chore: improve telemetry types for connection events (#6217)

* chore: improve telemetry types for connection events * chore: require passing connection data to connection scoped events * use correct hook * fetch connection info on demand
mongodb-js · Sep 12, 2024 · 5d0bb08 · 5d0bb08
1 parent fa161e8
commit 5d0bb08
Show file tree

Hide file tree

Showing 23 changed files with 215 additions and 74 deletions.
diff --git a/...s/src/components/pipeline-builder-workspace/pipeline-builder-ui-workspace/dnd-wrapper.tsx b/...s/src/components/pipeline-builder-workspace/pipeline-builder-ui-workspace/dnd-wrapper.tsx
@@ -17,6 +17,7 @@ import { UseCaseCardLayout } from '../../aggregation-side-panel/stage-wizard-use
 import type { PipelineBuilderUIWorkspaceProps } from '.';
 import type { DraggedUseCase } from '../../aggregation-side-panel/stage-wizard-use-cases/use-case-card';
 import { useTelemetry } from '@mongodb-js/compass-telemetry/provider';
+import { useConnectionInfoAccess } from '@mongodb-js/compass-connections/provider';
 
 // Types
 type PipelineBuilderDndWrapperProps = {
@@ -71,15 +72,21 @@ const PipelineBuilderDndWrapper = ({
     })
   );
 
+  const connectionInfoAccess = useConnectionInfoAccess();
+
   const handleUseCaseDropped = useCallback(
     (event: DragEndEvent) => {
       const { over } = event;
       const overId = indexFromDroppableId(String(over?.id));
       if (draggedUseCase && overId !== null) {
-        track('Aggregation Use Case Added', {
-          drag_and_drop: true,
-          stage_name: draggedUseCase.stageOperator,
-        });
+        track(
+          'Aggregation Use Case Added',
+          {
+            drag_and_drop: true,
+            stage_name: draggedUseCase.stageOperator,
+          },
+          connectionInfoAccess.getCurrentConnectionInfo()
+        );
         onUseCaseDropped(
           draggedUseCase.id,
           draggedUseCase.stageOperator,
@@ -88,7 +95,7 @@ const PipelineBuilderDndWrapper = ({
       }
       setDraggedUseCase(null);
     },
-    [draggedUseCase, onUseCaseDropped, track]
+    [draggedUseCase, onUseCaseDropped, track, connectionInfoAccess]
   );
 
   const handleSortEnd = useCallback(

diff --git a/packages/compass-aggregations/src/components/saving-pipeline-modal/saving-pipeline-modal.tsx b/packages/compass-aggregations/src/components/saving-pipeline-modal/saving-pipeline-modal.tsx
@@ -36,7 +36,7 @@ class SavingPipelineModal extends PureComponent<SavingPipelineModalProps> {
 
   componentDidUpdate(prevProps: SavingPipelineModalProps) {
     if (prevProps.isOpen !== this.props.isOpen && this.props.isOpen) {
-      this.props.track('Screen', { name: 'save_pipeline_modal' });
+      this.props.track('Screen', { name: 'save_pipeline_modal' }, undefined);
     }
   }
 

diff --git a/packages/compass-aggregations/src/modules/is-new-pipeline-confirm.ts b/packages/compass-aggregations/src/modules/is-new-pipeline-confirm.ts
@@ -25,7 +25,7 @@ export const confirmNewPipeline =
   async (dispatch, getState, { pipelineBuilder, track }) => {
     const isModified = getState().isModified;
     if (isModified) {
-      track('Screen', { name: 'confirm_new_pipeline_modal' });
+      track('Screen', { name: 'confirm_new_pipeline_modal' }, undefined);
       const confirmed = await showConfirmation({
         title: 'Are you sure you want to create a new pipeline?',
         description:

diff --git a/packages/compass-connections/src/index.tsx b/packages/compass-connections/src/index.tsx
@@ -21,12 +21,13 @@ export { default as SingleConnectionForm } from './components/legacy-connections
 export { LegacyConnectionsModal } from './components/legacy-connections-modal';
 export { useConnectionFormPreferences } from './hooks/use-connection-form-preferences';
 import type { connect as devtoolsConnect } from 'mongodb-data-service';
+import type { ExtraConnectionData as ExtraConnectionDataForTelemetry } from '@mongodb-js/compass-telemetry';
 
 const ConnectionsComponent: React.FunctionComponent<{
   appName: string;
   onExtraConnectionDataRequest: (
     connectionInfo: ConnectionInfo
-  ) => Promise<[Record<string, unknown>, string | null]>;
+  ) => Promise<[ExtraConnectionDataForTelemetry, string | null]>;
   onAutoconnectInfoRequest?: (
     connectionStorage: ConnectionStorage
   ) => Promise<ConnectionInfo | undefined>;

diff --git a/packages/compass-connections/src/stores/connections-store-redux.ts b/packages/compass-connections/src/stores/connections-store-redux.ts
@@ -29,6 +29,7 @@ import mongodbBuildInfo, { getGenuineMongoDB } from 'mongodb-build-info';
 import EventEmitter from 'events';
 import { showNonGenuineMongoDBWarningModal as _showNonGenuineMongoDBWarningModal } from '../components/non-genuine-connection-modal';
 import ConnectionString from 'mongodb-connection-string-url';
+import type { ExtraConnectionData as ExtraConnectionDataForTelemetry } from '@mongodb-js/compass-telemetry';
 
 export type ConnectionsEventMap = {
   connected: (
@@ -182,7 +183,7 @@ type ThunkExtraArg = {
   logger: Logger;
   getExtraConnectionData: (
     connectionInfo: ConnectionInfo
-  ) => Promise<[Record<string, unknown>, string | null]>;
+  ) => Promise<[ExtraConnectionDataForTelemetry, string | null]>;
   connectFn?: typeof devtoolsConnect;
 };
 

diff --git a/packages/compass-crud/src/components/insert-document-dialog.tsx b/packages/compass-crud/src/components/insert-document-dialog.tsx
@@ -98,7 +98,11 @@ class InsertDocumentDialog extends React.PureComponent<
   ) {
     if (prevProps.isOpen !== this.props.isOpen && this.props.isOpen) {
       this.props.track &&
-        this.props.track('Screen', { name: 'insert_document_modal' });
+        this.props.track(
+          'Screen',
+          { name: 'insert_document_modal' },
+          undefined
+        );
     }
 
     if (this.props.isOpen && !this.hasManyDocuments()) {

diff --git a/packages/compass-import-export/src/components/export-modal.tsx b/packages/compass-import-export/src/components/export-modal.tsx
@@ -151,7 +151,7 @@ function ExportModal({
   useTrackOnChange(
     (track: TrackFunction) => {
       if (isOpen) {
-        track('Screen', { name: 'export_modal' });
+        track('Screen', { name: 'export_modal' }, undefined);
       }
     },
     [isOpen],

diff --git a/packages/compass-import-export/src/components/import-modal.tsx b/packages/compass-import-export/src/components/import-modal.tsx
@@ -160,7 +160,7 @@ function ImportModal({
   useTrackOnChange(
     (track: TrackFunction) => {
       if (isOpen) {
-        track('Screen', { name: 'import_modal' });
+        track('Screen', { name: 'import_modal' }, undefined);
       }
     },
     [isOpen],

diff --git a/packages/compass-saved-aggregations-queries/src/components/aggregations-queries-list.tsx b/packages/compass-saved-aggregations-queries/src/components/aggregations-queries-list.tsx
@@ -138,7 +138,7 @@ export const AggregationsQueriesList = ({
     .map((x) => x.item);
 
   useTrackOnChange((track: TrackFunction) => {
-    track('Screen', { name: 'my_queries' });
+    track('Screen', { name: 'my_queries' }, undefined);
   }, []);
 
   useTrackOnChange(

diff --git a/packages/compass-saved-aggregations-queries/src/stores/delete-item.ts b/packages/compass-saved-aggregations-queries/src/stores/delete-item.ts
@@ -51,7 +51,8 @@ export const confirmDeleteItem = (
       {
         id: item.id,
         screen: 'my_queries',
-      }
+      },
+      undefined // this event is connection scoped when triggered from the aggregation or query screen
     );
 
     if (item.type === 'query') {

diff --git a/packages/compass-saved-aggregations-queries/src/stores/open-item.ts b/packages/compass-saved-aggregations-queries/src/stores/open-item.ts
@@ -426,15 +426,18 @@ const openItem =
     database: string,
     collection: string
   ): SavedQueryAggregationThunkAction<void> =>
-  (_dispatch, _getState, { track, workspaces }) => {
+  (_dispatch, _getState, { track, workspaces, connectionsManager }) => {
+    const connectionInfo =
+      connectionsManager.getConnectionById(connection)?.info;
     track(
       item.type === 'aggregation'
         ? 'Aggregation Opened'
         : 'Query History Favorite Used',
       {
         id: item.id,
         screen: 'my_queries',
-      }
+      },
+      connectionInfo
     );
 
     workspaces.openCollectionWorkspace(

diff --git a/packages/compass-shell/src/components/shell-info-modal/shell-info-modal.tsx b/packages/compass-shell/src/components/shell-info-modal/shell-info-modal.tsx
@@ -39,7 +39,7 @@ function ShellInfoModal({
   useTrackOnChange(
     (track: TrackFunction) => {
       if (show) {
-        track('Screen', { name: 'shell_info_modal' });
+        track('Screen', { name: 'shell_info_modal' }, undefined);
       }
     },
     [show],

diff --git a/packages/compass-sidebar/src/components/csfle-connection-modal.tsx b/packages/compass-sidebar/src/components/csfle-connection-modal.tsx
@@ -53,7 +53,7 @@ export default function CSFLEConnectionModal({
   useTrackOnChange(
     (track: TrackFunction) => {
       if (open) {
-        track('Screen', { name: 'csfle_connection_modal' });
+        track('Screen', { name: 'csfle_connection_modal' }, undefined);
       }
     },
     [open],

diff --git a/packages/compass-telemetry/src/generic-track.ts b/packages/compass-telemetry/src/generic-track.ts
@@ -1,5 +1,5 @@
 import { type Logger, mongoLogId } from '@mongodb-js/compass-logging/provider';
-import type { TrackFunction, TrackFunctionPayload } from './types';
+import type { TelemetryEvent, TrackFunction } from './types';
 
 export interface TelemetryPreferences {
   getPreferences(): { trackUsageStatistics: boolean };
@@ -8,7 +8,7 @@ export interface TelemetryPreferences {
 export type TelemetryConnectionInfoHook = () => { id: string };
 
 export interface TelemetryServiceOptions {
-  sendTrack: TrackFunction;
+  sendTrack: (event: string, props: Record<string, unknown>) => void;
   logger?: Logger;
   preferences?: TelemetryPreferences;
   useConnectionInfo?: TelemetryConnectionInfoHook;
@@ -24,9 +24,9 @@ export const createTrack = ({
   preferences,
 }: TelemetryServiceOptions & { logger: Logger }) => {
   const trackAsync: AsyncFn<TrackFunction> = async (
-    event,
-    parametersOrFn,
-    connectionInfo
+    event: TelemetryEvent['name'],
+    parametersOrFn: Parameters<TrackFunction>[1],
+    connectionInfo?: { id?: string }
   ) => {
     // Note that this preferences check is mainly a performance optimization,
     // since the main process telemetry code also checks this preference value,
@@ -37,9 +37,10 @@ export const createTrack = ({
       return;
     }
 
-    let parameters: TrackFunctionPayload<Record<string, unknown>> =
-      parametersOrFn;
+    let parameters: Record<string, unknown> =
+      typeof parametersOrFn === 'object' ? parametersOrFn : {};
 
+    // if parametersOrFn is a function use the return value of the function.
     if (typeof parametersOrFn === 'function') {
       try {
         parameters = await parametersOrFn();
@@ -65,7 +66,7 @@ export const createTrack = ({
       }
     }
 
-    if (typeof parameters === 'object' && connectionInfo) {
+    if (connectionInfo) {
       parameters.connection_id = connectionInfo.id;
     }
 

diff --git a/packages/compass-telemetry/src/index.ts b/packages/compass-telemetry/src/index.ts
@@ -1,3 +1,7 @@
 export { createIpcTrack, createIpcSendTrack } from './ipc-track';
 export type { TelemetryServiceOptions } from './generic-track';
-export type { TrackFunction, IdentifyTraits } from './types';
+export type {
+  TrackFunction,
+  IdentifyTraits,
+  ExtraConnectionData,
+} from './types';
diff --git a/packages/compass-telemetry/src/ipc-track.ts b/packages/compass-telemetry/src/ipc-track.ts
@@ -33,7 +33,7 @@ export function createIpcSendTrack() {
     // eslint-disable-next-line @typescript-eslint/no-var-requires
     require('hadron-ipc').ipcRenderer;
 
-  const sendTrack: TrackFunction = (event, properties) =>
+  const sendTrack = (event: string, properties: Record<string, unknown>) =>
     emit(ipc, 'compass:track', { event, properties });
 
   return sendTrack;

diff --git a/packages/compass-telemetry/src/provider.tsx b/packages/compass-telemetry/src/provider.tsx
@@ -38,9 +38,7 @@ export const telemetryLocator = createServiceLocator(
   'telemetryLocator'
 );
 
-export function useTelemetry(): (
-  ...args: Parameters<TrackFunction>
-) => ReturnType<TrackFunction> {
+export function useTelemetry(): TrackFunction {
   const track = React.useContext(TelemetryContext);
   if (!track) {
     throw new Error('Telemetry service is missing from React context');