Merged branch with master and fixed conflicts

apps/browser/src/auth/popup/two-factor.component.ts

@@ -32,6 +32,7 @@ const BroadcasterSubscriptionId = "TwoFactorComponent";
 })
 export class TwoFactorComponent extends BaseTwoFactorComponent {
   showNewWindowMessage = false;
+  redirectUrl: string;
 
   constructor(
     authService: AuthService,
@@ -74,6 +75,16 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
       syncService.fullSync(true);
     };
 
+    super.onSuccessfulLoginNavigate = async () => {
+      // The `redirectUrl` parameter determines the target route after a successful login.
+      // If provided in the URL's query parameters, the user will be redirected
+      // to the specified path once they are authenticated.
+      if (this.route.snapshot.queryParams.redirectUrl) {
+        this.redirectUrl = decodeURIComponent(this.route.snapshot.queryParams.redirectUrl);
+        this.router.navigateByUrl(this.redirectUrl);
+      }
+    };
+
     super.onSuccessfulLoginTde = async () => {
       syncService.fullSync(true);
     };

apps/browser/src/platform/browser/browser-api.ts

@@ -1,4 +1,3 @@
-import type { NgZone } from "@angular/core";
 import { Observable } from "rxjs";
 
 import { DeviceType } from "@bitwarden/common/enums";
@@ -245,22 +244,20 @@ export class BrowserApi {
   }
 
   /**
-   * Creates an observable that listens for messages. If an Angular zone is provided,
+   * Creates an observable that listens for messages. While this observable might
-   * ensures that the message processing runs within that zone, triggering change detection.
+   * operate outside the Angular zone, it's recommended to pipe it with the
+   * utility function `runInsideAngular` to ensure proper triggering of change detection
+   * and other zone-related behaviors.
+   *
+   * @see /libs/angular/src/utils/run-inside-angular.operator.ts
+   *
    * This solution was devised to address an issue in the `Fido2Component`, where the
    * original message listener operated outside the Angular zone.
-   *
-   * @param {NgZone} [zone] - An optional Angular zone to ensure UI updates and change
-   * detection are triggered. If omitted, operates outside the Angular zone.
    */
-  static messageListener$(zone?: NgZone) {
+  static messageListener$() {
     return new Observable<unknown>((subscriber) => {
       const handler = (message: unknown) => {
-        if (zone) {
+        subscriber.next(message);
-          zone.run(() => subscriber.next(message));
-        } else {
-          subscriber.next(message);
-        }
       };
       chrome.runtime.onMessage.addListener(handler);
       return () => chrome.runtime.onMessage.removeListener(handler);

apps/browser/src/vault/popup/components/fido2/fido2.component.ts

@@ -12,6 +12,7 @@ import {
   takeUntil,
 } from "rxjs";
 
+import { runInsideAngular } from "@bitwarden/angular/utils/run-inside-angular.operator";
 import { CipherService } from "@bitwarden/common/vault/abstractions/cipher.service";
 import { PasswordRepromptService } from "@bitwarden/common/vault/abstractions/password-reprompt.service";
 import { CipherType } from "@bitwarden/common/vault/enums/cipher-type";
@@ -58,11 +59,8 @@ export class Fido2Component implements OnInit, OnDestroy {
       map((queryParamMap) => queryParamMap.get("sessionId"))
     );
 
-    combineLatest([
+    combineLatest([sessionId$, BrowserApi.messageListener$() as Observable<BrowserFido2Message>])
-      sessionId$,
+      .pipe(runInsideAngular(this.ngZone), takeUntil(this.destroy$))
-      BrowserApi.messageListener$(this.ngZone) as Observable<BrowserFido2Message>,
-    ])
-      .pipe(takeUntil(this.destroy$))
       .subscribe(([sessionId, message]) => {
         this.sessionId = sessionId;
         if (message.type === "NewSessionCreatedRequest" && message.sessionId !== sessionId) {

libs/angular/src/auth/components/two-factor.component.ts

@@ -45,7 +45,6 @@ export class TwoFactorComponent extends CaptchaProtectedComponent implements OnI
   formPromise: Promise<any>;
   emailPromise: Promise<any>;
   orgIdentifier: string = null;
-  redirectUrl: string;
   onSuccessfulLogin: () => Promise<void>;
   onSuccessfulLoginNavigate: () => Promise<void>;
 
@@ -207,13 +206,6 @@ export class TwoFactorComponent extends CaptchaProtectedComponent implements OnI
   }
 
   async doSubmit() {
-    // The `redirectUrl` parameter determines the target route after a successful login.
-    // If provided in the URL's query parameters, the user will be redirected
-    // to the specified path once they are authenticated.
-    if (this.route.snapshot.queryParams.redirectUrl) {
-      this.successRoute = decodeURIComponent(this.route.snapshot.queryParams.redirectUrl);
-    }
-
     this.formPromise = this.authService.logInTwoFactor(
       new TokenTwoFactorRequest(this.selectedProviderType, this.token, this.remember),
       this.captchaToken