[AC-1486] Feature: SM Billing Round 1 (#5747)

* [AC-1423] Update organization subscription cloud page (#5614)

* [AC-1423] Add ProgressModule to shared.module.ts

* [AC-1423] Update cloud subscription page styles

- Remove bootstrap styles
- Use CL components where applicable
- Use CL typography directives
- Update heading levels to prepare for new SM sections

* [AC-1423] Add usePasswordManager boolean to organization domain

* [AC-1423] Introduce BitwardenProductType enum

* [AC-1423] Update Organization subscription line items

- Add product type prefix
- Indent addon services like additional storage and service accounts
- Show line items for free plans

* [AC-1420] Add Secrets Manager subscribe component (#5617)

* [AC-1418] Add secrets manager manage subscription component (#5661)

* add additional properties (#5743)

* Allow autoscale limits to be removed, update naming (#5781)

* [AC-1488] Store Organization.SmServiceAccounts as total not additional (#5784)

* Allow autoscale limits to be removed, update naming

* Display additional service accounts only

* [AC-1531] Fix SM subscribe component not showing in free org billing tab (#5848)

---------

Co-authored-by: Shane Melton <smelton@bitwarden.com>
Co-authored-by: Thomas Rittson <31796059+eliykat@users.noreply.github.com>
Co-authored-by: Thomas Rittson <trittson@bitwarden.com>
Co-authored-by: cyprain-okeke <108260115+cyprain-okeke@users.noreply.github.com>
Co-authored-by: Rui Tome <rtome@bitwarden.com>

libs/common/src/admin-console/abstractions/organization/organization-api.service.abstraction.ts

@@ -3,9 +3,11 @@ import { OrganizationSsoRequest } from "../../../auth/models/request/organizatio
 import { SecretVerificationRequest } from "../../../auth/models/request/secret-verification.request";
 import { ApiKeyResponse } from "../../../auth/models/response/api-key.response";
 import { OrganizationSsoResponse } from "../../../auth/models/response/organization-sso.response";
+import { OrganizationSmSubscriptionUpdateRequest } from "../../../billing/models/request/organization-sm-subscription-update.request";
 import { OrganizationSubscriptionUpdateRequest } from "../../../billing/models/request/organization-subscription-update.request";
 import { OrganizationTaxInfoUpdateRequest } from "../../../billing/models/request/organization-tax-info-update.request";
 import { PaymentRequest } from "../../../billing/models/request/payment.request";
+import { SecretsManagerSubscribeRequest } from "../../../billing/models/request/sm-subscribe.request";
 import { BillingResponse } from "../../../billing/models/response/billing.response";
 import { OrganizationSubscriptionResponse } from "../../../billing/models/response/organization-subscription.response";
 import { PaymentResponse } from "../../../billing/models/response/payment.response";
@@ -16,7 +18,6 @@ import { StorageRequest } from "../../../models/request/storage.request";
 import { VerifyBankRequest } from "../../../models/request/verify-bank.request";
 import { ListResponse } from "../../../models/response/list.response";
 import { OrganizationApiKeyType } from "../../enums";
-import { OrganizationEnrollSecretsManagerRequest } from "../../models/request/organization/organization-enroll-secrets-manager.request";
 import { OrganizationCreateRequest } from "../../models/request/organization-create.request";
 import { OrganizationKeysRequest } from "../../models/request/organization-keys.request";
 import { OrganizationUpdateRequest } from "../../models/request/organization-update.request";
@@ -37,7 +38,14 @@ export class OrganizationApiServiceAbstraction {
   save: (id: string, request: OrganizationUpdateRequest) => Promise<OrganizationResponse>;
   updatePayment: (id: string, request: PaymentRequest) => Promise<void>;
   upgrade: (id: string, request: OrganizationUpgradeRequest) => Promise<PaymentResponse>;
-  updateSubscription: (id: string, request: OrganizationSubscriptionUpdateRequest) => Promise<void>;
+  updatePasswordManagerSeats: (
+    id: string,
+    request: OrganizationSubscriptionUpdateRequest
+  ) => Promise<void>;
+  updateSecretsManagerSubscription: (
+    id: string,
+    request: OrganizationSmSubscriptionUpdateRequest
+  ) => Promise<void>;
   updateSeats: (id: string, request: SeatRequest) => Promise<PaymentResponse>;
   updateStorage: (id: string, request: StorageRequest) => Promise<PaymentResponse>;
   verifyBank: (id: string, request: VerifyBankRequest) => Promise<void>;
@@ -60,8 +68,5 @@ export class OrganizationApiServiceAbstraction {
   getSso: (id: string) => Promise<OrganizationSsoResponse>;
   updateSso: (id: string, request: OrganizationSsoRequest) => Promise<OrganizationSsoResponse>;
   selfHostedSyncLicense: (id: string) => Promise<void>;
-  updateEnrollSecretsManager: (
-    id: string,
-    request: OrganizationEnrollSecretsManagerRequest
-  ) => Promise<void>;
+  subscribeToSecretsManager: (id: string, request: SecretsManagerSubscribeRequest) => Promise<void>;
 }

libs/common/src/admin-console/models/data/organization.data.ts

@@ -22,6 +22,7 @@ export class OrganizationData {
   useCustomPermissions: boolean;
   useResetPassword: boolean;
   useSecretsManager: boolean;
+  usePasswordManager: boolean;
   useActivateAutofillPolicy: boolean;
   selfHost: boolean;
   usersGetPremium: boolean;
@@ -74,6 +75,7 @@ export class OrganizationData {
     this.useCustomPermissions = response.useCustomPermissions;
     this.useResetPassword = response.useResetPassword;
     this.useSecretsManager = response.useSecretsManager;
+    this.usePasswordManager = response.usePasswordManager;
     this.useActivateAutofillPolicy = response.useActivateAutofillPolicy;
     this.selfHost = response.selfHost;
     this.usersGetPremium = response.usersGetPremium;

libs/common/src/admin-console/models/domain/organization.ts

@@ -31,6 +31,7 @@ export class Organization {
   useCustomPermissions: boolean;
   useResetPassword: boolean;
   useSecretsManager: boolean;
+  usePasswordManager: boolean;
   useActivateAutofillPolicy: boolean;
   selfHost: boolean;
   usersGetPremium: boolean;
@@ -87,6 +88,7 @@ export class Organization {
     this.useCustomPermissions = obj.useCustomPermissions;
     this.useResetPassword = obj.useResetPassword;
     this.useSecretsManager = obj.useSecretsManager;
+    this.usePasswordManager = obj.usePasswordManager;
     this.useActivateAutofillPolicy = obj.useActivateAutofillPolicy;
     this.selfHost = obj.selfHost;
     this.usersGetPremium = obj.usersGetPremium;

libs/common/src/admin-console/models/request/organization-create.request.ts

@@ -23,4 +23,8 @@ export class OrganizationCreateRequest {
   billingAddressState: string;
   billingAddressPostalCode: string;
   billingAddressCountry: string;
+
+  useSecretsManager: boolean;
+  additionalSmSeats: number;
+  additionalServiceAccounts: number;
 }

libs/common/src/admin-console/models/request/organization-upgrade.request.ts

@@ -11,4 +11,8 @@ export class OrganizationUpgradeRequest {
   billingAddressCountry: string;
   billingAddressPostalCode: string;
   keys: OrganizationKeysRequest;
+
+  useSecretsManager: boolean;
+  additionalSmSeats: number;
+  additionalServiceAccounts: number;
 }

libs/common/src/admin-console/models/request/organization/organization-enroll-secrets-manager.request.ts

@@ -1,3 +0,0 @@
-export class OrganizationEnrollSecretsManagerRequest {
-  enabled: boolean;
-}

libs/common/src/admin-console/models/response/organization.response.ts

@@ -13,6 +13,7 @@ export class OrganizationResponse extends BaseResponse {
   businessTaxNumber: string;
   billingEmail: string;
   plan: PlanResponse;
+  secretsManagerPlan: PlanResponse;
   planType: PlanType;
   seats: number;
   maxAutoscaleSeats: number;
@@ -27,6 +28,11 @@ export class OrganizationResponse extends BaseResponse {
   useResetPassword: boolean;
   useSecretsManager: boolean;
   hasPublicAndPrivateKeys: boolean;
+  usePasswordManager: boolean;
+  smSeats?: number;
+  smServiceAccounts?: number;
+  maxAutoscaleSmSeats?: number;
+  maxAutoscaleSmServiceAccounts?: number;
 
   constructor(response: any) {
     super(response);
@@ -39,8 +45,14 @@ export class OrganizationResponse extends BaseResponse {
     this.businessCountry = this.getResponseProperty("BusinessCountry");
     this.businessTaxNumber = this.getResponseProperty("BusinessTaxNumber");
     this.billingEmail = this.getResponseProperty("BillingEmail");
+
     const plan = this.getResponseProperty("Plan");
     this.plan = plan == null ? null : new PlanResponse(plan);
+
+    const secretsManagerPlan = this.getResponseProperty("SecretsManagerPlan");
+    this.secretsManagerPlan =
+      secretsManagerPlan == null ? null : new PlanResponse(secretsManagerPlan);
+
     this.planType = this.getResponseProperty("PlanType");
     this.seats = this.getResponseProperty("Seats");
     this.maxAutoscaleSeats = this.getResponseProperty("MaxAutoscaleSeats");
@@ -55,5 +67,10 @@ export class OrganizationResponse extends BaseResponse {
     this.useResetPassword = this.getResponseProperty("UseResetPassword");
     this.useSecretsManager = this.getResponseProperty("UseSecretsManager");
     this.hasPublicAndPrivateKeys = this.getResponseProperty("HasPublicAndPrivateKeys");
+    this.usePasswordManager = this.getResponseProperty("UsePasswordManager");
+    this.smSeats = this.getResponseProperty("SmSeats");
+    this.smServiceAccounts = this.getResponseProperty("SmServiceAccounts");
+    this.maxAutoscaleSmSeats = this.getResponseProperty("MaxAutoscaleSmSeats");
+    this.maxAutoscaleSmServiceAccounts = this.getResponseProperty("MaxAutoscaleSmServiceAccounts");
   }
 }

libs/common/src/admin-console/models/response/profile-organization.response.ts

@@ -19,6 +19,7 @@ export class ProfileOrganizationResponse extends BaseResponse {
   useCustomPermissions: boolean;
   useResetPassword: boolean;
   useSecretsManager: boolean;
+  usePasswordManager: boolean;
   useActivateAutofillPolicy: boolean;
   selfHost: boolean;
   usersGetPremium: boolean;
@@ -65,6 +66,7 @@ export class ProfileOrganizationResponse extends BaseResponse {
     this.useCustomPermissions = this.getResponseProperty("UseCustomPermissions") ?? false;
     this.useResetPassword = this.getResponseProperty("UseResetPassword");
     this.useSecretsManager = this.getResponseProperty("UseSecretsManager");
+    this.usePasswordManager = this.getResponseProperty("UsePasswordManager");
     this.useActivateAutofillPolicy = this.getResponseProperty("UseActivateAutofillPolicy");
     this.selfHost = this.getResponseProperty("SelfHost");
     this.usersGetPremium = this.getResponseProperty("UsersGetPremium");

libs/common/src/admin-console/services/organization/organization-api.service.ts

@@ -4,9 +4,11 @@ import { OrganizationSsoRequest } from "../../../auth/models/request/organizatio
 import { SecretVerificationRequest } from "../../../auth/models/request/secret-verification.request";
 import { ApiKeyResponse } from "../../../auth/models/response/api-key.response";
 import { OrganizationSsoResponse } from "../../../auth/models/response/organization-sso.response";
+import { OrganizationSmSubscriptionUpdateRequest } from "../../../billing/models/request/organization-sm-subscription-update.request";
 import { OrganizationSubscriptionUpdateRequest } from "../../../billing/models/request/organization-subscription-update.request";
 import { OrganizationTaxInfoUpdateRequest } from "../../../billing/models/request/organization-tax-info-update.request";
 import { PaymentRequest } from "../../../billing/models/request/payment.request";
+import { SecretsManagerSubscribeRequest } from "../../../billing/models/request/sm-subscribe.request";
 import { BillingResponse } from "../../../billing/models/response/billing.response";
 import { OrganizationSubscriptionResponse } from "../../../billing/models/response/organization-subscription.response";
 import { PaymentResponse } from "../../../billing/models/response/payment.response";
@@ -19,7 +21,6 @@ import { ListResponse } from "../../../models/response/list.response";
 import { SyncService } from "../../../vault/abstractions/sync/sync.service.abstraction";
 import { OrganizationApiServiceAbstraction } from "../../abstractions/organization/organization-api.service.abstraction";
 import { OrganizationApiKeyType } from "../../enums";
-import { OrganizationEnrollSecretsManagerRequest } from "../../models/request/organization/organization-enroll-secrets-manager.request";
 import { OrganizationCreateRequest } from "../../models/request/organization-create.request";
 import { OrganizationKeysRequest } from "../../models/request/organization-keys.request";
 import { OrganizationUpdateRequest } from "../../models/request/organization-update.request";
@@ -120,7 +121,7 @@ export class OrganizationApiService implements OrganizationApiServiceAbstraction
     return new PaymentResponse(r);
   }
 
-  async updateSubscription(
+  async updatePasswordManagerSeats(
     id: string,
     request: OrganizationSubscriptionUpdateRequest
   ): Promise<void> {
@@ -133,6 +134,19 @@ export class OrganizationApiService implements OrganizationApiServiceAbstraction
     );
   }
 
+  async updateSecretsManagerSubscription(
+    id: string,
+    request: OrganizationSmSubscriptionUpdateRequest
+  ): Promise<void> {
+    return this.apiService.send(
+      "POST",
+      "/organizations/" + id + "/sm-subscription",
+      request,
+      true,
+      false
+    );
+  }
+
   async updateSeats(id: string, request: SeatRequest): Promise<PaymentResponse> {
     const r = await this.apiService.send(
       "POST",
@@ -294,13 +308,16 @@ export class OrganizationApiService implements OrganizationApiServiceAbstraction
     );
   }
 
-  async updateEnrollSecretsManager(id: string, request: OrganizationEnrollSecretsManagerRequest) {
-    await this.apiService.send(
+  async subscribeToSecretsManager(
+    id: string,
+    request: SecretsManagerSubscribeRequest
+  ): Promise<void> {
+    return await this.apiService.send(
       "POST",
-      "/organizations/" + id + "/enroll-secrets-manager",
+      "/organizations/" + id + "/subscribe-secrets-manager",
       request,
       true,
-      true
+      false
     );
   }
 }

libs/common/src/billing/enums/bitwarden-product-type.enum.ts

@@ -0,0 +1,4 @@
+export enum BitwardenProductType {
+  PasswordManager = 0,
+  SecretsManager = 1,
+}

libs/common/src/billing/enums/index.ts

@@ -2,3 +2,4 @@ export * from "./payment-method-type.enum";
 export * from "./plan-sponsorship-type.enum";
 export * from "./plan-type.enum";
 export * from "./transaction-type.enum";
+export * from "./bitwarden-product-type.enum";

libs/common/src/billing/models/request/organization-sm-subscription-update.request.ts

@@ -0,0 +1,21 @@
+export class OrganizationSmSubscriptionUpdateRequest {
+  /**
+   * The number of seats to add or remove from the subscription.
+   */
+  seatAdjustment: number;
+
+  /**
+   * The maximum number of seats that can be auto-scaled for the subscription.
+   */
+  maxAutoscaleSeats?: number;
+
+  /**
+   * The number of additional service accounts to add or remove from the subscription.
+   */
+  serviceAccountAdjustment: number;
+
+  /**
+   * The maximum number of additional service accounts that can be auto-scaled for the subscription.
+   */
+  maxAutoscaleServiceAccounts?: number;
+}

libs/common/src/billing/models/request/organization-subscription-update.request.ts

@@ -1,3 +1,23 @@
 export class OrganizationSubscriptionUpdateRequest {
-  constructor(public seatAdjustment: number, public maxAutoscaleSeats?: number) {}
+  /**
+   * The number of seats to add or remove from the subscription.
+   * Applies to both PM and SM request types.
+   */
+  seatAdjustment: number;
+
+  /**
+   * The maximum number of seats that can be auto-scaled for the subscription.
+   * Applies to both PM and SM request types.
+   */
+  maxAutoscaleSeats?: number;
+
+  /**
+   * Build a subscription update request for the Password Manager product type.
+   * @param seatAdjustment - The number of seats to add or remove from the subscription.
+   * @param maxAutoscaleSeats - The maximum number of seats that can be auto-scaled for the subscription.
+   */
+  constructor(seatAdjustment: number, maxAutoscaleSeats?: number) {
+    this.seatAdjustment = seatAdjustment;
+    this.maxAutoscaleSeats = maxAutoscaleSeats;
+  }
 }

libs/common/src/billing/models/request/sm-subscribe.request.ts

@@ -0,0 +1,4 @@
+export class SecretsManagerSubscribeRequest {
+  additionalSmSeats: number;
+  additionalServiceAccounts: number;
+}

libs/common/src/billing/models/response/plan.response.ts

@@ -1,10 +1,11 @@
 import { ProductType } from "../../../enums";
 import { BaseResponse } from "../../../models/response/base.response";
-import { PlanType } from "../../enums";
+import { BitwardenProductType, PlanType } from "../../enums";
 
 export class PlanResponse extends BaseResponse {
   type: PlanType;
   product: ProductType;
+  bitwardenProduct: BitwardenProductType;
   name: string;
   isAnnual: boolean;
   nameLocalizationKey: string;
@@ -48,6 +49,15 @@ export class PlanResponse extends BaseResponse {
   additionalStoragePricePerGb: number;
   premiumAccessOptionPrice: number;
 
+  // SM only
+  additionalPricePerServiceAccount: number;
+  baseServiceAccount: number;
+  maxServiceAccount: number;
+  hasAdditionalServiceAccountOption: boolean;
+  maxProjects: number;
+  maxAdditionalServiceAccounts: number;
+  stripeServiceAccountPlanId: string;
+
   constructor(response: any) {
     super(response);
     this.type = this.getResponseProperty("Type");
@@ -90,5 +100,18 @@ export class PlanResponse extends BaseResponse {
     this.seatPrice = this.getResponseProperty("SeatPrice");
     this.additionalStoragePricePerGb = this.getResponseProperty("AdditionalStoragePricePerGb");
     this.premiumAccessOptionPrice = this.getResponseProperty("PremiumAccessOptionPrice");
+
+    this.bitwardenProduct = this.getResponseProperty("BitwardenProduct");
+    this.additionalPricePerServiceAccount = this.getResponseProperty(
+      "AdditionalPricePerServiceAccount"
+    );
+    this.baseServiceAccount = this.getResponseProperty("BaseServiceAccount");
+    this.maxServiceAccount = this.getResponseProperty("MaxServiceAccount");
+    this.hasAdditionalServiceAccountOption = this.getResponseProperty(
+      "HasAdditionalServiceAccountOption"
+    );
+    this.maxProjects = this.getResponseProperty("MaxProjects");
+    this.maxAdditionalServiceAccounts = this.getResponseProperty("MaxAdditionalServiceAccounts");
+    this.stripeServiceAccountPlanId = this.getResponseProperty("StripeServiceAccountPlanId");
   }
 }

libs/common/src/billing/models/response/subscription.response.ts

@@ -1,4 +1,5 @@
 import { BaseResponse } from "../../../models/response/base.response";
+import { BitwardenProductType } from "../../enums";
 
 export class SubscriptionResponse extends BaseResponse {
   storageName: string;
@@ -62,6 +63,8 @@ export class BillingSubscriptionItemResponse extends BaseResponse {
   quantity: number;
   interval: string;
   sponsoredSubscriptionItem: boolean;
+  addonSubscriptionItem: boolean;
+  bitwardenProduct: BitwardenProductType;
 
   constructor(response: any) {
     super(response);
@@ -70,6 +73,8 @@ export class BillingSubscriptionItemResponse extends BaseResponse {
     this.quantity = this.getResponseProperty("Quantity");
     this.interval = this.getResponseProperty("Interval");
     this.sponsoredSubscriptionItem = this.getResponseProperty("SponsoredSubscriptionItem");
+    this.addonSubscriptionItem = this.getResponseProperty("AddonSubscriptionItem");
+    this.bitwardenProduct = this.getResponseProperty("BitwardenProduct");
   }
 }
 

libs/common/src/enums/feature-flag.enum.ts

@@ -2,4 +2,5 @@ export enum FeatureFlag {
   DisplayEuEnvironmentFlag = "display-eu-environment",
   DisplayLowKdfIterationWarningFlag = "display-kdf-iteration-warning",
   TrustedDeviceEncryption = "trusted-device-encryption",
+  SecretsManagerBilling = "sm-ga-billing",
 }

libs/common/src/services/api.service.ts

@@ -881,7 +881,7 @@ export class ApiService implements ApiServiceAbstraction {
   // Plan APIs
 
   async getPlans(): Promise<ListResponse<PlanResponse>> {
-    const r = await this.send("GET", "/plans/", null, false, true);
+    const r = await this.send("GET", "/plans/all", null, false, true);
     return new ListResponse(r, PlanResponse);
   }