Add workbench created and updated telemetry events (#819)

* Add workbench created and updated telemetry events * add DEV mode telemetry event log * small fixes * add project name in the event
opendatahub-io · Nov 30, 2022 · cf1666a · cf1666a
1 parent 6fbcd27
commit cf1666a
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 13 deletions.
diff --git a/frontend/src/pages/projects/screens/spawner/SpawnerFooter.tsx b/frontend/src/pages/projects/screens/spawner/SpawnerFooter.tsx
@@ -19,6 +19,7 @@ import {
 } from './service';
 import { useUser } from '../../../../redux/selectors';
 import { ProjectDetailsContext } from '../../ProjectDetailsContext';
+import { fireTrackingEvent } from '../../../../utilities/segmentIOUtils';
 
 type SpawnerFooterProps = {
   startNotebookData: StartNotebookData;
@@ -49,7 +50,14 @@ const SpawnerFooter: React.FC<SpawnerFooterProps> = ({
     !checkRequiredFieldsForNotebookStart(startNotebookData, storageData, envVariables);
   const { username } = useUser();
 
-  const redirect = () => {
+  const afterStart = (type: 'created' | 'updated') => {
+    const { gpus, notebookSize, image } = startNotebookData;
+    fireTrackingEvent(`Workbench ${type}`, {
+      GPU: gpus,
+      lastSelectedSize: notebookSize.name,
+      lastSelectedImage: `${image.imageVersion?.from.name}`,
+      projectName,
+    });
     refreshAllProjectData();
     navigate(`/projects/${projectName}`);
   };
@@ -82,7 +90,7 @@ const SpawnerFooter: React.FC<SpawnerFooterProps> = ({
       const { volumes, volumeMounts } = pvcDetails;
       const newStartNotebookData = { ...startNotebookData, volumes, volumeMounts, envFrom };
       updateNotebook(editNotebook, newStartNotebookData, username)
-        .then(redirect)
+        .then(() => afterStart('updated'))
         .catch(handleError);
     }
   };
@@ -103,7 +111,9 @@ const SpawnerFooter: React.FC<SpawnerFooterProps> = ({
     const { volumes, volumeMounts } = pvcDetails;
     const newStartData = { ...startNotebookData, volumes, volumeMounts, envFrom };
 
-    createNotebook(newStartData, username).then(redirect).catch(handleError);
+    createNotebook(newStartData, username)
+      .then(() => afterStart('created'))
+      .catch(handleError);
   };
 
   return (

diff --git a/frontend/src/types.ts b/frontend/src/types.ts
@@ -277,6 +277,7 @@ export type TrackingEventProperties = {
   GPU?: number;
   lastSelectedSize?: string;
   lastSelectedImage?: string;
+  projectName?: string;
 };
 
 export type NotebookPort = {

diff --git a/frontend/src/utilities/segmentIOUtils.tsx b/frontend/src/utilities/segmentIOUtils.tsx
@@ -1,20 +1,29 @@
 import { TrackingEventProperties } from '../types';
+import { DEV_MODE } from './const';
 
 export const fireTrackingEvent = (
   eventType: string,
   properties?: TrackingEventProperties,
 ): void => {
   const clusterID = window.clusterID ?? '';
-  if (window.analytics) {
-    switch (eventType) {
-      case 'identify':
-        window.analytics.identify(properties?.anonymousID, { clusterID });
-        break;
-      case 'page':
-        window.analytics.page(undefined, { clusterID });
-        break;
-      default:
-        window.analytics.track(eventType, { ...properties, clusterID });
+  if (DEV_MODE) {
+    console.log(
+      `Telemetry event triggered: ${eventType}${
+        properties ? ` - ${JSON.stringify(properties)}` : ''
+      }`,
+    );
+  } else {
+    if (window.analytics) {
+      switch (eventType) {
+        case 'identify':
+          window.analytics.identify(properties?.anonymousID, { clusterID });
+          break;
+        case 'page':
+          window.analytics.page(undefined, { clusterID });
+          break;
+        default:
+          window.analytics.track(eventType, { ...properties, clusterID });
+      }
     }
   }
 };