[PM-8114] all clients UI refresh SSO component

apps/browser/src/auth/popup/login/extension-sso-component.service.spec.ts

@@ -0,0 +1,67 @@
+import { TestBed } from "@angular/core/testing";
+import { mock, MockProxy } from "jest-mock-extended";
+import { BehaviorSubject } from "rxjs";
+
+import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service";
+import {
+  EnvironmentService,
+  Environment,
+} from "@bitwarden/common/platform/abstractions/environment.service";
+import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
+import { SyncService } from "@bitwarden/common/vault/abstractions/sync/sync.service.abstraction";
+
+import { BrowserApi } from "../../../platform/browser/browser-api";
+
+import { ExtensionSsoComponentService } from "./extension-sso-component.service";
+
+describe("ExtensionSsoComponentService", () => {
+  let service: ExtensionSsoComponentService;
+  const baseUrl = "https://vault.bitwarden.com";
+
+  let syncService: MockProxy<SyncService>;
+  let authService: MockProxy<AuthService>;
+  let environmentService: MockProxy<EnvironmentService>;
+  let i18nService: MockProxy<I18nService>;
+  let logService: MockProxy<LogService>;
+
+  beforeEach(() => {
+    syncService = mock<SyncService>();
+    authService = mock<AuthService>();
+    environmentService = mock<EnvironmentService>();
+    i18nService = mock<I18nService>();
+    logService = mock<LogService>();
+    environmentService.environment$ = new BehaviorSubject<Environment>({
+      getWebVaultUrl: () => baseUrl,
+    } as Environment);
+
+    TestBed.configureTestingModule({
+      providers: [
+        { provide: SyncService, useValue: syncService },
+        { provide: AuthService, useValue: authService },
+        { provide: EnvironmentService, useValue: environmentService },
+        { provide: I18nService, useValue: i18nService },
+        { provide: LogService, useValue: logService },
+        ExtensionSsoComponentService,
+      ],
+    });
+
+    service = TestBed.inject(ExtensionSsoComponentService);
+
+    jest.spyOn(BrowserApi, "reloadOpenWindows").mockImplementation();
+  });
+
+  it("creates the service", () => {
+    expect(service).toBeTruthy();
+  });
+
+  describe("closeWindow", () => {
+    it("closes window", async () => {
+      const windowSpy = jest.spyOn(window, "close").mockImplementation();
+
+      await service.closeWindow?.();
+
+      expect(windowSpy).toHaveBeenCalled();
+    });
+  });
+});

apps/browser/src/auth/popup/login/extension-sso-component.service.ts

@@ -0,0 +1,48 @@
+import { Injectable } from "@angular/core";
+
+import { DefaultSsoComponentService, SsoComponentService } from "@bitwarden/auth/angular";
+import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service";
+import { AuthenticationStatus } from "@bitwarden/common/auth/enums/authentication-status";
+import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
+import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
+import { SyncService } from "@bitwarden/common/vault/abstractions/sync/sync.service.abstraction";
+
+import { BrowserApi } from "../../../platform/browser/browser-api";
+
+/**
+ * This service is used to handle the SSO login process for the browser extension.
+ */
+@Injectable()
+export class ExtensionSsoComponentService
+  extends DefaultSsoComponentService
+  implements SsoComponentService
+{
+  constructor(
+    protected syncService: SyncService,
+    protected authService: AuthService,
+    protected environmentService: EnvironmentService,
+    protected i18nService: I18nService,
+    protected logService: LogService,
+  ) {
+    super();
+  }
+
+  /**
+   * Closes the popup window after a successful login.
+   */
+  async closeWindow() {
+    window.close();
+  }
+
+  /**
+   * Reloads open windows when the vault is not unlocked.
+   * Prevents clearing keys from memory after a successful login.
+   */
+  async reloadOpenWindowsWhenNotUnlocked() {
+    // If the vault is unlocked then this will clear keys from memory, which we don't want to do
+    if ((await this.authService.getAuthStatus()) !== AuthenticationStatus.Unlocked) {
+      BrowserApi.reloadOpenWindows();
+    }
+  }
+}

apps/browser/src/auth/popup/sso.component.ts → apps/browser/src/auth/popup/sso-v1.component.ts

@@ -29,9 +29,9 @@
 
 @Component({
   selector: "app-sso",
-  templateUrl: "sso.component.html",
+  templateUrl: "sso-v1.component.html",
 })
