@if (isNewAccount() && showOnboarding() && onboardingTasks$ | async; as onboardingTasks) {
  <div class="tw-mb-6">
    <app-onboarding
      [title]="'getStartedWithYourVault' | i18n"
      [subtitle]="'onboardingChecklistSubtitle' | i18n"
      startIcon="bwi-bitwarden-shield"
      (dismiss)="hideOnboarding()"
    >
      <app-onboarding-task
        [title]="'onboardingCreateYourAccountTitle' | i18n"
        [completed]="onboardingTasks.createAccount"
        [isDisabled]="true"
      ></app-onboarding-task>

      <app-onboarding-task
        [title]="'onboardingImportYourPasswordsTitle' | i18n"
        [subtitle]="'onboardingImportDataSubtitle' | i18n"
        [ctaText]="'onboardingImportCta' | i18n"
        ctaIcon="bwi-download"
        [route]="['/tools/import']"
        [completed]="onboardingTasks.importData"
      ></app-onboarding-task>

      <app-onboarding-task
        [title]="'onboardingInstallTheBrowserExtensionTitle' | i18n"
        [subtitle]="'onboardingInstallExtensionSubtitle' | i18n"
        [ctaText]="'onboardingInstallExtensionCta' | i18n"
        ctaIcon="bwi-puzzle"
        (ctaClick)="navigateToExtension()"
        [completed]="onboardingTasks.installExtension"
      ></app-onboarding-task>
    </app-onboarding>
  </div>
}