Refactor billing process in e2e tests

Code for billing process was refactored in end-to-end tests for clean code and better structure. In the described tests, related codes and classes have been moved to a new class named BillingPageObject. All corresponding calls were updated accordingly.

apps/e2e/tests/utils/billing.po.ts

@@ -0,0 +1,42 @@
+import { Page } from '@playwright/test';
+import { StripePageObject } from './stripe.po';
+
+export class BillingPageObject {
+  public readonly stripe: StripePageObject;
+
+  constructor(
+    private readonly page: Page,
+  ) {
+    this.stripe = new StripePageObject(page);
+  }
+
+  plans() {
+    return this.page.locator('[data-test-plan]');
+  }
+
+  selectPlan(index: number = 0) {
+    const plans = this.plans();
+
+    return plans.nth(index).click();
+  }
+
+  manageBillingButton() {
+    return this.page.locator('manage-billing-redirect-button');
+  }
+
+  successStatus() {
+    return this.page.locator('[data-test="payment-return-success"]');
+  }
+
+  async returnToHome() {
+    await this.successStatus().locator('button').click();
+  }
+
+  proceedToCheckout() {
+    return this.page.click('[data-test="checkout-submit-button"]');
+  }
+
+  async getStatus() {
+    return this.page.locator('[data-test="current-plan-card-status-badge"]');
+  }
+}