[CL-106] use CL's DialogService in Desktop & Browser (#5875)

* remove libs/angular dialog service; move simple dialog types to CL * update DialogServiceAbstraction imports to CL * update imports in libs/angular to use CL * colocate simple dialog types * move SimpleConfigurableDialog files under SimpleDialog * remove CL import alias from CL src * update imports * run prettier * convert SimpleDialog enums to types * replace DialogServiceAbstraction with DialogService * restrict libs/angular imports in CL * add deprecation note to ModalService * Delete BrowserDialogService * Remove ElectronDialogService * update browser and desktop services.module * remove os.EOL in simple dialog * change SimpleDialogCloseType to boolean * remove close type
2025-12-18 17:23:37 +00:00 · 2023-08-16 08:26:56 -04:00
parent c304b59c3b
commit a4fcd62c99
147 changed files with 448 additions and 758 deletions
--- a/apps/desktop/src/app/accounts/settings.component.ts
+++ b/apps/desktop/src/app/accounts/settings.component.ts
@@ -3,7 +3,6 @@ import { FormBuilder } from "@angular/forms";
 import { Observable, Subject } from "rxjs";
 import { concatMap, debounceTime, filter, map, takeUntil, tap } from "rxjs/operators";

-import { DialogServiceAbstraction, SimpleDialogType } from "@bitwarden/angular/services/dialog";
 import { ModalService } from "@bitwarden/angular/services/modal.service";
 import { AbstractThemingService } from "@bitwarden/angular/services/theming/theming.service.abstraction";
 import { SettingsService } from "@bitwarden/common/abstractions/settings.service";
@@ -17,6 +16,7 @@ import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.servic
 import { MessagingService } from "@bitwarden/common/platform/abstractions/messaging.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { Utils } from "@bitwarden/common/platform/misc/utils";
+import { DialogService } from "@bitwarden/components";

 import { flagEnabled } from "../../platform/flags";
 import { ElectronStateService } from "../../platform/services/electron-state.service.abstraction";
