[PM-14990] Add password prompt for ssh key import (#12105)

* Add password prompt for ssh key import

* Remove empty line

* Convert to switch statement

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

@@ -207,6 +207,21 @@
   "sshKeyGenerated": {
     "message": "A new SSH key was generated"
   },
+  "sshKeyWrongPassword": {
+    "message": "The password you entered is incorrect."
+  },
+  "importSshKey": {
+    "message": "Import"
+  },
+  "confirmSshKeyPassword": {
+    "message": "Confirm password"
+  },
+  "enterSshKeyPasswordDesc": {
+    "message": "Enter the password for the SSH key."
+  },
+  "enterSshKeyPassword": {
+    "message": "Enter password"
+  },
   "sshAgentUnlockRequired": {
     "message": "Please unlock your vault to approve the SSH key request."
   },

apps/desktop/src/vault/app/vault/add-edit.component.ts

@@ -2,6 +2,7 @@ import { DatePipe } from "@angular/common";
 import { Component, NgZone, OnChanges, OnDestroy, OnInit, ViewChild } from "@angular/core";
 import { NgForm } from "@angular/forms";
 import { sshagent as sshAgent } from "desktop_native/napi";
+import { lastValueFrom } from "rxjs";
 
 import { CollectionService } from "@bitwarden/admin-console/common";
 import { AddEditComponent as BaseAddEditComponent } from "@bitwarden/angular/vault/components/add-edit.component";
@@ -22,6 +23,7 @@ import { FolderService } from "@bitwarden/common/vault/abstractions/folder/folde
 import { CipherType } from "@bitwarden/common/vault/enums";
 import { CipherAuthorizationService } from "@bitwarden/common/vault/services/cipher-authorization.service";
 import { DialogService, ToastService } from "@bitwarden/components";
+import { SshKeyPasswordPromptComponent } from "@bitwarden/importer/ui";
 import { PasswordRepromptService } from "@bitwarden/vault";
 
 const BroadcasterSubscriptionId = "AddEditComponent";
@@ -170,33 +172,47 @@ export class AddEditComponent extends BaseAddEditComponent implements OnInit, On
     }
   }
 
