From c699817223f246bcff0483e5b2a4eac0a0211255 Mon Sep 17 00:00:00 2001
From: rr-bw <102181210+rr-bw@users.noreply.github.com>
Date: Wed, 14 May 2025 01:10:06 -0700
Subject: [PATCH] [PM-18721] disable button during submit process

---
 ...ency-access-takeover-dialog.component.html | 19 +++++++++++++++++--
 ...rgency-access-takeover-dialog.component.ts | 18 +++++++++++++++++-
 2 files changed, 34 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.html b/apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.html
index 5bc10fcbe1f..a5be649c06f 100644
--- a/apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.html
+++ b/apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.html
@@ -17,8 +17,23 @@
   </div>
 
   <ng-container bitDialogFooter>
-    <button type="button" bitButton buttonType="primary" (click)="handlePrimaryButtonClick()">
-      {{ "save" | i18n }}
+    <button
+      class="tw-relative"
+      type="button"
+      bitButton
+      buttonType="primary"
+      [disabled]="submitting"
+      (click)="handlePrimaryButtonClick()"
+    >
+      <span
+        [ngClass]="{ 'tw-invisible': !submitting }"
+        class="tw-absolute tw-inset-0 tw-flex tw-items-center tw-justify-center"
+      >
+        <i class="bwi bwi-spinner bwi-lg bwi-spin" aria-hidden="true"></i>
+      </span>
+      <span [ngClass]="{ 'tw-invisible': submitting }">
+        {{ "save" | i18n }}
+      </span>
     </button>
     <button type="button" bitButton buttonType="secondary" bitDialogClose>
       {{ "cancel" | i18n }}
diff --git a/apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.ts b/apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.ts
index 3e391091abe..2533e5ccde1 100644
--- a/apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.ts
+++ b/apps/web/src/app/auth/settings/emergency-access/takeover/emergency-access-takeover-dialog.component.ts
@@ -67,6 +67,8 @@ export class EmergencyAccessTakeoverDialogComponent implements OnInit {
 
   inputPasswordFlow = InputPasswordFlow.ChangePasswordDelegation;
   masterPasswordPolicyOptions?: MasterPasswordPolicyOptions;
+  receivedPasswordInputResult = false;
+  submitting = false;
 
   constructor(
     @Inject(DIALOG_DATA) protected dialogData: EmergencyAccessTakeoverDialogData,
@@ -91,10 +93,24 @@ export class EmergencyAccessTakeoverDialogComponent implements OnInit {
   }
 
   protected handlePrimaryButtonClick = async () => {
-    await this.inputPasswordComponent.submit();
+    try {
+      this.submitting = true;
+      await this.inputPasswordComponent.submit();
+    } catch {
+      // Flip to false if submit() throws an error
+      this.submitting = false;
+    }
+
+    // Flip to false if submit() returns early without a PasswordInputResult
+    // emission due to form validation errors or new password doesn't meet org policy reqs.
+    if (!this.receivedPasswordInputResult) {
+      this.submitting = false;
+    }
   };
 
   protected async handlePasswordFormSubmit(passwordInputResult: PasswordInputResult) {
+    this.receivedPasswordInputResult = Boolean(passwordInputResult);
+
     try {
       await this.emergencyAccessService.takeover(
         this.dialogData.emergencyAccessId,