[Desktop] Add install screen stepper change metrics (#2261)

package.json

@@ -83,7 +83,7 @@
   },
   "dependencies": {
     "@atlaskit/pragmatic-drag-and-drop": "^1.3.1",
-    "@comfyorg/comfyui-electron-types": "^0.4.7",
+    "@comfyorg/comfyui-electron-types": "^0.4.8",
     "@comfyorg/litegraph": "^0.8.60",
     "@primevue/themes": "^4.0.5",
     "@sentry/vue": "^8.48.0",

src/views/InstallView.vue

@@ -6,7 +6,7 @@
     <Stepper
       class="h-full p-8 2xl:p-16"
       value="0"
-      @update:value="setHighestStep"
+      @update:value="handleStepChange"
     >
       <StepList class="select-none">
         <Step value="0">
@@ -137,6 +137,14 @@ const allowMetrics = ref(true)
 /** Forces each install step to be visited at least once. */
 const highestStep = ref(0)
 
+const handleStepChange = (value: string | number) => {
+  setHighestStep(value)
+
+  electronAPI().Config.trackEvent('install_stepper_change', {
+    step: value
+  })
+}
+
 const setHighestStep = (value: string | number) => {
   const int = typeof value === 'number' ? value : parseInt(value, 10)
   if (!isNaN(int) && int > highestStep.value) highestStep.value = int
@@ -167,8 +175,14 @@ onMounted(async () => {
   if (!electron) return
 
   const detectedGpu = await electron.Config.getDetectedGpu()
-  if (detectedGpu === 'mps' || detectedGpu === 'nvidia')
+  if (detectedGpu === 'mps' || detectedGpu === 'nvidia') {
     device.value = detectedGpu
+  }
+
+  electronAPI().Config.trackEvent('install_stepper_change', {
+    step: '0',
+    gpu: detectedGpu
+  })
 })
 </script>
 

vite.electron.config.mts

@@ -57,7 +57,11 @@ const mockElectronAPI: Plugin = {
           changeTheme: () => {},
           Config: {
             setWindowStyle: () => {},
-            getWindowStyle: () => Promise.resolve('default')
+            getWindowStyle: () => Promise.resolve('default'),
+            trackEvent: (event_name, event_data) => {
+              console.log('trackEvent', event_name, event_data)
+            },
+            getDetectedGpu: () => Promise.resolve('nvidia')
           }
         };`
       }