add search resutls view events

pinterest · Jan 6, 2023 · 1695e66 · 1695e66
1 parent d37b41a
commit 1695e66
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 3 deletions.
diff --git a/querybook/webapp/components/Search/SearchOverview.tsx b/querybook/webapp/components/Search/SearchOverview.tsx
@@ -1,6 +1,6 @@
 import { isEmpty } from 'lodash';
 import moment from 'moment';
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import { useDispatch } from 'react-redux';
 import CreatableSelect from 'react-select/creatable';
 
@@ -16,7 +16,7 @@ import {
 } from 'const/search';
 import { useShallowSelector } from 'hooks/redux/useShallowSelector';
 import { useTrackView } from 'hooks/useTrackView';
-import { trackClick } from 'lib/analytics';
+import { trackClick, trackView } from 'lib/analytics';
 import { titleize } from 'lib/utils';
 import { getCurrentEnv } from 'lib/utils/query-string';
 import {
@@ -112,6 +112,18 @@ export const SearchOverview: React.FC<ISearchOverviewProps> = ({
     const results = resultByPage[currentPage] || [];
     const isLoading = !!searchRequest;
 
+    // Log search results
+    useEffect(() => {
+        if (!isLoading && !!searchString.length && !!results.length) {
+            const elementType = SearchTypeToElementType[searchType];
+            trackView(ComponentType.SEARCH_MODAL, elementType, {
+                search: searchString,
+                results: results.map((r) => r.id),
+                page: currentPage,
+            });
+        }
+    }, [isLoading, searchString, results]);
+
     const dispatch = useDispatch();
     const handleUpdateSearchString = React.useCallback(
         (searchStringParam: string) => {

diff --git a/querybook/webapp/lib/analytics.ts b/querybook/webapp/lib/analytics.ts
@@ -1,6 +1,7 @@
 import {
     AnalyticsEvent,
     ComponentType,
+    ElementType,
     EventData,
     EventType,
 } from 'const/analytics';
@@ -23,10 +24,16 @@ const track = (eventType: EventType, eventData: EventData) => {
     });
 };
 
-export const trackView = (component?: ComponentType) => {
+export const trackView = (
+    component?: ComponentType,
+    element?: ElementType,
+    aux?: object
+) => {
     const eventData = {
         path: location.pathname,
         component,
+        element,
+        aux,
     };
     track(EventType.VIEW, eventData);
 };