[PM-4226] Create login item on the fly and add passkey item to it (#6552)

* Use the + button to ad an item and then save a passkey on the added item

* switch if to tenary

apps/browser/src/vault/fido2/browser-fido2-user-interface.service.ts

@@ -42,7 +42,8 @@ export function fido2PopoutSessionData$() {
     map((queryParams) => ({
       isFido2Session: queryParams.sessionId != null,
       sessionId: queryParams.sessionId as string,
-      fallbackSupported: queryParams.fallbackSupported as boolean,
+      fallbackSupported: queryParams.fallbackSupported === "true",
+      userVerification: queryParams.userVerification === "true",
     }))
   );
 }
@@ -156,6 +157,15 @@ export class BrowserFido2UserInterfaceSession implements Fido2UserInterfaceSessi
     });
   }
 
+  static confirmNewCredentialResponse(sessionId: string, cipherId: string, userVerified: boolean) {
+    this.sendMessage({
+      sessionId: sessionId,
+      type: "ConfirmNewCredentialResponse",
+      cipherId,
+      userVerified,
+    });
+  }
+
   private closed = false;
   private messages$ = (BrowserApi.messageListener$() as Observable<BrowserFido2Message>).pipe(
     filter((msg) => msg.sessionId === this.sessionId)

apps/browser/src/vault/popup/components/fido2/fido2.component.ts

@@ -309,6 +309,12 @@ export class Fido2Component implements OnInit, OnDestroy {
   }
 
   addCipher() {
+    const data = this.message$.value;
+
+    if (data?.type !== "ConfirmNewCredentialRequest") {
+      return;
+    }
+
     this.router.navigate(["/add-cipher"], {
       queryParams: {
         name: Utils.getHostname(this.url),
@@ -316,35 +322,11 @@ export class Fido2Component implements OnInit, OnDestroy {
         uilocation: "popout",
         senderTabId: this.senderTabId,
         sessionId: this.sessionId,
+        userVerification: data.userVerification,
       },
     });
   }
 
-  buildCipher() {
-    this.cipher = new CipherView();
-    this.cipher.name = Utils.getHostname(this.url);
-    this.cipher.type = CipherType.Login;
-    this.cipher.login = new LoginView();
-    this.cipher.login.uris = [new LoginUriView()];
-    this.cipher.login.uris[0].uri = this.url;
-    this.cipher.card = new CardView();
-    this.cipher.identity = new IdentityView();
-    this.cipher.secureNote = new SecureNoteView();
-    this.cipher.secureNote.type = SecureNoteType.Generic;
-    this.cipher.reprompt = CipherRepromptType.None;
-  }
-
-  async createNewCipher() {
-    this.buildCipher();
-    const cipher = await this.cipherService.encrypt(this.cipher);
-    try {
-      await this.cipherService.createWithServer(cipher);
-      this.cipher.id = cipher.id;
-    } catch (e) {
-      this.logService.error(e);
-    }
-  }
-
   async loadLoginCiphers() {
     this.ciphers = (await this.cipherService.getAllDecrypted()).filter(
       (cipher) => cipher.type === CipherType.Login && !cipher.isDeleted
@@ -405,6 +387,31 @@ export class Fido2Component implements OnInit, OnDestroy {
     this.destroy$.complete();
   }
 
+  private buildCipher() {
+    this.cipher = new CipherView();
+    this.cipher.name = Utils.getHostname(this.url);
+    this.cipher.type = CipherType.Login;
+    this.cipher.login = new LoginView();
+    this.cipher.login.uris = [new LoginUriView()];
+    this.cipher.login.uris[0].uri = this.url;
+    this.cipher.card = new CardView();
+    this.cipher.identity = new IdentityView();
+    this.cipher.secureNote = new SecureNoteView();
+    this.cipher.secureNote.type = SecureNoteType.Generic;
+    this.cipher.reprompt = CipherRepromptType.None;
+  }
+
+  private async createNewCipher() {
+    this.buildCipher();
+    const cipher = await this.cipherService.encrypt(this.cipher);
+    try {
+      await this.cipherService.createWithServer(cipher);
+      this.cipher.id = cipher.id;
+    } catch (e) {
+      this.logService.error(e);
+    }
+  }
+
   private send(msg: BrowserFido2Message) {
     BrowserFido2UserInterfaceSession.sendMessage({
       sessionId: this.sessionId,

apps/browser/src/vault/popup/components/vault/add-edit.component.ts

@@ -174,7 +174,11 @@ export class AddEditComponent extends BaseAddEditComponent {
     // Would be refactored after rework is done on the windows popout service
     const sessionData = await firstValueFrom(this.fido2PopoutSessionData$);
     if (this.inPopout && sessionData.isFido2Session) {
-      return;
+      await this.confirmFido2CredentialResponse(
+        sessionData.sessionId,
+        sessionData.userVerification
+      );
+      return true;
     }
 
     if (this.popupUtilsService.inTab(window)) {
@@ -311,6 +315,18 @@ export class AddEditComponent extends BaseAddEditComponent {
     }, 200);
   }
 
+  private async confirmFido2CredentialResponse(sessionId: string, userVerification: boolean) {
+    const userVerified = userVerification
+      ? await this.passwordRepromptService.showPasswordPrompt()
+      : false;
+
+    BrowserFido2UserInterfaceSession.confirmNewCredentialResponse(
+      sessionId,
+      this.cipher.id,
+      userVerified
+    );
+  }
+
   repromptChanged() {
     super.repromptChanged();