Record events for shortcut usage (#22062)

GitOrigin-RevId: ff85e0719fca24a3723ea62119fa254226cd65c0

services/web/frontend/js/features/source-editor/commands/cursor.ts

@@ -1,8 +1,10 @@
-import { EditorView } from '@codemirror/view'
+import { Command } from '@codemirror/view'
 import { EditorSelection } from '@codemirror/state'
+import { emitShortcutEvent } from '@/features/source-editor/extensions/toolbar/utils/analytics'
 
 export const cloneSelectionVertically =
-  (forward: boolean, cumulative: boolean) => (view: EditorView) => {
+  (forward: boolean, cumulative: boolean, modifier: string): Command =>
+  view => {
     const { main, ranges, mainIndex } = view.state.selection
     const { anchor, head, goalColumn } = main
     const start = EditorSelection.range(anchor, head, goalColumn)
@@ -23,5 +25,12 @@ export const cloneSelectionVertically =
       filteredRanges.length
     )
     view.dispatch({ selection })
+
+    emitShortcutEvent(view, 'clone-selection-vertically', {
+      forward,
+      cumulative,
+      modifier,
+    })
+
     return true
   }

services/web/frontend/js/features/source-editor/extensions/shortcuts.ts

@@ -24,6 +24,7 @@ import {
   deleteToVisualLineStart,
 } from './visual-line-selection'
 import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+import { emitShortcutEvent } from '@/features/source-editor/extensions/toolbar/utils/analytics'
 
 const toggleReviewPanel = () => {
   if (isSplitTestEnabled('review-panel-redesign')) {
@@ -118,7 +119,10 @@ export const shortcuts = Prec.high(
     {
       key: 'Mod-d',
       preventDefault: true,
-      run: deleteLine,
+      run(view) {
+        emitShortcutEvent(view, 'delete-line')
+        return deleteLine(view)
+      },
     },
     {
       key: 'Mod-j',
@@ -136,55 +140,64 @@ export const shortcuts = Prec.high(
       run: toggleTrackChangesFromKbdShortcut,
     },
     {
-      key: 'Mod-Alt-ArrowUp',
+      key: 'Cmd-Alt-ArrowUp',
       preventDefault: true,
-      run: cloneSelectionVertically(false, true),
+      run: cloneSelectionVertically(false, true, 'cmd'),
     },
     {
-      key: 'Mod-Alt-ArrowDown',
+      key: 'Cmd-Alt-ArrowDown',
       preventDefault: true,
-      run: cloneSelectionVertically(true, true),
+      run: cloneSelectionVertically(true, true, 'cmd'),
     },
     {
-      key: 'Mod-Alt-Shift-ArrowUp',
+      key: 'Cmd-Alt-Shift-ArrowUp',
       preventDefault: true,
-      run: cloneSelectionVertically(false, false),
+      run: cloneSelectionVertically(false, false, 'cmd'),
     },
     {
-      key: 'Mod-Alt-Shift-ArrowDown',
+      key: 'Cmd-Alt-Shift-ArrowDown',
       preventDefault: true,
-      run: cloneSelectionVertically(true, false),
+      run: cloneSelectionVertically(true, false, 'cmd'),
     },
-    // duplicates of the above commands, allowing Ctrl on macOS for backwards compatibility
+    // Duplicates of the above commands,
+    // allowing Ctrl instead of Command (but still tracking the events separately).
+    // Note: both Ctrl and Commmand versions need to work on macOS, for backwards compatibility,
+    // so the duplicates shouldn't simply be combined to use `Mod-`.
     {
-      mac: 'Ctrl-Alt-ArrowUp',
+      key: 'Ctrl-Alt-ArrowUp',
       preventDefault: true,
-      run: cloneSelectionVertically(false, true),
+      run: cloneSelectionVertically(false, true, 'ctrl'),
     },
     {
-      mac: 'Ctrl-Alt-ArrowDown',
+      key: 'Ctrl-Alt-ArrowDown',
       preventDefault: true,
-      run: cloneSelectionVertically(true, true),
+      run: cloneSelectionVertically(true, true, 'ctrl'),
     },
     {
-      mac: 'Ctrl-Alt-Shift-ArrowUp',
+      key: 'Ctrl-Alt-Shift-ArrowUp',
       preventDefault: true,
-      run: cloneSelectionVertically(false, false),
+      run: cloneSelectionVertically(false, false, 'ctrl'),
     },
     {
-      mac: 'Ctrl-Alt-Shift-ArrowDown',
+      key: 'Ctrl-Alt-Shift-ArrowDown',
       preventDefault: true,
-      run: cloneSelectionVertically(true, false),
+      run: cloneSelectionVertically(true, false, 'ctrl'),
     },
     {
       key: 'Ctrl-Alt-ArrowLeft',
       preventDefault: true,
-      run: selectPrevOccurrence,
+      run(view) {
+        emitShortcutEvent(view, 'select-prev-occurrence')
+        return selectPrevOccurrence(view)
+      },
     },
     {
       key: 'Ctrl-Alt-ArrowRight',
       preventDefault: true,
-      run: selectNextOccurrence,
+      run(view) {
+        emitShortcutEvent(view, 'select-next-occurrence')
+        return selectNextOccurrence(view)
+      },
     },
     {
       key: 'Mod-Shift-d',

services/web/frontend/js/features/source-editor/extensions/toolbar/utils/analytics.ts

@@ -5,12 +5,21 @@ import { isVisual } from '../../visual/visual'
 export function emitCommandEvent(
   view: EditorView,
   key: string,
-  command: string
+  command: string,
+  segmentation?: Record<string, string | number | boolean>
 ) {
   const mode = isVisual(view) ? 'visual' : 'source'
-  sendMB(key, { command, mode })
+  sendMB(key, { command, mode, ...segmentation })
 }
 
 export function emitToolbarEvent(view: EditorView, command: string) {
   emitCommandEvent(view, 'codemirror-toolbar-event', command)
 }
+
+export function emitShortcutEvent(
+  view: EditorView,
+  command: string,
+  segmentation?: Record<string, string | number | boolean>
+) {
+  emitCommandEvent(view, 'codemirror-shortcut-event', command, segmentation)
+}