Bug 1947634 - Add a Glean event for CPM tile interactions. r=rsafaeian,credential-management-reviewers

Differential Revision: https://phabricator.services.mozilla.com/D237950

Author: Micah Tigley

toolkit/components/satchel/megalist/content/components/password-card/password-card.mjs

@@ -127,7 +127,14 @@ export class PasswordCard extends MozLitElement {
     this.messageToViewModel("Command", { commandId, snapshotId: lineIndex });
   }
 
+  #recordInteractionType(type) {
+    Glean.contextualManager.interactionType.record({
+      interaction_type: type,
+    });
+  }
+
   async onEditButtonClick() {
+    this.#recordInteractionType("edit");
     const isAuthenticated = await this.reauthCommandHandler(() =>
       this.messageToViewModel("Command", {
         commandId: "Edit",
@@ -144,10 +151,12 @@ export class PasswordCard extends MozLitElement {
 
   onViewAlertClick() {
     this.handleViewAlertClick();
+    this.#recordInteractionType("view_alert");
   }
 
   #onOriginLineClick(lineIndex) {
     this.handleCommand("OpenLink", lineIndex);
+    this.#recordInteractionType("url_navigate");
   }
 
   #onCopyButtonClick(lineIndex) {
@@ -197,6 +206,7 @@ export class PasswordCard extends MozLitElement {
         .value=${this.username.value}
         .onLineClick=${() => {
           this.#onCopyButtonClick(this.username.lineIndex);
+          this.#recordInteractionType("copy_username");
           return true;
         }}
         ?alert=${!this.username.value.length}
@@ -213,17 +223,24 @@ export class PasswordCard extends MozLitElement {
         .value=${this.password.value}
         .visible=${!this.password.concealed}
         ?alert=${this.password.vulnerable}
-        .onLineClick=${() =>
-          this.reauthCommandHandler(() =>
-            this.#onCopyButtonClick(this.password.lineIndex)
-          )}
-        .onButtonClick=${() =>
+        .onLineClick=${() => {
+          this.reauthCommandHandler(() => {
+            this.#onCopyButtonClick(this.password.lineIndex);
+          });
+          this.#recordInteractionType("copy_password");
+        }}
+        .onButtonClick=${() => {
+          const interactionType = this.password.concealed
+            ? "view_password"
+            : "hide_password";
+          this.#recordInteractionType(interactionType);
           this.reauthCommandHandler(() =>
             this.onPasswordRevealClick(
               this.password.concealed,
               this.password.lineIndex
             )
-          )}
+          );
+        }}
       >
       </concealed-login-line>
     `;

toolkit/components/satchel/megalist/metrics.yaml

@@ -48,3 +48,30 @@ contextual_manager:
         description: >
           The action selected from the toolbar
         type: string
+
+  records_interaction:
+    type: event
+    description: >
+      Client interacts with existing CM tile
+      Possible interaction types include:
+        "url_navigate": When the origin field is clicked
+        "copy_username": When the username field is clicked
+        "copy_password": When the password field is clicked
+        "view_password": When the reveal password button is clicked
+        "hide_password": When the hide password button is clicked
+        "edit": When the edit button is clicked
+        "view_alert": When the "View alert" button is clicked
+    bugs:
+      - https://bugzilla.mozilla.org/show_bug.cgi?id=1947634
+    data_reviews:
+      - https://bugzilla.mozilla.org/show_bug.cgi?id=1947634
+    notification_emails:
+      - passwords-dev@mozilla.org
+      - issozi@mozilla.com
+      - tthorne@mozilla.com
+    expires: never
+    extra_keys:
+      interaction_type:
+        description: >
+          The type of user interaction with the CM record tile
+        type: string