-  async importSshKeyFromClipboard() {
+  async importSshKeyFromClipboard(password: string = "") {
     const key = await this.platformUtilsService.readFromClipboard();
-    const parsedKey = await ipc.platform.sshAgent.importKey(key, "");
+    const parsedKey = await ipc.platform.sshAgent.importKey(key, password);
-    if (parsedKey == null || parsedKey.status === sshAgent.SshKeyImportStatus.ParsingError) {
+    if (parsedKey == null) {
       this.toastService.showToast({
         variant: "error",
         title: "",
         message: this.i18nService.t("invalidSshKey"),
       });
       return;
-    } else if (parsedKey.status === sshAgent.SshKeyImportStatus.UnsupportedKeyType) {
+    }
+
+    switch (parsedKey.status) {
+      case sshAgent.SshKeyImportStatus.ParsingError:
+        this.toastService.showToast({
+          variant: "error",
+          title: "",
+          message: this.i18nService.t("invalidSshKey"),
+        });
+        return;
+      case sshAgent.SshKeyImportStatus.UnsupportedKeyType:
         this.toastService.showToast({
           variant: "error",
           title: "",
           message: this.i18nService.t("sshKeyTypeUnsupported"),
         });
-    } else if (
+        return;
-      parsedKey.status === sshAgent.SshKeyImportStatus.PasswordRequired ||
+      case sshAgent.SshKeyImportStatus.PasswordRequired:
-      parsedKey.status === sshAgent.SshKeyImportStatus.WrongPassword
+      case sshAgent.SshKeyImportStatus.WrongPassword:
-    ) {
+        if (password !== "") {
           this.toastService.showToast({
             variant: "error",
             title: "",
-        message: this.i18nService.t("sshKeyPasswordUnsupported"),
+            message: this.i18nService.t("sshKeyWrongPassword"),
           });
-      return;
         } else {
+          password = await this.getSshKeyPassword();
+          await this.importSshKeyFromClipboard(password);
+        }
+        return;
+      default:
         this.cipher.sshKey.privateKey = parsedKey.sshKey.privateKey;
         this.cipher.sshKey.publicKey = parsedKey.sshKey.publicKey;
         this.cipher.sshKey.keyFingerprint = parsedKey.sshKey.keyFingerprint;
@@ -208,6 +224,14 @@ export class AddEditComponent extends BaseAddEditComponent implements OnInit, On
     }
   }
 
+  async getSshKeyPassword(): Promise<string> {
+    const dialog = this.dialogService.open<string>(SshKeyPasswordPromptComponent, {
+      ariaModal: true,
+    });
+
+    return await lastValueFrom(dialog.closed);
+  }
+
   async typeChange() {
     if (this.cipher.type === CipherType.SshKey) {
       await this.generateSshKey();

libs/importer/src/components/dialog/index.ts

@@ -1,3 +1,4 @@
 export * from "./import-error-dialog.component";
 export * from "./import-success-dialog.component";
 export * from "./file-password-prompt.component";
+export * from "./sshkey-password-prompt.component";

libs/importer/src/components/dialog/sshkey-password-prompt.component.html

@@ -0,0 +1,31 @@
+<form [formGroup]="formGroup" [bitSubmit]="submit">
+  <bit-dialog>
+    <span bitDialogTitle>
+      {{ "enterSshKeyPassword" | i18n }}
+    </span>
+
+    <div bitDialogContent>
+      {{ "enterSshKeyPasswordDesc" | i18n }}
+      <bit-form-field class="tw-mt-6">
+        <bit-label>{{ "confirmSshKeyPassword" | i18n }}</bit-label>
+        <input
+          bitInput
+          type="password"
+          formControlName="sshKeyPassword"
+          appAutofocus
+          appInputVerbatim
+        />
+        <button type="button" bitSuffix bitIconButton bitPasswordInputToggle></button>
+      </bit-form-field>
+    </div>
+
+    <ng-container bitDialogFooter>
+      <button bitButton buttonType="primary" type="submit">
+        <span>{{ "importSshKey" | i18n }}</span>
+      </button>
+      <button bitButton bitDialogClose buttonType="secondary" type="button">
+        <span>{{ "cancel" | i18n }}</span>
+      </button>
+    </ng-container>
+  </bit-dialog>
+</form>

libs/importer/src/components/dialog/sshkey-password-prompt.component.ts

@@ -0,0 +1,46 @@
+import { DialogRef } from "@angular/cdk/dialog";
+import { CommonModule } from "@angular/common";
+import { Component } from "@angular/core";
+import { FormBuilder, ReactiveFormsModule, Validators } from "@angular/forms";
+
+import { JslibModule } from "@bitwarden/angular/jslib.module";
+import {
+  AsyncActionsModule,
+  ButtonModule,
+  DialogModule,
+  FormFieldModule,
+  IconButtonModule,
+} from "@bitwarden/components";
+
+@Component({
+  templateUrl: "sshkey-password-prompt.component.html",
+  standalone: true,
+  imports: [
+    CommonModule,
+    JslibModule,
+    DialogModule,
+    FormFieldModule,
+    AsyncActionsModule,
+    ButtonModule,
+    IconButtonModule,
+    ReactiveFormsModule,
+  ],
+})
+export class SshKeyPasswordPromptComponent {
+  protected formGroup = this.formBuilder.group({
+    sshKeyPassword: ["", Validators.required],
+  });
+
+  constructor(
+    public dialogRef: DialogRef,
+    protected formBuilder: FormBuilder,
+  ) {}
+
+  submit = () => {
+    this.formGroup.markAsTouched();
+    if (!this.formGroup.valid) {
+      return;
+    }
+    this.dialogRef.close(this.formGroup.value.sshKeyPassword);
+  };
+}