[PM-4048] Update DeleteAccountComponent on Desktop (#6846)

* [PM-4048] Use dialog service instead of modal service. Change UI file to use bit-Dialog. Remove from app module into standalone.

* [PM-4048] Update app.module imports

* [PM-4048] Fix form.

* PM-4048 - Delete Account tweak - remove unncessary delete header per discussion with product

* PM-4048 - Per CL migration guide,

* PM-4048 - (1) Remove button module import from dialog module exports (2) Add CL imports to desktop app module for delete acct dialog comp (3) Update delete acct dialog comp to use bitSubmit

* PM-4048 - Remove deprecated data-dismiss as bitDialogClose replaced it in terms of functionality.

* PM-4048 - Desktop Delete Acct - update loading button logic to latest CL standards (thanks Will!)

* PM-4048 - Must manually show errors to get "User Verification failed" message when user inputs incorrect MP.

* PM-4048 - desktop - delete-account.component.html - per PR feedback, remove non-tailwind classes and address missing bitFormButton

* PM-4048 - DeleteAccountComponent - per PR feedback, import DialogService using proper import alias.

* PM-4048 - delete-account.component.html - per PR feedback, remove no longer needed #form

* PM-4048 - delete-account.component.html - remove missed non-tailwind class

* PM-4048 - DeleteAccountComponent - per PR feedback, remove try catch as it is unnecessary as the bitSubmit handles errors

* add bespoke border to fix color contrast issue

* convert delete-account.component and user-verification.component to standalone; revert app module CL imports

* run prettier

* run prettier again

---------

Co-authored-by: Jared Snider <116684653+JaredSnider-Bitwarden@users.noreply.github.com>
Co-authored-by: Jared Snider <jsnider@bitwarden.com>
Co-authored-by: William Martin <contact@willmartian.com>

apps/desktop/src/app/app.component.ts

@@ -252,7 +252,7 @@ export class AppComponent implements OnInit, OnDestroy {
             break;
           }
           case "deleteAccount":
-            this.modalService.open(DeleteAccountComponent, { replaceTopModal: true });
+            DeleteAccountComponent.open(this.dialogService);
             break;
           case "openPasswordHistory":
             await this.openModal<PasswordGeneratorHistoryComponent>(

apps/desktop/src/app/app.module.ts

@@ -3,11 +3,11 @@ import "zone.js";
 // Register the locales for the application
 import "../platform/app/locales";
 
-import { DialogModule } from "@angular/cdk/dialog";
 import { NgModule } from "@angular/core";
 
 import { ColorPasswordCountPipe } from "@bitwarden/angular/pipes/color-password-count.pipe";
 import { ColorPasswordPipe } from "@bitwarden/angular/pipes/color-password.pipe";
+import { DialogModule } from "@bitwarden/components";
 
 import { AccessibilityCookieComponent } from "../auth/accessibility-cookie.component";
 import { SetPinComponent } from "../auth/components/set-pin.component";
@@ -55,7 +55,15 @@ import { AddEditComponent as SendAddEditComponent } from "./tools/send/add-edit.
 import { SendComponent } from "./tools/send/send.component";
 
 @NgModule({
-  imports: [SharedModule, DialogModule, AppRoutingModule, VaultFilterModule, LoginModule],
+  imports: [
+    SharedModule,
+    AppRoutingModule,
+    VaultFilterModule,
+    LoginModule,
+    DialogModule,
+    DeleteAccountComponent,
+    UserVerificationComponent,
+  ],
   declarations: [
     AccessibilityCookieComponent,
     AccountSwitcherComponent,
@@ -67,7 +75,6 @@ import { SendComponent } from "./tools/send/send.component";
     CollectionsComponent,
     ColorPasswordPipe,
     ColorPasswordCountPipe,
-    DeleteAccountComponent,
     EnvironmentComponent,
     ExportComponent,
     FolderAddEditComponent,
@@ -92,7 +99,6 @@ import { SendComponent } from "./tools/send/send.component";
     TwoFactorComponent,
     TwoFactorOptionsComponent,
     UpdateTempPasswordComponent,
-    UserVerificationComponent,
     VaultComponent,
     VaultTimeoutInputComponent,
     ViewComponent,

apps/desktop/src/app/components/user-verification.component.ts

@@ -1,11 +1,16 @@
 import { animate, style, transition, trigger } from "@angular/animations";
+import { CommonModule } from "@angular/common";
 import { Component } from "@angular/core";
-import { NG_VALUE_ACCESSOR } from "@angular/forms";
+import { FormsModule, NG_VALUE_ACCESSOR, ReactiveFormsModule } from "@angular/forms";
 
 import { UserVerificationComponent as BaseComponent } from "@bitwarden/angular/auth/components/user-verification.component";
+import { JslibModule } from "@bitwarden/angular/jslib.module";
+import { FormFieldModule } from "@bitwarden/components";
 
 @Component({
   selector: "app-user-verification",
+  standalone: true,
+  imports: [CommonModule, JslibModule, ReactiveFormsModule, FormFieldModule, FormsModule],
   templateUrl: "user-verification.component.html",
   providers: [
     {