[PM-13930] - add cancel button to multiple screens (#13705)

* add cancel button to multiple screens

* revert changes to view-v2

* remove unnecessary props

* add cancel button to blocked domains

apps/browser/src/autofill/popup/settings/blocked-domains.component.html

@@ -76,5 +76,8 @@
     >
       {{ "save" | i18n }}
     </button>
+    <button (click)="goBack()" bitButton type="button" buttonType="secondary">
+      {{ "cancel" | i18n }}
+    </button>
   </popup-footer>
 </popup-page>

apps/browser/src/autofill/popup/settings/blocked-domains.component.ts

@@ -39,6 +39,7 @@ import { PopOutComponent } from "../../../platform/popup/components/pop-out.comp
 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";
+import { PopupRouterCacheService } from "../../../platform/popup/view-cache/popup-router-cache.service";
 
 @Component({
   selector: "app-blocked-domains",
@@ -88,6 +89,7 @@ export class BlockedDomainsComponent implements AfterViewInit, OnDestroy {
     private i18nService: I18nService,
     private toastService: ToastService,
     private formBuilder: FormBuilder,
+    private popupRouterCacheService: PopupRouterCacheService,
   ) {}
 
   get domainForms() {
@@ -220,6 +222,10 @@ export class BlockedDomainsComponent implements AfterViewInit, OnDestroy {
     }
   }
 
+  async goBack() {
+    await this.popupRouterCacheService.back();
+  }
+
   trackByFunction(index: number, _: string) {
     return index;
   }

apps/browser/src/autofill/popup/settings/excluded-domains.component.html

@@ -72,5 +72,8 @@
     >
       {{ "save" | i18n }}
     </button>
+    <button (click)="goBack()" bitButton type="button" buttonType="secondary">
+      {{ "cancel" | i18n }}
+    </button>
   </popup-footer>
 </popup-page>

apps/browser/src/autofill/popup/settings/excluded-domains.component.ts

@@ -40,6 +40,7 @@ import { PopOutComponent } from "../../../platform/popup/components/pop-out.comp
 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";
+import { PopupRouterCacheService } from "../../../platform/popup/view-cache/popup-router-cache.service";
 
 @Component({
   selector: "app-excluded-domains",
@@ -90,6 +91,7 @@ export class ExcludedDomainsComponent implements AfterViewInit, OnDestroy {
     private i18nService: I18nService,
     private toastService: ToastService,
     private formBuilder: FormBuilder,
+    private popupRouterCacheService: PopupRouterCacheService,
   ) {
     this.accountSwitcherEnabled = enableAccountSwitching();
   }
@@ -150,6 +152,10 @@ export class ExcludedDomainsComponent implements AfterViewInit, OnDestroy {
     await this.fieldChange();
   }
 
+  async goBack() {
+    await this.popupRouterCacheService.back();
+  }
+
   async fieldChange() {
     if (this.dataIsPristine) {
       this.dataIsPristine = false;

apps/browser/src/vault/popup/components/vault-v2/add-edit/add-edit-v2.component.html

@@ -2,7 +2,7 @@
   <popup-header
     slot="header"
     [pageTitle]="headerText"
-    [backAction]="handleBackButton.bind(this)"
+    [backAction]="handleBackButton"
     showBackButton
   >
     <app-pop-out slot="end" />
@@ -27,6 +27,10 @@
       {{ "save" | i18n }}
     </button>
 
+    <button (click)="handleBackButton()" bitButton type="button" buttonType="secondary">
+      {{ "cancel" | i18n }}
+    </button>
+
     <button
       slot="end"
       *ngIf="canDeleteCipher$ | async"

apps/browser/src/vault/popup/components/vault-v2/add-edit/add-edit-v2.component.ts

@@ -212,7 +212,7 @@ export class AddEditV2Component implements OnInit {
   /**
    * Handle back button
    */
-  async handleBackButton() {
+  handleBackButton = async () => {
     if (this.inFido2PopoutWindow) {
       this.popupCloseWarningService.disable();
       BrowserFido2UserInterfaceSession.abortPopout(this.fido2PopoutSessionData.sessionId);
@@ -225,7 +225,7 @@ export class AddEditV2Component implements OnInit {
     }
 
     await this.popupRouterCacheService.back();
-  }
+  };
 
   async onCipherSaved(cipher: CipherView) {
     if (BrowserPopupUtils.inPopout(window)) {

apps/browser/src/vault/popup/components/vault-v2/attachments/attachments-v2.component.html

@@ -20,5 +20,8 @@
     >
       {{ "upload" | i18n }}
     </button>
+    <button (click)="navigateBack()" bitButton type="button" buttonType="secondary">
+      {{ "cancel" | i18n }}
+    </button>
   </popup-footer>
 </popup-page>