-export class SsoComponent extends BaseSsoComponent {
+export class SsoComponentV1 extends BaseSsoComponent {
   constructor(
     ssoLoginService: SsoLoginServiceAbstraction,
     loginStrategyService: LoginStrategyServiceAbstraction,

apps/browser/src/popup/app-routing.module.ts

@@ -39,6 +39,7 @@
   VaultIcon,
   LoginDecryptionOptionsComponent,
   DevicesIcon,
+  SsoComponent,
   TwoFactorTimeoutIcon,
 } from "@bitwarden/auth/angular";
 import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
@@ -62,7 +63,7 @@
 import { SetPasswordComponent } from "../auth/popup/set-password.component";
 import { AccountSecurityComponent as AccountSecurityV1Component } from "../auth/popup/settings/account-security-v1.component";
 import { AccountSecurityComponent } from "../auth/popup/settings/account-security.component";
-import { SsoComponent } from "../auth/popup/sso.component";
+import { SsoComponentV1 } from "../auth/popup/sso-v1.component";
 import { TwoFactorAuthComponent } from "../auth/popup/two-factor-auth.component";
 import { TwoFactorOptionsComponent } from "../auth/popup/two-factor-options.component";
 import { TwoFactorComponent } from "../auth/popup/two-factor.component";
@@ -230,12 +231,40 @@
     canActivate: [unauthGuardFn(unauthRouteOverrides)],
     data: { elevation: 1 } satisfies RouteDataProperties,
   },
-  {
-    path: "sso",
-    component: SsoComponent,
-    canActivate: [unauthGuardFn(unauthRouteOverrides)],
-    data: { elevation: 1 } satisfies RouteDataProperties,
-  },
+  ...unauthUiRefreshSwap(
+    SsoComponentV1,
+    ExtensionAnonLayoutWrapperComponent,
+    {
+      path: "sso",
+      canActivate: [unauthGuardFn(unauthRouteOverrides)],
+      data: { elevation: 1 } satisfies RouteDataProperties,
+    },
+    {
+      path: "sso",
+      canActivate: [unauthGuardFn(unauthRouteOverrides)],
+      data: {
+        pageIcon: VaultIcon,
+        pageTitle: {
+          key: "enterpriseSingleSignOn",
+        },
+        pageSubtitle: {
+          key: "singleSignOnEnterOrgIdentifierText",
+        },
+        elevation: 1,
+      } satisfies RouteDataProperties & ExtensionAnonLayoutWrapperData,
+      children: [
+        { path: "", component: SsoComponent },
+        {
+          path: "",
+          component: EnvironmentSelectorComponent,
+          outlet: "environment-selector",
+          data: {
+            overlayPosition: ExtensionDefaultOverlayPosition,
+          } satisfies EnvironmentSelectorRouteData,
+        },
+      ],
+    },
+  ),
   {
     path: "set-password",
     component: SetPasswordComponent,

apps/browser/src/popup/app.module.ts

@@ -33,7 +33,7 @@
 import { AccountSecurityComponent as AccountSecurityComponentV1 } from "../auth/popup/settings/account-security-v1.component";
 import { AccountSecurityComponent } from "../auth/popup/settings/account-security.component";
 import { VaultTimeoutInputComponent } from "../auth/popup/settings/vault-timeout-input.component";
-import { SsoComponent } from "../auth/popup/sso.component";
+import { SsoComponentV1 } from "../auth/popup/sso-v1.component";
 import { TwoFactorOptionsComponent } from "../auth/popup/two-factor-options.component";
 import { TwoFactorComponent } from "../auth/popup/two-factor.component";
 import { UpdateTempPasswordComponent } from "../auth/popup/update-temp-password.component";
@@ -177,7 +177,7 @@
     SettingsComponent,
     VaultSettingsComponent,
     ShareComponent,
-    SsoComponent,
+    SsoComponentV1,
     SyncComponent,
     TabsComponent,
     TabsV2Component,

apps/browser/src/popup/services/services.module.ts

@@ -25,6 +25,7 @@
   AnonLayoutWrapperDataService,
   LoginComponentService,
   LockComponentService,
+  SsoComponentService,
   LoginDecryptionOptionsService,
 } from "@bitwarden/auth/angular";
 import { LockService, LoginEmailService, PinServiceAbstraction } from "@bitwarden/auth/common";
@@ -119,6 +120,7 @@
 import { ForegroundLockService } from "../../auth/popup/accounts/foreground-lock.service";
 import { ExtensionAnonLayoutWrapperDataService } from "../../auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper-data.service";
 import { ExtensionLoginComponentService } from "../../auth/popup/login/extension-login-component.service";
+import { ExtensionSsoComponentService } from "../../auth/popup/login/extension-sso-component.service";
 import { ExtensionLoginDecryptionOptionsService } from "../../auth/popup/login-decryption-options/extension-login-decryption-options.service";
 import { AutofillService as AutofillServiceAbstraction } from "../../autofill/services/abstractions/autofill.service";
 import AutofillService from "../../autofill/services/autofill.service";
@@ -597,6 +599,11 @@
     useExisting: PopupCompactModeService,
     deps: [],
   }),
+  safeProvider({
+    provide: SsoComponentService,
+    useClass: ExtensionSsoComponentService,
+    deps: [SyncService, AuthService, EnvironmentService, I18nServiceAbstraction, LogService],
+  }),
   safeProvider({
     provide: LoginDecryptionOptionsService,
     useClass: ExtensionLoginDecryptionOptionsService,

apps/desktop/src/app/app-routing.module.ts

@@ -36,6 +36,7 @@
   VaultIcon,
   LoginDecryptionOptionsComponent,
   DevicesIcon,
+  SsoComponent,
   TwoFactorTimeoutIcon,
 } from "@bitwarden/auth/angular";
 import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
@@ -51,7 +52,7 @@
 import { RegisterComponent } from "../auth/register.component";
 import { RemovePasswordComponent } from "../auth/remove-password.component";
 import { SetPasswordComponent } from "../auth/set-password.component";
-import { SsoComponent } from "../auth/sso.component";
+import { SsoComponentV1 } from "../auth/sso-v1.component";
 import { TwoFactorAuthComponent } from "../auth/two-factor-auth.component";
 import { TwoFactorComponent } from "../auth/two-factor.component";
 import { UpdateTempPasswordComponent } from "../auth/update-temp-password.component";
@@ -122,7 +123,33 @@
   },
   { path: "accessibility-cookie", component: AccessibilityCookieComponent },
   { path: "set-password", component: SetPasswordComponent },
