Changes suggested by Thomas R

2026-02-12 06:23:38 +00:00 · 2022-08-01 18:21:47 -04:00
parent 370cbacd3e
commit 518fd23b43
13 changed files with 140 additions and 204 deletions
--- a/apps/desktop/src/app/vault/export.component.ts
+++ b/apps/desktop/src/app/vault/export.component.ts
@@ -4,8 +4,7 @@ import { Component, OnInit } from "@angular/core";
 import { FormBuilder } from "@angular/forms";

 import { ExportComponent as BaseExportComponent } from "@bitwarden/angular/components/export.component";
-import { ModalConfig, ModalService } from "@bitwarden/angular/services/modal.service";
-import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { ModalService } from "@bitwarden/angular/services/modal.service";
 import { BroadcasterService } from "@bitwarden/common/abstractions/broadcaster.service";
 import { CryptoService } from "@bitwarden/common/abstractions/crypto.service";
 import { EventService } from "@bitwarden/common/abstractions/event.service";
@@ -15,7 +14,6 @@ import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { PolicyService } from "@bitwarden/common/abstractions/policy.service";
-import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service";

 const BroadcasterSubscriptionId = "ExportComponent";
@@ -35,12 +33,9 @@ export class ExportComponent extends BaseExportComponent implements OnInit {
    userVerificationService: UserVerificationService,
    private broadcasterService: BroadcasterService,
    logService: LogService,
-    protected modalService: ModalService,
-    protected apiService: ApiService,
-    protected stateService: StateService,
-    protected modalConfig: ModalConfig,
    formBuilder: FormBuilder,
-    fileDownloadService: FileDownloadService
+    fileDownloadService: FileDownloadService,
+    modalService: ModalService
  ) {
    super(
      cryptoService,
@@ -52,12 +47,9 @@ export class ExportComponent extends BaseExportComponent implements OnInit {
      window,
      logService,
      userVerificationService,
-      modalService,
-      apiService,
-      stateService,
-      modalConfig,
      formBuilder,
-      fileDownloadService
+      fileDownloadService,
+      modalService
    );
  }

--- a/apps/web/src/app/components/file-password-prompt.component.html
+++ b/apps/web/src/app/components/file-password-prompt.component.html
@@ -1,68 +1,54 @@
-<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmVaultImport | i18n">
  <div class="modal-dialog modal-dialog-scrollable" role="document">
-    <form
-      #form
-      (ngSubmit)="submit()"
-      [appApiAction]="formPromise"
-      [formGroup]="importForm"
-      *ngIf="importForm"
-    >
-      <div class="modal-footer">
-        <div class="form-group modal-content">
-          <div>
-            <div class="tw-text-center bwi-3x">
-              <i class="bwi bwi-exclamation-triangle text-warning"></i>
-            </div>
-
-            <h2 class="tw-text-center tw-font-semibold" id="confirmVaultImport">
-              {{ "confirmVaultImport" | i18n }}
-            </h2>
-
-            <div class="modal-body">
-              <div>
-                {{ "confirmVaultImportDesc" | i18n }}
-              </div>
-            </div>
-
-            <div class="input-group">
-              <bit-form-field>
-                <bit-label>{{ "confirmFilePassword" | i18n }}</bit-label>
-                <input
-                  bitInput
-                  required
-                  type="{{ showPassword ? 'text' : 'password' }}"
-                  formControlName="filePassword"
-                  name="filePassword"
-                  appAutofocus
-                  appInputVerbatim
-                />
-                <button
-                  bitSuffix
-                  bitButton
-                  appStopClick
-                  appA11yTitle="{{ 'toggleVisibility' | i18n }}"
-                  [attr.aria-pressed]="showPassword"
-                  (click)="togglePassword()"
-                >
-                  <i
-                    class="bwi bwi-lg"
-                    aria-hidden="true"
-                    [ngClass]="{ 'bwi-eye': !showPassword, 'bwi-eye-slash': showPassword }"
-                  ></i>
-                </button>
-              </bit-form-field>
-            </div>
+    <form #form (ngSubmit)="submit()" [appApiAction]="formPromise" *ngIf="filePassword">
+      <div class="form-group modal-content">
+        <div class="modal-header">
+          <div class="tw-text-center bwi-3x">
+            <i class="bwi bwi-exclamation-triangle text-warning"></i>
          </div>
-          <div class="modal-footer">
-            <div class="modal-footer-content">
-              <div class="tw-mt-4">
-                <button bitButton buttonType="primary" type="submit" appBlurClick>
-                  <span>{{ "importData" | i18n }}</span>
-                </button>
-                <button bitButton buttonType="secondary" type="button" data-dismiss="modal">
-                  {{ "cancel" | i18n }}
-                </button>
-              </div>
+          <h2 class="tw-text-center tw-font-semibold" id="confirmVaultImport">
+            {{ "confirmVaultImport" | i18n }}
+          </h2>
+        </div>
+        <div class="modal-body">
+          {{ "confirmVaultImportDesc" | i18n }}
+          <div class="input-group">
+            <bit-form-field>
+              <bit-label>{{ "confirmFilePassword" | i18n }}</bit-label>
+              <input
+                bitInput
+                required
+                type="{{ showPassword ? 'text' : 'password' }}"
+                name="filePassword"
+                appAutofocus
+                appInputVerbatim
+              />
+              <button
+                bitSuffix
+                bitButton
+                appStopClick
+                appA11yTitle="{{ 'toggleVisibility' | i18n }}"
+                [attr.aria-pressed]="showPassword"
+                (click)="togglePassword()"
+              >
+                <i
+                  class="bwi bwi-lg"
+                  aria-hidden="true"
+                  [ngClass]="{ 'bwi-eye': !showPassword, 'bwi-eye-slash': showPassword }"
+                ></i>
+              </button>
+            </bit-form-field>
+          </div>
+        </div>
+        <div class="modal-footer">
+          <div class="modal-footer-content">
+            <div class="tw-mt-4">
+              <button bitButton buttonType="primary" type="submit" appBlurClick>
+                <span>{{ "importData" | i18n }}</span>
+              </button>
+              <button bitButton buttonType="secondary" type="button" data-dismiss="modal">
+                {{ "cancel" | i18n }}
+              </button>
            </div>
          </div>
        </div>
--- a/apps/web/src/app/components/user-verification-prompt.component.html
+++ b/apps/web/src/app/components/user-verification-prompt.component.html
@@ -1,28 +1,23 @@
 <div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
  <div class="modal-dialog modal-dialog-scrollable" role="document">
    <form class="modal-content" #form (ngSubmit)="submit()">
-      <div class="tw-text-center bwi-3x">
-        <i class="bwi bwi-exclamation-triangle text-warning"></i>
+      <div class="modal-header">
+        <div class="tw-text-center bwi-3x">
+          <i class="bwi bwi-exclamation-triangle text-warning"></i>
+        </div>
+        <h2 class="tw-text-center tw-font-semibold" id="modalTitle | i18n">
+          {{ modalTitle | i18n }}
+        </h2>
      </div>
-
-      <h2 class="tw-text-center tw-font-semibold" id="confirmUserTitle">
-        {{ modalTitle | i18n }}
-      </h2>
-
      <div class="modal-body">
        <div>
          {{ confirmDescription | i18n }}
        </div>
      </div>
-
      <div class="modal-footer">
        <div class="modal-footer-content">
-          <div [formGroup]="myGroup">
-            <div class="form-group">
-              <app-user-verification ngDefaultControl formControlName="secret" name="secret">
-              </app-user-verification>
-            </div>
-          </div>
+          <app-user-verification ngDefaultControl [formControl]="secret" name="secret">
+          </app-user-verification>
        </div>
        <button bitButton buttonType="primary" type="submit" appBlurClick>
          <span>{{ confirmButtonText | i18n }}</span>
--- a/apps/web/src/app/modules/loose-components.module.ts
+++ b/apps/web/src/app/modules/loose-components.module.ts
@@ -425,7 +425,6 @@ import { OrganizationBadgeModule } from "./vault/modules/organization-badge/orga
    PasswordGeneratorHistoryComponent,
    PasswordGeneratorPolicyComponent,
    PasswordRepromptComponent,
-    FilePasswordPromptComponent,
    PaymentMethodComponent,
    PersonalOwnershipPolicyComponent,
    PreferencesComponent,
--- a/apps/web/src/app/organizations/tools/import-export/org-export.component.ts
+++ b/apps/web/src/app/organizations/tools/import-export/org-export.component.ts
@@ -2,8 +2,7 @@ import { Component } from "@angular/core";
 import { FormBuilder } from "@angular/forms";
 import { ActivatedRoute } from "@angular/router";

-import { ModalConfig, ModalService } from "@bitwarden/angular/services/modal.service";
-import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { ModalService } from "@bitwarden/angular/services/modal.service";
 import { CryptoService } from "@bitwarden/common/abstractions/crypto.service";
 import { EventService } from "@bitwarden/common/abstractions/event.service";
 import { ExportService } from "@bitwarden/common/abstractions/export.service";
@@ -12,7 +11,6 @@ import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { PolicyService } from "@bitwarden/common/abstractions/policy.service";
-import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service";

 import { ExportComponent } from "../../../tools/import-export/export.component";
@@ -32,12 +30,9 @@ export class OrganizationExportComponent extends ExportComponent {
    policyService: PolicyService,
    logService: LogService,
    userVerificationService: UserVerificationService,
-    modalService: ModalService,
-    apiService: ApiService,
-    stateService: StateService,
-    modalConfig: ModalConfig,
    formBuilder: FormBuilder,
-    fileDownloadService: FileDownloadService
+    fileDownloadService: FileDownloadService,
+    modalService: ModalService
  ) {
    super(
      cryptoService,
@@ -48,12 +43,9 @@ export class OrganizationExportComponent extends ExportComponent {
      policyService,
      logService,
      userVerificationService,
-      modalService,
-      apiService,
-      stateService,
-      modalConfig,
      formBuilder,
-      fileDownloadService
+      fileDownloadService,
+      modalService
    );
  }

--- a/apps/web/src/app/organizations/tools/import-export/org-import.component.ts
+++ b/apps/web/src/app/organizations/tools/import-export/org-import.component.ts
@@ -4,7 +4,6 @@ import { ActivatedRoute, Router } from "@angular/router";
 import { ModalService } from "@bitwarden/angular/services/modal.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { ImportService } from "@bitwarden/common/abstractions/import.service";
-import { KeyConnectorService } from "@bitwarden/common/abstractions/keyConnector.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
 import { OrganizationService } from "@bitwarden/common/abstractions/organization.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
@@ -28,8 +27,7 @@ export class OrganizationImportComponent extends ImportComponent {
    policyService: PolicyService,
    private organizationService: OrganizationService,
    logService: LogService,
-    modalService: ModalService,
-    keyConnectorService: KeyConnectorService
+    modalService: ModalService
  ) {
    super(
      i18nService,
@@ -38,8 +36,7 @@ export class OrganizationImportComponent extends ImportComponent {
      platformUtilsService,
      policyService,
      logService,
-      modalService,
-      keyConnectorService
+      modalService
    );
  }

--- a/apps/web/src/app/tools/import-export/export.component.html
+++ b/apps/web/src/app/tools/import-export/export.component.html
@@ -41,8 +41,8 @@
                type="radio"
                class="radio"
                name="fileEncryptionType"
-                id="1"
-                [value]="0"
+                id="AccountEncrypted"
+                [value]="encryptedExportType.AccountEncrypted"
                formControlName="fileEncryptionType"
              />
            </div>
@@ -61,8 +61,8 @@
                type="radio"
                class="radio"
                name="fileEncryptionType"
-                id="2"
-                [value]="1"
+                id="FileEncrypted"
+                [value]="encryptedExportType.FileEncrypted"
                formControlName="fileEncryptionType"
              />
            </div>
@@ -79,7 +79,7 @@
        </div>
        <br />

-        <ng-container *ngIf="fileEncryptionType == 1">
+        <ng-container *ngIf="fileEncryptionType == encryptedExportType.FileEncrypted">
          <div class="input-group">
            <bit-form-field>
              <bit-label>{{ "filePassword" | i18n }}</bit-label>
@@ -87,7 +87,8 @@
                bitInput
                required
                type="{{ showPassword ? 'text' : 'password' }}"
-                formControlName="password"
+                id="filePassword"
+                formControlName="filePassword"
                name="password"
              />

@@ -98,13 +99,13 @@
                  buttonType="secondary"
                  appStopClick
                  appA11yTitle="{{ 'toggleVisibility' | i18n }}"
-                  [attr.aria-pressed]="showPassword"
-                  (click)="togglePassword()"
+                  [attr.aria-pressed]="showFilePassword"
+                  (click)="toggleFilePassword()"
                >
                  <i
                    class="bwi bwi-lg"
                    aria-hidden="true"
-                    [ngClass]="{ 'bwi-eye': !showPassword, 'bwi-eye-slash': showPassword }"
+                    [ngClass]="{ 'bwi-eye': !showFilePassword, 'bwi-eye-slash': showFilePassword }"
                  ></i>
                </button>
              </div>
@@ -122,8 +123,9 @@
                bitInput
                required
                type="{{ showConfirmPassword ? 'text' : 'password' }}"
-                formControlName="confirmPassword"
-                name="confirmPassword"
+                id="confirmFilePassword"
+                formControlName="confirmFilePassword"
+                name="confirmFilePassword"
              />

              <div class="input-group-append">
@@ -133,15 +135,15 @@
                  buttonType="secondary"
                  appStopClick
                  appA11yTitle="{{ 'toggleVisibility' | i18n }}"
-                  [attr.aria-pressed]="showConfirmPassword"
-                  (click)="toggleConfirmPassword()"
+                  [attr.aria-pressed]="showConfirmFilePassword"
+                  (click)="toggleConfirmFilePassword()"
                >
                  <i
                    class="bwi bwi-lg"
                    aria-hidden="true"
                    [ngClass]="{
-                      'bwi-eye': !showConfirmPassword,
-                      'bwi-eye-slash': showConfirmPassword
+                      'bwi-eye': !showConfirmFilePassword,
+                      'bwi-eye-slash': showConfirmFilePassword
                    }"
                  ></i>
                </button>
--- a/apps/web/src/app/tools/import-export/export.component.ts
+++ b/apps/web/src/app/tools/import-export/export.component.ts
@@ -2,8 +2,7 @@ import { Component } from "@angular/core";
 import { FormBuilder } from "@angular/forms";

 import { ExportComponent as BaseExportComponent } from "@bitwarden/angular/components/export.component";
-import { ModalConfig, ModalService } from "@bitwarden/angular/services/modal.service";
-import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { ModalService } from "@bitwarden/angular/services/modal.service";
 import { CryptoService } from "@bitwarden/common/abstractions/crypto.service";
 import { EventService } from "@bitwarden/common/abstractions/event.service";
 import { ExportService } from "@bitwarden/common/abstractions/export.service";
@@ -12,7 +11,6 @@ import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { PolicyService } from "@bitwarden/common/abstractions/policy.service";
-import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service";
 import { EncryptedExportType } from "@bitwarden/common/enums/EncryptedExportType";

@@ -24,8 +22,9 @@ import { UserVerificationPromptComponent } from "src/app/components/user-verific
 })
 export class ExportComponent extends BaseExportComponent {
  organizationId: string;
-  showPassword: boolean;
-  showConfirmPassword: boolean;
+  showFilePassword: boolean;
+  showConfirmFilePassword: boolean;
+  encryptedExportType = EncryptedExportType;

  constructor(
    cryptoService: CryptoService,
@@ -36,12 +35,9 @@ export class ExportComponent extends BaseExportComponent {
    policyService: PolicyService,
    logService: LogService,
    userVerificationService: UserVerificationService,
-    modalService: ModalService,
-    apiService: ApiService,
-    stateService: StateService,
-    modalConfig: ModalConfig,
    formBuilder: FormBuilder,
-    fileDownloadService: FileDownloadService
+    fileDownloadService: FileDownloadService,
+    modalService: ModalService
  ) {
    super(
      cryptoService,
@@ -53,12 +49,9 @@ export class ExportComponent extends BaseExportComponent {
      window,
      logService,
      userVerificationService,
-      modalService,
-      apiService,
-      stateService,
-      modalConfig,
      formBuilder,
-      fileDownloadService
+      fileDownloadService,
+      modalService
    );
  }

@@ -92,14 +85,14 @@ export class ExportComponent extends BaseExportComponent {
    }
  }

-  togglePassword() {
-    this.showPassword = !this.showPassword;
-    document.getElementById("newPassword").focus();
+  toggleFilePassword() {
+    this.showFilePassword = !this.showFilePassword;
+    document.getElementById("filePassword").focus();
  }

-  toggleConfirmPassword() {
-    this.showConfirmPassword = !this.showConfirmPassword;
-    document.getElementById("newConfirmPassword").focus();
+  toggleConfirmFilePassword() {
+    this.showConfirmFilePassword = !this.showConfirmFilePassword;
+    document.getElementById("confirmFilePassword").focus();
  }

  protected saved() {
@@ -112,8 +105,8 @@ export class ExportComponent extends BaseExportComponent {
      this.fileEncryptionType == EncryptedExportType.FileEncrypted &&
      this.format == "encrypted_json"
    ) {
-      if (this.password.length > 0 || this.confirmPassword.length > 0) {
-        if (this.password != this.confirmPassword) {
+      if (this.filePassword.length > 0 || this.confirmFilePassword.length > 0) {
+        if (this.filePassword != this.confirmFilePassword) {
          this.platformUtilsService.showToast(
            "error",
            this.i18nService.t("errorOccurred"),
@@ -122,11 +115,9 @@ export class ExportComponent extends BaseExportComponent {
          return false;
        }

-        this.encryptionPassword = this.password;
        return true;
      }
    } else {
-      this.clearPasswordField();
      return true;
    }
  }
--- a/apps/web/src/app/tools/import-export/import-export.module.ts
+++ b/apps/web/src/app/tools/import-export/import-export.module.ts
@@ -7,10 +7,12 @@ import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { CipherService } from "@bitwarden/common/abstractions/cipher.service";
 import { CollectionService } from "@bitwarden/common/abstractions/collection.service";
 import { CryptoService } from "@bitwarden/common/abstractions/crypto.service";
+import { ExportService as ExportServiceAbstraction } from "@bitwarden/common/abstractions/export.service";
 import { FolderService } from "@bitwarden/common/abstractions/folder/folder.service.abstraction";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { ImportService as ImportServiceAbstraction } from "@bitwarden/common/abstractions/import.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
+import { ExportService } from "@bitwarden/common/services/export.service";
 import { ImportService } from "@bitwarden/common/services/import.service";

 import { SharedModule } from "src/app/modules/shared.module";
@@ -33,6 +35,11 @@ import { ImportComponent } from "./import.component";
  ],
  declarations: [ImportComponent, ExportComponent],
  providers: [
+    {
+      provide: ExportServiceAbstraction,
+      useClass: ExportService,
+      deps: [FolderService, CipherService, ApiService, CryptoService],
+    },
    {
      provide: ImportServiceAbstraction,
      useClass: ImportService,
--- a/apps/web/src/app/tools/import-export/import.component.ts
+++ b/apps/web/src/app/tools/import-export/import.component.ts
@@ -6,7 +6,6 @@ import Swal, { SweetAlertIcon } from "sweetalert2";
 import { ModalService } from "@bitwarden/angular/services/modal.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { ImportService } from "@bitwarden/common/abstractions/import.service";
-import { KeyConnectorService } from "@bitwarden/common/abstractions/keyConnector.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { PolicyService } from "@bitwarden/common/abstractions/policy.service";
@@ -39,8 +38,7 @@ export class ImportComponent implements OnInit {
    protected platformUtilsService: PlatformUtilsService,
    protected policyService: PolicyService,
    private logService: LogService,
-    protected modalService: ModalService,
-    protected keyConnectorService: KeyConnectorService
+    protected modalService: ModalService
  ) {}

  async ngOnInit() {
@@ -256,7 +254,6 @@ export class ImportComponent implements OnInit {
      return false;
    }

-    const result = await ref.onClosedPromise();
-    return result === true;
+    return await ref.onClosedPromise();
  }
 }
--- a/libs/angular/src/components/export.component.ts
+++ b/libs/angular/src/components/export.component.ts
@@ -1,8 +1,6 @@
 import { Directive, EventEmitter, OnInit, Output } from "@angular/core";
 import { FormBuilder } from "@angular/forms";

-import { ModalConfig, ModalService } from "@bitwarden/angular/services/modal.service";
-import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { CryptoService } from "@bitwarden/common/abstractions/crypto.service";
 import { EventService } from "@bitwarden/common/abstractions/event.service";
 import { ExportService } from "@bitwarden/common/abstractions/export.service";
@@ -11,24 +9,24 @@ import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { PolicyService } from "@bitwarden/common/abstractions/policy.service";
-import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service";
 import { EventType } from "@bitwarden/common/enums/eventType";
 import { PolicyType } from "@bitwarden/common/enums/policyType";

+import { ModalService } from "../services/modal.service";
+
@Directive()
 export class ExportComponent implements OnInit {
  @Output() onSaved = new EventEmitter();

  formPromise: Promise<string>;
  disabledByPolicy = false;
-  encryptionPassword: string;

  exportForm = this.formBuilder.group({
    format: ["json"],
    secret: [""],
-    password: [""],
-    confirmPassword: [""],
+    filePassword: [""],
+    confirmFilePassword: [""],
    fileEncryptionType: [""],
  });

@@ -48,12 +46,9 @@ export class ExportComponent implements OnInit {
    protected win: Window,
    private logService: LogService,
    private userVerificationService: UserVerificationService,
-    protected modalService: ModalService,
-    protected apiService: ApiService,
-    protected stateService: StateService,
-    protected modalConfig: ModalConfig,
    private formBuilder: FormBuilder,
-    protected fileDownloadService: FileDownloadService
+    protected fileDownloadService: FileDownloadService,
+    protected modalService: ModalService
  ) {}

  async ngOnInit() {
@@ -91,8 +86,8 @@ export class ExportComponent implements OnInit {
      this.saved();
      await this.collectEvent();
      this.exportForm.get("secret").setValue("");
-      this.exportForm.get("password").setValue("");
-      this.exportForm.get("confirmPassword").setValue("");
+      this.exportForm.get("filePassword").setValue("");
+      this.exportForm.get("confirmFilePassword").setValue("");
    } catch (e) {
      this.logService.error(e);
    }
@@ -165,9 +160,10 @@ export class ExportComponent implements OnInit {
  }

  protected getExportData() {
-    return (this.fileEncryptionType != 1 && this.password == undefined) || this.password == ""
+    return (this.fileEncryptionType != 1 && this.filePassword == undefined) ||
+      this.filePassword == ""
      ? this.exportService.getExport(this.format, null)
-      : this.exportService.getPasswordProtectedExport(this.password);
+      : this.exportService.getPasswordProtectedExport(this.filePassword);
  }

  protected getFileName(prefix?: string) {
@@ -187,20 +183,16 @@ export class ExportComponent implements OnInit {
    await this.eventService.collect(EventType.User_ClientExportedVault);
  }

-  protected clearPasswordField() {
-    this.encryptionPassword = "";
-  }
-
  get format() {
    return this.exportForm.get("format").value;
  }

-  get password() {
-    return this.exportForm.get("password").value;
+  get filePassword() {
+    return this.exportForm.get("filePassword").value;
  }

-  get confirmPassword() {
-    return this.exportForm.get("confirmPassword").value;
+  get confirmFilePassword() {
+    return this.exportForm.get("confirmFilePassword").value;
  }

  get fileEncryptionType() {
--- a/libs/angular/src/components/file-password-prompt.component.ts
+++ b/libs/angular/src/components/file-password-prompt.component.ts
@@ -1,5 +1,5 @@
 import { Directive } from "@angular/core";
-import { FormBuilder } from "@angular/forms";
+import { FormBuilder, FormControl } from "@angular/forms";

 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { ImportService } from "@bitwarden/common/abstractions/import.service";
@@ -15,12 +15,9 @@ import { ModalRef } from "./modal/modal.ref";
@Directive()
 export class FilePasswordPromptComponent {
  showPassword: boolean;
-
-  importForm = this.formBuilder.group({
-    filePassword: [""],
-    organizationId: [""],
-    fileContents: [""],
-  });
+  filePassword = new FormControl("");
+  organizationId: string;
+  fileContents: string;

  constructor(
    private modalRef: ModalRef,
@@ -30,8 +27,8 @@ export class FilePasswordPromptComponent {
    config: ModalConfig,
    protected formBuilder: FormBuilder
  ) {
-    this.importForm.get("fileContents").setValue(config.data.fileContents);
-    this.importForm.get("organizationId").setValue(config.data.organizationId);
+    this.fileContents = config.data.fileContents;
+    this.organizationId = config.data.organizationId;
  }

  togglePassword() {
@@ -41,16 +38,15 @@ export class FilePasswordPromptComponent {
  async submit() {
    const importerPassword = this.importService.getImporter(
      "bitwardenpasswordprotected",
-      this.importForm.get("organizationId").value,
-      this.importForm.get("filePassword").value
+      this.organizationId,
+      this.filePassword.value
    );

-    const formPromise = this.importService.import(
+    const passwordError = this.importService.import(
      importerPassword,
-      this.importForm.get("fileContents").value,
-      this.importForm.get("organizationId").value
+      this.fileContents,
+      this.organizationId
    );
-    const passwordError = await formPromise;

    if (passwordError != null) {
      this.platformUtilsService.showToast(
--- a/libs/angular/src/components/user-verification-prompt.component.ts
+++ b/libs/angular/src/components/user-verification-prompt.component.ts
@@ -14,14 +14,10 @@ import { ModalRef } from "./modal/modal.ref";
 */
@Directive()
 export class UserVerificationPromptComponent {
-  showPassword = false;
-  organizationId = "";
  confirmDescription = this.config.data.confirmDescription;
  confirmButtonText = this.config.data.confirmButtonText;
  modalTitle = this.config.data.modalTitle;
-  myGroup = this.formBuilder.group({
-    secret: new FormControl(),
-  });
+  secret = new FormControl();

  constructor(
    private modalRef: ModalRef,
@@ -32,16 +28,10 @@ export class UserVerificationPromptComponent {
    private i18nService: I18nService
  ) {}

-  togglePassword() {
-    this.showPassword = !this.showPassword;
-  }
-
  async submit() {
-    const secret = this.myGroup.get("secret").value;
-
    try {
      //Incorrect secret will throw an invalid password error.
-      await this.userVerificationService.verifyUser(secret);
+      await this.userVerificationService.verifyUser(this.secret.value);
    } catch (e) {
      this.platformUtilsService.showToast(
        "error",