[PM 18701]Optional payment modal after signup (#15384)

* Implement the planservice

* Add the pricing component and service

* Add the change plan type service

* resolve the unit test issues

* Move the changeSubscriptionFrequency endpoint

* Rename planservice to plancardservice

* Remove unused and correct typos

* Resolve the double asignment

* resolve the unit test failing

* Remove default payment setting to card

* remove unnecessary check

* Property initialPaymentMethod has no initializer

* move the logic to service

* Move estimate tax to pricing service

* Refactor thr pricing summary component

* Resolve the lint unit test error

* Add changes for auto modal

* Remove custom role for sm

* Resolve the blank member page issue

* Changes on the pricing display

libs/common/src/billing/abstractions/organizations/organization-billing-api.service.abstraction.ts

@@ -1,3 +1,4 @@
+import { ChangePlanFrequencyRequest } from "@bitwarden/common/billing/models/request/change-plan-frequency.request";
 import { OrganizationWarningsResponse } from "@bitwarden/common/billing/models/response/organization-warnings.response";
 
 import {
@@ -28,4 +29,9 @@ export abstract class OrganizationBillingApiServiceAbstraction {
       organizationKey: string;
     },
   ) => Promise<string>;
+
+  abstract changeSubscriptionFrequency: (
+    organizationId: string,
+    request: ChangePlanFrequencyRequest,
+  ) => Promise<void>;
 }

libs/common/src/billing/models/request/change-plan-frequency.request.ts

@@ -0,0 +1,9 @@
+import { PlanType } from "../../enums";
+
+export class ChangePlanFrequencyRequest {
+  newPlanType: PlanType;
+
+  constructor(newPlanType?: PlanType) {
+    this.newPlanType = newPlanType!;
+  }
+}

libs/common/src/billing/services/organization/organization-billing-api.service.ts

@@ -1,3 +1,4 @@
+import { ChangePlanFrequencyRequest } from "@bitwarden/common/billing/models/request/change-plan-frequency.request";
 import { OrganizationWarningsResponse } from "@bitwarden/common/billing/models/response/organization-warnings.response";
 
 import { ApiService } from "../../../abstractions/api.service";
@@ -83,4 +84,17 @@ export class OrganizationBillingApiService implements OrganizationBillingApiServ
 
     return response as string;
   }
+
+  async changeSubscriptionFrequency(
+    organizationId: string,
+    request: ChangePlanFrequencyRequest,
+  ): Promise<void> {
+    return await this.apiService.send(
+      "POST",
+      "/organizations/" + organizationId + "/billing/change-frequency",
+      request,
+      true,
+      false,
+    );
+  }
 }