[EC-317] Desktop client delete user account (#3151)

* [EC-317] feat: add delete account section in settings

* [EC-317] feat: add new delete account modal

* [EC-317] feat: add ability to replace top-most modal

* [EC-317] chore: remove unecessary lint ignore

* [EC-317] fix: so delete account is closed if export vault is opened

* [EC-317] feat: inital delete account design without i18n

* [EC-317] feat: disabled but basic working delete functionality

* [EC-317] feat: implement according to new design

* [EC-317] feat: use translations

* [EC-317] feat: implement working deletion

* [EC-317] feat: add loading state and error messages

* [EC-317] feat: add menu bar item

* [EC-317] feat: update form to support typed reactive forms

* [EC-317] chore: update translation text after design review

* [EC-317] feat: move deletion logic to service

* [EC-317] refactor: update web deletion

* [EC-317] feat: disable submit if secret is empty

* [EC-317] fix: handle errors in components as well

* [EC-317] fix: use abstraction as interface

* [EC-317] refactor: extract deleteAccount from api service

* [EC-317] fix: typo in translations

* [EC-317] chore: rename to accountApiService

apps/web/src/app/settings/delete-account.component.html

@@ -6,6 +6,7 @@
       (ngSubmit)="submit()"
       [appApiAction]="formPromise"
       ngNativeValidate
+      [formGroup]="deleteForm"
     >
       <div class="modal-header">
         <h2 class="modal-title" id="deleteAccountTitle">{{ "deleteAccount" | i18n }}</h2>
@@ -21,7 +22,7 @@
       <div class="modal-body">
         <p>{{ "deleteAccountDesc" | i18n }}</p>
         <app-callout type="warning">{{ "deleteAccountWarning" | i18n }}</app-callout>
-        <app-user-verification [(ngModel)]="masterPassword" ngDefaultControl name="secret">
+        <app-user-verification ngDefaultControl formControlName="verification" name="verification">
         </app-user-verification>
       </div>
       <div class="modal-footer">

apps/web/src/app/settings/delete-account.component.ts

@@ -1,11 +1,10 @@
 import { Component } from "@angular/core";
+import { FormBuilder } from "@angular/forms";
 
-import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { AccountService } from "@bitwarden/common/abstractions/account/account.service.abstraction";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
-import { MessagingService } from "@bitwarden/common/abstractions/messaging.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
-import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service";
 import { Verification } from "@bitwarden/common/types/verification";
 
 @Component({
@@ -13,30 +12,30 @@ import { Verification } from "@bitwarden/common/types/verification";
   templateUrl: "delete-account.component.html",
 })
 export class DeleteAccountComponent {
-  masterPassword: Verification;
-  formPromise: Promise<any>;
+  formPromise: Promise<void>;
+
+  deleteForm = this.formBuilder.group({
+    verification: undefined as Verification | undefined,
+  });
 
   constructor(
-    private apiService: ApiService,
     private i18nService: I18nService,
     private platformUtilsService: PlatformUtilsService,
-    private userVerificationService: UserVerificationService,
-    private messagingService: MessagingService,
+    private formBuilder: FormBuilder,
+    private accountService: AccountService,
     private logService: LogService
   ) {}
 
   async submit() {
     try {
-      this.formPromise = this.userVerificationService
-        .buildRequest(this.masterPassword)
-        .then((request) => this.apiService.deleteAccount(request));
+      const verification = this.deleteForm.get("verification").value;
+      this.formPromise = this.accountService.delete(verification);
       await this.formPromise;
       this.platformUtilsService.showToast(
         "success",
         this.i18nService.t("accountDeleted"),
         this.i18nService.t("accountDeletedDesc")
       );
-      this.messagingService.send("logout");
     } catch (e) {
       this.logService.error(e);
     }

apps/web/src/locales/en/messages.json

@@ -1088,7 +1088,7 @@
     "message": "Account Deleted"
   },
   "accountDeletedDesc": {
-    "message": "Your Bitwarden account and vault data were permanently deleted."
+    "message": "Your account has been closed and all associated data has been deleted."
   },
   "myAccount": {
     "message": "My Account"