Merge branch 'main' into auth/pm-8111/browser-refresh-login-component

2025-12-17 16:53:34 +00:00 · 2024-10-10 10:07:39 -05:00
parent 3868dcbc60 16f36a1008
commit 90a24cba67
91 changed files with 2434 additions and 1087 deletions
--- a/apps/browser/src/_locales/en/messages.json
+++ b/apps/browser/src/_locales/en/messages.json
@@ -396,7 +396,7 @@
  },
  "generator": {
    "message": "Generator",
-    "description": "Short for 'Password Generator'."
+    "description": "Short for 'credential generator'."
  },
  "passGenInfo": {
    "message": "Automatically generate strong, unique passwords for your logins."
@@ -2516,7 +2516,25 @@
    "message": "Send created successfully!",
    "description": "'Send' is a noun and the name of a feature called 'Bitwarden Send'. It should not be translated."
  },
-  "sendAvailability": {
+  "sendExpiresInHoursSingle": {
+    "message": "The Send will be available to anyone with the link for the next 1 hour.",
+    "description": "'Send' is a noun and the name of a feature called 'Bitwarden Send'. It should not be translated."
+  },
+  "sendExpiresInHours": {
+    "message": "The Send will be available to anyone with the link for the next $HOURS$ hours.",
+    "description": "'Send' is a noun and the name of a feature called 'Bitwarden Send'. It should not be translated.",
+    "placeholders": {
+      "hours": {
+        "content": "$1",
+        "example": "5"
+      }
+    }
+  },
+  "sendExpiresInDaysSingle": {
+    "message": "The Send will be available to anyone with the link for the next 1 day.",
+    "description": "'Send' is a noun and the name of a feature called 'Bitwarden Send'. It should not be translated."
+  },
+  "sendExpiresInDays": {
    "message": "The Send will be available to anyone with the link for the next $DAYS$ days.",
    "description": "'Send' is a noun and the name of a feature called 'Bitwarden Send'. It should not be translated.",
    "placeholders": {
@@ -3680,6 +3698,9 @@
  "noMatchingLoginsForSite": {
    "message": "No matching logins for this site"
  },
+  "searchSavePasskeyNewLogin": {
+    "message": "Search or save passkey as new login"
+  },
  "confirm": {
    "message": "Confirm"
  },
--- a/apps/browser/src/autofill/background/overlay-notifications.background.spec.ts
+++ b/apps/browser/src/autofill/background/overlay-notifications.background.spec.ts
@@ -1,4 +1,5 @@
 import { mock, MockProxy } from "jest-mock-extended";
+import { BehaviorSubject } from "rxjs";

 import { CLEAR_NOTIFICATION_LOGIN_DATA_DURATION } from "@bitwarden/common/autofill/constants";
 import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
@@ -24,6 +25,7 @@ import { OverlayNotificationsBackground } from "./overlay-notifications.backgrou

 describe("OverlayNotificationsBackground", () => {
  let logService: MockProxy<LogService>;
+  let getFeatureFlagMock$: BehaviorSubject<boolean>;
  let configService: MockProxy<ConfigService>;
  let notificationBackground: NotificationBackground;
  let getEnableChangedPasswordPromptSpy: jest.SpyInstance;
@@ -33,7 +35,10 @@ describe("OverlayNotificationsBackground", () => {
  beforeEach(async () => {
    jest.useFakeTimers();
    logService = mock<LogService>();
-    configService = mock<ConfigService>();
+    getFeatureFlagMock$ = new BehaviorSubject(true);
+    configService = mock<ConfigService>({
+      getFeatureFlag$: jest.fn().mockReturnValue(getFeatureFlagMock$),
+    });
    notificationBackground = mock<NotificationBackground>();
    getEnableChangedPasswordPromptSpy = jest
      .spyOn(notificationBackground, "getEnableChangedPasswordPrompt")
@@ -164,8 +169,17 @@ describe("OverlayNotificationsBackground", () => {
  });

  describe("storing the modified login form data", () => {
+    const pageDetails = mock<AutofillPageDetails>({ fields: [mock<AutofillField>()] });
    const sender = mock<chrome.runtime.MessageSender>({ tab: { id: 1 } });

+    beforeEach(async () => {
+      sendMockExtensionMessage(
+        { command: "collectPageDetailsResponse", details: pageDetails },
+        sender,
+      );
+      await flushPromises();
+    });
+
    it("stores the modified login cipher form data", async () => {
      sendMockExtensionMessage(
        {
@@ -349,8 +363,14 @@ describe("OverlayNotificationsBackground", () => {

    describe("web requests that trigger notifications", () => {
      const requestId = "123345";
+      const pageDetails = mock<AutofillPageDetails>({ fields: [mock<AutofillField>()] });

      beforeEach(async () => {
+        sendMockExtensionMessage(
+          { command: "collectPageDetailsResponse", details: pageDetails },
+          sender,
+        );
+        await flushPromises();
        sendMockExtensionMessage(
          {
            command: "formFieldSubmitted",
@@ -446,6 +466,11 @@ describe("OverlayNotificationsBackground", () => {

      it("triggers the notification on the beforeRequest listener when a post-submission redirection is encountered", async () => {
        sender.tab = mock<chrome.tabs.Tab>({ id: 4 });
+        sendMockExtensionMessage(
+          { command: "collectPageDetailsResponse", details: pageDetails },
+          sender,
+        );
+        await flushPromises();
        sendMockExtensionMessage(
          {
            command: "formFieldSubmitted",
--- a/apps/browser/src/autofill/background/overlay-notifications.background.ts
+++ b/apps/browser/src/autofill/background/overlay-notifications.background.ts
@@ -1,4 +1,5 @@
-import { Subject, switchMap, timer } from "rxjs";
+import { startWith, Subject, Subscription, switchMap, timer } from "rxjs";
+import { pairwise } from "rxjs/operators";

 import { CLEAR_NOTIFICATION_LOGIN_DATA_DURATION } from "@bitwarden/common/autofill/constants";
 import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
@@ -23,7 +24,9 @@ export class OverlayNotificationsBackground implements OverlayNotificationsBackg
  private websiteOriginsWithFields: WebsiteOriginsWithFields = new Map();
  private activeFormSubmissionRequests: ActiveFormSubmissionRequests = new Set();
  private modifyLoginCipherFormData: ModifyLoginCipherFormDataForTab = new Map();
+  private featureFlagState$: Subscription;
  private clearLoginCipherFormDataSubject: Subject<void> = new Subject();
+  private notificationFallbackTimeout: number | NodeJS.Timeout | null;
  private readonly formSubmissionRequestMethods: Set<string> = new Set(["POST", "PUT", "PATCH"]);
  private readonly extensionMessageHandlers: OverlayNotificationsExtensionMessageHandlers = {
    formFieldSubmitted: ({ message, sender }) => this.storeModifiedLoginFormData(message, sender),
@@ -41,19 +44,35 @@ export class OverlayNotificationsBackground implements OverlayNotificationsBackg
   * Initialize the overlay notifications background service.
   */
  async init() {
-    const featureFlagActive = await this.configService.getFeatureFlag(
-      FeatureFlag.NotificationBarAddLoginImprovements,
-    );
-    if (!featureFlagActive) {
-      return;
-    }
-
-    this.setupExtensionListeners();
+    this.featureFlagState$ = this.configService
+      .getFeatureFlag$(FeatureFlag.NotificationBarAddLoginImprovements)
+      .pipe(startWith(undefined), pairwise())
+      .subscribe(([prev, current]) => this.handleInitFeatureFlagChange(prev, current));
    this.clearLoginCipherFormDataSubject
      .pipe(switchMap(() => timer(CLEAR_NOTIFICATION_LOGIN_DATA_DURATION)))
      .subscribe(() => this.modifyLoginCipherFormData.clear());
  }

+  /**
+   * Handles enabling/disabling the extension listeners that trigger the
+   * overlay notifications based on the feature flag state.
+   *
+   * @param previousValue - The previous value of the feature flag
+   * @param currentValue - The current value of the feature flag
+   */
+  private handleInitFeatureFlagChange = (previousValue: boolean, currentValue: boolean) => {
+    if (previousValue === currentValue) {
+      return;
+    }
+
+    if (currentValue) {
+      this.setupExtensionListeners();
+      return;
+    }
+
+    this.removeExtensionListeners();
+  };
+
  /**
   * Handles the response from the content script with the page details. Triggers an initialization
   * of the add login or change password notification if the conditions are met.
@@ -126,6 +145,10 @@ export class OverlayNotificationsBackground implements OverlayNotificationsBackg
    message: OverlayNotificationsExtensionMessage,
    sender: chrome.runtime.MessageSender,
  ) => {
+    if (!this.websiteOriginsWithFields.has(sender.tab.id)) {
+      return;
+    }
+
    const { uri, username, password, newPassword } = message;
    if (!username && !password && !newPassword) {
      return;
@@ -142,8 +165,29 @@ export class OverlayNotificationsBackground implements OverlayNotificationsBackg
    }

    this.modifyLoginCipherFormData.set(sender.tab.id, formData);
+
+    this.clearNotificationFallbackTimeout();
+    this.notificationFallbackTimeout = setTimeout(
+      () =>
+        this.setupNotificationInitTrigger(
+          sender.tab.id,
+          "",
+          this.modifyLoginCipherFormData.get(sender.tab.id),
+        ).catch((error) => this.logService.error(error)),
+      1500,
+    );
  };

+  /**
+   * Clears the timeout used when triggering a notification on click of the submit button.
+   */
+  private clearNotificationFallbackTimeout() {
+    if (this.notificationFallbackTimeout) {
+      clearTimeout(this.notificationFallbackTimeout);
+      this.notificationFallbackTimeout = null;
+    }
+  }
+
  /**
   * Determines if the sender of the message is from an excluded domain. This is used to prevent the
   * add login or change password notification from being triggered on the user's vault domain or
@@ -306,12 +350,16 @@ export class OverlayNotificationsBackground implements OverlayNotificationsBackg
  private handleOnCompletedRequestEvent = async (details: chrome.webRequest.WebResponseDetails) => {
    if (
      this.requestHostIsInvalid(details) ||
-      isInvalidResponseStatusCode(details.statusCode) ||
      !this.activeFormSubmissionRequests.has(details.requestId)
    ) {
      return;
    }

+    if (isInvalidResponseStatusCode(details.statusCode)) {
+      this.clearNotificationFallbackTimeout();
+      return;
+    }
+
    const modifyLoginData = this.modifyLoginCipherFormData.get(details.tabId);
    if (!modifyLoginData) {
      return;
@@ -335,6 +383,8 @@ export class OverlayNotificationsBackground implements OverlayNotificationsBackg
    requestId: string,
    modifyLoginData: ModifyLoginCipherFormData,
  ) => {
+    this.clearNotificationFallbackTimeout();
+
    const tab = await BrowserApi.getTab(tabId);
    if (tab.status !== "complete") {
      await this.delayNotificationInitUntilTabIsComplete(tabId, requestId, modifyLoginData);
@@ -463,11 +513,20 @@ export class OverlayNotificationsBackground implements OverlayNotificationsBackg
   * Sets up the listeners for the extension messages and the tab events.
   */
  private setupExtensionListeners() {
-    BrowserApi.messageListener("overlay-notifications", this.handleExtensionMessage);
+    BrowserApi.addListener(chrome.runtime.onMessage, this.handleExtensionMessage);
    chrome.tabs.onRemoved.addListener(this.handleTabRemoved);
    chrome.tabs.onUpdated.addListener(this.handleTabUpdated);
  }

+  /**
+   * Removes the listeners for the extension messages and the tab events.
+   */
+  private removeExtensionListeners() {
+    BrowserApi.removeListener(chrome.runtime.onMessage, this.handleExtensionMessage);
+    chrome.tabs.onRemoved.removeListener(this.handleTabRemoved);
+    chrome.tabs.onUpdated.removeListener(this.handleTabUpdated);
+  }
+
  /**
   * Handles messages that are sent to the extension background.
   *
--- a/apps/browser/src/autofill/background/overlay.background.ts
+++ b/apps/browser/src/autofill/background/overlay.background.ts
@@ -1484,9 +1484,7 @@ export class OverlayBackground implements OverlayBackgroundInterface {
  }

  /**
-   * Gets the user's authentication status from the auth service. If the user's authentication
-   * status has changed, the inline menu button's authentication status will be updated
-   * and the inline menu list's ciphers will be updated.
+   * Gets the user's authentication status from the auth service.
   */
  private async getAuthStatus() {
    return await firstValueFrom(this.authService.activeAccountStatus$);
--- a/apps/browser/src/autofill/fido2/background/abstractions/fido2.background.ts
+++ b/apps/browser/src/autofill/fido2/background/abstractions/fido2.background.ts
@@ -45,7 +45,6 @@ type Fido2BackgroundExtensionMessageHandlers = {

 interface Fido2Background {
  init(): void;
-  injectFido2ContentScriptsInAllTabs(): Promise<void>;
 }

 export {
--- a/apps/browser/src/autofill/fido2/background/fido2.background.spec.ts
+++ b/apps/browser/src/autofill/fido2/background/fido2.background.spec.ts
@@ -1,6 +1,8 @@
 import { mock, MockProxy } from "jest-mock-extended";
 import { BehaviorSubject } from "rxjs";

+import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service";
+import { AuthenticationStatus } from "@bitwarden/common/auth/enums/authentication-status";
 import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
 import { Fido2ActiveRequestManager } from "@bitwarden/common/platform/abstractions/fido2/fido2-active-request-manager.abstraction";
 import {
@@ -59,6 +61,8 @@ describe("Fido2Background", () => {
  let scriptInjectorServiceMock!: MockProxy<BrowserScriptInjectorService>;
  let configServiceMock!: MockProxy<ConfigService>;
  let enablePasskeysMock$!: BehaviorSubject<boolean>;
+  let activeAccountStatusMock$: BehaviorSubject<AuthenticationStatus>;
+  let authServiceMock!: MockProxy<AuthService>;
  let fido2Background!: Fido2Background;

  beforeEach(() => {
@@ -81,6 +85,9 @@ describe("Fido2Background", () => {
    vaultSettingsService.enablePasskeys$ = enablePasskeysMock$;
    fido2ActiveRequestManager = mock<Fido2ActiveRequestManager>();
    fido2ClientService.isFido2FeatureEnabled.mockResolvedValue(true);
+    activeAccountStatusMock$ = new BehaviorSubject(AuthenticationStatus.Unlocked);
+    authServiceMock = mock<AuthService>();
+    authServiceMock.activeAccountStatus$ = activeAccountStatusMock$;
    fido2Background = new Fido2Background(
      logService,
      fido2ActiveRequestManager,
@@ -88,6 +95,7 @@ describe("Fido2Background", () => {
      vaultSettingsService,
      scriptInjectorServiceMock,
      configServiceMock,
+      authServiceMock,
    );
    fido2Background["abortManager"] = abortManagerMock;
    abortManagerMock.runWithAbortController.mockImplementation((_requestId, runner) =>
@@ -101,55 +109,31 @@ describe("Fido2Background", () => {
    jest.clearAllMocks();
  });

-  describe("injectFido2ContentScriptsInAllTabs", () => {
-    it("does not inject any FIDO2 content scripts when no tabs have a secure url protocol", async () => {
-      const insecureTab = mock<chrome.tabs.Tab>({ id: 789, url: "http://example.com" });
-      tabsQuerySpy.mockResolvedValueOnce([insecureTab]);
+  describe("handleAuthStatusUpdate", () => {
+    let updateContentScriptRegistrationSpy: jest.SpyInstance;

-      await fido2Background.injectFido2ContentScriptsInAllTabs();
-
-      expect(scriptInjectorServiceMock.inject).not.toHaveBeenCalled();
+    beforeEach(() => {
+      updateContentScriptRegistrationSpy = jest
+        .spyOn(fido2Background as any, "updateContentScriptRegistration")
+        .mockImplementation();
    });

-    it("only injects the FIDO2 content script into tabs that contain a secure url protocol", async () => {
-      const secondTabMock = mock<chrome.tabs.Tab>({ id: 456, url: "https://example.com" });
-      const insecureTab = mock<chrome.tabs.Tab>({ id: 789, url: "http://example.com" });
-      const noUrlTab = mock<chrome.tabs.Tab>({ id: 101, url: undefined });
-      tabsQuerySpy.mockResolvedValueOnce([tabMock, secondTabMock, insecureTab, noUrlTab]);
+    it("skips triggering the passkeys settings update if the user is logged out", async () => {
+      activeAccountStatusMock$.next(AuthenticationStatus.LoggedOut);

-      await fido2Background.injectFido2ContentScriptsInAllTabs();
+      fido2Background.init();
      await flushPromises();

-      expect(scriptInjectorServiceMock.inject).toHaveBeenCalledWith({
-        tabId: tabMock.id,
-        injectDetails: contentScriptDetails,
-      });
-      expect(scriptInjectorServiceMock.inject).toHaveBeenCalledWith({
-        tabId: secondTabMock.id,
-        injectDetails: contentScriptDetails,
-      });
-      expect(scriptInjectorServiceMock.inject).not.toHaveBeenCalledWith({
-        tabId: insecureTab.id,
-        injectDetails: contentScriptDetails,
-      });
-      expect(scriptInjectorServiceMock.inject).not.toHaveBeenCalledWith({
-        tabId: noUrlTab.id,
-        injectDetails: contentScriptDetails,
-      });
+      expect(updateContentScriptRegistrationSpy).not.toHaveBeenCalled();
    });

-    it("injects the `page-script.js` content script into the provided tab", async () => {
-      tabsQuerySpy.mockResolvedValueOnce([tabMock]);
+    it("triggers the passkeys setting update if the user is logged in", async () => {
+      activeAccountStatusMock$.next(AuthenticationStatus.Unlocked);

-      await fido2Background.injectFido2ContentScriptsInAllTabs();
+      fido2Background.init();
      await flushPromises();

-      expect(scriptInjectorServiceMock.inject).toHaveBeenCalledWith({
-        tabId: tabMock.id,
-        injectDetails: sharedScriptInjectionDetails,
-        mv2Details: { file: Fido2ContentScript.PageScriptAppend },
-        mv3Details: { file: Fido2ContentScript.PageScript, world: "MAIN" },
-      });
+      expect(updateContentScriptRegistrationSpy).toHaveBeenCalled();
    });
  });

@@ -157,6 +141,7 @@ describe("Fido2Background", () => {
    let portMock!: MockProxy<chrome.runtime.Port>;

    beforeEach(() => {
+      jest.spyOn(fido2Background as any, "handleAuthStatusUpdate").mockImplementation();
      fido2Background.init();
      jest.spyOn(BrowserApi, "registerContentScriptsMv2");
      jest.spyOn(BrowserApi, "registerContentScriptsMv3");
@@ -168,6 +153,15 @@ describe("Fido2Background", () => {
      tabsQuerySpy.mockResolvedValue([tabMock]);
    });

+    it("skips handling the passkey update if the user is logged out", async () => {
+      activeAccountStatusMock$.next(AuthenticationStatus.LoggedOut);
+
+      enablePasskeysMock$.next(true);
+
+      expect(portMock.disconnect).not.toHaveBeenCalled();
+      expect(scriptInjectorServiceMock.inject).not.toHaveBeenCalled();
+    });
+
    it("does not destroy and re-inject the content scripts when triggering `handleEnablePasskeysUpdate` with an undefined currentEnablePasskeysSetting property", async () => {
      await flushPromises();

@@ -421,6 +415,7 @@ describe("Fido2Background", () => {
    let portMock!: MockProxy<chrome.runtime.Port>;

    beforeEach(() => {
+      jest.spyOn(fido2Background as any, "handleAuthStatusUpdate").mockImplementation();
      fido2Background.init();
      portMock = createPortSpyMock(Fido2PortName.InjectedScript);
      triggerRuntimeOnConnectEvent(portMock);
--- a/apps/browser/src/autofill/fido2/background/fido2.background.ts
+++ b/apps/browser/src/autofill/fido2/background/fido2.background.ts
@@ -1,6 +1,8 @@
-import { firstValueFrom, startWith } from "rxjs";
+import { firstValueFrom, startWith, Subscription } from "rxjs";
 import { pairwise } from "rxjs/operators";

+import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service";
+import { AuthenticationStatus } from "@bitwarden/common/auth/enums/authentication-status";
 import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
 import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
 import { Fido2ActiveRequestManager } from "@bitwarden/common/platform/abstractions/fido2/fido2-active-request-manager.abstraction";
@@ -29,6 +31,7 @@ import {
 } from "./abstractions/fido2.background";

 export class Fido2Background implements Fido2BackgroundInterface {
+  private currentAuthStatus$: Subscription;
  private abortManager = new AbortManager();
  private fido2ContentScriptPortsSet = new Set<chrome.runtime.Port>();
  private registeredContentScripts: browser.contentScripts.RegisteredContentScript;
@@ -55,6 +58,7 @@ export class Fido2Background implements Fido2BackgroundInterface {
    private vaultSettingsService: VaultSettingsService,
    private scriptInjectorService: ScriptInjectorService,
    private configService: ConfigService,
+    private authService: AuthService,
  ) {}

  /**
@@ -68,12 +72,32 @@ export class Fido2Background implements Fido2BackgroundInterface {
    this.vaultSettingsService.enablePasskeys$
      .pipe(startWith(undefined), pairwise())
      .subscribe(([previous, current]) => this.handleEnablePasskeysUpdate(previous, current));
+    this.currentAuthStatus$ = this.authService.activeAccountStatus$
+      .pipe(startWith(undefined), pairwise())
+      .subscribe(([_previous, current]) => this.handleAuthStatusUpdate(current));
+  }
+
+  /**
+   * Handles initializing the FIDO2 content scripts based on the current
+   * authentication status. We only want to inject the FIDO2 content scripts
+   * if the user is logged in.
+   *
+   * @param authStatus - The current authentication status.
+   */
+  private async handleAuthStatusUpdate(authStatus: AuthenticationStatus) {
+    if (authStatus === AuthenticationStatus.LoggedOut) {
+      return;
+    }
+
+    const enablePasskeys = await this.isPasskeySettingEnabled();
+    await this.handleEnablePasskeysUpdate(enablePasskeys, enablePasskeys);
+    this.currentAuthStatus$.unsubscribe();
  }

  /**
   * Injects the FIDO2 content and page script into all existing browser tabs.
   */
-  async injectFido2ContentScriptsInAllTabs() {
+  private async injectFido2ContentScriptsInAllTabs() {
    const tabs = await BrowserApi.tabsQuery({});

    for (let index = 0; index < tabs.length; index++) {
@@ -85,6 +109,13 @@ export class Fido2Background implements Fido2BackgroundInterface {
    }
  }

+  /**
+   * Gets the user's authentication status from the auth service.
+   */
+  private async getAuthStatus() {
+    return await firstValueFrom(this.authService.activeAccountStatus$);
+  }
+
  /**
   * Handles reacting to the enablePasskeys setting being updated. If the setting
   * is enabled, the FIDO2 content scripts are injected into all tabs. If the setting
@@ -98,13 +129,17 @@ export class Fido2Background implements Fido2BackgroundInterface {
    previousEnablePasskeysSetting: boolean,
    enablePasskeys: boolean,
  ) {
-    this.fido2ActiveRequestManager.removeAllActiveRequests();
-    await this.updateContentScriptRegistration();
+    if ((await this.getAuthStatus()) === AuthenticationStatus.LoggedOut) {
+      return;
+    }

    if (previousEnablePasskeysSetting === undefined) {
      return;
    }

+    this.fido2ActiveRequestManager.removeAllActiveRequests();
+    await this.updateContentScriptRegistration();
+
    this.destroyLoadedFido2ContentScripts();
    if (enablePasskeys) {
      void this.injectFido2ContentScriptsInAllTabs();
--- a/apps/browser/src/autofill/fido2/content/fido2-page-script-append.mv2.ts
+++ b/apps/browser/src/autofill/fido2/content/fido2-page-script-append.mv2.ts
@@ -9,6 +9,7 @@

  const script = globalContext.document.createElement("script");
  script.src = chrome.runtime.getURL("content/fido2-page-script.js");
+  script.async = false;

  const scriptInsertionPoint =
    globalContext.document.head || globalContext.document.documentElement;
--- a/apps/browser/src/autofill/fido2/content/fido2-page-script-delay-append.mv2.ts
+++ b/apps/browser/src/autofill/fido2/content/fido2-page-script-delay-append.mv2.ts
@@ -9,6 +9,7 @@

  const script = globalContext.document.createElement("script");
  script.src = chrome.runtime.getURL("content/fido2-page-script.js");
+  script.async = false;

  // We are ensuring that the script injection is delayed in the event that we are loading
  // within an iframe element. This prevents an issue with web mail clients that load content
--- a/apps/browser/src/autofill/fido2/content/fido2-page-script.ts
+++ b/apps/browser/src/autofill/fido2/content/fido2-page-script.ts
@@ -4,6 +4,12 @@ import { MessageType } from "./messaging/message";
 import { Messenger } from "./messaging/messenger";

 (function (globalContext) {
+  if (globalContext.document.currentScript) {
+    globalContext.document.currentScript.parentNode.removeChild(
+      globalContext.document.currentScript,
+    );
+  }
+
  const shouldExecuteContentScript =
    globalContext.document.contentType === "text/html" &&
    (globalContext.document.location.protocol === "https:" ||
--- a/apps/browser/src/autofill/popup/fido2/fido2.component.html
+++ b/apps/browser/src/autofill/popup/fido2/fido2.component.html
@@ -50,7 +50,7 @@
      <ng-container *ngIf="!displayedCiphers.length">
        <bit-no-items class="tw-text-main" [icon]="noResultsIcon">
          <ng-container slot="title">{{ "noMatchingLoginsForSite" | i18n }}</ng-container>
-          <ng-container slot="description">Search or save passkey as new login</ng-container>
+          <ng-container slot="description">{{ "searchSavePasskeyNewLogin" | i18n }}</ng-container>
          <button
            bitButton
            buttonType="primary"
@@ -100,8 +100,8 @@
      <!-- Display when no matching ciphers exist -->
      <ng-container *ngIf="!displayedCiphers.length">
        <bit-no-items class="tw-text-main" [icon]="noResultsIcon">
-          <ng-container slot="title">No matching logins for this site</ng-container>
-          <ng-container slot="description">Search or save passkey as new login</ng-container>
+          <ng-container slot="title">{{ "noItemsMatchSearch" | i18n }}</ng-container>
+          <ng-container slot="description">{{ "clearFiltersOrTryAnother" | i18n }}</ng-container>
          <button
            bitButton
            buttonType="primary"
--- a/apps/browser/src/autofill/services/dom-query.service.ts
+++ b/apps/browser/src/autofill/services/dom-query.service.ts
@@ -7,6 +7,27 @@ import { DomQueryService as DomQueryServiceInterface } from "./abstractions/dom-
 export class DomQueryService implements DomQueryServiceInterface {
  private pageContainsShadowDom: boolean;
  private useTreeWalkerStrategyFlagSet = true;
+  private ignoredTreeWalkerNodes = new Set([
+    "svg",
+    "script",
+    "noscript",
+    "head",
+    "style",
+    "link",
+    "meta",
+    "title",
+    "base",
+    "img",
+    "picture",
+    "video",
+    "audio",
+    "object",
+    "source",
+    "track",
+    "param",
+    "map",
+    "area",
+  ]);

  constructor() {
    void this.init();
@@ -21,6 +42,7 @@ export class DomQueryService implements DomQueryServiceInterface {
   * @param treeWalkerFilter - The filter callback to use for the treeWalker query
   * @param mutationObserver - The MutationObserver to use for observing shadow roots
   * @param forceDeepQueryAttempt - Whether to force a deep query attempt
+   * @param ignoredTreeWalkerNodesOverride - An optional set of node names to ignore when using the treeWalker strategy
   */
  query<T>(
    root: Document | ShadowRoot | Element,
@@ -28,15 +50,28 @@ export class DomQueryService implements DomQueryServiceInterface {
    treeWalkerFilter: CallableFunction,
    mutationObserver?: MutationObserver,
    forceDeepQueryAttempt?: boolean,
+    ignoredTreeWalkerNodesOverride?: Set<string>,
  ): T[] {
+    const ignoredTreeWalkerNodes = ignoredTreeWalkerNodesOverride || this.ignoredTreeWalkerNodes;
+
    if (!forceDeepQueryAttempt && this.pageContainsShadowDomElements()) {
-      return this.queryAllTreeWalkerNodes<T>(root, treeWalkerFilter, mutationObserver);
+      return this.queryAllTreeWalkerNodes<T>(
+        root,
+        treeWalkerFilter,
+        ignoredTreeWalkerNodes,
+        mutationObserver,
+      );
    }

    try {
      return this.deepQueryElements<T>(root, queryString, mutationObserver);
    } catch {
-      return this.queryAllTreeWalkerNodes<T>(root, treeWalkerFilter, mutationObserver);
+      return this.queryAllTreeWalkerNodes<T>(
+        root,
+        treeWalkerFilter,
+        ignoredTreeWalkerNodes,
+        mutationObserver,
+      );
    }
  }

@@ -207,11 +242,13 @@ export class DomQueryService implements DomQueryServiceInterface {
   * and returns a collection of nodes.
   * @param rootNode
   * @param filterCallback
+   * @param ignoredTreeWalkerNodes
   * @param mutationObserver
   */
  private queryAllTreeWalkerNodes<T>(
    rootNode: Node,
    filterCallback: CallableFunction,
+    ignoredTreeWalkerNodes: Set<string>,
    mutationObserver?: MutationObserver,
  ): T[] {
    const treeWalkerQueryResults: T[] = [];
@@ -220,6 +257,7 @@ export class DomQueryService implements DomQueryServiceInterface {
      rootNode,
      treeWalkerQueryResults,
      filterCallback,
+      ignoredTreeWalkerNodes,
      mutationObserver,
    );

@@ -233,15 +271,21 @@ export class DomQueryService implements DomQueryServiceInterface {
   * @param rootNode
   * @param treeWalkerQueryResults
   * @param filterCallback
+   * @param ignoredTreeWalkerNodes
   * @param mutationObserver
   */
  private buildTreeWalkerNodesQueryResults<T>(
    rootNode: Node,
    treeWalkerQueryResults: T[],
    filterCallback: CallableFunction,
+    ignoredTreeWalkerNodes: Set<string>,
    mutationObserver?: MutationObserver,
  ) {
-    const treeWalker = document?.createTreeWalker(rootNode, NodeFilter.SHOW_ELEMENT);
+    const treeWalker = document?.createTreeWalker(rootNode, NodeFilter.SHOW_ELEMENT, (node) =>
+      ignoredTreeWalkerNodes.has(node.nodeName?.toLowerCase())
+        ? NodeFilter.FILTER_REJECT
+        : NodeFilter.FILTER_ACCEPT,
+    );
    let currentNode = treeWalker?.currentNode;

    while (currentNode) {
@@ -263,6 +307,7 @@ export class DomQueryService implements DomQueryServiceInterface {
          nodeShadowRoot,
          treeWalkerQueryResults,
          filterCallback,
+          ignoredTreeWalkerNodes,
          mutationObserver,
        );
      }
--- a/apps/browser/src/background/main.background.ts
+++ b/apps/browser/src/background/main.background.ts
@@ -1103,6 +1103,7 @@ export default class MainBackground {
        this.vaultSettingsService,
        this.scriptInjectorService,
        this.configService,
+        this.authService,
      );

      const lockService = new DefaultLockService(this.accountService, this.vaultTimeoutService);
@@ -1118,7 +1119,6 @@ export default class MainBackground {
        this.messagingService,
        this.logService,
        this.configService,
-        this.fido2Background,
        messageListener,
        this.accountService,
        lockService,
--- a/apps/browser/src/background/runtime.background.ts
+++ b/apps/browser/src/background/runtime.background.ts
@@ -21,7 +21,6 @@ import {
  openTwoFactorAuthPopout,
 } from "../auth/popup/utils/auth-popout-window";
 import { LockedVaultPendingNotificationsData } from "../autofill/background/abstractions/notification.background";
-import { Fido2Background } from "../autofill/fido2/background/abstractions/fido2.background";
 import { AutofillService } from "../autofill/services/abstractions/autofill.service";
 import { BrowserApi } from "../platform/browser/browser-api";
 import { BrowserEnvironmentService } from "../platform/services/browser-environment.service";
@@ -46,7 +45,6 @@ export default class RuntimeBackground {
    private messagingService: MessagingService,
    private logService: LogService,
    private configService: ConfigService,
-    private fido2Background: Fido2Background,
    private messageListener: MessageListener,
    private accountService: AccountService,
    private readonly lockService: LockService,
@@ -365,7 +363,6 @@ export default class RuntimeBackground {

  private async checkOnInstalled() {
    setTimeout(async () => {
-      void this.fido2Background.injectFido2ContentScriptsInAllTabs();
      void this.autofillService.loadAutofillScriptsOnInstall();

      if (this.onInstalledReason != null) {
--- a/apps/browser/src/platform/browser/browser-api.register-content-scripts-polyfill.ts
+++ b/apps/browser/src/platform/browser/browser-api.register-content-scripts-polyfill.ts
@@ -43,23 +43,17 @@ function buildRegisterContentScriptsPolyfill() {
  function NestedProxy<T extends object>(target: T): T {
    return new Proxy(target, {
      get(target, prop) {
-        const propertyValue = target[prop as keyof T];
-
-        if (!propertyValue) {
+        if (!target[prop as keyof T]) {
          return;
        }

-        if (typeof propertyValue === "object") {
-          return NestedProxy<typeof propertyValue>(propertyValue);
-        }
-
-        if (typeof propertyValue !== "function") {
-          return propertyValue;
+        if (typeof target[prop as keyof T] !== "function") {
+          return NestedProxy(target[prop as keyof T] as object);
        }

        return (...arguments_: any[]) =>
          new Promise((resolve, reject) => {
-            propertyValue(...arguments_, (result: any) => {
+            (target[prop as keyof T] as CallableFunction)(...arguments_, (result: any) => {
              if (chrome.runtime.lastError) {
                reject(new Error(chrome.runtime.lastError.message));
              } else {
--- a/apps/browser/src/popup/app-routing.module.ts
+++ b/apps/browser/src/popup/app-routing.module.ts
@@ -12,7 +12,6 @@ import {
  unauthGuardFn,
 } from "@bitwarden/angular/auth/guards";
 import { canAccessFeature } from "@bitwarden/angular/platform/guard/feature-flag.guard";
-import { generatorSwap } from "@bitwarden/angular/tools/generator/generator-swap";
 import { extensionRefreshRedirect } from "@bitwarden/angular/utils/extension-refresh-redirect";
 import { extensionRefreshSwap } from "@bitwarden/angular/utils/extension-refresh-swap";
 import {
@@ -582,7 +581,7 @@ const routes: Routes = [
        canDeactivate: [clearVaultStateGuard],
        data: { state: "tabs_vault" } satisfies RouteDataProperties,
      }),
-      ...generatorSwap(GeneratorComponent, CredentialGeneratorComponent, {
+      ...extensionRefreshSwap(GeneratorComponent, CredentialGeneratorComponent, {
        path: "generator",
        canActivate: [authGuard],
        data: { state: "tabs_generator" } satisfies RouteDataProperties,
--- a/apps/browser/src/tools/popup/generator/credential-generator.component.html
+++ b/apps/browser/src/tools/popup/generator/credential-generator.component.html
@@ -1,2 +1,15 @@
-<!-- Note: this is all throwaway markup, so it won't follow best practices -->
-<tools-username-generator />
+<popup-page>
+  <popup-header slot="header" [pageTitle]="'generator' | i18n">
+    <ng-container slot="end">
+      <app-pop-out />
+      <app-current-account />
+    </ng-container>
+  </popup-header>
+  <tools-credential-generator />
+  <bit-item>
+    <a type="button" bit-item-content routerLink="/generator-history">
+      {{ "passwordHistory" | i18n }}
+      <i slot="end" class="bwi bwi-angle-right" aria-hidden="true"></i>
+    </a>
+  </bit-item>
+</popup-page>
--- a/apps/browser/src/tools/popup/generator/credential-generator.component.ts
+++ b/apps/browser/src/tools/popup/generator/credential-generator.component.ts
@@ -1,12 +1,28 @@
 import { Component } from "@angular/core";

-import { SectionComponent } from "@bitwarden/components";
-import { UsernameGeneratorComponent } from "@bitwarden/generator-components";
+import { JslibModule } from "@bitwarden/angular/jslib.module";
+import { ItemModule } from "@bitwarden/components";
+import { GeneratorModule } from "@bitwarden/generator-components";
+
+import { CurrentAccountComponent } from "../../../auth/popup/account-switching/current-account.component";
+import { PopOutComponent } from "../../../platform/popup/components/pop-out.component";
+import { PopupFooterComponent } from "../../../platform/popup/layout/popup-footer.component";
+import { PopupHeaderComponent } from "../../../platform/popup/layout/popup-header.component";
+import { PopupPageComponent } from "../../../platform/popup/layout/popup-page.component";

@Component({
  standalone: true,
  selector: "credential-generator",
  templateUrl: "credential-generator.component.html",
-  imports: [UsernameGeneratorComponent, SectionComponent],
+  imports: [
+    GeneratorModule,
+    CurrentAccountComponent,
+    JslibModule,
+    PopOutComponent,
+    PopupHeaderComponent,
+    PopupPageComponent,
+    PopupFooterComponent,
+    ItemModule,
+  ],
 })
 export class CredentialGeneratorComponent {}
--- a/apps/browser/src/tools/popup/send-v2/send-created/send-created.component.html
+++ b/apps/browser/src/tools/popup/send-v2/send-created/send-created.component.html
@@ -16,7 +16,9 @@
    >
      <bit-icon [icon]="sendCreatedIcon"></bit-icon>
      <h3 class="tw-font-semibold">{{ "createdSendSuccessfully" | i18n }}</h3>
-      <p class="tw-text-center">{{ "sendAvailability" | i18n: daysAvailable }}</p>
+      <p class="tw-text-center">
+        {{ formatExpirationDate() }}
+      </p>
      <button bitButton type="button" buttonType="primary" (click)="copyLink()">
        <b>{{ "copyLink" | i18n }}</b>
      </button>
--- a/apps/browser/src/tools/popup/send-v2/send-created/send-created.component.spec.ts
+++ b/apps/browser/src/tools/popup/send-v2/send-created/send-created.component.spec.ts
@@ -3,7 +3,7 @@ import { ComponentFixture, TestBed } from "@angular/core/testing";
 import { ActivatedRoute, Router, RouterLink } from "@angular/router";
 import { RouterTestingModule } from "@angular/router/testing";
 import { MockProxy, mock } from "jest-mock-extended";
-import { of } from "rxjs";
+import { BehaviorSubject, of } from "rxjs";

 import { JslibModule } from "@bitwarden/angular/jslib.module";
 import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
@@ -13,7 +13,7 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
 import { SelfHostedEnvironment } from "@bitwarden/common/platform/services/default-environment.service";
 import { SendView } from "@bitwarden/common/tools/send/models/view/send.view";
 import { SendService } from "@bitwarden/common/tools/send/services/send.service.abstraction";
-import { ButtonModule, IconModule, ToastService } from "@bitwarden/components";
+import { ButtonModule, I18nMockService, IconModule, ToastService } from "@bitwarden/components";

 import { PopOutComponent } from "../../../../platform/popup/components/pop-out.component";
 import { PopupFooterComponent } from "../../../../platform/popup/layout/popup-footer.component";
@@ -26,7 +26,6 @@ import { SendCreatedComponent } from "./send-created.component";
 describe("SendCreatedComponent", () => {
  let component: SendCreatedComponent;
  let fixture: ComponentFixture<SendCreatedComponent>;
-  let i18nService: MockProxy<I18nService>;
  let platformUtilsService: MockProxy<PlatformUtilsService>;
  let sendService: MockProxy<SendService>;
  let toastService: MockProxy<ToastService>;
@@ -36,17 +35,10 @@ describe("SendCreatedComponent", () => {
  let router: MockProxy<Router>;

  const sendId = "test-send-id";
-  const deletionDate = new Date();
-  deletionDate.setDate(deletionDate.getDate() + 7);
-  const sendView: SendView = {
-    id: sendId,
-    deletionDate,
-    accessId: "abc",
-    urlB64Key: "123",
-  } as SendView;
+  let sendView: SendView;
+  let sendViewsSubject: BehaviorSubject<SendView[]>;

  beforeEach(async () => {
-    i18nService = mock<I18nService>();
    platformUtilsService = mock<PlatformUtilsService>();
    sendService = mock<SendService>();
    toastService = mock<ToastService>();
@@ -54,6 +46,17 @@ describe("SendCreatedComponent", () => {
    activatedRoute = mock<ActivatedRoute>();
    environmentService = mock<EnvironmentService>();
    router = mock<Router>();
+
+    sendView = {
+      id: sendId,
+      deletionDate: new Date(),
+      accessId: "abc",
+      urlB64Key: "123",
+    } as SendView;
+
+    sendViewsSubject = new BehaviorSubject<SendView[]>([sendView]);
+    sendService.sendViews$ = sendViewsSubject.asObservable();
+
    Object.defineProperty(environmentService, "environment$", {
      configurable: true,
      get: () => of(new SelfHostedEnvironment({ webVault: "https://example.com" })),
@@ -65,8 +68,6 @@ describe("SendCreatedComponent", () => {
      },
    } as any;

-    sendService.sendViews$ = of([sendView]);
-
    await TestBed.configureTestingModule({
      imports: [
        CommonModule,
@@ -82,7 +83,25 @@ describe("SendCreatedComponent", () => {
        SendCreatedComponent,
      ],
      providers: [
-        { provide: I18nService, useValue: i18nService },
+        {
+          provide: I18nService,
+          useFactory: () => {
+            return new I18nMockService({
+              back: "back",
+              loading: "loading",
+              copyLink: "copyLink",
+              close: "close",
+              createdSend: "createdSend",
+              createdSendSuccessfully: "createdSendSuccessfully",
+              popOutNewWindow: "popOutNewWindow",
+              sendExpiresInHours: (hours) => `sendExpiresInHours ${hours}`,
+              sendExpiresInHoursSingle: "sendExpiresInHoursSingle",
+              sendExpiresInDays: (days) => `sendExpiresInDays ${days}`,
+              sendExpiresInDaysSingle: "sendExpiresInDaysSingle",
+              sendLinkCopied: "sendLinkCopied",
+            });
+          },
+        },
        { provide: PlatformUtilsService, useValue: platformUtilsService },
        { provide: SendService, useValue: sendService },
        { provide: ToastService, useValue: toastService },
@@ -94,40 +113,73 @@ describe("SendCreatedComponent", () => {
        { provide: Router, useValue: router },
      ],
    }).compileComponents();
-  });

-  beforeEach(() => {
    fixture = TestBed.createComponent(SendCreatedComponent);
    component = fixture.componentInstance;
+    fixture.detectChanges();
  });

  it("should create", () => {
-    fixture.detectChanges();
    expect(component).toBeTruthy();
  });

-  it("should initialize send and daysAvailable", () => {
-    fixture.detectChanges();
+  it("should initialize send, daysAvailable, and hoursAvailable", () => {
    expect(component["send"]).toBe(sendView);
-    expect(component["daysAvailable"]).toBe(7);
+    expect(component["daysAvailable"]).toBe(0);
+    expect(component["hoursAvailable"]).toBe(0);
  });

  it("should navigate back to send list on close", async () => {
-    fixture.detectChanges();
    await component.close();
    expect(router.navigate).toHaveBeenCalledWith(["/tabs/send"]);
  });

-  describe("getDaysAvailable", () => {
-    it("returns the correct number of days", () => {
+  describe("getHoursAvailable", () => {
+    it("returns the correct number of hours", () => {
+      sendView.deletionDate.setDate(sendView.deletionDate.getDate() + 7);
+      sendViewsSubject.next([sendView]);
      fixture.detectChanges();
-      expect(component.getDaysAvailable(sendView)).toBe(7);
+
+      expect(component.getHoursAvailable(sendView)).toBeCloseTo(168, 0);
+    });
+  });
+
+  describe("formatExpirationDate", () => {
+    it("returns days plural if expiry is more than 24 hours", () => {
+      sendView.deletionDate.setDate(sendView.deletionDate.getDate() + 7);
+      sendViewsSubject.next([sendView]);
+      fixture.detectChanges();
+
+      expect(component.formatExpirationDate()).toBe("sendExpiresInDays 7");
+    });
+
+    it("returns days singular if expiry is 24 hours", () => {
+      sendView.deletionDate.setDate(sendView.deletionDate.getDate() + 1);
+      sendViewsSubject.next([sendView]);
+      fixture.detectChanges();
+
+      expect(component.formatExpirationDate()).toBe("sendExpiresInDaysSingle");
+    });
+
+    it("returns hours plural if expiry is more than 1 hour but less than 24", () => {
+      sendView.deletionDate.setHours(sendView.deletionDate.getHours() + 2);
+      sendViewsSubject.next([sendView]);
+      fixture.detectChanges();
+
+      expect(component.formatExpirationDate()).toBe("sendExpiresInHours 2");
+    });
+
+    it("returns hours singular if expiry is in 1 hour", () => {
+      sendView.deletionDate.setHours(sendView.deletionDate.getHours() + 1);
+      sendViewsSubject.next([sendView]);
+      fixture.detectChanges();
+
+      expect(component.formatExpirationDate()).toBe("sendExpiresInHoursSingle");
    });
  });

  describe("copyLink", () => {
    it("should copy link and show toast", async () => {
-      fixture.detectChanges();
      const link = "https://example.com/#/send/abc/123";

      await component.copyLink();
@@ -136,7 +188,7 @@ describe("SendCreatedComponent", () => {
      expect(toastService.showToast).toHaveBeenCalledWith({
        variant: "success",
        title: null,
-        message: i18nService.t("sendLinkCopied"),
+        message: "sendLinkCopied",
      });
    });
  });
--- a/apps/browser/src/tools/popup/send-v2/send-created/send-created.component.ts
+++ b/apps/browser/src/tools/popup/send-v2/send-created/send-created.component.ts
@@ -39,6 +39,7 @@ export class SendCreatedComponent {
  protected sendCreatedIcon = SendCreatedIcon;
  protected send: SendView;
  protected daysAvailable = 0;
+  protected hoursAvailable = 0;

  constructor(
    private i18nService: I18nService,
@@ -54,14 +55,26 @@ export class SendCreatedComponent {
    this.sendService.sendViews$.pipe(takeUntilDestroyed()).subscribe((sendViews) => {
      this.send = sendViews.find((s) => s.id === sendId);
      if (this.send) {
-        this.daysAvailable = this.getDaysAvailable(this.send);
+        this.hoursAvailable = this.getHoursAvailable(this.send);
+        this.daysAvailable = Math.ceil(this.hoursAvailable / 24);
      }
    });
  }

-  getDaysAvailable(send: SendView): number {
+  formatExpirationDate(): string {
+    if (this.hoursAvailable < 24) {
+      return this.hoursAvailable === 1
+        ? this.i18nService.t("sendExpiresInHoursSingle")
+        : this.i18nService.t("sendExpiresInHours", this.hoursAvailable);
+    }
+    return this.daysAvailable === 1
+      ? this.i18nService.t("sendExpiresInDaysSingle")
+      : this.i18nService.t("sendExpiresInDays", this.daysAvailable);
+  }
+
+  getHoursAvailable(send: SendView): number {
    const now = new Date().getTime();
-    return Math.max(0, Math.ceil((send.deletionDate.getTime() - now) / (1000 * 60 * 60 * 24)));
+    return Math.max(0, Math.ceil((send.deletionDate.getTime() - now) / (1000 * 60 * 60)));
  }

  async close() {
--- a/apps/desktop/desktop_native/Cargo.lock
+++ b/apps/desktop/desktop_native/Cargo.lock
@@ -304,9 +304,9 @@ dependencies = [

 [[package]]
 name = "cc"
-version = "1.1.24"
+version = "1.1.28"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "812acba72f0a070b003d3697490d2b55b837230ae7c6c6497f05cc2ddbb8d938"
+checksum = "2e80e3b6a3ab07840e1cae9b0666a63970dc28e8ed5ffbcdacbfc760c281bfc1"
 dependencies = [
 "shlex",
 ]
@@ -725,9 +725,9 @@ dependencies = [

 [[package]]
 name = "futures-channel"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "eac8f7d7865dcb88bd4373ab671c8cf4508703796caa2b1985a9ca867b3fcb78"
+checksum = "2dff15bf788c671c1934e366d07e30c1814a8ef514e1af724a602e8a2fbe1b10"
 dependencies = [
 "futures-core",
 "futures-sink",
@@ -735,15 +735,15 @@ dependencies = [

 [[package]]
 name = "futures-core"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "dfc6580bb841c5a68e9ef15c77ccc837b40a7504914d52e47b8b0e9bbda25a1d"
+checksum = "05f29059c0c2090612e8d742178b0580d2dc940c837851ad723096f87af6663e"

 [[package]]
 name = "futures-executor"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a576fc72ae164fca6b9db127eaa9a9dda0d61316034f33a0a0d4eda41f02b01d"
+checksum = "1e28d1d997f585e54aebc3f97d39e72338912123a67330d723fdbb564d646c9f"
 dependencies = [
 "futures-core",
 "futures-task",
@@ -752,9 +752,9 @@ dependencies = [

 [[package]]
 name = "futures-io"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a44623e20b9681a318efdd71c299b6b222ed6f231972bfe2f224ebad6311f0c1"
+checksum = "9e5c1b78ca4aae1ac06c48a526a655760685149f0d465d21f37abfe57ce075c6"

 [[package]]
 name = "futures-lite"
@@ -771,9 +771,9 @@ dependencies = [

 [[package]]
 name = "futures-macro"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "87750cf4b7a4c0625b1529e4c543c2182106e4dedc60a2a6455e00d212c489ac"
+checksum = "162ee34ebcb7c64a8abebc059ce0fee27c2262618d7b60ed8faf72fef13c3650"
 dependencies = [
 "proc-macro2",
 "quote",
@@ -782,21 +782,21 @@ dependencies = [

 [[package]]
 name = "futures-sink"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9fb8e00e87438d937621c1c6269e53f536c14d3fbd6a042bb24879e57d474fb5"
+checksum = "e575fab7d1e0dcb8d0c7bcf9a63ee213816ab51902e6d244a95819acacf1d4f7"

 [[package]]
 name = "futures-task"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "38d84fa142264698cdce1a9f9172cf383a0c82de1bddcf3092901442c4097004"
+checksum = "f90f7dce0722e95104fcb095585910c0977252f286e354b5e3bd38902cd99988"

 [[package]]
 name = "futures-util"
-version = "0.3.30"
+version = "0.3.31"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3d6401deb83407ab3da39eba7e33987a73c3df0c82b4bb5813ee871c19c41d48"
+checksum = "9fa08315bb612088cc391249efdc3bc77536f16c91f6cf495e6fbe85b20a4a81"
 dependencies = [
 "futures-channel",
 "futures-core",
@@ -936,9 +936,9 @@ dependencies = [

 [[package]]
 name = "hashbrown"
-version = "0.14.5"
+version = "0.15.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e5274423e17b7c9fc20b6e7e208532f9b19825d82dfd615708b70edd83df41f1"
+checksum = "1e087f84d4f86bf4b218b927129862374b72199ae7d8657835f1e89000eea4fb"

 [[package]]
 name = "heck"
@@ -975,9 +975,9 @@ dependencies = [

 [[package]]
 name = "indexmap"
-version = "2.5.0"
+version = "2.6.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "68b900aa2f7301e21c36462b170ee99994de34dff39a4a6a528e80e7376d07e5"
+checksum = "707907fe3c25f5424cce2cb7e1cbcafee6bdbe735ca90ef77c29e84591e5b9da"
 dependencies = [
 "equivalent",
 "hashbrown",
@@ -1378,21 +1378,18 @@ dependencies = [

 [[package]]
 name = "object"
-version = "0.36.4"
+version = "0.36.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "084f1a5821ac4c651660a94a7153d27ac9d8a53736203f58b31945ded098070a"
+checksum = "aedf0a2d09c573ed1d8d85b30c119153926a2b36dce0ab28322c09a117a4683e"
 dependencies = [
 "memchr",
 ]

 [[package]]
 name = "once_cell"
-version = "1.20.1"
+version = "1.20.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "82881c4be219ab5faaf2ad5e5e5ecdff8c66bd7402ca3160975c93b24961afd1"
-dependencies = [
- "portable-atomic",
-]
+checksum = "1261fe7e33c73b354eab43b1273a57c8f967d0391e80353e51f764ac02cf6775"

 [[package]]
 name = "option-ext"
@@ -1503,12 +1500,6 @@ dependencies = [
 "windows-sys 0.59.0",
 ]

-[[package]]
-name = "portable-atomic"
-version = "1.9.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "cc9c68a3f6da06753e9335d63e27f6b9754dd1920d941135b7ea8224f141adb2"
-
 [[package]]
 name = "powerfmt"
 version = "0.2.0"
@@ -1535,9 +1526,9 @@ dependencies = [

 [[package]]
 name = "proc-macro2"
-version = "1.0.86"
+version = "1.0.87"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5e719e8df665df0d1c8fbfd238015744736151d4445ec0836b8e628aae103b77"
+checksum = "b3e4daa0dcf6feba26f985457cdf104d4b4256fc5a09547140f3631bb076b19a"
 dependencies = [
 "unicode-ident",
 ]
--- a/apps/desktop/src/app/tools/generator/credential-generator.component.html
+++ b/apps/desktop/src/app/tools/generator/credential-generator.component.html
@@ -1,8 +1,7 @@
 <bit-dialog #dialog dialogSize="large" background="alt">
  <span bitDialogTitle>{{ "generator" | i18n }}</span>
  <ng-container bitDialogContent>
-    <!-- FIXME: Will get replaced with <tools-credential-generator /> once https://github.com/bitwarden/clients/pull/11398 has been merged -->
-    <tools-password-generator />
+    <tools-credential-generator />
  </ng-container>
  <ng-container bitDialogFooter>
    <button type="button" bitButton bitFormButton buttonType="secondary" bitDialogClose>
--- a/apps/desktop/src/app/tools/generator/credential-generator.component.ts
+++ b/apps/desktop/src/app/tools/generator/credential-generator.component.ts
@@ -2,12 +2,12 @@ import { Component } from "@angular/core";

 import { JslibModule } from "@bitwarden/angular/jslib.module";
 import { ButtonModule, DialogModule } from "@bitwarden/components";
-import { PasswordGeneratorComponent } from "@bitwarden/generator-components";
+import { GeneratorModule } from "@bitwarden/generator-components";

@Component({
  standalone: true,
  selector: "credential-generator",
  templateUrl: "credential-generator.component.html",
-  imports: [DialogModule, ButtonModule, JslibModule, PasswordGeneratorComponent],
+  imports: [DialogModule, ButtonModule, JslibModule, GeneratorModule],
 })
 export class CredentialGeneratorComponent {}
--- a/apps/desktop/src/locales/en/messages.json
+++ b/apps/desktop/src/locales/en/messages.json
@@ -2340,7 +2340,8 @@
    "message": "Unlocked"
  },
  "generator": {
-    "message": "Generator"
+    "message": "Generator",
+    "description": "Short for 'credential generator'."
  },
  "whatWouldYouLikeToGenerate": {
    "message": "What would you like to generate?"
--- a/apps/desktop/src/package-lock.json
+++ b/apps/desktop/src/package-lock.json
@@ -14,6 +14,7 @@
      }
    },
    "../desktop_native/napi": {
+      "name": "@bitwarden/desktop-napi",
      "version": "0.1.0",
      "license": "GPL-3.0",
      "devDependencies": {
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@bitwarden/web-vault",
-  "version": "2024.10.1",
+  "version": "2024.10.2",
  "scripts": {
    "build:oss": "webpack",
    "build:bit": "webpack -c ../../bitwarden_license/bit-web/webpack.config.js",
--- a/apps/web/src/app/admin-console/organizations/layouts/organization-layout.component.html
+++ b/apps/web/src/app/admin-console/organizations/layouts/organization-layout.component.html
@@ -39,6 +39,11 @@
        *ngIf="organization.canAccessReports"
      ></bit-nav-item>
    </bit-nav-group>
+    <bit-nav-item
+      *ngIf="isAccessIntelligenceFeatureEnabled"
+      [text]="'accessIntelligence' | i18n"
+      route="access-intelligence"
+    ></bit-nav-item>
    <bit-nav-group
      icon="bwi-billing"
      [text]="'billing' | i18n"
--- a/apps/web/src/app/admin-console/organizations/layouts/organization-layout.component.ts
+++ b/apps/web/src/app/admin-console/organizations/layouts/organization-layout.component.ts
@@ -51,6 +51,7 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
  showPaymentAndHistory$: Observable<boolean>;
  hideNewOrgButton$: Observable<boolean>;
  organizationIsUnmanaged$: Observable<boolean>;
+  isAccessIntelligenceFeatureEnabled = false;

  private _destroy = new Subject<void>();

@@ -70,6 +71,10 @@ export class OrganizationLayoutComponent implements OnInit, OnDestroy {
  async ngOnInit() {
    document.body.classList.remove("layout_frontend");

+    this.isAccessIntelligenceFeatureEnabled = await this.configService.getFeatureFlag(
+      FeatureFlag.AccessIntelligence,
+    );
+
    this.organization$ = this.route.params
      .pipe(takeUntil(this._destroy))
      .pipe<string>(map((p) => p.organizationId))
--- a/apps/web/src/app/admin-console/organizations/members/components/reset-password.component.html
+++ b/apps/web/src/app/admin-console/organizations/members/components/reset-password.component.html
@@ -1,100 +1,67 @@
-<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="resetPasswordTitle">
-  <div class="modal-dialog" role="document">
-    <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
-      <div class="modal-header">
-        <h1 class="modal-title" id="resetPasswordTitle">
-          {{ "recoverAccount" | i18n }}
-          <small class="text-muted" *ngIf="name">{{ name }}</small>
-        </h1>
-        <button
-          type="button"
-          class="close"
-          data-dismiss="modal"
-          appA11yTitle="{{ 'close' | i18n }}"
-        >
-          <span aria-hidden="true">&times;</span>
-        </button>
-      </div>
-      <div class="modal-body">
-        <app-callout type="warning"
+<form [formGroup]="formGroup" [bitSubmit]="submit">
+  <bit-dialog [title]="'recoverAccount' | i18n" [subtitle]="data.name">
+    <ng-container bitDialogContent>
+      <bit-callout type="warning"
        >{{ "resetPasswordLoggedOutWarning" | i18n: loggedOutWarningName }}
-        </app-callout>
+      </bit-callout>
      <auth-password-callout
        [policy]="enforcedPolicyOptions"
        message="resetPasswordMasterPasswordPolicyInEffect"
        *ngIf="enforcedPolicyOptions"
      >
      </auth-password-callout>
-        <div class="row">
-          <div class="col form-group">
-            <div class="d-flex">
-              <label for="newPassword">{{ "newPassword" | i18n }}</label>
-              <div class="ml-auto d-flex">
-                <a
-                  href="#"
-                  class="d-block mr-2 bwi-icon-above-input"
-                  appStopClick
-                  appA11yTitle="{{ 'generatePassword' | i18n }}"
-                  (click)="generatePassword()"
-                >
-                  <i class="bwi bwi-lg bwi-fw bwi-refresh" aria-hidden="true"></i>
-                </a>
-              </div>
-            </div>
-            <div class="input-group mb-1">
+      <bit-form-field>
+        <bit-label>
+          {{ "newPassword" | i18n }}
+        </bit-label>
        <input
          id="newPassword"
-                class="form-control text-monospace"
-                appAutofocus
-                type="{{ showPassword ? 'text' : 'password' }}"
+          bitInput
+          [type]="showPassword ? 'text' : 'password'"
          name="NewPassword"
-                [(ngModel)]="newPassword"
+          formControlName="newPassword"
          required
          appInputVerbatim
          autocomplete="new-password"
        />
-              <div class="input-group-append">
        <button
          type="button"
-                  class="btn btn-outline-secondary"
+          bitIconButton="bwi-generate"
+          bitSuffix
+          [appA11yTitle]="'generatePassword' | i18n"
+          (click)="generatePassword()"
+        ></button>
+        <button
+          type="button"
+          bitSuffix
+          [bitIconButton]="showPassword ? 'bwi-eye-slash' : 'bwi-eye'"
+          buttonType="secondary"
          appA11yTitle="{{ 'toggleVisibility' | i18n }}"
          (click)="togglePassword()"
-                >
-                  <i
-                    class="bwi bwi-lg"
-                    aria-hidden="true"
-                    [ngClass]="{ 'bwi-eye': !showPassword, 'bwi-eye-slash': showPassword }"
-                  ></i>
-                </button>
+        ></button>
        <button
          type="button"
-                  class="btn btn-outline-secondary"
+          bitSuffix
+          bitIconButton="bwi-clone"
          appA11yTitle="{{ 'copyPassword' | i18n }}"
-                  (click)="copy(newPassword)"
-                >
-                  <i class="bwi bwi-lg bwi-clone" aria-hidden="true"></i>
-                </button>
-              </div>
-            </div>
-            <app-password-strength
-              [password]="newPassword"
-              [email]="email"
+          (click)="copy()"
+        ></button>
+      </bit-form-field>
+      <tools-password-strength
+        [password]="formGroup.value.newPassword"
+        [email]="data.email"
        [showText]="true"
-              (passwordStrengthResult)="getStrengthResult($event)"
+        (passwordStrengthScore)="getStrengthScore($event)"
      >
-            </app-password-strength>
-          </div>
-        </div>
-      </div>
-      <div class="modal-footer">
-        <button type="submit" class="btn btn-primary btn-submit" [disabled]="form.loading">
-          <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
-          <span>{{ "save" | i18n }}</span>
+      </tools-password-strength>
+    </ng-container>
+    <ng-container bitDialogFooter>
+      <button bitButton buttonType="primary" bitFormButton type="submit">
+        {{ "save" | i18n }}
      </button>
-        <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">
+      <button bitButton buttonType="secondary" bitDialogClose type="button">
        {{ "cancel" | i18n }}
      </button>
-      </div>
+    </ng-container>
+  </bit-dialog>
 </form>
-  </div>
-</div>
--- a/apps/web/src/app/admin-console/organizations/members/components/reset-password.component.ts
+++ b/apps/web/src/app/admin-console/organizations/members/components/reset-password.component.ts
@@ -1,16 +1,9 @@
-import {
-  Component,
-  EventEmitter,
-  Input,
-  OnDestroy,
-  OnInit,
-  Output,
-  ViewChild,
-} from "@angular/core";
+import { DIALOG_DATA, DialogConfig, DialogRef } from "@angular/cdk/dialog";
+import { Component, Inject, OnDestroy, OnInit, ViewChild } from "@angular/core";
+import { FormBuilder, Validators } from "@angular/forms";
 import { Subject, takeUntil } from "rxjs";
-import zxcvbn from "zxcvbn";

-import { PasswordStrengthComponent } from "@bitwarden/angular/tools/password-strength/password-strength.component";
+import { PasswordStrengthV2Component } from "@bitwarden/angular/tools/password-strength/password-strength-v2.component";
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
 import { MasterPasswordPolicyOptions } from "@bitwarden/common/admin-console/models/domain/master-password-policy-options";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
@@ -22,27 +15,60 @@ import { PasswordGenerationServiceAbstraction } from "@bitwarden/generator-legac

 import { OrganizationUserResetPasswordService } from "../services/organization-user-reset-password/organization-user-reset-password.service";

+/**
+ * Encapsulates a few key data inputs needed to initiate an account recovery
+ * process for the organization user in question.
+ */
+export type ResetPasswordDialogData = {
+  /**
+   * The organization user's full name
+   */
+  name: string;
+
+  /**
+   * The organization user's email address
+   */
+  email: string;
+
+  /**
+   * The `organizationUserId` for the user
+   */
+  id: string;
+
+  /**
+   * The organization's `organizationId`
+   */
+  organizationId: string;
+};
+
+export enum ResetPasswordDialogResult {
+  Ok = "ok",
+}
+
@Component({
  selector: "app-reset-password",
  templateUrl: "reset-password.component.html",
 })
+/**
+ * Used in a dialog for initiating the account recovery process against a
+ * given organization user. An admin will access this form when they want to
+ * reset a user's password and log them out of sessions.
+ */
 export class ResetPasswordComponent implements OnInit, OnDestroy {
-  @Input() name: string;
-  @Input() email: string;
-  @Input() id: string;
-  @Input() organizationId: string;
-  @Output() passwordReset = new EventEmitter();
-  @ViewChild(PasswordStrengthComponent) passwordStrengthComponent: PasswordStrengthComponent;
+  formGroup = this.formBuilder.group({
+    newPassword: ["", Validators.required],
+  });
+
+  @ViewChild(PasswordStrengthV2Component) passwordStrengthComponent: PasswordStrengthV2Component;

  enforcedPolicyOptions: MasterPasswordPolicyOptions;
-  newPassword: string = null;
  showPassword = false;
-  passwordStrengthResult: zxcvbn.ZXCVBNResult;
-  formPromise: Promise<any>;
+  passwordStrengthScore: number;

  private destroy$ = new Subject<void>();

  constructor(
+    @Inject(DIALOG_DATA) protected data: ResetPasswordDialogData,
    private resetPasswordService: OrganizationUserResetPasswordService,
    private i18nService: I18nService,
    private platformUtilsService: PlatformUtilsService,
@@ -51,6 +77,8 @@ export class ResetPasswordComponent implements OnInit, OnDestroy {
    private logService: LogService,
    private dialogService: DialogService,
    private toastService: ToastService,
+    private formBuilder: FormBuilder,
+    private dialogRef: DialogRef<ResetPasswordDialogResult>,
  ) {}

  async ngOnInit() {
@@ -69,13 +97,15 @@ export class ResetPasswordComponent implements OnInit, OnDestroy {
  }

  get loggedOutWarningName() {
-    return this.name != null ? this.name : this.i18nService.t("thisUser");
+    return this.data.name != null ? this.data.name : this.i18nService.t("thisUser");
  }

  async generatePassword() {
    const options = (await this.passwordGenerationService.getOptions())?.[0] ?? {};
-    this.newPassword = await this.passwordGenerationService.generatePassword(options);
-    this.passwordStrengthComponent.updatePasswordStrength(this.newPassword);
+    this.formGroup.patchValue({
+      newPassword: await this.passwordGenerationService.generatePassword(options),
+    });
+    this.passwordStrengthComponent.updatePasswordStrength(this.formGroup.value.newPassword);
  }

  togglePassword() {
@@ -83,7 +113,8 @@ export class ResetPasswordComponent implements OnInit, OnDestroy {
    document.getElementById("newPassword").focus();
  }

-  copy(value: string) {
+  copy() {
+    const value = this.formGroup.value.newPassword;
    if (value == null) {
      return;
    }
@@ -96,9 +127,9 @@ export class ResetPasswordComponent implements OnInit, OnDestroy {
    });
  }

-  async submit() {
+  submit = async () => {
    // Validation
-    if (this.newPassword == null || this.newPassword === "") {
+    if (this.formGroup.value.newPassword == null || this.formGroup.value.newPassword === "") {
      this.toastService.showToast({
        variant: "error",
        title: this.i18nService.t("errorOccurred"),
@@ -107,7 +138,7 @@ export class ResetPasswordComponent implements OnInit, OnDestroy {
      return false;
    }

-    if (this.newPassword.length < Utils.minimumPasswordLength) {
+    if (this.formGroup.value.newPassword.length < Utils.minimumPasswordLength) {
      this.toastService.showToast({
        variant: "error",
        title: this.i18nService.t("errorOccurred"),
@@ -119,8 +150,8 @@ export class ResetPasswordComponent implements OnInit, OnDestroy {
    if (
      this.enforcedPolicyOptions != null &&
      !this.policyService.evaluateMasterPassword(
-        this.passwordStrengthResult.score,
-        this.newPassword,
+        this.passwordStrengthScore,
+        this.formGroup.value.newPassword,
        this.enforcedPolicyOptions,
      )
    ) {
@@ -132,7 +163,7 @@ export class ResetPasswordComponent implements OnInit, OnDestroy {
      return;
    }

-    if (this.passwordStrengthResult.score < 3) {
+    if (this.passwordStrengthScore < 3) {
      const result = await this.dialogService.openSimpleDialog({
        title: { key: "weakMasterPassword" },
        content: { key: "weakMasterPasswordDesc" },
@@ -145,26 +176,29 @@ export class ResetPasswordComponent implements OnInit, OnDestroy {
    }

    try {
-      this.formPromise = this.resetPasswordService.resetMasterPassword(
-        this.newPassword,
-        this.email,
-        this.id,
-        this.organizationId,
+      await this.resetPasswordService.resetMasterPassword(
+        this.formGroup.value.newPassword,
+        this.data.email,
+        this.data.id,
+        this.data.organizationId,
      );
-      await this.formPromise;
      this.toastService.showToast({
        variant: "success",
        title: null,
        message: this.i18nService.t("resetPasswordSuccess"),
      });
-      this.passwordReset.emit();
    } catch (e) {
      this.logService.error(e);
    }
-    this.formPromise = null;
+
+    this.dialogRef.close(ResetPasswordDialogResult.Ok);
+  };
+
+  getStrengthScore(result: number) {
+    this.passwordStrengthScore = result;
  }

-  getStrengthResult(result: zxcvbn.ZXCVBNResult) {
-    this.passwordStrengthResult = result;
-  }
+  static open = (dialogService: DialogService, input: DialogConfig<ResetPasswordDialogData>) => {
+    return dialogService.open<ResetPasswordDialogResult>(ResetPasswordComponent, input);
+  };
 }
--- a/apps/web/src/app/admin-console/organizations/members/members.component.ts
+++ b/apps/web/src/app/admin-console/organizations/members/members.component.ts
@@ -70,7 +70,10 @@ import {
  MemberDialogTab,
  openUserAddEditDialog,
 } from "./components/member-dialog";
-import { ResetPasswordComponent } from "./components/reset-password.component";
+import {
+  ResetPasswordComponent,
+  ResetPasswordDialogResult,
+} from "./components/reset-password.component";

 class MembersTableDataSource extends PeopleTableDataSource<OrganizationUserView> {
  protected statusType = OrganizationUserStatusType;
@@ -663,24 +666,19 @@ export class MembersComponent extends BaseMembersComponent<OrganizationUserView>
  }

  async resetPassword(user: OrganizationUserView) {
-    const [modal] = await this.modalService.openViewRef(
-      ResetPasswordComponent,
-      this.resetPasswordModalRef,
-      (comp) => {
-        comp.name = this.userNamePipe.transform(user);
-        comp.email = user != null ? user.email : null;
-        comp.organizationId = this.organization.id;
-        comp.id = user != null ? user.id : null;
-
-        // eslint-disable-next-line rxjs-angular/prefer-takeuntil
-        comp.passwordReset.subscribe(() => {
-          modal.close();
-          // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
-          // eslint-disable-next-line @typescript-eslint/no-floating-promises
-          this.load();
-        });
+    const dialogRef = ResetPasswordComponent.open(this.dialogService, {
+      data: {
+        name: this.userNamePipe.transform(user),
+        email: user != null ? user.email : null,
+        organizationId: this.organization.id,
+        id: user != null ? user.id : null,
      },
-    );
+    });
+
+    const result = await lastValueFrom(dialogRef.closed);
+    if (result === ResetPasswordDialogResult.Ok) {
+      await this.load();
+    }
  }

  protected async removeUserConfirmationDialog(user: OrganizationUserView) {
--- a/apps/web/src/app/admin-console/organizations/members/members.module.ts
+++ b/apps/web/src/app/admin-console/organizations/members/members.module.ts
@@ -1,6 +1,7 @@
 import { ScrollingModule } from "@angular/cdk/scrolling";
 import { NgModule } from "@angular/core";

+import { PasswordStrengthV2Component } from "@bitwarden/angular/tools/password-strength/password-strength-v2.component";
 import { PasswordCalloutComponent } from "@bitwarden/auth/angular";

 import { LooseComponentsModule } from "../../../shared";
@@ -24,6 +25,7 @@ import { MembersComponent } from "./members.component";
    UserDialogModule,
    PasswordCalloutComponent,
    ScrollingModule,
+    PasswordStrengthV2Component,
  ],
  declarations: [
    BulkConfirmComponent,
--- a/apps/web/src/app/admin-console/organizations/organization-routing.module.ts
+++ b/apps/web/src/app/admin-console/organizations/organization-routing.module.ts
@@ -62,6 +62,13 @@ const routes: Routes = [
            (m) => m.OrganizationReportingModule,
          ),
      },
+      {
+        path: "access-intelligence",
+        loadChildren: () =>
+          import("../../tools/access-intelligence/access-intelligence.module").then(
+            (m) => m.AccessIntelligenceModule,
+          ),
+      },
      {
        path: "billing",
        loadChildren: () =>
--- a/apps/web/src/app/auth/sso.component.ts
+++ b/apps/web/src/app/auth/sso.component.ts
@@ -12,11 +12,14 @@ import {
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { OrgDomainApiServiceAbstraction } from "@bitwarden/common/admin-console/abstractions/organization-domain/org-domain-api.service.abstraction";
 import { OrganizationDomainSsoDetailsResponse } from "@bitwarden/common/admin-console/abstractions/organization-domain/responses/organization-domain-sso-details.response";
+import { VerifiedOrganizationDomainSsoDetailsResponse } from "@bitwarden/common/admin-console/abstractions/organization-domain/responses/verified-organization-domain-sso-details.response";
 import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
 import { InternalMasterPasswordServiceAbstraction } from "@bitwarden/common/auth/abstractions/master-password.service.abstraction";
 import { SsoLoginServiceAbstraction } from "@bitwarden/common/auth/abstractions/sso-login.service.abstraction";
 import { HttpStatusCode } from "@bitwarden/common/enums";
+import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
 import { ErrorResponse } from "@bitwarden/common/models/response/error.response";
+import { ListResponse } from "@bitwarden/common/models/response/list.response";
 import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
 import { CryptoFunctionService } from "@bitwarden/common/platform/abstractions/crypto-function.service";
 import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
@@ -107,6 +110,16 @@ export class SsoComponent extends BaseSsoComponent implements OnInit {
          // show loading spinner
          this.loggingIn = true;
          try {
+            if (await this.configService.getFeatureFlag(FeatureFlag.VerifiedSsoDomainEndpoint)) {
+              const response: ListResponse<VerifiedOrganizationDomainSsoDetailsResponse> =
+                await this.orgDomainApiService.getVerifiedOrgDomainsByEmail(qParams.email);
+
+              if (response.data.length > 0) {
+                this.identifierFormControl.setValue(response.data[0].organizationIdentifier);
+                await this.submit();
+                return;
+              }
+            } else {
              const response: OrganizationDomainSsoDetailsResponse =
                await this.orgDomainApiService.getClaimedOrgDomainByEmail(qParams.email);

@@ -115,6 +128,7 @@ export class SsoComponent extends BaseSsoComponent implements OnInit {
                await this.submit();
                return;
              }
+            }
          } catch (error) {
            this.handleGetClaimedDomainByEmailError(error);
          }
--- a/apps/web/src/app/billing/individual/billing-history-view.component.html
+++ b/apps/web/src/app/billing/individual/billing-history-view.component.html
@@ -11,8 +11,12 @@
  ></i>
  <span class="tw-sr-only">{{ "loading" | i18n }}</span>
 </ng-container>
-<ng-container *ngIf="invoices || transactions">
-  <app-billing-history [invoices]="invoices" [transactions]="transactions"></app-billing-history>
+<ng-container *ngIf="openInvoices || paidInvoices || transactions">
+  <app-billing-history
+    [openInvoices]="openInvoices"
+    [paidInvoices]="paidInvoices"
+    [transactions]="transactions"
+  ></app-billing-history>
  <button
    type="button"
    bitButton
--- a/apps/web/src/app/billing/individual/billing-history-view.component.ts
+++ b/apps/web/src/app/billing/individual/billing-history-view.component.ts
@@ -14,7 +14,8 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
 export class BillingHistoryViewComponent implements OnInit {
  loading = false;
  firstLoaded = false;
-  invoices: BillingInvoiceResponse[] = [];
+  openInvoices: BillingInvoiceResponse[] = [];
+  paidInvoices: BillingInvoiceResponse[] = [];
  transactions: BillingTransactionResponse[] = [];
  hasAdditionalHistory: boolean = false;

@@ -41,8 +42,14 @@ export class BillingHistoryViewComponent implements OnInit {
    }
    this.loading = true;

-    const invoicesPromise = this.accountBillingApiService.getBillingInvoices(
-      this.invoices.length > 0 ? this.invoices[this.invoices.length - 1].id : null,
+    const openInvoicesPromise = this.accountBillingApiService.getBillingInvoices(
+      "open",
+      this.openInvoices.length > 0 ? this.openInvoices[this.openInvoices.length - 1].id : null,
+    );
+
+    const paidInvoicesPromise = this.accountBillingApiService.getBillingInvoices(
+      "paid",
+      this.paidInvoices.length > 0 ? this.paidInvoices[this.paidInvoices.length - 1].id : null,
    );

    const transactionsPromise = this.accountBillingApiService.getBillingTransactions(
@@ -51,15 +58,20 @@ export class BillingHistoryViewComponent implements OnInit {
        : null,
    );

-    const accountInvoices = await invoicesPromise;
-    const accountTransactions = await transactionsPromise;
+    const openInvoices = await openInvoicesPromise;
+    const paidInvoices = await paidInvoicesPromise;
+    const transactions = await transactionsPromise;
+
    const pageSize = 5;

-    this.invoices = [...this.invoices, ...accountInvoices];
-    this.transactions = [...this.transactions, ...accountTransactions];
-    this.hasAdditionalHistory = !(
-      accountInvoices.length < pageSize && accountTransactions.length < pageSize
-    );
+    this.openInvoices = [...this.openInvoices, ...openInvoices];
+    this.paidInvoices = [...this.paidInvoices, ...paidInvoices];
+    this.transactions = [...this.transactions, ...transactions];
+
+    this.hasAdditionalHistory =
+      openInvoices.length >= pageSize ||
+      paidInvoices.length >= pageSize ||
+      transactions.length >= pageSize;

    this.loading = false;
  }
--- a/apps/web/src/app/billing/organizations/organization-billing-history-view.component.html
+++ b/apps/web/src/app/billing/organizations/organization-billing-history-view.component.html
@@ -9,8 +9,12 @@
    ></i>
    <span class="tw-sr-only">{{ "loading" | i18n }}</span>
  </ng-container>
-  <ng-container *ngIf="invoices || transactions">
-    <app-billing-history [invoices]="invoices" [transactions]="transactions"></app-billing-history>
+  <ng-container *ngIf="openInvoices || paidInvoices || transactions">
+    <app-billing-history
+      [openInvoices]="openInvoices"
+      [paidInvoices]="paidInvoices"
+      [transactions]="transactions"
+    ></app-billing-history>
    <button
      type="button"
      bitButton
--- a/apps/web/src/app/billing/organizations/organization-billing-history-view.component.ts
+++ b/apps/web/src/app/billing/organizations/organization-billing-history-view.component.ts
@@ -14,7 +14,8 @@ import {
 export class OrgBillingHistoryViewComponent implements OnInit, OnDestroy {
  loading = false;
  firstLoaded = false;
-  invoices: BillingInvoiceResponse[] = [];
+  openInvoices: BillingInvoiceResponse[] = [];
+  paidInvoices: BillingInvoiceResponse[] = [];
  transactions: BillingTransactionResponse[] = [];
  organizationId: string;
  hasAdditionalHistory: boolean = false;
@@ -51,9 +52,16 @@ export class OrgBillingHistoryViewComponent implements OnInit, OnDestroy {

    this.loading = true;

-    const invoicesPromise = this.organizationBillingApiService.getBillingInvoices(
+    const openInvoicesPromise = this.organizationBillingApiService.getBillingInvoices(
      this.organizationId,
-      this.invoices.length > 0 ? this.invoices[this.invoices.length - 1].id : null,
+      "open",
+      this.openInvoices.length > 0 ? this.openInvoices[this.openInvoices.length - 1].id : null,
+    );
+
+    const paidInvoicesPromise = this.organizationBillingApiService.getBillingInvoices(
+      this.organizationId,
+      "paid",
+      this.paidInvoices.length > 0 ? this.paidInvoices[this.paidInvoices.length - 1].id : null,
    );

    const transactionsPromise = this.organizationBillingApiService.getBillingTransactions(
@@ -63,13 +71,21 @@ export class OrgBillingHistoryViewComponent implements OnInit, OnDestroy {
        : null,
    );

-    const invoices = await invoicesPromise;
+    const openInvoices = await openInvoicesPromise;
+    const paidInvoices = await paidInvoicesPromise;
    const transactions = await transactionsPromise;
+
    const pageSize = 5;

-    this.invoices = [...this.invoices, ...invoices];
+    this.openInvoices = [...this.openInvoices, ...openInvoices];
+    this.paidInvoices = [...this.paidInvoices, ...paidInvoices];
    this.transactions = [...this.transactions, ...transactions];
-    this.hasAdditionalHistory = !(invoices.length < pageSize && transactions.length < pageSize);
+
+    this.hasAdditionalHistory =
+      openInvoices.length <= pageSize ||
+      paidInvoices.length <= pageSize ||
+      transactions.length <= pageSize;
+
    this.loading = false;
  }
 }
--- a/apps/web/src/app/billing/shared/billing-history.component.html
+++ b/apps/web/src/app/billing/shared/billing-history.component.html
@@ -1,9 +1,11 @@
 <bit-section>
-  <h3 bitTypography="h3">{{ "invoices" | i18n }}</h3>
-  <p bitTypography="body1" *ngIf="!invoices || !invoices.length">{{ "noInvoices" | i18n }}</p>
+  <h3 bitTypography="h3">{{ "unpaid" | i18n }} {{ "invoices" | i18n }}</h3>
+  <p bitTypography="body1" *ngIf="!openInvoices || !openInvoices.length">
+    {{ "noUnpaidInvoices" | i18n }}
+  </p>
  <bit-table>
    <ng-template body>
-      <tr bitRow *ngFor="let i of invoices">
+      <tr bitRow *ngFor="let i of openInvoices">
        <td bitCell>{{ i.date | date: "mediumDate" }}</td>
        <td bitCell>
          <a
@@ -26,7 +28,51 @@
          >
        </td>
        <td bitCell>{{ i.amount | currency: "$" }}</td>
+        <td bitCell class="tw-w-28">
+          <span *ngIf="i.paid">
+            <i class="bwi bwi-check tw-text-success" aria-hidden="true"></i>
+            {{ "paid" | i18n }}
+          </span>
+          <span *ngIf="!i.paid">
+            <i class="bwi bwi-exclamation-circle tw-text-muted" aria-hidden="true"></i>
+            {{ "unpaid" | i18n }}
+          </span>
+        </td>
+      </tr>
+    </ng-template>
+  </bit-table>
+</bit-section>
+<bit-section>
+  <h3 bitTypography="h3">{{ "paid" | i18n }} {{ "invoices" | i18n }}</h3>
+  <p bitTypography="body1" *ngIf="!paidInvoices || !paidInvoices.length">
+    {{ "noPaidInvoices" | i18n }}
+  </p>
+  <bit-table>
+    <ng-template body>
+      <tr bitRow *ngFor="let i of paidInvoices">
+        <td bitCell>{{ i.date | date: "mediumDate" }}</td>
        <td bitCell>
+          <a
+            href="{{ i.pdfUrl }}"
+            target="_blank"
+            rel="noreferrer"
+            class="tw-mr-2"
+            appA11yTitle="{{ 'downloadInvoice' | i18n }}"
+          >
+            <i class="bwi bwi-file-pdf" aria-hidden="true"></i
+          ></a>
+          <a
+            bitLink
+            href="{{ i.url }}"
+            target="_blank"
+            rel="noreferrer"
+            title="{{ 'viewInvoice' | i18n }}"
+          >
+            {{ "invoiceNumber" | i18n: i.number }}</a
+          >
+        </td>
+        <td bitCell>{{ i.amount | currency: "$" }}</td>
+        <td bitCell class="tw-w-28">
          <span *ngIf="i.paid">
            <i class="bwi bwi-check tw-text-success" aria-hidden="true"></i>
            {{ "paid" | i18n }}
--- a/apps/web/src/app/billing/shared/billing-history.component.ts
+++ b/apps/web/src/app/billing/shared/billing-history.component.ts
@@ -12,7 +12,10 @@ import {
 })
 export class BillingHistoryComponent {
  @Input()
-  invoices: BillingInvoiceResponse[];
+  openInvoices: BillingInvoiceResponse[];
+
+  @Input()
+  paidInvoices: BillingInvoiceResponse[];

  @Input()
  transactions: BillingTransactionResponse[];
--- a/apps/web/src/app/oss-routing.module.ts
+++ b/apps/web/src/app/oss-routing.module.ts
@@ -10,6 +10,7 @@ import {
  unauthGuardFn,
 } from "@bitwarden/angular/auth/guards";
 import { canAccessFeature } from "@bitwarden/angular/platform/guard/feature-flag.guard";
+import { generatorSwap } from "@bitwarden/angular/tools/generator/generator-swap";
 import { extensionRefreshSwap } from "@bitwarden/angular/utils/extension-refresh-swap";
 import {
  AnonLayoutWrapperComponent,
@@ -72,6 +73,7 @@ import { RequestSMAccessComponent } from "./secrets-manager/secrets-manager-land
 import { SMLandingComponent } from "./secrets-manager/secrets-manager-landing/sm-landing.component";
 import { DomainRulesComponent } from "./settings/domain-rules.component";
 import { PreferencesComponent } from "./settings/preferences.component";
+import { CredentialGeneratorComponent } from "./tools/credential-generator/credential-generator.component";
 import { GeneratorComponent } from "./tools/generator.component";
 import { ReportsModule } from "./tools/reports";
 import { AccessComponent } from "./tools/send/access.component";
@@ -645,11 +647,10 @@ const routes: Routes = [
              titleId: "exportVault",
            } satisfies RouteDataProperties,
          },
-          {
+          ...generatorSwap(GeneratorComponent, CredentialGeneratorComponent, {
            path: "generator",
-            component: GeneratorComponent,
            data: { titleId: "generator" } satisfies RouteDataProperties,
-          },
+          }),
        ],
      },
      {
--- a/apps/web/src/app/tools/access-intelligence/access-intelligence-routing.module.ts
+++ b/apps/web/src/app/tools/access-intelligence/access-intelligence-routing.module.ts
@@ -0,0 +1,25 @@
+import { NgModule } from "@angular/core";
+import { RouterModule, Routes } from "@angular/router";
+
+import { unauthGuardFn } from "@bitwarden/angular/auth/guards";
+import { canAccessFeature } from "@bitwarden/angular/platform/guard/feature-flag.guard";
+import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
+
+import { AccessIntelligenceComponent } from "./access-intelligence.component";
+
+const routes: Routes = [
+  {
+    path: "",
+    component: AccessIntelligenceComponent,
+    canActivate: [canAccessFeature(FeatureFlag.AccessIntelligence), unauthGuardFn()],
+    data: {
+      titleId: "accessIntelligence",
+    },
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class AccessIntelligenceRoutingModule {}
--- a/apps/web/src/app/tools/access-intelligence/access-intelligence.component.html
+++ b/apps/web/src/app/tools/access-intelligence/access-intelligence.component.html
@@ -0,0 +1,23 @@
+<app-header></app-header>
+<bit-tab-group [(selectedIndex)]="tabIndex">
+  <bit-tab label="{{ 'allApplicationsWithCount' | i18n: apps.length }}">
+    <h2 bitTypography="h2">{{ "allApplications" | i18n }}</h2>
+    <tools-application-table></tools-application-table>
+  </bit-tab>
+  <bit-tab>
+    <ng-template bitTabLabel>
+      <i class="bwi bwi-star"></i>
+      {{ "priorityApplicationsWithCount" | i18n: priorityApps.length }}
+    </ng-template>
+    <h2 bitTypography>{{ "priorityApplications" | i18n }}</h2>
+    <tools-application-table></tools-application-table>
+  </bit-tab>
+  <bit-tab>
+    <ng-template bitTabLabel>
+      <i class="bwi bwi-envelope"></i>
+      {{ "notifiedMembersWithCount" | i18n: priorityApps.length }}
+    </ng-template>
+    <h2 bitTypography="h2">{{ "notifiedMembers" | i18n }}</h2>
+    <tools-notified-members-table></tools-notified-members-table>
+  </bit-tab>
+</bit-tab-group>
--- a/apps/web/src/app/tools/access-intelligence/access-intelligence.component.ts
+++ b/apps/web/src/app/tools/access-intelligence/access-intelligence.component.ts
@@ -0,0 +1,45 @@
+import { CommonModule } from "@angular/common";
+import { Component } from "@angular/core";
+import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
+import { ActivatedRoute } from "@angular/router";
+import { first } from "rxjs";
+
+import { JslibModule } from "@bitwarden/angular/jslib.module";
+import { TabsModule } from "@bitwarden/components";
+
+import { HeaderModule } from "../../layouts/header/header.module";
+
+import { ApplicationTableComponent } from "./application-table.component";
+import { NotifiedMembersTableComponent } from "./notified-members-table.component";
+
+export enum AccessIntelligenceTabType {
+  AllApps = 0,
+  PriorityApps = 1,
+  NotifiedMembers = 2,
+}
+
+@Component({
+  standalone: true,
+  templateUrl: "./access-intelligence.component.html",
+  imports: [
+    ApplicationTableComponent,
+    CommonModule,
+    JslibModule,
+    HeaderModule,
+    NotifiedMembersTableComponent,
+    TabsModule,
+  ],
+})
+export class AccessIntelligenceComponent {
+  tabIndex: AccessIntelligenceTabType;
+
+  apps: any[] = [];
+  priorityApps: any[] = [];
+  notifiedMembers: any[] = [];
+
+  constructor(route: ActivatedRoute) {
+    route.queryParams.pipe(takeUntilDestroyed(), first()).subscribe(({ tabIndex }) => {
+      this.tabIndex = !isNaN(tabIndex) ? tabIndex : AccessIntelligenceTabType.AllApps;
+    });
+  }
+}
--- a/apps/web/src/app/tools/access-intelligence/access-intelligence.module.ts
+++ b/apps/web/src/app/tools/access-intelligence/access-intelligence.module.ts
@@ -0,0 +1,9 @@
+import { NgModule } from "@angular/core";
+
+import { AccessIntelligenceRoutingModule } from "./access-intelligence-routing.module";
+import { AccessIntelligenceComponent } from "./access-intelligence.component";
+
+@NgModule({
+  imports: [AccessIntelligenceComponent, AccessIntelligenceRoutingModule],
+})
+export class AccessIntelligenceModule {}
--- a/apps/web/src/app/tools/access-intelligence/application-table.component.html
+++ b/apps/web/src/app/tools/access-intelligence/application-table.component.html
@@ -0,0 +1,11 @@
+<!-- <bit-table [dataSource]="dataSource"> -->
+<ng-container header>
+  <tr>
+    <th bitCell>{{ "application" | i18n }}</th>
+    <th bitCell>{{ "atRiskPasswords" | i18n }}</th>
+    <th bitCell>{{ "totalPasswords" | i18n }}</th>
+    <th bitCell>{{ "atRiskMembers" | i18n }}</th>
+    <th bitCell>{{ "totalMembers" | i18n }}</th>
+  </tr>
+</ng-container>
+<!-- </bit-table> -->
--- a/apps/web/src/app/tools/access-intelligence/application-table.component.ts
+++ b/apps/web/src/app/tools/access-intelligence/application-table.component.ts
@@ -0,0 +1,19 @@
+import { CommonModule } from "@angular/common";
+import { Component } from "@angular/core";
+
+import { JslibModule } from "@bitwarden/angular/jslib.module";
+import { TableDataSource, TableModule } from "@bitwarden/components";
+
+@Component({
+  standalone: true,
+  selector: "tools-application-table",
+  templateUrl: "./application-table.component.html",
+  imports: [CommonModule, JslibModule, TableModule],
+})
+export class ApplicationTableComponent {
+  protected dataSource = new TableDataSource<any>();
+
+  constructor() {
+    this.dataSource.data = [];
+  }
+}
--- a/apps/web/src/app/tools/access-intelligence/notified-members-table.component.html
+++ b/apps/web/src/app/tools/access-intelligence/notified-members-table.component.html
@@ -0,0 +1,11 @@
+<!-- <bit-table [dataSource]="dataSource"> -->
+<ng-container header>
+  <tr>
+    <th bitCell>{{ "member" | i18n }}</th>
+    <th bitCell>{{ "atRiskPasswords" | i18n }}</th>
+    <th bitCell>{{ "totalPasswords" | i18n }}</th>
+    <th bitCell>{{ "atRiskApplications" | i18n }}</th>
+    <th bitCell>{{ "totalApplications" | i18n }}</th>
+  </tr>
+</ng-container>
+<!-- </bit-table> -->
--- a/apps/web/src/app/tools/access-intelligence/notified-members-table.component.ts
+++ b/apps/web/src/app/tools/access-intelligence/notified-members-table.component.ts
@@ -0,0 +1,19 @@
+import { CommonModule } from "@angular/common";
+import { Component } from "@angular/core";
+
+import { JslibModule } from "@bitwarden/angular/jslib.module";
+import { TableDataSource, TableModule } from "@bitwarden/components";
+
+@Component({
+  standalone: true,
+  selector: "tools-notified-members-table",
+  templateUrl: "./notified-members-table.component.html",
+  imports: [CommonModule, JslibModule, TableModule],
+})
+export class NotifiedMembersTableComponent {
+  dataSource = new TableDataSource<any>();
+
+  constructor() {
+    this.dataSource.data = [];
+  }
+}
--- a/apps/web/src/app/tools/credential-generator/credential-generator.component.html
+++ b/apps/web/src/app/tools/credential-generator/credential-generator.component.html
@@ -0,0 +1,5 @@
+<app-header></app-header>
+
+<bit-container>
+  <tools-credential-generator />
+</bit-container>
--- a/apps/web/src/app/tools/credential-generator/credential-generator.component.ts
+++ b/apps/web/src/app/tools/credential-generator/credential-generator.component.ts
@@ -0,0 +1,14 @@
+import { Component } from "@angular/core";
+
+import { GeneratorModule } from "@bitwarden/generator-components";
+
+import { HeaderModule } from "../../layouts/header/header.module";
+import { SharedModule } from "../../shared";
+
+@Component({
+  standalone: true,
+  selector: "credential-generator",
+  templateUrl: "credential-generator.component.html",
+  imports: [SharedModule, HeaderModule, GeneratorModule],
+})
+export class CredentialGeneratorComponent {}
--- a/apps/web/src/app/vault/org-vault/vault.component.ts
+++ b/apps/web/src/app/vault/org-vault/vault.component.ts
@@ -788,8 +788,8 @@ export class VaultComponent implements OnInit, OnDestroy {
  }

  /**
-   * Edit the given cipher
-   * @param cipherView - The cipher to be edited
+   * Edit the given cipher or add a new cipher
+   * @param cipherView - When set, the cipher to be edited
   * @param cloneCipher - `true` when the cipher should be cloned.
   * Used in place of the `additionalComponentParameters`, as
   * the `editCipherIdV2` method has a differing implementation.
@@ -797,7 +797,7 @@ export class VaultComponent implements OnInit, OnDestroy {
   * the `AddEditComponent` to edit methods directly.
   */
  async editCipher(
-    cipher: CipherView,
+    cipher: CipherView | null,
    cloneCipher: boolean,
    additionalComponentParameters?: (comp: AddEditComponent) => void,
  ) {
@@ -805,7 +805,7 @@ export class VaultComponent implements OnInit, OnDestroy {
  }

  async editCipherId(
-    cipher: CipherView,
+    cipher: CipherView | null,
    cloneCipher: boolean,
    additionalComponentParameters?: (comp: AddEditComponent) => void,
  ) {
@@ -827,7 +827,7 @@ export class VaultComponent implements OnInit, OnDestroy {
    const defaultComponentParameters = (comp: AddEditComponent) => {
      comp.organization = this.organization;
      comp.organizationId = this.organization.id;
-      comp.cipherId = cipher.id;
+      comp.cipherId = cipher?.id;
      comp.onSavedCipher.pipe(takeUntil(this.destroy$)).subscribe(() => {
        modal.close();
        this.refresh();
@@ -866,10 +866,10 @@ export class VaultComponent implements OnInit, OnDestroy {
   * Edit a cipher using the new AddEditCipherDialogV2 component.
   * Only to be used behind the ExtensionRefresh feature flag.
   */
-  private async editCipherIdV2(cipher: CipherView, cloneCipher: boolean) {
+  private async editCipherIdV2(cipher: CipherView | null, cloneCipher: boolean) {
    const cipherFormConfig = await this.cipherFormConfigService.buildConfig(
      cloneCipher ? "clone" : "edit",
-      cipher.id as CipherId,
+      cipher?.id as CipherId | null,
    );

    await this.openVaultItemDialog("form", cipherFormConfig, cipher);
--- a/apps/web/src/locales/en/messages.json
+++ b/apps/web/src/locales/en/messages.json
@@ -1,4 +1,64 @@
 {
+  "allApplications": {
+    "message": "All applications"
+  },
+  "priorityApplications": {
+    "message": "Priority applications"
+  },
+  "accessIntelligence": {
+    "message": "Access Intelligence"
+  },
+  "notifiedMembers": {
+    "message": "Notified members"
+  },
+  "allApplicationsWithCount": {
+    "message": "All applications ($COUNT$)",
+    "placeholders": {
+      "count": {
+        "content": "$1",
+        "example": "3"
+      }
+    }
+  },
+  "priorityApplicationsWithCount": {
+    "message": "Priority applications ($COUNT$)",
+    "placeholders": {
+      "count": {
+        "content": "$1",
+        "example": "3"
+      }
+    }
+  },
+  "notifiedMembersWithCount": {
+    "message": "Notified members ($COUNT$)",
+    "placeholders": {
+      "count": {
+        "content": "$1",
+        "example": "3"
+      }
+    }
+  },
+  "application": {
+    "message": "Application"
+  },
+  "atRiskPasswords": {
+    "message": "At-risk passwords"
+  },
+  "totalPasswords": {
+    "message": "Total passwords"
+  },
+  "atRiskMembers": {
+    "message": "At-risk members"
+  },
+  "totalMembers": {
+    "message": "Total members"
+  },
+  "atRiskApplications": {
+    "message": "At-risk applications"
+  },
+  "totalApplications": {
+    "message": "Total applications"
+  },
  "whatTypeOfItem": {
    "message": "What type of item is this?"
  },
@@ -1452,7 +1512,12 @@
    "description": "Minimum special characters"
  },
  "ambiguous": {
-    "message": "Avoid ambiguous characters"
+    "message": "Avoid ambiguous characters",
+    "description": "deprecated. Use avoidAmbiguous instead."
+  },
+  "avoidAmbiguous": {
+    "message": "Avoid ambiguous characters",
+    "description": "Label for the avoid ambiguous characters checkbox."
  },
  "regeneratePassword": {
    "message": "Regenerate password"
@@ -1465,18 +1530,51 @@
  },
  "uppercase": {
    "message": "Uppercase (A-Z)",
-    "description": "Include uppercase letters in the password generator."
+    "description": "deprecated. Use uppercaseLabel instead."
  },
  "lowercase": {
    "message": "Lowercase (a-z)",
-    "description": "Include lowercase letters in the password generator."
+    "description": "deprecated. Use lowercaseLabel instead."
  },
  "numbers": {
-    "message": "Numbers (0-9)"
+    "message": "Numbers (0-9)",
+    "description": "deprecated. Use numbersLabel instead."
  },
  "specialCharacters": {
    "message": "Special characters (!@#$%^&*)"
  },
+  "uppercaseDescription": {
+    "message": "Include uppercase characters",
+    "description": "Tooltip for the password generator uppercase character checkbox"
+  },
+  "uppercaseLabel": {
+    "message": "A-Z",
+    "description": "Label for the password generator uppercase character checkbox"
+  },
+  "lowercaseDescription": {
+    "message": "Include lowercase characters",
+    "description": "Full description for the password generator lowercase character checkbox"
+  },
+  "lowercaseLabel": {
+    "message": "a-z",
+    "description": "Label for the password generator lowercase character checkbox"
+  },
+  "numbersDescription": {
+    "message": "Include numbers",
+    "description": "Full description for the password generator numbers checkbox"
+  },
+  "numbersLabel": {
+    "message": "0-9",
+    "description": "Label for the password generator numbers checkbox"
+  },
+  "specialCharactersDescription": {
+    "message": "Include special characters",
+    "description": "Full description for the password generator special characters checkbox"
+  },
+  "specialCharactersLabel": {
+    "message": "!@#$%^&*",
+    "description": "Label for the password generator special characters checkbox"
+  },
  "numWords": {
    "message": "Number of words"
  },
@@ -2628,8 +2726,11 @@
  "invoices": {
    "message": "Invoices"
  },
-  "noInvoices": {
-    "message": "No invoices."
+  "noUnpaidInvoices": {
+    "message": "No unpaid invoices."
+  },
+  "noPaidInvoices": {
+    "message": "No paid invoices."
  },
  "paid": {
    "message": "Paid",
@@ -6235,7 +6336,8 @@
    "message": "Account settings"
  },
  "generator": {
-    "message": "Generator"
+    "message": "Generator",
+    "description": "Short for 'credential generator'."
  },
  "whatWouldYouLikeToGenerate": {
    "message": "What would you like to generate?"
--- a/libs/auth/src/angular/anon-layout/anon-layout.component.html
+++ b/libs/auth/src/angular/anon-layout/anon-layout.component.html
@@ -5,8 +5,7 @@
    'tw-pt-0': decreaseTopPadding,
    'tw-pt-8': !decreaseTopPadding,
    'tw-min-h-screen': clientType === 'web',
-    'tw-min-h-[calc(100vh-72px)]': clientType === 'browser',
-    'tw-min-h-[calc(100vh-54px)]': clientType === 'desktop',
+    'tw-min-h-full': clientType === 'browser' || clientType === 'desktop',
  }"
 >
  <a *ngIf="!hideLogo" [routerLink]="['/']" class="tw-w-[128px] [&>*]:tw-align-top">
@@ -33,7 +32,7 @@
  </div>

  <div
-    class="tw-mb-auto tw-w-full tw-max-w-md tw-mx-auto tw-flex tw-flex-col tw-items-center sm:tw-min-w-[28rem]"
+    class="tw-grow tw-w-full tw-max-w-md tw-mx-auto tw-flex tw-flex-col tw-items-center sm:tw-min-w-[28rem]"
    [ngClass]="{ 'tw-max-w-md': maxWidth === 'md', 'tw-max-w-3xl': maxWidth === '3xl' }"
  >
    <div
@@ -45,13 +44,15 @@
  </div>

  <footer *ngIf="!hideFooter" class="tw-text-center">
-    <div *ngIf="showReadonlyHostname">{{ "accessing" | i18n }} {{ hostname }}</div>
+    <div *ngIf="showReadonlyHostname" bitTypography="body2">
+      {{ "accessing" | i18n }} {{ hostname }}
+    </div>
    <ng-container *ngIf="!showReadonlyHostname">
      <ng-content select="[slot=environment-selector]"></ng-content>
    </ng-container>
    <ng-container *ngIf="!hideYearAndVersion">
-      <div>&copy; {{ year }} Bitwarden Inc.</div>
-      <div>{{ version }}</div>
+      <div bitTypography="body2">&copy; {{ year }} Bitwarden Inc.</div>
+      <div bitTypography="body2">{{ version }}</div>
    </ng-container>
  </footer>
 </main>
--- a/libs/auth/src/angular/anon-layout/anon-layout.component.ts
+++ b/libs/auth/src/angular/anon-layout/anon-layout.component.ts
@@ -1,5 +1,5 @@
 import { CommonModule } from "@angular/common";
-import { Component, Input, OnChanges, OnInit, SimpleChanges } from "@angular/core";
+import { Component, HostBinding, Input, OnChanges, OnInit, SimpleChanges } from "@angular/core";
 import { RouterModule } from "@angular/router";
 import { firstValueFrom } from "rxjs";

@@ -19,6 +19,12 @@ import { BitwardenLogo, VaultIcon } from "../icons";
  imports: [IconModule, CommonModule, TypographyModule, SharedModule, RouterModule],
 })
 export class AnonLayoutComponent implements OnInit, OnChanges {
+  @HostBinding("class")
+  get classList() {
+    // AnonLayout should take up full height of parent container for proper footer placement.
+    return ["tw-h-full"];
+  }
+
  @Input() title: string;
  @Input() subtitle: string;
  @Input() icon: Icon;
--- a/libs/common/src/admin-console/abstractions/organization-domain/org-domain-api.service.abstraction.ts
+++ b/libs/common/src/admin-console/abstractions/organization-domain/org-domain-api.service.abstraction.ts
@@ -1,7 +1,10 @@
+import { ListResponse } from "@bitwarden/common/models/response/list.response";
+
 import { OrganizationDomainRequest } from "../../services/organization-domain/requests/organization-domain.request";

 import { OrganizationDomainSsoDetailsResponse } from "./responses/organization-domain-sso-details.response";
 import { OrganizationDomainResponse } from "./responses/organization-domain.response";
+import { VerifiedOrganizationDomainSsoDetailsResponse } from "./responses/verified-organization-domain-sso-details.response";

 export abstract class OrgDomainApiServiceAbstraction {
  getAllByOrgId: (orgId: string) => Promise<Array<OrganizationDomainResponse>>;
@@ -16,4 +19,7 @@ export abstract class OrgDomainApiServiceAbstraction {
  verify: (orgId: string, orgDomainId: string) => Promise<OrganizationDomainResponse>;
  delete: (orgId: string, orgDomainId: string) => Promise<any>;
  getClaimedOrgDomainByEmail: (email: string) => Promise<OrganizationDomainSsoDetailsResponse>;
+  getVerifiedOrgDomainsByEmail: (
+    email: string,
+  ) => Promise<ListResponse<VerifiedOrganizationDomainSsoDetailsResponse>>;
 }
--- a/libs/common/src/admin-console/abstractions/organization-domain/responses/verified-organization-domain-sso-details.response.ts
+++ b/libs/common/src/admin-console/abstractions/organization-domain/responses/verified-organization-domain-sso-details.response.ts
@@ -0,0 +1,15 @@
+import { BaseResponse } from "@bitwarden/common/models/response/base.response";
+
+export class VerifiedOrganizationDomainSsoDetailsResponse extends BaseResponse {
+  organizationName: string;
+  organizationIdentifier: string;
+  domainName: string;
+
+  constructor(response: any) {
+    super(response);
+
+    this.organizationName = this.getResponseProperty("organizationName");
+    this.organizationIdentifier = this.getResponseProperty("organizationIdentifier");
+    this.domainName = this.getResponseProperty("domainName");
+  }
+}
--- a/libs/common/src/admin-console/services/organization-domain/org-domain-api.service.spec.ts
+++ b/libs/common/src/admin-console/services/organization-domain/org-domain-api.service.spec.ts
@@ -1,6 +1,9 @@
 import { mock } from "jest-mock-extended";
 import { lastValueFrom } from "rxjs";

+import { VerifiedOrganizationDomainSsoDetailsResponse } from "@bitwarden/common/admin-console/abstractions/organization-domain/responses/verified-organization-domain-sso-details.response";
+import { ListResponse } from "@bitwarden/common/models/response/list.response";
+
 import { ApiService } from "../../../abstractions/api.service";
 import { I18nService } from "../../../platform/abstractions/i18n.service";
 import { PlatformUtilsService } from "../../../platform/abstractions/platform-utils.service";
@@ -81,6 +84,19 @@ const mockedOrganizationDomainSsoDetailsResponse = new OrganizationDomainSsoDeta
  mockedOrganizationDomainSsoDetailsServerResponse,
 );

+const mockedVerifiedOrganizationDomain = {
+  organizationIdentifier: "fake-org-identifier",
+  organizationName: "fake-org",
+  domainName: "fake-domain-name",
+};
+
+const mockedVerifiedOrganizationDomainSsoResponse =
+  new VerifiedOrganizationDomainSsoDetailsResponse(mockedVerifiedOrganizationDomain);
+
+const mockedVerifiedOrganizationDomainSsoDetailsListResponse = {
+  data: [mockedVerifiedOrganizationDomain],
+} as ListResponse<VerifiedOrganizationDomainSsoDetailsResponse>;
+
 describe("Org Domain API Service", () => {
  let orgDomainApiService: OrgDomainApiService;

@@ -229,4 +245,21 @@ describe("Org Domain API Service", () => {

    expect(result).toEqual(mockedOrganizationDomainSsoDetailsResponse);
  });
+
+  it("getVerifiedOrgDomainsByEmail should call ApiService.send with correct parameters and return response", async () => {
+    const email = "test@example.com";
+    apiService.send.mockResolvedValue(mockedVerifiedOrganizationDomainSsoDetailsListResponse);
+
+    const result = await orgDomainApiService.getVerifiedOrgDomainsByEmail(email);
+
+    expect(apiService.send).toHaveBeenCalledWith(
+      "POST",
+      "/organizations/domain/sso/verified",
+      new OrganizationDomainSsoDetailsRequest(email),
+      false, //anonymous
+      true,
+    );
+
+    expect(result.data).toContainEqual(mockedVerifiedOrganizationDomainSsoResponse);
+  });
 });
--- a/libs/common/src/admin-console/services/organization-domain/org-domain-api.service.ts
+++ b/libs/common/src/admin-console/services/organization-domain/org-domain-api.service.ts
@@ -4,6 +4,7 @@ import { OrgDomainApiServiceAbstraction } from "../../abstractions/organization-
 import { OrgDomainInternalServiceAbstraction } from "../../abstractions/organization-domain/org-domain.service.abstraction";
 import { OrganizationDomainSsoDetailsResponse } from "../../abstractions/organization-domain/responses/organization-domain-sso-details.response";
 import { OrganizationDomainResponse } from "../../abstractions/organization-domain/responses/organization-domain.response";
+import { VerifiedOrganizationDomainSsoDetailsResponse } from "../../abstractions/organization-domain/responses/verified-organization-domain-sso-details.response";

 import { OrganizationDomainSsoDetailsRequest } from "./requests/organization-domain-sso-details.request";
 import { OrganizationDomainRequest } from "./requests/organization-domain.request";
@@ -109,4 +110,18 @@ export class OrgDomainApiService implements OrgDomainApiServiceAbstraction {

    return response;
  }
+
+  async getVerifiedOrgDomainsByEmail(
+    email: string,
+  ): Promise<ListResponse<VerifiedOrganizationDomainSsoDetailsResponse>> {
+    const result = await this.apiService.send(
+      "POST",
+      `/organizations/domain/sso/verified`,
+      new OrganizationDomainSsoDetailsRequest(email),
+      false, // anonymous
+      true,
+    );
+
+    return new ListResponse(result, VerifiedOrganizationDomainSsoDetailsResponse);
+  }
 }
--- a/libs/common/src/billing/abstractions/account/account-billing-api.service.abstraction.ts
+++ b/libs/common/src/billing/abstractions/account/account-billing-api.service.abstraction.ts
@@ -4,9 +4,6 @@ import {
 } from "@bitwarden/common/billing/models/response/billing.response";

 export class AccountBillingApiServiceAbstraction {
-  getBillingInvoices: (id: string, startAfter?: string) => Promise<BillingInvoiceResponse[]>;
-  getBillingTransactions: (
-    id: string,
-    startAfter?: string,
-  ) => Promise<BillingTransactionResponse[]>;
+  getBillingInvoices: (status?: string, startAfter?: string) => Promise<BillingInvoiceResponse[]>;
+  getBillingTransactions: (startAfter?: string) => Promise<BillingTransactionResponse[]>;
 }
--- a/libs/common/src/billing/abstractions/organizations/organization-billing-api.service.abstraction.ts
+++ b/libs/common/src/billing/abstractions/organizations/organization-billing-api.service.abstraction.ts
@@ -4,7 +4,12 @@ import {
 } from "@bitwarden/common/billing/models/response/billing.response";

 export class OrganizationBillingApiServiceAbstraction {
-  getBillingInvoices: (id: string, startAfter?: string) => Promise<BillingInvoiceResponse[]>;
+  getBillingInvoices: (
+    id: string,
+    status?: string,
+    startAfter?: string,
+  ) => Promise<BillingInvoiceResponse[]>;
+
  getBillingTransactions: (
    id: string,
    startAfter?: string,
--- a/libs/common/src/billing/services/account/account-billing-api.service.ts
+++ b/libs/common/src/billing/services/account/account-billing-api.service.ts
@@ -8,11 +8,25 @@ import {
 export class AccountBillingApiService implements AccountBillingApiServiceAbstraction {
  constructor(private apiService: ApiService) {}

-  async getBillingInvoices(startAfter?: string): Promise<BillingInvoiceResponse[]> {
-    const queryParams = startAfter ? `?startAfter=${startAfter}` : "";
+  async getBillingInvoices(
+    status?: string,
+    startAfter?: string,
+  ): Promise<BillingInvoiceResponse[]> {
+    const params = new URLSearchParams();
+
+    if (status) {
+      params.append("status", status);
+    }
+
+    if (startAfter) {
+      params.append("startAfter", startAfter);
+    }
+
+    const queryString = `?${params.toString()}`;
+
    const r = await this.apiService.send(
      "GET",
-      `/accounts/billing/invoices${queryParams}`,
+      `/accounts/billing/invoices${queryString}`,
      null,
      true,
      true,
--- a/libs/common/src/billing/services/organization/organization-billing-api.service.ts
+++ b/libs/common/src/billing/services/organization/organization-billing-api.service.ts
@@ -8,11 +8,26 @@ import {
 export class OrganizationBillingApiService implements OrganizationBillingApiServiceAbstraction {
  constructor(private apiService: ApiService) {}

-  async getBillingInvoices(id: string, startAfter?: string): Promise<BillingInvoiceResponse[]> {
-    const queryParams = startAfter ? `?startAfter=${startAfter}` : "";
+  async getBillingInvoices(
+    id: string,
+    status?: string,
+    startAfter?: string,
+  ): Promise<BillingInvoiceResponse[]> {
+    const params = new URLSearchParams();
+
+    if (status) {
+      params.append("status", status);
+    }
+
+    if (startAfter) {
+      params.append("startAfter", startAfter);
+    }
+
+    const queryString = `?${params.toString()}`;
+
    const r = await this.apiService.send(
      "GET",
-      `/organizations/${id}/billing/invoices${queryParams}`,
+      `/organizations/${id}/billing/invoices${queryString}`,
      null,
      true,
      true,
--- a/libs/common/src/enums/feature-flag.enum.ts
+++ b/libs/common/src/enums/feature-flag.enum.ts
@@ -31,8 +31,10 @@ export enum FeatureFlag {
  NotificationBarAddLoginImprovements = "notification-bar-add-login-improvements",
  AC2476_DeprecateStripeSourcesAPI = "AC-2476-deprecate-stripe-sources-api",
  CipherKeyEncryption = "cipher-key-encryption",
+  VerifiedSsoDomainEndpoint = "pm-12337-refactor-sso-details-endpoint",
  PM11901_RefactorSelfHostingLicenseUploader = "PM-11901-refactor-self-hosting-license-uploader",
  Pm3478RefactorOrganizationUserApi = "pm-3478-refactor-organizationuser-api",
+  AccessIntelligence = "pm-13227-access-intelligence",
 }

 export type AllowedFeatureFlagTypes = boolean | number | string;
@@ -74,8 +76,10 @@ export const DefaultFeatureFlagValue = {
  [FeatureFlag.NotificationBarAddLoginImprovements]: FALSE,
  [FeatureFlag.AC2476_DeprecateStripeSourcesAPI]: FALSE,
  [FeatureFlag.CipherKeyEncryption]: FALSE,
+  [FeatureFlag.VerifiedSsoDomainEndpoint]: FALSE,
  [FeatureFlag.PM11901_RefactorSelfHostingLicenseUploader]: FALSE,
  [FeatureFlag.Pm3478RefactorOrganizationUserApi]: FALSE,
+  [FeatureFlag.AccessIntelligence]: FALSE,
 } satisfies Record<FeatureFlag, AllowedFeatureFlagTypes>;

 export type DefaultFeatureFlagValueType = typeof DefaultFeatureFlagValue;
--- a/libs/components/src/tw-theme.css
+++ b/libs/components/src/tw-theme.css
@@ -222,10 +222,11 @@ summary.tw-list-none::-webkit-details-marker {
 }

 /**
- * Bootstrap uses z-index: 1050 for modals, dialogs should appear above them.
- * Remove once bootstrap is removed from our codebase.
- * CL-XYZ
+ * Bootstrap uses z-index: 1050 for modals, dialogs and drag-and-drop previews should appear above them.
+ * When bootstrap is removed, test if these styles are still needed and that overlays display properly over other content.
+ * CL-483
 */
+.cdk-drag-preview,
 .cdk-overlay-container,
 .cdk-global-overlay-wrapper,
 .cdk-overlay-connected-position-bounding-box,
--- a/libs/tools/generator/components/readme.md
+++ b/libs/tools/generator/components/readme.md
@@ -0,0 +1,40 @@
+<!-- FIXME: make this one or more storybooks -->
+
+## Using generator components
+
+The components within this module require the following import.
+
+```ts
+import { GeneratorModule } from "@bitwarden/generator-components";
+```
+
+The credential generator provides access to all generator features.
+
+```html
+<!-- Bound to active user -->
+<tools-credential-generator />
+
+<!-- Bound to a specific user -->
+<tools-credential-generator [user-id]="userId" />
+
+<!-- receive updates when a credential is generated.
+     `$event` is a `GeneratedCredential`.
+-->
+<tools-credential-generator (onGenerated)="eventHandler($event)" />
+```
+
+Specialized components are provided for username and password generation. These
+components support the same properties as the credential generator.
+
+```html
+<tools-password-generator [user-id]="userId" (onGenerated)="eventHandler($event)" />
+<tools-username-generator [user-id]="userId" (onGenerated)="eventHandler($event)" />
+```
+
+The emission behavior of `onGenerated` varies according to credential type. When
+a credential supports immediate execution, the component automatically generates
+a value and emits from `onGenerated`. An additional emission occurs each time the
+user changes a setting. Users may also request a regeneration.
+
+When a credential does not support immediate execution, then `onGenerated` fires
+only when the user clicks the "generate" button.
--- a/libs/tools/generator/components/src/catchall-settings.component.ts
+++ b/libs/tools/generator/components/src/catchall-settings.component.ts
@@ -10,15 +10,12 @@ import {
  Generators,
 } from "@bitwarden/generator-core";

-import { DependenciesModule } from "./dependencies";
 import { completeOnAccountSwitch } from "./util";

 /** Options group for catchall emails */
@Component({
-  standalone: true,
  selector: "tools-catchall-settings",
  templateUrl: "catchall-settings.component.html",
-  imports: [DependenciesModule],
 })
 export class CatchallSettingsComponent implements OnInit, OnDestroy {
  /** Instantiates the component
--- a/libs/tools/generator/components/src/credential-generator.component.html
+++ b/libs/tools/generator/components/src/credential-generator.component.html
@@ -0,0 +1,77 @@
+<!-- FIXME: root$ should be powered using a reactive form -->
+<bit-toggle-group
+  fullWidth
+  class="tw-mb-4"
+  [selected]="(root$ | async).nav"
+  (selectedChange)="onRootChanged($event)"
+  attr.aria-label="{{ 'type' | i18n }}"
+>
+  <bit-toggle *ngFor="let option of rootOptions$ | async" [value]="option.value">
+    {{ option.label }}
+  </bit-toggle>
+</bit-toggle-group>
+
+<bit-card class="tw-flex tw-justify-between tw-mb-4">
+  <div class="tw-grow tw-flex tw-items-center">
+    <bit-color-password class="tw-font-mono" [password]="value$ | async"></bit-color-password>
+  </div>
+  <div class="tw-space-x-1">
+    <button type="button" bitIconButton="bwi-generate" buttonType="main" (click)="generate$.next()">
+      {{ "generatePassword" | i18n }}
+    </button>
+    <button
+      type="button"
+      bitIconButton="bwi-clone"
+      buttonType="main"
+      showToast
+      [appCopyClick]="value$ | async"
+    >
+      {{ "copyPassword" | i18n }}
+    </button>
+  </div>
+</bit-card>
+<tools-password-settings
+  class="tw-mt-6"
+  *ngIf="(algorithm$ | async)?.id === 'password'"
+  [userId]="userId$ | async"
+  (onUpdated)="generate$.next()"
+/>
+<tools-passphrase-settings
+  class="tw-mt-6"
+  *ngIf="(algorithm$ | async)?.id === 'passphrase'"
+  [userId]="userId$ | async"
+  (onUpdated)="generate$.next()"
+/>
+<bit-section *ngIf="(category$ | async) !== 'password'">
+  <bit-section-header>
+    <h6 bitTypography="h6">{{ "options" | i18n }}</h6>
+  </bit-section-header>
+  <div class="tw-mb-4">
+    <bit-card>
+      <form class="box" [formGroup]="username" class="tw-container">
+        <bit-form-field>
+          <bit-label>{{ "type" | i18n }}</bit-label>
+          <bit-select [items]="usernameOptions$ | async" formControlName="nav"> </bit-select>
+          <bit-hint *ngIf="!!(credentialTypeHint$ | async)">{{
+            credentialTypeHint$ | async
+          }}</bit-hint>
+        </bit-form-field>
+      </form>
+      <tools-catchall-settings
+        *ngIf="(algorithm$ | async)?.id === 'catchall'"
+        [userId]="userId$ | async"
+        (onUpdated)="generate$.next()"
+      />
+      <tools-subaddress-settings
+        *ngIf="(algorithm$ | async)?.id === 'subaddress'"
+        [userId]="userId$ | async"
+        (onUpdated)="generate$.next()"
+      />
+      <tools-username-settings
+        *ngIf="(algorithm$ | async)?.id === 'username'"
+        [userId]="userId$ | async"
+        (onUpdated)="generate$.next()"
+      />
+    </bit-card>
+  </div>
+</bit-section>
--- a/libs/tools/generator/components/src/credential-generator.component.ts
+++ b/libs/tools/generator/components/src/credential-generator.component.ts
@@ -0,0 +1,293 @@
+import { Component, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output } from "@angular/core";
+import { FormBuilder } from "@angular/forms";
+import {
+  BehaviorSubject,
+  concat,
+  distinctUntilChanged,
+  filter,
+  map,
+  of,
+  ReplaySubject,
+  Subject,
+  switchMap,
+  takeUntil,
+  withLatestFrom,
+} from "rxjs";
+
+import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
+import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+import { UserId } from "@bitwarden/common/types/guid";
+import { Option } from "@bitwarden/components/src/select/option";
+import {
+  CredentialAlgorithm,
+  CredentialCategory,
+  CredentialGeneratorInfo,
+  CredentialGeneratorService,
+  GeneratedCredential,
+  Generators,
+  isEmailAlgorithm,
+  isPasswordAlgorithm,
+  isUsernameAlgorithm,
+  PasswordAlgorithm,
+} from "@bitwarden/generator-core";
+
+/** root category that drills into username and email categories */
+const IDENTIFIER = "identifier";
+/** options available for the top-level navigation */
+type RootNavValue = PasswordAlgorithm | typeof IDENTIFIER;
+
+@Component({
+  selector: "tools-credential-generator",
+  templateUrl: "credential-generator.component.html",
+})
+export class CredentialGeneratorComponent implements OnInit, OnDestroy {
+  constructor(
+    private generatorService: CredentialGeneratorService,
+    private i18nService: I18nService,
+    private accountService: AccountService,
+    private zone: NgZone,
+    private formBuilder: FormBuilder,
+  ) {}
+
+  /** Binds the component to a specific user's settings. When this input is not provided,
+   * the form binds to the active user
+   */
+  @Input()
+  userId: UserId | null;
+
+  /** Emits credentials created from a generation request. */
+  @Output()
+  readonly onGenerated = new EventEmitter<GeneratedCredential>();
+
+  protected root$ = new BehaviorSubject<{ nav: RootNavValue }>({
+    nav: null,
+  });
+
+  protected onRootChanged(nav: RootNavValue) {
+    // prevent subscription cycle
+    if (this.root$.value.nav !== nav) {
+      this.zone.run(() => {
+        this.root$.next({ nav });
+      });
+    }
+  }
+
+  protected username = this.formBuilder.group({
+    nav: [null as CredentialAlgorithm],
+  });
+
+  async ngOnInit() {
+    if (this.userId) {
+      this.userId$.next(this.userId);
+    } else {
+      this.accountService.activeAccount$
+        .pipe(
+          map((acct) => acct.id),
+          distinctUntilChanged(),
+          takeUntil(this.destroyed),
+        )
+        .subscribe(this.userId$);
+    }
+
+    this.generatorService
+      .algorithms$(["email", "username"], { userId$: this.userId$ })
+      .pipe(
+        map((algorithms) => this.toOptions(algorithms)),
+        takeUntil(this.destroyed),
+      )
+      .subscribe(this.usernameOptions$);
+
+    this.generatorService
+      .algorithms$("password", { userId$: this.userId$ })
+      .pipe(
+        map((algorithms) => {
+          const options = this.toOptions(algorithms) as Option<RootNavValue>[];
+          options.push({ value: IDENTIFIER, label: this.i18nService.t("username") });
+          return options;
+        }),
+        takeUntil(this.destroyed),
+      )
+      .subscribe(this.rootOptions$);
+
+    this.algorithm$
+      .pipe(
+        map((a) => a?.descriptionKey && this.i18nService.t(a?.descriptionKey)),
+        takeUntil(this.destroyed),
+      )
+      .subscribe((hint) => {
+        // update subjects within the angular zone so that the
+        // template bindings refresh immediately
+        this.zone.run(() => {
+          this.credentialTypeHint$.next(hint);
+        });
+      });
+
+    this.algorithm$
+      .pipe(
+        map((a) => a.category),
+        distinctUntilChanged(),
+        takeUntil(this.destroyed),
+      )
+      .subscribe((category) => {
+        // update subjects within the angular zone so that the
+        // template bindings refresh immediately
+        this.zone.run(() => {
+          this.category$.next(category);
+        });
+      });
+
+    // wire up the generator
+    this.algorithm$
+      .pipe(
+        switchMap((algorithm) => this.typeToGenerator$(algorithm.id)),
+        takeUntil(this.destroyed),
+      )
+      .subscribe((generated) => {
+        // update subjects within the angular zone so that the
+        // template bindings refresh immediately
+        this.zone.run(() => {
+          this.onGenerated.next(generated);
+          this.value$.next(generated.credential);
+        });
+      });
+
+    // assume the last-visible generator algorithm is the user's preferred one
+    const preferences = await this.generatorService.preferences({ singleUserId$: this.userId$ });
+    this.root$
+      .pipe(
+        filter(({ nav }) => !!nav),
+        switchMap((root) => {
+          if (root.nav === IDENTIFIER) {
+            return concat(of(this.username.value), this.username.valueChanges);
+          } else {
+            return of(root as { nav: PasswordAlgorithm });
+          }
+        }),
+        filter(({ nav }) => !!nav),
+        withLatestFrom(preferences),
+        takeUntil(this.destroyed),
+      )
+      .subscribe(([{ nav: algorithm }, preference]) => {
+        function setPreference(category: CredentialCategory) {
+          const p = preference[category];
+          p.algorithm = algorithm;
+          p.updated = new Date();
+        }
+
+        // `is*Algorithm` decides `algorithm`'s type, which flows into `setPreference`
+        if (isEmailAlgorithm(algorithm)) {
+          setPreference("email");
+        } else if (isUsernameAlgorithm(algorithm)) {
+          setPreference("username");
+        } else if (isPasswordAlgorithm(algorithm)) {
+          setPreference("password");
+        } else {
+          return;
+        }
+
+        preferences.next(preference);
+      });
+
+    // populate the form with the user's preferences to kick off interactivity
+    preferences.pipe(takeUntil(this.destroyed)).subscribe(({ email, username, password }) => {
+      // the last preference set by the user "wins"
+      const userNav = email.updated > username.updated ? email : username;
+      const rootNav: any = userNav.updated > password.updated ? IDENTIFIER : password.algorithm;
+      const credentialType = rootNav === IDENTIFIER ? userNav.algorithm : password.algorithm;
+
+      // update navigation; break subscription loop
+      this.onRootChanged(rootNav);
+      this.username.setValue({ nav: userNav.algorithm }, { emitEvent: false });
+
+      // load algorithm metadata
+      const algorithm = this.generatorService.algorithm(credentialType);
+
+      // update subjects within the angular zone so that the
+      // template bindings refresh immediately
+      this.zone.run(() => {
+        this.algorithm$.next(algorithm);
+      });
+    });
+
+    // generate on load unless the generator prohibits it
+    this.algorithm$
+      .pipe(
+        distinctUntilChanged((prev, next) => prev.id === next.id),
+        filter((a) => !a.onlyOnRequest),
+        takeUntil(this.destroyed),
+      )
+      .subscribe(() => this.generate$.next());
+  }
+
+  private typeToGenerator$(type: CredentialAlgorithm) {
+    const dependencies = {
+      on$: this.generate$,
+      userId$: this.userId$,
+    };
+
+    switch (type) {
+      case "catchall":
+        return this.generatorService.generate$(Generators.catchall, dependencies);
+
+      case "subaddress":
+        return this.generatorService.generate$(Generators.subaddress, dependencies);
+
+      case "username":
+        return this.generatorService.generate$(Generators.username, dependencies);
+
+      case "password":
+        return this.generatorService.generate$(Generators.password, dependencies);
+
+      case "passphrase":
+        return this.generatorService.generate$(Generators.passphrase, dependencies);
+
+      default:
+        throw new Error(`Invalid generator type: "${type}"`);
+    }
+  }
+
+  /** Lists the credential types of the username algorithm box. */
+  protected usernameOptions$ = new BehaviorSubject<Option<CredentialAlgorithm>[]>([]);
+
+  /** Lists the top-level credential types supported by the component. */
+  protected rootOptions$ = new BehaviorSubject<Option<RootNavValue>[]>([]);
+
+  /** tracks the currently selected credential type */
+  protected algorithm$ = new ReplaySubject<CredentialGeneratorInfo>(1);
+
+  /** Emits hint key for the currently selected credential type */
+  protected credentialTypeHint$ = new ReplaySubject<string>(1);
+
+  /** tracks the currently selected credential category */
+  protected category$ = new ReplaySubject<string>(1);
+
+  /** Emits the last generated value. */
+  protected readonly value$ = new BehaviorSubject<string>("");
+
+  /** Emits when the userId changes */
+  protected readonly userId$ = new BehaviorSubject<UserId>(null);
+
+  /** Emits when a new credential is requested */
+  protected readonly generate$ = new Subject<void>();
+
+  private toOptions(algorithms: CredentialGeneratorInfo[]) {
+    const options: Option<CredentialAlgorithm>[] = algorithms.map((algorithm) => ({
+      value: algorithm.id,
+      label: this.i18nService.t(algorithm.nameKey),
+    }));
+
+    return options;
+  }
+
+  private readonly destroyed = new Subject<void>();
+  ngOnDestroy() {
+    this.destroyed.complete();
+
+    // finalize subjects
+    this.generate$.complete();
+    this.value$.complete();
+
+    // finalize component bindings
+    this.onGenerated.complete();
+  }
+}
--- a/libs/tools/generator/components/src/generator.module.ts
+++ b/libs/tools/generator/components/src/generator.module.ts
@@ -10,8 +10,8 @@ import { CryptoService } from "@bitwarden/common/platform/abstractions/crypto.se
 import { StateProvider } from "@bitwarden/common/platform/state";
 import {
  CardComponent,
-  CheckboxModule,
  ColorPasswordModule,
+  CheckboxModule,
  FormFieldModule,
  IconButtonModule,
  InputModule,
@@ -27,16 +27,24 @@ import {
  Randomizer,
 } from "@bitwarden/generator-core";

+import { CatchallSettingsComponent } from "./catchall-settings.component";
+import { CredentialGeneratorComponent } from "./credential-generator.component";
+import { PassphraseSettingsComponent } from "./passphrase-settings.component";
+import { PasswordGeneratorComponent } from "./password-generator.component";
+import { PasswordSettingsComponent } from "./password-settings.component";
+import { SubaddressSettingsComponent } from "./subaddress-settings.component";
+import { UsernameGeneratorComponent } from "./username-generator.component";
+import { UsernameSettingsComponent } from "./username-settings.component";
+
 const RANDOMIZER = new SafeInjectionToken<Randomizer>("Randomizer");

 /** Shared module containing generator component dependencies */
@NgModule({
-  imports: [CardComponent, SectionComponent, SectionHeaderComponent],
-  exports: [
+  imports: [
    CardComponent,
+    ColorPasswordModule,
    CheckboxModule,
    CommonModule,
-    ColorPasswordModule,
    FormFieldModule,
    IconButtonModule,
    InputModule,
@@ -60,8 +68,18 @@ const RANDOMIZER = new SafeInjectionToken<Randomizer>("Randomizer");
      deps: [RANDOMIZER, StateProvider, PolicyService],
    }),
  ],
-  declarations: [],
+  declarations: [
+    CatchallSettingsComponent,
+    CredentialGeneratorComponent,
+    SubaddressSettingsComponent,
+    UsernameSettingsComponent,
+    PasswordGeneratorComponent,
+    PasswordSettingsComponent,
+    PassphraseSettingsComponent,
+    UsernameGeneratorComponent,
+  ],
+  exports: [CredentialGeneratorComponent, PasswordGeneratorComponent, UsernameGeneratorComponent],
 })
-export class DependenciesModule {
+export class GeneratorModule {
  constructor() {}
 }
--- a/libs/tools/generator/components/src/index.ts
+++ b/libs/tools/generator/components/src/index.ts
@@ -1,9 +1,3 @@
-export { CatchallSettingsComponent } from "./catchall-settings.component";
 export { CredentialGeneratorHistoryComponent } from "./credential-generator-history.component";
 export { EmptyCredentialHistoryComponent } from "./empty-credential-history.component";
-export { PassphraseSettingsComponent } from "./passphrase-settings.component";
-export { PasswordSettingsComponent } from "./password-settings.component";
-export { PasswordGeneratorComponent } from "./password-generator.component";
-export { SubaddressSettingsComponent } from "./subaddress-settings.component";
-export { UsernameGeneratorComponent } from "./username-generator.component";
-export { UsernameSettingsComponent } from "./username-settings.component";
+export { GeneratorModule } from "./generator.module";
--- a/libs/tools/generator/components/src/passphrase-settings.component.ts
+++ b/libs/tools/generator/components/src/passphrase-settings.component.ts
@@ -10,7 +10,6 @@ import {
  PassphraseGenerationOptions,
 } from "@bitwarden/generator-core";

-import { DependenciesModule } from "./dependencies";
 import { completeOnAccountSwitch, toValidators } from "./util";

 const Controls = Object.freeze({
@@ -22,10 +21,8 @@ const Controls = Object.freeze({

 /** Options group for passphrases */
@Component({
-  standalone: true,
  selector: "tools-passphrase-settings",
  templateUrl: "passphrase-settings.component.html",
-  imports: [DependenciesModule],
 })
 export class PassphraseSettingsComponent implements OnInit, OnDestroy {
  /** Instantiates the component
--- a/libs/tools/generator/components/src/password-generator.component.html
+++ b/libs/tools/generator/components/src/password-generator.component.html
@@ -5,11 +5,8 @@
  (selectedChange)="onCredentialTypeChanged($event)"
  attr.aria-label="{{ 'type' | i18n }}"
 >
-  <bit-toggle value="password">
-    {{ "password" | i18n }}
-  </bit-toggle>
-  <bit-toggle value="passphrase">
-    {{ "passphrase" | i18n }}
+  <bit-toggle *ngFor="let option of passwordOptions$ | async" [value]="option.value">
+    {{ option.label }}
  </bit-toggle>
 </bit-toggle-group>
 <bit-card class="tw-flex tw-justify-between tw-mb-4">
@@ -24,6 +21,7 @@
      type="button"
      bitIconButton="bwi-clone"
      buttonType="main"
+      showToast
      [appCopyClick]="value$ | async"
    >
      {{ "copyPassword" | i18n }}
@@ -32,13 +30,13 @@
 </bit-card>
 <tools-password-settings
  class="tw-mt-6"
-  *ngIf="(credentialType$ | async) === 'password'"
+  *ngIf="(algorithm$ | async)?.id === 'password'"
  [userId]="this.userId$ | async"
  (onUpdated)="generate$.next()"
 />
 <tools-passphrase-settings
  class="tw-mt-6"
-  *ngIf="(credentialType$ | async) === 'passphrase'"
+  *ngIf="(algorithm$ | async)?.id === 'passphrase'"
  [userId]="this.userId$ | async"
  (onUpdated)="generate$.next()"
 />
--- a/libs/tools/generator/components/src/password-generator.component.ts
+++ b/libs/tools/generator/components/src/password-generator.component.ts
@@ -1,29 +1,39 @@
 import { Component, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output } from "@angular/core";
-import { BehaviorSubject, distinctUntilChanged, map, Subject, switchMap, takeUntil } from "rxjs";
+import {
+  BehaviorSubject,
+  distinctUntilChanged,
+  filter,
+  map,
+  ReplaySubject,
+  Subject,
+  switchMap,
+  takeUntil,
+  withLatestFrom,
+} from "rxjs";

 import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
+import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { UserId } from "@bitwarden/common/types/guid";
+import { Option } from "@bitwarden/components/src/select/option";
 import {
  CredentialGeneratorService,
  Generators,
  PasswordAlgorithm,
  GeneratedCredential,
+  CredentialGeneratorInfo,
+  CredentialAlgorithm,
+  isPasswordAlgorithm,
 } from "@bitwarden/generator-core";

-import { DependenciesModule } from "./dependencies";
-import { PassphraseSettingsComponent } from "./passphrase-settings.component";
-import { PasswordSettingsComponent } from "./password-settings.component";
-
 /** Options group for passwords */
@Component({
-  standalone: true,
  selector: "tools-password-generator",
  templateUrl: "password-generator.component.html",
-  imports: [DependenciesModule, PasswordSettingsComponent, PassphraseSettingsComponent],
 })
 export class PasswordGeneratorComponent implements OnInit, OnDestroy {
  constructor(
    private generatorService: CredentialGeneratorService,
+    private i18nService: I18nService,
    private accountService: AccountService,
    private zone: NgZone,
  ) {}
@@ -36,7 +46,7 @@ export class PasswordGeneratorComponent implements OnInit, OnDestroy {
  userId: UserId | null;

  /** tracks the currently selected credential type */
-  protected credentialType$ = new BehaviorSubject<PasswordAlgorithm>("password");
+  protected credentialType$ = new BehaviorSubject<PasswordAlgorithm>(null);

  /** Emits the last generated value. */
  protected readonly value$ = new BehaviorSubject<string>("");
@@ -51,9 +61,11 @@ export class PasswordGeneratorComponent implements OnInit, OnDestroy {
   * @param type the new credential type
   */
  protected onCredentialTypeChanged(type: PasswordAlgorithm) {
+    // break subscription cycle
    if (this.credentialType$.value !== type) {
+      this.zone.run(() => {
        this.credentialType$.next(type);
-      this.generate$.next();
+      });
    }
  }

@@ -74,9 +86,18 @@ export class PasswordGeneratorComponent implements OnInit, OnDestroy {
        .subscribe(this.userId$);
    }

-    this.credentialType$
+    this.generatorService
+      .algorithms$("password", { userId$: this.userId$ })
      .pipe(
-        switchMap((type) => this.typeToGenerator$(type)),
+        map((algorithms) => this.toOptions(algorithms)),
+        takeUntil(this.destroyed),
+      )
+      .subscribe(this.passwordOptions$);
+
+    // wire up the generator
+    this.algorithm$
+      .pipe(
+        switchMap((algorithm) => this.typeToGenerator$(algorithm.id)),
        takeUntil(this.destroyed),
      )
      .subscribe((generated) => {
@@ -87,9 +108,52 @@ export class PasswordGeneratorComponent implements OnInit, OnDestroy {
          this.value$.next(generated.credential);
        });
      });
+
+    // assume the last-visible generator algorithm is the user's preferred one
+    const preferences = await this.generatorService.preferences({ singleUserId$: this.userId$ });
+    this.credentialType$
+      .pipe(
+        filter((type) => !!type),
+        withLatestFrom(preferences),
+        takeUntil(this.destroyed),
+      )
+      .subscribe(([algorithm, preference]) => {
+        if (isPasswordAlgorithm(algorithm)) {
+          preference.password.algorithm = algorithm;
+          preference.password.updated = new Date();
+        } else {
+          return;
        }

-  private typeToGenerator$(type: PasswordAlgorithm) {
+        preferences.next(preference);
+      });
+
+    // populate the form with the user's preferences to kick off interactivity
+    preferences.pipe(takeUntil(this.destroyed)).subscribe(({ password }) => {
+      // update navigation
+      this.onCredentialTypeChanged(password.algorithm);
+
+      // load algorithm metadata
+      const algorithm = this.generatorService.algorithm(password.algorithm);
+
+      // update subjects within the angular zone so that the
+      // template bindings refresh immediately
+      this.zone.run(() => {
+        this.algorithm$.next(algorithm);
+      });
+    });
+
+    // generate on load unless the generator prohibits it
+    this.algorithm$
+      .pipe(
+        distinctUntilChanged((prev, next) => prev.id === next.id),
+        filter((a) => !a.onlyOnRequest),
+        takeUntil(this.destroyed),
+      )
+      .subscribe(() => this.generate$.next());
+  }
+
+  private typeToGenerator$(type: CredentialAlgorithm) {
    const dependencies = {
      on$: this.generate$,
      userId$: this.userId$,
@@ -106,6 +170,21 @@ export class PasswordGeneratorComponent implements OnInit, OnDestroy {
    }
  }

+  /** Lists the credential types supported by the component. */
+  protected passwordOptions$ = new BehaviorSubject<Option<CredentialAlgorithm>[]>([]);
+
+  /** tracks the currently selected credential type */
+  protected algorithm$ = new ReplaySubject<CredentialGeneratorInfo>(1);
+
+  private toOptions(algorithms: CredentialGeneratorInfo[]) {
+    const options: Option<CredentialAlgorithm>[] = algorithms.map((algorithm) => ({
+      value: algorithm.id,
+      label: this.i18nService.t(algorithm.nameKey),
+    }));
+
+    return options;
+  }
+
  private readonly destroyed = new Subject<void>();
  ngOnDestroy(): void {
    // tear down subscriptions
--- a/libs/tools/generator/components/src/password-settings.component.ts
+++ b/libs/tools/generator/components/src/password-settings.component.ts
@@ -10,7 +10,6 @@ import {
  PasswordGenerationOptions,
 } from "@bitwarden/generator-core";

-import { DependenciesModule } from "./dependencies";
 import { completeOnAccountSwitch, toValidators } from "./util";

 const Controls = Object.freeze({
@@ -26,10 +25,8 @@ const Controls = Object.freeze({

 /** Options group for passwords */
@Component({
-  standalone: true,
  selector: "tools-password-settings",
  templateUrl: "password-settings.component.html",
-  imports: [DependenciesModule],
 })
 export class PasswordSettingsComponent implements OnInit, OnDestroy {
  /** Instantiates the component
--- a/libs/tools/generator/components/src/subaddress-settings.component.ts
+++ b/libs/tools/generator/components/src/subaddress-settings.component.ts
@@ -10,15 +10,12 @@ import {
  SubaddressGenerationOptions,
 } from "@bitwarden/generator-core";

-import { DependenciesModule } from "./dependencies";
 import { completeOnAccountSwitch } from "./util";

 /** Options group for plus-addressed emails */
@Component({
-  standalone: true,
  selector: "tools-subaddress-settings",
  templateUrl: "subaddress-settings.component.html",
-  imports: [DependenciesModule],
 })
 export class SubaddressSettingsComponent implements OnInit, OnDestroy {
  /** Instantiates the component
--- a/libs/tools/generator/components/src/username-generator.component.html
+++ b/libs/tools/generator/components/src/username-generator.component.html
@@ -10,6 +10,7 @@
      type="button"
      bitIconButton="bwi-clone"
      buttonType="main"
+      showToast
      [appCopyClick]="value$ | async"
    >
      {{ "copyPassword" | i18n }}
--- a/libs/tools/generator/components/src/username-generator.component.ts
+++ b/libs/tools/generator/components/src/username-generator.component.ts
@@ -26,23 +26,10 @@ import {
  isUsernameAlgorithm,
 } from "@bitwarden/generator-core";

-import { CatchallSettingsComponent } from "./catchall-settings.component";
-import { DependenciesModule } from "./dependencies";
-import { SubaddressSettingsComponent } from "./subaddress-settings.component";
-import { UsernameSettingsComponent } from "./username-settings.component";
-import { completeOnAccountSwitch } from "./util";
-
 /** Component that generates usernames and emails */
@Component({
-  standalone: true,
  selector: "tools-username-generator",
  templateUrl: "username-generator.component.html",
-  imports: [
-    DependenciesModule,
-    CatchallSettingsComponent,
-    SubaddressSettingsComponent,
-    UsernameSettingsComponent,
-  ],
 })
 export class UsernameGeneratorComponent implements OnInit, OnDestroy {
  /** Instantiates the username generator
@@ -72,14 +59,20 @@ export class UsernameGeneratorComponent implements OnInit, OnDestroy {

  /** Tracks the selected generation algorithm */
  protected credential = this.formBuilder.group({
-    type: ["username" as CredentialAlgorithm],
+    type: [null as CredentialAlgorithm],
  });

  async ngOnInit() {
    if (this.userId) {
      this.userId$.next(this.userId);
    } else {
-      this.singleUserId$().pipe(takeUntil(this.destroyed)).subscribe(this.userId$);
+      this.accountService.activeAccount$
+        .pipe(
+          map((acct) => acct.id),
+          distinctUntilChanged(),
+          takeUntil(this.destroyed),
+        )
+        .subscribe(this.userId$);
    }

    this.generatorService
@@ -121,7 +114,11 @@ export class UsernameGeneratorComponent implements OnInit, OnDestroy {
    // assume the last-visible generator algorithm is the user's preferred one
    const preferences = await this.generatorService.preferences({ singleUserId$: this.userId$ });
    this.credential.valueChanges
-      .pipe(withLatestFrom(preferences), takeUntil(this.destroyed))
+      .pipe(
+        filter(({ type }) => !!type),
+        withLatestFrom(preferences),
+        takeUntil(this.destroyed),
+      )
      .subscribe(([{ type }, preference]) => {
        if (isEmailAlgorithm(type)) {
          preference.email.algorithm = type;
@@ -202,19 +199,6 @@ export class UsernameGeneratorComponent implements OnInit, OnDestroy {
  /** Emits when a new credential is requested */
  protected readonly generate$ = new Subject<void>();

-  private singleUserId$() {
-    // FIXME: this branch should probably scan for the user and make sure
-    // the account is unlocked
-    if (this.userId) {
-      return new BehaviorSubject(this.userId as UserId).asObservable();
-    }
-
-    return this.accountService.activeAccount$.pipe(
-      completeOnAccountSwitch(),
-      takeUntil(this.destroyed),
-    );
-  }
-
  private toOptions(algorithms: CredentialGeneratorInfo[]) {
    const options: Option<CredentialAlgorithm>[] = algorithms.map((algorithm) => ({
      value: algorithm.id,
--- a/libs/tools/generator/components/src/username-settings.component.ts
+++ b/libs/tools/generator/components/src/username-settings.component.ts
@@ -10,15 +10,12 @@ import {
  Generators,
 } from "@bitwarden/generator-core";

-import { DependenciesModule } from "./dependencies";
 import { completeOnAccountSwitch } from "./util";

 /** Options group for usernames */
@Component({
-  standalone: true,
  selector: "tools-username-settings",
  templateUrl: "username-settings.component.html",
-  imports: [DependenciesModule],
 })
 export class UsernameSettingsComponent implements OnInit, OnDestroy {
  /** Instantiates the component
--- a/libs/tools/send/send-ui/src/send-form/components/options/send-options.component.html
+++ b/libs/tools/send/send-ui/src/send-form/components/options/send-options.component.html
@@ -12,8 +12,8 @@
      >
    </bit-form-field>
    <bit-form-field>
-      <bit-label *ngIf="!hasPassword">{{ "password" | i18n }}</bit-label>
-      <bit-label *ngIf="hasPassword">{{ "newPassword" | i18n }}</bit-label>
+      <bit-label *ngIf="!originalSendView || !hasPassword">{{ "password" | i18n }}</bit-label>
+      <bit-label *ngIf="originalSendView && hasPassword">{{ "newPassword" | i18n }}</bit-label>
      <input bitInput type="password" formControlName="password" />
      <button
        data-testid="toggle-visibility-for-password"
--- a/libs/vault/src/cipher-form/cipher-form.stories.ts
+++ b/libs/vault/src/cipher-form/cipher-form.stories.ts
@@ -15,7 +15,9 @@ import { EventCollectionService } from "@bitwarden/common/abstractions/event/eve
 import { Organization } from "@bitwarden/common/admin-console/models/domain/organization";
 import { AutofillSettingsServiceAbstraction } from "@bitwarden/common/autofill/services/autofill-settings.service";
 import { DomainSettingsService } from "@bitwarden/common/autofill/services/domain-settings.service";
+import { ClientType } from "@bitwarden/common/enums";
 import { UriMatchStrategy } from "@bitwarden/common/models/domain/domain-service";
+import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { CipherType } from "@bitwarden/common/vault/enums";
 import { Cipher } from "@bitwarden/common/vault/models/domain/cipher";
 import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
@@ -175,6 +177,12 @@ export default {
            collect: () => Promise.resolve(),
          },
        },
+        {
+          provide: PlatformUtilsService,
+          useValue: {
+            getClientType: () => ClientType.Browser,
+          },
+        },
      ],
    }),
    componentWrapperDecorator(
--- a/libs/vault/src/cipher-form/components/autofill-options/autofill-options.component.spec.ts
+++ b/libs/vault/src/cipher-form/components/autofill-options/autofill-options.component.spec.ts
@@ -7,6 +7,7 @@ import { AutofillSettingsServiceAbstraction } from "@bitwarden/common/autofill/s
 import { DomainSettingsService } from "@bitwarden/common/autofill/services/domain-settings.service";
 import { UriMatchStrategy } from "@bitwarden/common/models/domain/domain-service";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
 import { LoginUriView } from "@bitwarden/common/vault/models/view/login-uri.view";
 import { LoginView } from "@bitwarden/common/vault/models/view/login.view";
@@ -23,10 +24,12 @@ describe("AutofillOptionsComponent", () => {
  let liveAnnouncer: MockProxy<LiveAnnouncer>;
  let domainSettingsService: MockProxy<DomainSettingsService>;
  let autofillSettingsService: MockProxy<AutofillSettingsServiceAbstraction>;
+  let platformUtilsService: MockProxy<PlatformUtilsService>;

  beforeEach(async () => {
    cipherFormContainer = mock<CipherFormContainer>();
    liveAnnouncer = mock<LiveAnnouncer>();
+    platformUtilsService = mock<PlatformUtilsService>();
    domainSettingsService = mock<DomainSettingsService>();
    domainSettingsService.defaultUriMatchStrategy$ = new BehaviorSubject(null);

@@ -45,6 +48,7 @@ describe("AutofillOptionsComponent", () => {
        { provide: LiveAnnouncer, useValue: liveAnnouncer },
        { provide: DomainSettingsService, useValue: domainSettingsService },
        { provide: AutofillSettingsServiceAbstraction, useValue: autofillSettingsService },
+        { provide: PlatformUtilsService, useValue: platformUtilsService },
      ],
    }).compileComponents();

--- a/libs/vault/src/cipher-form/components/autofill-options/autofill-options.component.ts
+++ b/libs/vault/src/cipher-form/components/autofill-options/autofill-options.component.ts
@@ -3,13 +3,15 @@ import { AsyncPipe, NgForOf, NgIf } from "@angular/common";
 import { Component, OnInit, QueryList, ViewChildren } from "@angular/core";
 import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
 import { FormBuilder, ReactiveFormsModule } from "@angular/forms";
-import { Subject, switchMap, take } from "rxjs";
+import { filter, Subject, switchMap, take } from "rxjs";

 import { JslibModule } from "@bitwarden/angular/jslib.module";
 import { AutofillSettingsServiceAbstraction } from "@bitwarden/common/autofill/services/autofill-settings.service";
 import { DomainSettingsService } from "@bitwarden/common/autofill/services/domain-settings.service";
+import { ClientType } from "@bitwarden/common/enums";
 import { UriMatchStrategySetting } from "@bitwarden/common/models/domain/domain-service";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { LoginUriView } from "@bitwarden/common/vault/models/view/login-uri.view";
 import { LoginView } from "@bitwarden/common/vault/models/view/login.view";
 import {
@@ -69,7 +71,10 @@ export class AutofillOptionsComponent implements OnInit {
    return this.autofillOptionsForm.controls.uris.controls;
  }

-  protected defaultMatchDetection$ = this.domainSettingsService.defaultUriMatchStrategy$;
+  protected defaultMatchDetection$ = this.domainSettingsService.defaultUriMatchStrategy$.pipe(
+    // The default match detection should only be shown when used on the browser
+    filter(() => this.platformUtilsService.getClientType() == ClientType.Browser),
+  );
  protected autofillOnPageLoadEnabled$ = this.autofillSettingsService.autofillOnPageLoad$;

  protected autofillOptions: { label: string; value: boolean | null }[] = [
@@ -90,6 +95,7 @@ export class AutofillOptionsComponent implements OnInit {
    private liveAnnouncer: LiveAnnouncer,
    private domainSettingsService: DomainSettingsService,
    private autofillSettingsService: AutofillSettingsServiceAbstraction,
+    private platformUtilsService: PlatformUtilsService,
  ) {
    this.cipherFormContainer.registerChildForm("autoFillOptions", this.autofillOptionsForm);

--- a/libs/vault/src/cipher-form/components/autofill-options/uri-option.component.spec.ts
+++ b/libs/vault/src/cipher-form/components/autofill-options/uri-option.component.spec.ts
@@ -51,6 +51,13 @@ describe("UriOptionComponent", () => {
    expect(component).toBeTruthy();
  });

+  it("should not update the default uri match strategy label when it is null", () => {
+    component.defaultMatchDetection = null;
+    fixture.detectChanges();
+
+    expect(component["uriMatchOptions"][0].label).toBe("default");
+  });
+
  it("should update the default uri match strategy label", () => {
    component.defaultMatchDetection = UriMatchStrategy.Exact;
    fixture.detectChanges();
--- a/libs/vault/src/cipher-form/components/autofill-options/uri-option.component.ts
+++ b/libs/vault/src/cipher-form/components/autofill-options/uri-option.component.ts
@@ -83,6 +83,11 @@ export class UriOptionComponent implements ControlValueAccessor {
   */
  @Input({ required: true })
  set defaultMatchDetection(value: UriMatchStrategySetting) {
+    // The default selection has a value of `null` avoid showing "Default (Default)"
+    if (!value) {
+      return;
+    }
+
    this.uriMatchOptions[0].label = this.i18nService.t(
      "defaultLabel",
      this.uriMatchOptions.find((o) => o.value === value)?.label,
--- a/libs/vault/src/cipher-form/components/cipher-generator/cipher-form-generator.component.spec.ts
+++ b/libs/vault/src/cipher-form/components/cipher-generator/cipher-form-generator.component.spec.ts
@@ -3,10 +3,7 @@ import { ComponentFixture, TestBed } from "@angular/core/testing";
 import { By } from "@angular/platform-browser";

 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
-import {
-  PasswordGeneratorComponent,
-  UsernameGeneratorComponent,
-} from "@bitwarden/generator-components";
+import { GeneratorModule } from "@bitwarden/generator-components";
 import { CipherFormGeneratorComponent } from "@bitwarden/vault";

@Component({
@@ -37,7 +34,7 @@ describe("CipherFormGeneratorComponent", () => {
      providers: [{ provide: I18nService, useValue: { t: (key: string) => key } }],
    })
      .overrideComponent(CipherFormGeneratorComponent, {
-        remove: { imports: [PasswordGeneratorComponent, UsernameGeneratorComponent] },
+        remove: { imports: [GeneratorModule] },
        add: { imports: [MockPasswordGeneratorComponent, MockUsernameGeneratorComponent] },
      })
      .compileComponents();
--- a/libs/vault/src/cipher-form/components/cipher-generator/cipher-form-generator.component.ts
+++ b/libs/vault/src/cipher-form/components/cipher-generator/cipher-form-generator.component.ts
@@ -1,11 +1,7 @@
 import { CommonModule } from "@angular/common";
 import { Component, EventEmitter, Input, Output } from "@angular/core";

-import { SectionComponent } from "@bitwarden/components";
-import {
-  PasswordGeneratorComponent,
-  UsernameGeneratorComponent,
-} from "@bitwarden/generator-components";
+import { GeneratorModule } from "@bitwarden/generator-components";
 import { GeneratedCredential } from "@bitwarden/generator-core";

 /**
@@ -16,7 +12,7 @@ import { GeneratedCredential } from "@bitwarden/generator-core";
  selector: "vault-cipher-form-generator",
  templateUrl: "./cipher-form-generator.component.html",
  standalone: true,
-  imports: [CommonModule, SectionComponent, PasswordGeneratorComponent, UsernameGeneratorComponent],
+  imports: [CommonModule, GeneratorModule],
 })
 export class CipherFormGeneratorComponent {
  /**
--- a/libs/vault/src/cipher-view/login-credentials/login-credentials-view.component.html
+++ b/libs/vault/src/cipher-view/login-credentials/login-credentials-view.component.html
@@ -36,15 +36,6 @@
        aria-readonly="true"
        data-testid="login-password"
      />
-      <button
-        *ngIf="cipher.viewPassword"
-        bitSuffix
-        type="button"
-        bitIconButton
-        bitPasswordInputToggle
-        data-testid="toggle-password"
-        (toggledChange)="pwToggleValue($event)"
-      ></button>
      <button
        *ngIf="cipher.viewPassword && passwordRevealed"
        bitIconButton="bwi-numbered-list"
@@ -56,6 +47,15 @@
        appStopClick
        (click)="togglePasswordCount()"
      ></button>
+      <button
+        *ngIf="cipher.viewPassword"
+        bitSuffix
+        type="button"
+        bitIconButton
+        bitPasswordInputToggle
+        data-testid="toggle-password"
+        (toggledChange)="pwToggleValue($event)"
+      ></button>
      <button
        *ngIf="cipher.viewPassword"
        bitIconButton="bwi-clone"
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -213,6 +213,7 @@
      "zone.js": "$zone.js"
    },
    "replacestream": "4.0.3",
+    "@types/minimatch": "3.0.5",
    "@electron/asar": {
      "@types/glob": "7.1.3"
    }