bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2026-02-09 05:00:10 +00:00
Code Issues Releases Wiki Activity

CompleteTrialInitiationComponent - initialize data before rendering InputPasswordComponent

Browse Source
This commit is contained in:
rr-bw
2025-04-24 21:50:38 -07:00
parent fbaa33eb32
commit 910780f4bb
2 changed files with 96 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,87 +1,99 @@
<div *ngIf="!useTrialStepper">
<auth-input-password
[flow]="inputPasswordFlow"
[email]="email"
[masterPasswordPolicyOptions]="enforcedPolicyOptions"
(onPasswordFormSubmit)="handlePasswordSubmit($event)"
[primaryButtonText]="{ key: 'createAccount' }"
></auth-input-password>
</div>
<div *ngIf="useTrialStepper">
<app-vertical-stepper #stepper linear (selectionChange)="verticalStepChange($event)">
<app-vertical-step label="Create Account" [editable]="false" [subLabel]="email">
<auth-input-password
[flow]="inputPasswordFlow"
[email]="email"
[masterPasswordPolicyOptions]="enforcedPolicyOptions"
(onPasswordFormSubmit)="handlePasswordSubmit($event)"
[primaryButtonText]="{ key: 'createAccount' }"
></auth-input-password>
</app-vertical-step>
<app-vertical-step label="Organization Information" [subLabel]="orgInfoSubLabel">
<app-org-info [nameOnly]="true" [formGroup]="orgInfoFormGroup"></app-org-info>
<button
type="button"
bitButton
buttonType="primary"
[disabled]="orgInfoFormGroup.controls.name.invalid"
[loading]="loading && (trialPaymentOptional$ | async)"
(click)="orgNameEntrySubmit()"
>
{{ (trialPaymentOptional$ | async) ? ("startTrial" | i18n) : ("next" | i18n) }}
</button>
</app-vertical-step>
<app-vertical-step
label="Billing"
[subLabel]="billingSubLabel"
*ngIf="!(trialPaymentOptional$ | async) && !isSecretsManagerFree"
>
<app-trial-billing-step
*ngIf="stepper.selectedIndex === 2"
[organizationInfo]="{
name: orgInfoFormGroup.value.name,
email: orgInfoFormGroup.value.billingEmail,
type: trialOrganizationType,
}"
[subscriptionProduct]="
product === ProductType.SecretsManager
? SubscriptionProduct.SecretsManager
: SubscriptionProduct.PasswordManager
"
(steppedBack)="previousStep()"
(organizationCreated)="createdOrganization($event)"
>
</app-trial-billing-step>
</app-vertical-step>
<app-vertical-step label="Confirmation Details" [applyBorder]="false">
<app-trial-confirmation-details
[email]="email"
[orgLabel]="orgLabel"
[product]="this.product"
></app-trial-confirmation-details>
<div class="tw-mb-3 tw-flex">
<a
@if (initializing) {
<div class="tw-flex tw-items-center tw-justify-center">
<i
class="bwi bwi-spinner bwi-spin bwi-3x tw-text-muted"
title="{{ 'loading' | i18n }}"
aria-hidden="true"
></i>
<span class="tw-sr-only">{{ "loading" | i18n }}</span>
</div>
} @else {
<div *ngIf="!useTrialStepper">
<auth-input-password
[flow]="inputPasswordFlow"
[email]="email"
[masterPasswordPolicyOptions]="enforcedPolicyOptions"
(onPasswordFormSubmit)="handlePasswordSubmit($event)"
[primaryButtonText]="{ key: 'createAccount' }"
></auth-input-password>
</div>
<div *ngIf="useTrialStepper">
<app-vertical-stepper #stepper linear (selectionChange)="verticalStepChange($event)">
<app-vertical-step label="Create Account" [editable]="false" [subLabel]="email">
<auth-input-password
[flow]="inputPasswordFlow"
[email]="email"
[masterPasswordPolicyOptions]="enforcedPolicyOptions"
(onPasswordFormSubmit)="handlePasswordSubmit($event)"
[primaryButtonText]="{ key: 'createAccount' }"
></auth-input-password>
</app-vertical-step>
<app-vertical-step label="Organization Information" [subLabel]="orgInfoSubLabel">
<app-org-info [nameOnly]="true" [formGroup]="orgInfoFormGroup"></app-org-info>
<button
type="button"
bitButton
buttonType="primary"
[routerLink]="
[disabled]="orgInfoFormGroup.controls.name.invalid"
[loading]="loading && (trialPaymentOptional$ | async)"
(click)="orgNameEntrySubmit()"
>
{{ (trialPaymentOptional$ | async) ? ("startTrial" | i18n) : ("next" | i18n) }}
</button>
</app-vertical-step>
<app-vertical-step
label="Billing"
[subLabel]="billingSubLabel"
*ngIf="!(trialPaymentOptional$ | async) && !isSecretsManagerFree"
>
<app-trial-billing-step
*ngIf="stepper.selectedIndex === 2"
[organizationInfo]="{
name: orgInfoFormGroup.value.name,
email: orgInfoFormGroup.value.billingEmail,
type: trialOrganizationType,
}"
[subscriptionProduct]="
product === ProductType.SecretsManager
? ['/sm', orgId]
: ['/organizations', orgId, 'vault']
? SubscriptionProduct.SecretsManager
: SubscriptionProduct.PasswordManager
"
(steppedBack)="previousStep()"
(organizationCreated)="createdOrganization($event)"
>
{{ "getStarted" | i18n | titlecase }}
</a>
<a
type="button"
bitButton
buttonType="secondary"
[routerLink]="['/organizations', orgId, 'members']"
class="tw-ml-3 tw-inline-flex tw-items-center tw-px-3"
>
{{ "inviteUsers" | i18n }}
</a>
</div>
</app-vertical-step>
</app-vertical-stepper>
</div>
</app-trial-billing-step>
</app-vertical-step>
<app-vertical-step label="Confirmation Details" [applyBorder]="false">
<app-trial-confirmation-details
[email]="email"
[orgLabel]="orgLabel"
[product]="this.product"
></app-trial-confirmation-details>
<div class="tw-mb-3 tw-flex">
<a
type="button"
bitButton
buttonType="primary"
[routerLink]="
product === ProductType.SecretsManager
? ['/sm', orgId]
: ['/organizations', orgId, 'vault']
"
>
{{ "getStarted" | i18n | titlecase }}
</a>
<a
type="button"
bitButton
buttonType="secondary"
[routerLink]="['/organizations', orgId, 'members']"
class="tw-ml-3 tw-inline-flex tw-items-center tw-px-3"
>
{{ "inviteUsers" | i18n }}
</a>
</div>
</app-vertical-step>
</app-vertical-stepper>
</div>
}

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

@@ -52,6 +52,7 @@ export class CompleteTrialInitiationComponent implements OnInit, OnDestroy {
@ViewChild("stepper", { static: false }) verticalStepper: VerticalStepperComponent;
inputPasswordFlow = InputPasswordFlow.AccountRegistration;
initializing = true;
/** Password Manager or Secrets Manager */
product: ProductType;
@@ -198,6 +199,8 @@ export class CompleteTrialInitiationComponent implements OnInit, OnDestroy {
.subscribe(() => {
this.orgInfoFormGroup.controls.name.markAsTouched();
});
this.initializing = false;
}
ngOnDestroy(): void {