[PM-22179] Redirect user to /setup-extension (#15375)

* add end user feature flag

* add initial setup extension component and route

* redirect users from registration completion to the setup extension page

* add `hideIcon` to anon layout for web
- matches implementation on the browser.

* integrate with anon layout for extension wrapper

* add initial loading state

* conditionally redirect the user upon initialization

* redirect the user to the vault if the extension is installed

* add initial copy for setup-extension page

* add confirmation dialog for skipping the extension installation

* add success state for setup extension page

* only show loggedin toast when end user activation is not enabled.

* add image alt

* lower threshold for polling extension

* close the dialog when linking to the vault

* update party colors

* use the platform specific registration service to to only forward the web registrations to `/setup-extension`

* call `super` rather than `/vault` directly, it could change in the future

apps/web/src/app/vault/components/setup-extension/setup-extension.component.html

@@ -0,0 +1,59 @@
+<i
+  *ngIf="state === SetupExtensionState.Loading"
+  class="bwi bwi-spinner bwi-spin bwi-3x tw-text-muted"
+  aria-hidden="true"
+  [appA11yTitle]="'loading' | i18n"
+></i>
+
+<section *ngIf="state === SetupExtensionState.NeedsExtension" class="tw-text-center tw-mt-4">
+  <h1 bitTypography="h2">{{ "setupExtensionPageTitle" | i18n }}</h1>
+  <h2 bitTypography="body1">{{ "setupExtensionPageDescription" | i18n }}</h2>
+  <div class="tw-mb-6">
+    <!-- Placeholder - will be removed in following tickets -->
+    <img
+      class="tw-max-w-3xl"
+      [alt]="'setupExtensionContentAlt' | i18n"
+      src="/images/setup-extension/setup-extension-placeholder.png"
+    />
+  </div>
+  <div class="tw-flex tw-flex-col tw-gap-4 tw-items-center">
+    <a
+      bitButton
+      buttonType="primary"
+      [href]="webStoreUrl"
+      target="_blank"
+      rel="noopener noreferrer"
+    >
+      {{ "getTheExtension" | i18n }}
+    </a>
+    <button type="button" bitLink (click)="addItLater()">
+      {{ "addItLater" | i18n }}
+    </button>
+  </div>
+</section>
+
+<section *ngIf="state === SetupExtensionState.Success" class="tw-flex tw-flex-col tw-items-center">
+  <bit-icon [icon]="PartyIcon"></bit-icon>
+  <h1 bitTypography="h2" class="tw-mb-6 tw-mt-4">{{ "bitwardenExtensionInstalled" | i18n }}</h1>
+  <div
+    class="tw-flex tw-flex-col tw-rounded-2xl tw-bg-background tw-border tw-border-solid tw-border-secondary-300 tw-p-8"
+  >
+    <p>{{ "openExtensionToAutofill" | i18n }}</p>
+    <button type="button" bitButton buttonType="primary" class="tw-mb-2" (click)="openExtension()">
+      {{ "openBitwardenExtension" | i18n }}
+    </button>
+    <a bitButton buttonType="secondary" routerLink="/vault">
+      {{ "skipToWebApp" | i18n }}
+    </a>
+  </div>
+  <p class="tw-mt-10 tw-max-w-96 tw-text-center">
+    {{ "gettingStartedWithBitwardenPart1" | i18n }}
+    <a bitLink href="https://bitwarden.com/help/">
+      {{ "gettingStartedWithBitwardenPart2" | i18n }}
+    </a>
+    {{ "and" | i18n }}
+    <a bitLink href="https://bitwarden.com/help/learning-center/">
+      {{ "gettingStartedWithBitwardenPart3" | i18n }}
+    </a>
+  </p>
+</section>