Pivot trial initiation copy based on trial length (#14635)

Author: amorask-bitwarden

apps/web/src/app/billing/accounts/trial-initiation/trial-billing-step.component.html

@@ -56,7 +56,7 @@ <h2 class="tw-mb-3 tw-text-base tw-font-semibold">{{ "paymentType" | i18n }}</h2
     </div>
     <div class="tw-flex tw-space-x-2">
       <button type="submit" buttonType="primary" bitButton [loading]="form.loading">
-        {{ "startTrial" | i18n }}
+        {{ (trialLength > 0 ? "startTrial" : "submit") | i18n }}
       </button>
       <button bitButton type="button" buttonType="secondary" (click)="stepBack()">Back</button>
     </div>

apps/web/src/app/billing/accounts/trial-initiation/trial-billing-step.component.ts

@@ -55,6 +55,7 @@ export class TrialBillingStepComponent implements OnInit {
   @ViewChild(ManageTaxInformationComponent) taxInfoComponent: ManageTaxInformationComponent;
   @Input() organizationInfo: OrganizationInfo;
   @Input() subscriptionProduct: SubscriptionProduct = SubscriptionProduct.PasswordManager;
+  @Input() trialLength: number;
   @Output() steppedBack = new EventEmitter();
   @Output() organizationCreated = new EventEmitter<OrganizationCreatedEvent>();
 

apps/web/src/app/billing/trial-initiation/complete-trial-initiation/complete-trial-initiation.component.html

@@ -48,6 +48,7 @@
             ? SubscriptionProduct.SecretsManager
             : SubscriptionProduct.PasswordManager
         "
+        [trialLength]="trialLength"
         (steppedBack)="previousStep()"
         (organizationCreated)="createdOrganization($event)"
       >
@@ -58,6 +59,7 @@
         [email]="email"
         [orgLabel]="orgLabel"
         [product]="this.product"
+        [trialLength]="trialLength"
       ></app-trial-confirmation-details>
       <div class="tw-mb-3 tw-flex">
         <a

apps/web/src/app/billing/trial-initiation/complete-trial-initiation/complete-trial-initiation.component.ts

@@ -86,6 +86,8 @@ export class CompleteTrialInitiationComponent implements OnInit, OnDestroy {
   loading = false;
   productTierValue: number;
 
+  trialLength: number;
+
   orgInfoFormGroup = this.formBuilder.group({
     name: ["", { validators: [Validators.required, Validators.maxLength(50)], updateOn: "change" }],
     billingEmail: [""],
@@ -160,6 +162,8 @@ export class CompleteTrialInitiationComponent implements OnInit, OnDestroy {
         this.useTrialStepper = true;
       }
 
+      this.trialLength = qParams.trialLength ? parseInt(qParams.trialLength) : 7;
+
       // Are they coming from an email for sponsoring a families organization
       // After logging in redirect them to setup the families sponsorship
       this.setupFamilySponsorship(qParams.sponsorshipToken);

apps/web/src/app/billing/trial-initiation/complete-trial-initiation/resolver/free-trial-text.resolver.spec.ts

@@ -11,27 +11,58 @@ const route = {
 const routerStateSnapshot = {} as RouterStateSnapshot;
 
 describe("freeTrialTextResolver", () => {
-  it("shows password manager text", () => {
+  beforeEach(() => {
+    route.queryParams = {};
+  });
+
+  it("shows password manager free trial text", () => {
     route.queryParams.product = `${ProductType.PasswordManager}`;
 
     expect(freeTrialTextResolver(route, routerStateSnapshot)).toEqual({
       key: "continueSettingUpFreeTrialPasswordManager",
     });
   });
 
-  it("shows secret manager text", () => {
+  it("shows password manager text", () => {
+    route.queryParams.product = `${ProductType.PasswordManager}`;
+    route.queryParams.trialLength = "0";
+
+    expect(freeTrialTextResolver(route, routerStateSnapshot)).toEqual({
+      key: "continueSettingUpPasswordManager",
+    });
+  });
+
+  it("shows secret manager free trial text", () => {
     route.queryParams.product = `${ProductType.SecretsManager}`;
 
     expect(freeTrialTextResolver(route, routerStateSnapshot)).toEqual({
       key: "continueSettingUpFreeTrialSecretsManager",
     });
   });
 
-  it("shows default text", () => {
+  it("shows secret manager text", () => {
+    route.queryParams.product = `${ProductType.SecretsManager}`;
+    route.queryParams.trialLength = "0";
+
+    expect(freeTrialTextResolver(route, routerStateSnapshot)).toEqual({
+      key: "continueSettingUpSecretsManager",
+    });
+  });
+
+  it("shows default free trial text", () => {
     route.queryParams.product = `${ProductType.PasswordManager},${ProductType.SecretsManager}`;
 
     expect(freeTrialTextResolver(route, routerStateSnapshot)).toEqual({
       key: "continueSettingUpFreeTrial",
     });
   });
+
+  it("shows default text", () => {
+    route.queryParams.product = `${ProductType.PasswordManager},${ProductType.SecretsManager}`;
+    route.queryParams.trialLength = "0";
+
+    expect(freeTrialTextResolver(route, routerStateSnapshot)).toEqual({
+      key: "continueSettingUp",
+    });
+  });
 });

apps/web/src/app/billing/trial-initiation/complete-trial-initiation/resolver/free-trial-text.resolver.ts

@@ -9,21 +9,29 @@ export const freeTrialTextResolver: ResolveFn<Translation | null> = (
   const { product } = route.queryParams;
   const products: ProductType[] = (product ?? "").split(",").map((p: string) => parseInt(p));
 
+  const trialLength = route.queryParams.trialLength ? parseInt(route.queryParams.trialLength) : 7;
+
   const onlyPasswordManager = products.length === 1 && products[0] === ProductType.PasswordManager;
   const onlySecretsManager = products.length === 1 && products[0] === ProductType.SecretsManager;
 
   switch (true) {
     case onlyPasswordManager:
       return {
-        key: "continueSettingUpFreeTrialPasswordManager",
+        key:
+          trialLength > 0
+            ? "continueSettingUpFreeTrialPasswordManager"
+            : "continueSettingUpPasswordManager",
       };
     case onlySecretsManager:
       return {
-        key: "continueSettingUpFreeTrialSecretsManager",
+        key:
+          trialLength > 0
+            ? "continueSettingUpFreeTrialSecretsManager"
+            : "continueSettingUpSecretsManager",
       };
     default:
       return {
-        key: "continueSettingUpFreeTrial",
+        key: trialLength > 0 ? "continueSettingUpFreeTrial" : "continueSettingUp",
       };
   }
 };

apps/web/src/app/billing/trial-initiation/confirmation-details.component.html

@@ -13,7 +13,7 @@
         >.
       </p>
     </li>
-    <li>
+    <li *ngIf="trialLength > 0">
       <p>
         {{ "trialPaidInfoMessage" | i18n: orgLabel }}
       </p>

apps/web/src/app/billing/trial-initiation/confirmation-details.component.ts

@@ -12,6 +12,7 @@ export class ConfirmationDetailsComponent {
   @Input() email: string;
   @Input() orgLabel: string;
   @Input() product?: ProductType = ProductType.PasswordManager;
+  @Input() trialLength: number;
 
   protected readonly Product = ProductType;
 }

apps/web/src/locales/en/messages.json

@@ -9414,12 +9414,21 @@
   "manageBillingFromProviderPortalMessage": {
     "message": "Manage billing from the Provider Portal"
   },
+  "continueSettingUp": {
+    "message": "Continue setting up Bitwarden"
+  },
   "continueSettingUpFreeTrial": {
     "message": "Continue setting up your free trial of Bitwarden"
   },
+  "continueSettingUpPasswordManager": {
+    "message": "Continue setting up Bitwarden Password Manager"
+  },
   "continueSettingUpFreeTrialPasswordManager": {
     "message": "Continue setting up your free trial of Bitwarden Password Manager"
   },
+  "continueSettingUpSecretsManager": {
+    "message": "Continue setting up Bitwarden Secrets Manager"
+  },
   "continueSettingUpFreeTrialSecretsManager": {
     "message": "Continue setting up your free trial of Bitwarden Secrets Manager"
   },