[EC-598] feat: inform user when no credentials are found

apps/browser/src/fido2/popup/fido2/fido2.component.html

@@ -46,6 +46,14 @@
         </div>
       </div>
     </ng-container>
+    <ng-container *ngIf="data.type == 'InformCredentialNotFoundRequest'">
+      You do not have a matching login for this site.
+      <div class="box list">
+        <div class="box-content">
+          <app-cipher-row *ngFor="let cipher of ciphers" [cipher]="cipher"></app-cipher-row>
+        </div>
+      </div>
+    </ng-container>
     <button type="button" class="btn btn-outline-secondary" (click)="abort(true)">
       Use browser built-in
     </button>

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

@@ -10,13 +10,13 @@ import {
   takeUntil,
 } from "rxjs";
 
-import { Utils } from "@bitwarden/common/misc/utils";
 import { UserRequestedFallbackAbortReason } from "@bitwarden/common/fido2/abstractions/fido2-client.service.abstraction";
 import {
   Fido2UserInterfaceService as Fido2UserInterfaceServiceAbstraction,
   Fido2UserInterfaceSession,
   NewCredentialParams,
 } from "@bitwarden/common/fido2/abstractions/fido2-user-interface.service.abstraction";
+import { Utils } from "@bitwarden/common/misc/utils";
 
 import { BrowserApi } from "../../browser/browserApi";
 import { PopupUtilsService } from "../../popup/services/popup-utils.service";
@@ -79,6 +79,9 @@ export type BrowserFido2Message = { sessionId: string } & (
       type: "InformExcludedCredentialRequest";
       existingCipherIds: string[];
     }
+  | {
+      type: "InformCredentialNotFoundRequest";
+    }
   | {
       type: "AbortRequest";
     }
@@ -240,6 +243,16 @@ export class BrowserFido2UserInterfaceSession implements Fido2UserInterfaceSessi
     await this.receive("AbortResponse");
   }
 
+  async informCredentialNotFound(): Promise<void> {
+    const data: BrowserFido2Message = {
+      type: "InformCredentialNotFoundRequest",
+      sessionId: this.sessionId,
+    };
+
+    await this.send(data);
+    await this.receive("AbortResponse");
+  }
+
   async close() {
     await this.send({ type: "CloseRequest", sessionId: this.sessionId });
     this.closed = true;