[PM-5884] Allow deletion of passkey from edit view - clients (#8500)

* add remove button for passkeys during edit

* added live region to announce when a passkey is removed

* removed announce passkey removed by SR

* removed unused variable

apps/browser/src/_locales/en/messages.json

@@ -2999,5 +2999,11 @@
   "saveCipherAttemptFailed": {
     "message": "Error saving credentials. Check console for details.",
     "description": "Notification message for when saving credentials has failed."
+  },
+  "removePasskey": {
+    "message": "Remove passkey"
+  },
+  "passkeyRemoved": {
+    "message": "Passkey removed"
   }
 }

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

@@ -138,10 +138,20 @@
             attr.aria-label="{{ 'typePasskey' | i18n }} {{ fido2CredentialCreationDateValue }}"
           >
             <div class="box-content">
-              <div class="box-content-row text-muted">
-                <span class="row-label">{{ "typePasskey" | i18n }}</span>
-                {{ "dateCreated" | i18n }}
-                {{ cipher.login.fido2Credentials[0].creationDate | date: "short" }}
+              <div class="box-content-row box-content-row-multi text-muted" appBoxRow>
+                <button
+                  type="button"
+                  appStopClick
+                  (click)="removePasskey()"
+                  appA11yTitle="{{ 'removePasskey' | i18n }}"
+                >
+                  <i class="bwi bwi-fw bwi-minus-circle bwi-lg" aria-hidden="true"></i>
+                </button>
+                <div class="row-main">
+                  <span class="row-label">{{ "typePasskey" | i18n }}</span>
+                  {{ "dateCreated" | i18n }}
+                  {{ cipher.login.fido2Credentials[0].creationDate | date: "short" }}
+                </div>
               </div>
             </div>
           </div>