[PM-18721] feature flag the showing of the dialog component

apps/web/src/app/auth/settings/emergency-access/emergency-access.component.ts

@@ -10,6 +10,8 @@ import { OrganizationManagementPreferencesService } from "@bitwarden/common/admi
 import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
 import { getUserId } from "@bitwarden/common/auth/services/account.service";
 import { BillingAccountProfileStateService } from "@bitwarden/common/billing/abstractions/account/billing-account-profile-state.service";
+import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
+import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
 import { MessagingService } from "@bitwarden/common/platform/abstractions/messaging.service";
@@ -34,6 +36,10 @@ import {
   EmergencyAccessAddEditComponent,
   EmergencyAccessAddEditDialogResult,
 } from "./emergency-access-add-edit.component";
+import {
+  EmergencyAccessTakeoverDialogComponent,
+  EmergencyAccessTakeoverDialogResultType,
+} from "./takeover/emergency-access-takeover-dialog.component";
 import {
   EmergencyAccessTakeoverComponent,
   EmergencyAccessTakeoverResultType,
@@ -69,6 +75,7 @@ export class EmergencyAccessComponent implements OnInit {
     private toastService: ToastService,
     private apiService: ApiService,
     private accountService: AccountService,
+    private configService: ConfigService,
   ) {
     this.canAccessPremium$ = this.accountService.activeAccount$.pipe(
       switchMap((account) =>
@@ -285,20 +292,46 @@ export class EmergencyAccessComponent implements OnInit {
   }
 
   takeover = async (details: GrantorEmergencyAccess) => {
-    const dialogRef = EmergencyAccessTakeoverComponent.open(this.dialogService, {
-      data: {
-        name: this.userNamePipe.transform(details),
-        email: details.email,
-        emergencyAccessId: details.id ?? null,
-      },
-    });
-    const result = await lastValueFrom(dialogRef.closed);
-    if (result === EmergencyAccessTakeoverResultType.Done) {
-      this.toastService.showToast({
-        variant: "success",
-        title: null,
-        message: this.i18nService.t("passwordResetFor", this.userNamePipe.transform(details)),
+    const changePasswordRefactorFlag = await this.configService.getFeatureFlag(
+      FeatureFlag.PM16117_ChangeExistingPasswordRefactor,
+    );
+
+    const grantorName = this.userNamePipe.transform(details);
+    const grantorEmail = details.email;
+    const emergencyAccessId = details.id ?? null;
+
+    if (changePasswordRefactorFlag) {
+      const dialogRef = EmergencyAccessTakeoverDialogComponent.open(this.dialogService, {
+        data: {
+          grantorName,
+          grantorEmail,
+          emergencyAccessId,
+        },
       });
+      const result = await lastValueFrom(dialogRef.closed);
+      if (result === EmergencyAccessTakeoverDialogResultType.Done) {
+        this.toastService.showToast({
+          variant: "success",
+          title: null,
+          message: this.i18nService.t("passwordResetFor", grantorName),
+        });
+      }
+    } else {
+      const dialogRef = EmergencyAccessTakeoverComponent.open(this.dialogService, {
+        data: {
+          name: grantorName,
+          email: grantorEmail,
+          emergencyAccessId,
+        },
+      });
+      const result = await lastValueFrom(dialogRef.closed);
+      if (result === EmergencyAccessTakeoverResultType.Done) {
+        this.toastService.showToast({
+          variant: "success",
+          title: null,
+          message: this.i18nService.t("passwordResetFor", grantorName),
+        });
+      }
     }
   };
 

apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.ts

@@ -0,0 +1,45 @@
+import { Component, Inject } from "@angular/core";
+
+import { DIALOG_DATA, DialogConfig, DialogService } from "@bitwarden/components";
+
+type EmergencyAccessTakeoverDialogData = {
+  grantorName: string;
+  grantorEmail: string;
+  /** Traces a unique emergency request */
+  emergencyAccessId: string;
+};
+
+export enum EmergencyAccessTakeoverDialogResultType {
+  Done = "done",
+}
+
+/**
+ * This component is used by a Grantee to take over emergency access of a Grantor's account
+ * by changing the Grantor's master password. It is displayed as a dialog when the Grantee
+ * clicks the "Takeover" button while on the `/settings/emergency-access` page (see `EmergencyAccessComponent`).
+ *
+ * @link https://bitwarden.com/help/emergency-access/
+ */
+@Component({
+  standalone: true,
+  selector: "auth-emergency-access-takeover-dialog",
+  templateUrl: "./emergency-access-takeover-dialog.component.html",
+})
+export class EmergencyAccessTakeoverDialogComponent {
+  constructor(@Inject(DIALOG_DATA) private dialogData: EmergencyAccessTakeoverDialogData) {}
+
+  /**
+   * Strongly typed helper to open a EmergencyAccessTakeoverDialogComponent
+   * @param dialogService Instance of the dialog service that will be used to open the dialog
+   * @param dialogConfig Configuration for the dialog
+   */
+  static open = (
+    dialogService: DialogService,
+    dialogConfig: DialogConfig<EmergencyAccessTakeoverDialogData>,
+  ) => {
+    return dialogService.open<EmergencyAccessTakeoverDialogResultType>(
+      EmergencyAccessTakeoverDialogComponent,
+      dialogConfig,
+    );
+  };
+}

libs/common/src/enums/feature-flag.enum.ts

@@ -109,7 +109,7 @@ export const DefaultFeatureFlagValue = {
   [FeatureFlag.PM19941MigrateCipherDomainToSdk]: FALSE,
 
   /* Auth */
-  [FeatureFlag.PM16117_ChangeExistingPasswordRefactor]: FALSE,
+  [FeatureFlag.PM16117_ChangeExistingPasswordRefactor]: true,
   [FeatureFlag.PM9115_TwoFactorExtensionDataPersistence]: FALSE,
 
   /* Billing */