-  { path: "sso", component: SsoComponent },
+  ...unauthUiRefreshSwap(
+    SsoComponentV1,
+    AnonLayoutWrapperComponent,
+    {
+      path: "sso",
+    },
+    {
+      path: "sso",
+      data: {
+        pageIcon: VaultIcon,
+        pageTitle: {
+          key: "enterpriseSingleSignOn",
+        },
+        pageSubtitle: {
+          key: "singleSignOnEnterOrgIdentifierText",
+        },
+      } satisfies AnonLayoutWrapperData,
+      children: [
+        { path: "", component: SsoComponent },
+        {
+          path: "",
+          component: EnvironmentSelectorComponent,
+          outlet: "environment-selector",
+        },
+      ],
+    },
+  ),
   {
     path: "send",
     component: SendComponent,

apps/desktop/src/app/app.module.ts

@@ -18,7 +18,7 @@
 import { RegisterComponent } from "../auth/register.component";
 import { RemovePasswordComponent } from "../auth/remove-password.component";
 import { SetPasswordComponent } from "../auth/set-password.component";
-import { SsoComponent } from "../auth/sso.component";
+import { SsoComponentV1 } from "../auth/sso-v1.component";
 import { TwoFactorOptionsComponent } from "../auth/two-factor-options.component";
 import { TwoFactorComponent } from "../auth/two-factor.component";
 import { UpdateTempPasswordComponent } from "../auth/update-temp-password.component";
@@ -92,7 +92,7 @@
     SetPasswordComponent,
     SettingsComponent,
     ShareComponent,
-    SsoComponent,
+    SsoComponentV1,
     TwoFactorComponent,
     TwoFactorOptionsComponent,
     UpdateTempPasswordComponent,

apps/desktop/src/app/services/services.module.ts

@@ -25,6 +25,8 @@ import {
   LoginComponentService,
   SetPasswordJitService,
   LockComponentService,
+  SsoComponentService,
+  DefaultSsoComponentService,
 } from "@bitwarden/auth/angular";
 import {
   InternalUserDecryptionOptionsServiceAbstraction,
@@ -361,6 +363,11 @@ const safeProviders: SafeProvider[] = [
     useClass: LoginEmailService,
     deps: [AccountService, AuthService, StateProvider],
   }),
+  safeProvider({
+    provide: SsoComponentService,
+    useClass: DefaultSsoComponentService,
+    deps: [],
+  }),
   safeProvider({
     provide: LoginApprovalComponentServiceAbstraction,
     useClass: DesktopLoginApprovalComponentService,

apps/desktop/src/auth/sso.component.ts → apps/desktop/src/auth/sso-v1.component.ts

@@ -23,9 +23,9 @@
 
 @Component({
   selector: "app-sso",
-  templateUrl: "sso.component.html",
+  templateUrl: "sso-v1.component.html",
 })
-export class SsoComponent extends BaseSsoComponent {
+export class SsoComponentV1 extends BaseSsoComponent {
   constructor(
     ssoLoginService: SsoLoginServiceAbstraction,
     loginStrategyService: LoginStrategyServiceAbstraction,

apps/web/src/app/auth/core/services/login/web-sso-component.service.spec.ts

@@ -0,0 +1,36 @@
+import { TestBed } from "@angular/core/testing";
+import { mock, MockProxy } from "jest-mock-extended";
+
+import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
+
+import { WebSsoComponentService } from "./web-sso-component.service";
+
+describe("WebSsoComponentService", () => {
+  let service: WebSsoComponentService;
+  let i18nService: MockProxy<I18nService>;
+
+  beforeEach(() => {
+    i18nService = mock<I18nService>();
+
+    TestBed.configureTestingModule({
+      providers: [WebSsoComponentService, { provide: I18nService, useValue: i18nService }],
+    });
+    service = TestBed.inject(WebSsoComponentService);
+  });
+
+  it("creates the service", () => {
+    expect(service).toBeTruthy();
+  });
+
+  describe("setDocumentCookies", () => {
+    it("sets ssoHandOffMessage cookie with translated message", () => {
+      const mockMessage = "Test SSO Message";
+      i18nService.t.mockReturnValue(mockMessage);
+
+      service.setDocumentCookies?.();
+
+      expect(document.cookie).toContain(`ssoHandOffMessage=${mockMessage}`);
+      expect(i18nService.t).toHaveBeenCalledWith("ssoHandOff");
+    });
+  });
+});