@@ -111,7 +111,7 @@ export class SettingsComponent implements OnInit {
    private modalService: ModalService,
    private themingService: AbstractThemingService,
    private settingsService: SettingsService,
-    private dialogService: DialogServiceAbstraction
+    private dialogService: DialogService
  ) {
    const isMac = this.platformUtilsService.getDevice() === DeviceType.MacOsDesktop;

@@ -300,7 +300,7 @@ export class SettingsComponent implements OnInit {
      const confirmed = await this.dialogService.openSimpleDialog({
        title: { key: "warning" },
        content: { key: "neverLockWarning" },
-        type: SimpleDialogType.WARNING,
+        type: "warning",
      });

      if (!confirmed) {
@@ -336,7 +336,7 @@ export class SettingsComponent implements OnInit {
      const confirmed = await this.dialogService.openSimpleDialog({
        title: { key: "vaultTimeoutLogOutConfirmationTitle" },
        content: { key: "vaultTimeoutLogOutConfirmation" },
-        type: SimpleDialogType.WARNING,
+        type: "warning",
      });

      if (!confirmed) {
@@ -465,7 +465,7 @@ export class SettingsComponent implements OnInit {
      const confirm = await this.dialogService.openSimpleDialog({
        title: { key: "confirmTrayTitle" },
        content: { key: "confirmTrayDesc" },
-        type: SimpleDialogType.WARNING,
+        type: "warning",
      });

      if (confirm) {
@@ -527,7 +527,7 @@ export class SettingsComponent implements OnInit {
        content: { key: "browserIntegrationMasOnlyDesc" },
        acceptButtonText: { key: "ok" },
        cancelButtonText: null,
-        type: SimpleDialogType.WARNING,
+        type: "warning",
      });

      this.form.controls.enableBrowserIntegration.setValue(false);
@@ -538,7 +538,7 @@ export class SettingsComponent implements OnInit {
        content: { key: "browserIntegrationWindowsStoreDesc" },
        acceptButtonText: { key: "ok" },
        cancelButtonText: null,
-        type: SimpleDialogType.WARNING,
+        type: "warning",
      });

      this.form.controls.enableBrowserIntegration.setValue(false);
@@ -549,7 +549,7 @@ export class SettingsComponent implements OnInit {
        content: { key: "browserIntegrationLinuxDesc" },
        acceptButtonText: { key: "ok" },
        cancelButtonText: null,
-        type: SimpleDialogType.WARNING,
+        type: "warning",
      });

      this.form.controls.enableBrowserIntegration.setValue(false);
--- a/apps/desktop/src/app/app.component.ts
+++ b/apps/desktop/src/app/app.component.ts
@@ -15,7 +15,6 @@ import { IndividualConfig, ToastrService } from "ngx-toastr";
 import { firstValueFrom, Subject, takeUntil } from "rxjs";

 import { ModalRef } from "@bitwarden/angular/components/modal/modal.ref";
-import { DialogServiceAbstraction, SimpleDialogType } from "@bitwarden/angular/services/dialog";
 import { ModalService } from "@bitwarden/angular/services/modal.service";
 import { EventUploadService } from "@bitwarden/common/abstractions/event/event-upload.service";
 import { NotificationsService } from "@bitwarden/common/abstractions/notifications.service";
@@ -43,6 +42,7 @@ import { CollectionService } from "@bitwarden/common/vault/abstractions/collecti
 import { InternalFolderService } from "@bitwarden/common/vault/abstractions/folder/folder.service.abstraction";
 import { SyncService } from "@bitwarden/common/vault/abstractions/sync/sync.service.abstraction";
 import { CipherType } from "@bitwarden/common/vault/enums/cipher-type";
+import { DialogService } from "@bitwarden/components";

 import { DeleteAccountComponent } from "../auth/delete-account.component";
 import { LoginApprovalComponent } from "../auth/login/login-approval.component";
@@ -138,7 +138,7 @@ export class AppComponent implements OnInit, OnDestroy {
    private modalService: ModalService,
    private keyConnectorService: KeyConnectorService,
    private configService: ConfigServiceAbstraction,
-    private dialogService: DialogServiceAbstraction
+    private dialogService: DialogService
  ) {}

  ngOnInit() {
@@ -246,7 +246,7 @@ export class AppComponent implements OnInit, OnDestroy {
                this.i18nService.t("yourAccountsFingerprint") + ":\n" + fingerprint.join("-"),
              acceptButtonText: { key: "learnMore" },
              cancelButtonText: { key: "close" },
-              type: SimpleDialogType.INFO,
+              type: "info",
            });

            if (result) {
@@ -281,7 +281,7 @@ export class AppComponent implements OnInit, OnDestroy {
              title: { key: "premiumRequired" },
              content: { key: "premiumRequiredDesc" },
              acceptButtonText: { key: "learnMore" },
-              type: SimpleDialogType.SUCCESS,
+              type: "success",
            });
            if (premiumConfirmed) {
              await this.openModal<PremiumComponent>(PremiumComponent, this.premiumRef);
@@ -293,7 +293,7 @@ export class AppComponent implements OnInit, OnDestroy {
              title: { key: "emailVerificationRequired" },
              content: { key: "emailVerificationRequiredDesc" },
              acceptButtonText: { key: "learnMore" },
-              type: SimpleDialogType.INFO,
+              type: "info",
            });
            if (emailVerificationConfirmed) {
              this.platformUtilsService.launchUri(
--- a/apps/desktop/src/app/services/services.module.ts
+++ b/apps/desktop/src/app/services/services.module.ts
@@ -1,6 +1,5 @@
 import { APP_INITIALIZER, InjectionToken, NgModule } from "@angular/core";

-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import {
  SECURE_STORAGE,
  STATE_FACTORY,
@@ -40,6 +39,7 @@ import { SystemService } from "@bitwarden/common/platform/services/system.servic
 import { PasswordGenerationServiceAbstraction } from "@bitwarden/common/tools/generator/password";
 import { CipherService as CipherServiceAbstraction } from "@bitwarden/common/vault/abstractions/cipher.service";
 import { PasswordRepromptService as PasswordRepromptServiceAbstraction } from "@bitwarden/common/vault/abstractions/password-reprompt.service";
+import { DialogService } from "@bitwarden/components";

 import { LoginGuard } from "../../auth/guards/login.guard";
 import { Account } from "../../models/account";
@@ -52,7 +52,6 @@ import { ElectronRendererStorageService } from "../../platform/services/electron
 import { ElectronStateService } from "../../platform/services/electron-state.service";
 import { ElectronStateService as ElectronStateServiceAbstraction } from "../../platform/services/electron-state.service.abstraction";
 import { I18nService } from "../../platform/services/i18n.service";
-import { ElectronDialogService } from "../../services/electron-dialog.service";
 import { EncryptedMessageHandlerService } from "../../services/encrypted-message-handler.service";
 import { NativeMessageHandlerService } from "../../services/native-message-handler.service";
 import { NativeMessagingService } from "../../services/native-messaging.service";
@@ -73,6 +72,7 @@ const RELOAD_CALLBACK = new InjectionToken<() => any>("RELOAD_CALLBACK");
    NativeMessagingService,
    SearchBarService,
    LoginGuard,
+    DialogService,
    {
      provide: APP_INITIALIZER,
      useFactory: (initService: InitService) => initService.init(),
@@ -178,10 +178,6 @@ const RELOAD_CALLBACK = new InjectionToken<() => any>("RELOAD_CALLBACK");
      useClass: LoginService,
      deps: [StateServiceAbstraction],
    },
-    {
-      provide: DialogServiceAbstraction,
-      useClass: ElectronDialogService,
-    },
    {
      provide: CryptoServiceAbstraction,
      useClass: ElectronCryptoService,
--- a/apps/desktop/src/app/tools/export/export.component.ts
+++ b/apps/desktop/src/app/tools/export/export.component.ts
@@ -1,9 +1,6 @@
-import * as os from "os";
-
 import { Component, OnInit } from "@angular/core";
 import { UntypedFormBuilder } from "@angular/forms";

-import { DialogServiceAbstraction, SimpleDialogType } from "@bitwarden/angular/services/dialog";
 import { ExportComponent as BaseExportComponent } from "@bitwarden/angular/tools/export/components/export.component";
 import { EventCollectionService } from "@bitwarden/common/abstractions/event/event-collection.service";
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
@@ -14,6 +11,7 @@ import { FileDownloadService } from "@bitwarden/common/platform/abstractions/fil
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
+import { DialogService } from "@bitwarden/components";
 import { VaultExportServiceAbstraction } from "@bitwarden/exporter/vault-export";

 const BroadcasterSubscriptionId = "ExportComponent";
@@ -35,7 +33,7 @@ export class ExportComponent extends BaseExportComponent implements OnInit {
    private broadcasterService: BroadcasterService,
    logService: LogService,
    fileDownloadService: FileDownloadService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      cryptoService,
@@ -56,26 +54,4 @@ export class ExportComponent extends BaseExportComponent implements OnInit {
  ngOnDestroy() {
    this.broadcasterService.unsubscribe(BroadcasterSubscriptionId);
  }
-
-  async warningDialog() {
-    if (this.encryptedFormat) {
-      return await this.dialogService.openSimpleDialog({
-        title: { key: "confirmVaultExport" },
-        content:
-          this.i18nService.t("encExportKeyWarningDesc") +
-          os.EOL +
-          os.EOL +
-          this.i18nService.t("encExportAccountWarningDesc"),
-        acceptButtonText: { key: "exportVault" },
-        type: SimpleDialogType.WARNING,
-      });
-    } else {
-      return await this.dialogService.openSimpleDialog({
-        title: { key: "confirmVaultExport" },
-        content: { key: "exportWarningDesc" },
-        acceptButtonText: { key: "exportVault" },
-        type: SimpleDialogType.WARNING,
-      });
-    }
-  }
 }
--- a/apps/desktop/src/app/tools/send/add-edit.component.ts
+++ b/apps/desktop/src/app/tools/send/add-edit.component.ts
@@ -1,7 +1,6 @@
 import { DatePipe } from "@angular/common";
 import { Component } from "@angular/core";

-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { AddEditComponent as BaseAddEditComponent } from "@bitwarden/angular/tools/send/add-edit.component";
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
 import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
@@ -12,6 +11,7 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
 import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
 import { SendApiService } from "@bitwarden/common/tools/send/services/send-api.service.abstraction";
 import { SendService } from "@bitwarden/common/tools/send/services/send.service.abstraction";
+import { DialogService } from "@bitwarden/components";

@Component({
  selector: "app-send-add-edit",
@@ -29,7 +29,7 @@ export class AddEditComponent extends BaseAddEditComponent {
    policyService: PolicyService,
    logService: LogService,
    sendApiService: SendApiService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      i18nService,
--- a/apps/desktop/src/app/tools/send/send.component.ts
+++ b/apps/desktop/src/app/tools/send/send.component.ts
@@ -1,6 +1,5 @@
 import { Component, NgZone, OnDestroy, OnInit, ViewChild } from "@angular/core";

-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { SendComponent as BaseSendComponent } from "@bitwarden/angular/tools/send/send.component";
 import { SearchService } from "@bitwarden/common/abstractions/search.service";
 import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
@@ -12,6 +11,7 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
 import { SendView } from "@bitwarden/common/tools/send/models/view/send.view";
 import { SendApiService } from "@bitwarden/common/tools/send/services/send-api.service.abstraction";
 import { SendService } from "@bitwarden/common/tools/send/services/send.service.abstraction";
+import { DialogService } from "@bitwarden/components";

 import { invokeMenu, RendererMenuItem } from "../../../utils";
 import { SearchBarService } from "../../layout/search/search-bar.service";
@@ -48,7 +48,7 @@ export class SendComponent extends BaseSendComponent implements OnInit, OnDestro
    private searchBarService: SearchBarService,
    logService: LogService,
    sendApiService: SendApiService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      sendService,
--- a/apps/desktop/src/auth/lock.component.ts
+++ b/apps/desktop/src/auth/lock.component.ts
@@ -3,7 +3,6 @@ import { ActivatedRoute, Router } from "@angular/router";
 import { ipcRenderer } from "electron";

 import { LockComponent as BaseLockComponent } from "@bitwarden/angular/auth/components/lock.component";
-import { DialogServiceAbstraction, SimpleDialogType } from "@bitwarden/angular/services/dialog";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { VaultTimeoutService } from "@bitwarden/common/abstractions/vaultTimeout/vaultTimeout.service";
 import { VaultTimeoutSettingsService } from "@bitwarden/common/abstractions/vaultTimeout/vaultTimeoutSettings.service";
@@ -19,6 +18,7 @@ import { LogService } from "@bitwarden/common/platform/abstractions/log.service"
 import { MessagingService } from "@bitwarden/common/platform/abstractions/messaging.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { PasswordStrengthServiceAbstraction } from "@bitwarden/common/tools/password-strength";
+import { DialogService } from "@bitwarden/components";

 import { ElectronStateService } from "../platform/services/electron-state.service.abstraction";
 import { BiometricStorageAction, BiometricMessage } from "../types/biometric-message";
@@ -52,7 +52,7 @@ export class LockComponent extends BaseLockComponent {
    passwordStrengthService: PasswordStrengthServiceAbstraction,
    logService: LogService,
    keyConnectorService: KeyConnectorService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      router,
@@ -155,7 +155,7 @@ export class LockComponent extends BaseLockComponent {
      const response = await this.dialogService.openSimpleDialog({
        title: { key: "windowsBiometricUpdateWarningTitle" },
        content: { key: "windowsBiometricUpdateWarning" },
-        type: SimpleDialogType.WARNING,
+        type: "warning",
      });

      await this.stateService.setBiometricRequirePasswordOnStart(response);
--- a/apps/desktop/src/auth/register.component.ts
+++ b/apps/desktop/src/auth/register.component.ts
@@ -4,7 +4,6 @@ import { Router } from "@angular/router";

 import { RegisterComponent as BaseRegisterComponent } from "@bitwarden/angular/components/register.component";
 import { FormValidationErrorsService } from "@bitwarden/angular/platform/abstractions/form-validation-errors.service";
-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { AuditService } from "@bitwarden/common/abstractions/audit.service";
 import { AuthService } from "@bitwarden/common/auth/abstractions/auth.service";
@@ -16,6 +15,7 @@ import { LogService } from "@bitwarden/common/platform/abstractions/log.service"
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
 import { PasswordGenerationServiceAbstraction } from "@bitwarden/common/tools/generator/password";
+import { DialogService } from "@bitwarden/components";

 const BroadcasterSubscriptionId = "RegisterComponent";

@@ -40,7 +40,7 @@ export class RegisterComponent extends BaseRegisterComponent implements OnInit,
    private ngZone: NgZone,
    logService: LogService,
    auditService: AuditService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      formValidationErrorService,
--- a/apps/desktop/src/auth/set-password.component.ts
+++ b/apps/desktop/src/auth/set-password.component.ts
@@ -2,7 +2,6 @@ import { Component, NgZone, OnDestroy } from "@angular/core";
 import { ActivatedRoute, Router } from "@angular/router";

 import { SetPasswordComponent as BaseSetPasswordComponent } from "@bitwarden/angular/components/set-password.component";
-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { OrganizationUserService } from "@bitwarden/common/abstractions/organization-user/organization-user.service";
 import { OrganizationApiServiceAbstraction } from "@bitwarden/common/admin-console/abstractions/organization/organization-api.service.abstraction";
@@ -16,6 +15,7 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
 import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
 import { PasswordGenerationServiceAbstraction } from "@bitwarden/common/tools/generator/password";
 import { SyncService } from "@bitwarden/common/vault/abstractions/sync/sync.service.abstraction";
+import { DialogService } from "@bitwarden/components";

 const BroadcasterSubscriptionId = "SetPasswordComponent";

@@ -41,7 +41,7 @@ export class SetPasswordComponent extends BaseSetPasswordComponent implements On
    stateService: StateService,
    organizationApiService: OrganizationApiServiceAbstraction,
    organizationUserService: OrganizationUserService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      i18nService,
--- a/apps/desktop/src/services/electron-dialog.service.ts
+++ b/apps/desktop/src/services/electron-dialog.service.ts
@@ -1,62 +0,0 @@
-import { ipcRenderer } from "electron";
-
-import {
-  DialogService,
-  SimpleDialogOptions,
-  SimpleDialogType,
-} from "@bitwarden/angular/services/dialog";
-
-// Electron supports a limited set of dialog types
-// https://www.electronjs.org/docs/latest/api/dialog#dialogshowmessageboxbrowserwindow-options
-const electronTypeMap: Record<SimpleDialogType, string> = {
-  [SimpleDialogType.PRIMARY]: "info",
-  [SimpleDialogType.SUCCESS]: "info",
-  [SimpleDialogType.INFO]: "info",
-  [SimpleDialogType.WARNING]: "warning",
-  [SimpleDialogType.DANGER]: "error",
-};
-
-export class ElectronDialogService extends DialogService {
-  async openSimpleDialog(options: SimpleDialogOptions) {
-    const defaultCancel =
-      options.cancelButtonText === undefined
-        ? options.acceptButtonText == null
-          ? "no"
-          : "cancel"
-        : null;
-
-    return this.legacyShowDialog(
-      this.translate(options.content),
-      this.translate(options.title),
-      this.translate(options.acceptButtonText, "yes"),
-      this.translate(options.cancelButtonText, defaultCancel),
-      options.type
-    );
-  }
-
-  private async legacyShowDialog(
-    body: string,
-    title?: string,
-    confirmText?: string,
-    cancelText?: string,
-    type?: SimpleDialogType
-  ) {
-    const buttons = [confirmText == null ? this.i18nService.t("ok") : confirmText];
-    if (cancelText != null) {
-      buttons.push(cancelText);
-    }
-
-    const result = await ipcRenderer.invoke("showMessageBox", {
-      type: electronTypeMap[type] ?? "none",
-      title: title,
-      message: title,
-      detail: body,
-      buttons: buttons,
-      cancelId: buttons.length === 2 ? 1 : null,
-      defaultId: 0,
-      noLink: true,
-    });
-
-    return Promise.resolve(result.response === 0);
-  }
-}
--- a/apps/desktop/src/vault/app/accounts/premium.component.ts
+++ b/apps/desktop/src/vault/app/accounts/premium.component.ts
@@ -1,6 +1,5 @@
 import { Component } from "@angular/core";

-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { PremiumComponent as BasePremiumComponent } from "@bitwarden/angular/vault/components/premium.component";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
@@ -8,6 +7,7 @@ import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.servic
 import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
+import { DialogService } from "@bitwarden/components";

@Component({
  selector: "app-premium",
@@ -20,7 +20,7 @@ export class PremiumComponent extends BasePremiumComponent {
    apiService: ApiService,
    logService: LogService,
    stateService: StateService,
-    dialogService: DialogServiceAbstraction,
+    dialogService: DialogService,
    environmentService: EnvironmentService
  ) {
    super(
--- a/apps/desktop/src/vault/app/vault/add-edit.component.ts
+++ b/apps/desktop/src/vault/app/vault/add-edit.component.ts
@@ -1,7 +1,6 @@
 import { Component, NgZone, OnChanges, OnDestroy, ViewChild } from "@angular/core";
 import { NgForm } from "@angular/forms";

-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { AddEditComponent as BaseAddEditComponent } from "@bitwarden/angular/vault/components/add-edit.component";
 import { AuditService } from "@bitwarden/common/abstractions/audit.service";
 import { EventCollectionService } from "@bitwarden/common/abstractions/event/event-collection.service";
@@ -18,6 +17,7 @@ import { CipherService } from "@bitwarden/common/vault/abstractions/cipher.servi
 import { CollectionService } from "@bitwarden/common/vault/abstractions/collection.service";
 import { FolderService } from "@bitwarden/common/vault/abstractions/folder/folder.service.abstraction";
 import { PasswordRepromptService } from "@bitwarden/common/vault/abstractions/password-reprompt.service";
+import { DialogService } from "@bitwarden/components";

 const BroadcasterSubscriptionId = "AddEditComponent";

@@ -45,7 +45,7 @@ export class AddEditComponent extends BaseAddEditComponent implements OnChanges,
    logService: LogService,
    organizationService: OrganizationService,
    sendApiService: SendApiService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      cipherService,
--- a/apps/desktop/src/vault/app/vault/attachments.component.ts
+++ b/apps/desktop/src/vault/app/vault/attachments.component.ts
@@ -1,6 +1,5 @@
 import { Component } from "@angular/core";

-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { AttachmentsComponent as BaseAttachmentsComponent } from "@bitwarden/angular/vault/components/attachments.component";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { CryptoService } from "@bitwarden/common/platform/abstractions/crypto.service";
@@ -10,6 +9,7 @@ import { LogService } from "@bitwarden/common/platform/abstractions/log.service"
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
 import { CipherService } from "@bitwarden/common/vault/abstractions/cipher.service";
+import { DialogService } from "@bitwarden/components";

@Component({
  selector: "app-vault-attachments",
@@ -25,7 +25,7 @@ export class AttachmentsComponent extends BaseAttachmentsComponent {
    logService: LogService,
    stateService: StateService,
    fileDownloadService: FileDownloadService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      cipherService,
--- a/apps/desktop/src/vault/app/vault/folder-add-edit.component.ts
+++ b/apps/desktop/src/vault/app/vault/folder-add-edit.component.ts
@@ -1,13 +1,13 @@
 import { Component } from "@angular/core";
 import { FormBuilder } from "@angular/forms";

-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { FolderAddEditComponent as BaseFolderAddEditComponent } from "@bitwarden/angular/vault/components/folder-add-edit.component";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { FolderApiServiceAbstraction } from "@bitwarden/common/vault/abstractions/folder/folder-api.service.abstraction";
 import { FolderService } from "@bitwarden/common/vault/abstractions/folder/folder.service.abstraction";
+import { DialogService } from "@bitwarden/components";

@Component({
  selector: "app-folder-add-edit",
@@ -20,7 +20,7 @@ export class FolderAddEditComponent extends BaseFolderAddEditComponent {
    i18nService: I18nService,
    platformUtilsService: PlatformUtilsService,
    logService: LogService,
-    dialogService: DialogServiceAbstraction,
+    dialogService: DialogService,
    formBuilder: FormBuilder
  ) {
    super(
--- a/apps/desktop/src/vault/app/vault/vault.component.ts
+++ b/apps/desktop/src/vault/app/vault/vault.component.ts
@@ -11,7 +11,6 @@ import { ActivatedRoute, Router } from "@angular/router";
 import { first } from "rxjs/operators";

 import { ModalRef } from "@bitwarden/angular/components/modal/modal.ref";
-import { DialogServiceAbstraction, SimpleDialogType } from "@bitwarden/angular/services/dialog";
 import { ModalService } from "@bitwarden/angular/services/modal.service";
 import { VaultFilter } from "@bitwarden/angular/vault/vault-filter/models/vault-filter.model";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
@@ -29,6 +28,7 @@ import { CipherRepromptType } from "@bitwarden/common/vault/enums/cipher-repromp
 import { CipherType } from "@bitwarden/common/vault/enums/cipher-type";
 import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
 import { FolderView } from "@bitwarden/common/vault/models/view/folder.view";
+import { DialogService } from "@bitwarden/components";

 import { SearchBarService } from "../../../app/layout/search/search-bar.service";
 import { GeneratorComponent } from "../../../app/tools/generator.component";
@@ -102,7 +102,7 @@ export class VaultComponent implements OnInit, OnDestroy {
    private stateService: StateService,
    private searchBarService: SearchBarService,
    private apiService: ApiService,
-    private dialogService: DialogServiceAbstraction
+    private dialogService: DialogService
  ) {}

  async ngOnInit() {
@@ -684,7 +684,7 @@ export class VaultComponent implements OnInit, OnDestroy {
    const confirmed = await this.dialogService.openSimpleDialog({
      title: { key: "unsavedChangesTitle" },
      content: { key: "unsavedChangesConfirmation" },
-      type: SimpleDialogType.WARNING,
+      type: "warning",
    });
    return !confirmed;
  }
--- a/apps/desktop/src/vault/app/vault/view.component.ts
+++ b/apps/desktop/src/vault/app/vault/view.component.ts
@@ -7,7 +7,6 @@ import {
  Output,
 } from "@angular/core";

-import { DialogServiceAbstraction } from "@bitwarden/angular/services/dialog";
 import { ViewComponent as BaseViewComponent } from "@bitwarden/angular/vault/components/view.component";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { AuditService } from "@bitwarden/common/abstractions/audit.service";
@@ -26,6 +25,7 @@ import { CipherService } from "@bitwarden/common/vault/abstractions/cipher.servi
 import { FolderService } from "@bitwarden/common/vault/abstractions/folder/folder.service.abstraction";
 import { PasswordRepromptService } from "@bitwarden/common/vault/abstractions/password-reprompt.service";
 import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view";
+import { DialogService } from "@bitwarden/components";

 const BroadcasterSubscriptionId = "ViewComponent";

@@ -55,7 +55,7 @@ export class ViewComponent extends BaseViewComponent implements OnChanges {
    logService: LogService,
    stateService: StateService,
    fileDownloadService: FileDownloadService,
-    dialogService: DialogServiceAbstraction
+    dialogService: DialogService
  ) {
    super(
      cipherService,