[feat] Add analytics keys map object and new untracked features (#1296)

Added analytics keys map object Added analytics traction on new features
aimhubio · Feb 10, 2022 · ff54487 · ff54487
1 parent 4f50d9c
commit ff54487
Show file tree

Hide file tree

Showing 67 changed files with 692 additions and 146 deletions.
diff --git a/aim/web/ui/src/components/HeatMap/HeatMap.tsx b/aim/web/ui/src/components/HeatMap/HeatMap.tsx
@@ -6,6 +6,8 @@ import { Tooltip } from '@material-ui/core';
 import { Text } from 'components/kit';
 import ErrorBoundary from 'components/ErrorBoundary/ErrorBoundary';
 
+import { ANALYTICS_EVENT_KEYS } from 'config/analytics/analyticsKeysMap';
+
 import * as analytics from 'services/analytics';
 
 import { encode } from 'utils/encoder/encoder';
@@ -135,6 +137,7 @@ function HeatMap({
 
     function onClickeCell(e: React.MouseEvent) {
       e.stopPropagation();
+      onCellClick();
       if (scale) {
         const startDate = date.getTime();
         const endDate = new Date(
@@ -151,7 +154,7 @@ function HeatMap({
             startDate / 1000
           } and run.creation_time <= ${endDate / 1000}`,
         });
-        analytics.trackEvent('[Home][HeatMap] Activity cell click');
+        analytics.trackEvent(ANALYTICS_EVENT_KEYS.home.activityCellClick);
         history.push(`/runs?select=${search}`);
       }
     }

diff --git a/aim/web/ui/src/components/ImagesExploreRangePanel/ImagesExploreRangePanel.tsx b/aim/web/ui/src/components/ImagesExploreRangePanel/ImagesExploreRangePanel.tsx
@@ -4,6 +4,9 @@ import { Button } from 'components/kit';
 import SliderWithInput from 'components/SliderWithInput';
 import ErrorBoundary from 'components/ErrorBoundary/ErrorBoundary';
 
+import { ANALYTICS_EVENT_KEYS } from 'config/analytics/analyticsKeysMap';
+
+import * as analytics from 'services/analytics';
 import imagesExploreAppModel from 'services/models/imagesExplore/imagesExploreAppModel';
 
 import { IImagesExploreRangePanelProps } from './types.d';
@@ -23,6 +26,9 @@ function ImagesExploreRangePanel({
 }: IImagesExploreRangePanelProps): React.FunctionComponentElement<React.ReactNode> {
   const searchMetricsRef = React.useRef<any>(null);
   function handleSearch() {
+    analytics.trackEvent(
+      ANALYTICS_EVENT_KEYS.images.imagesPanel.clickApplyButton,
+    );
     searchMetricsRef.current = imagesExploreAppModel.getImagesData(true);
     searchMetricsRef.current.call();
   }

diff --git a/aim/web/ui/src/components/MediaList/ImageBox.tsx b/aim/web/ui/src/components/MediaList/ImageBox.tsx
@@ -10,8 +10,10 @@ import ErrorBoundary from 'components/ErrorBoundary/ErrorBoundary';
 
 import { BATCH_COLLECT_DELAY } from 'config/mediaConfigs/mediaConfigs';
 import { MediaItemAlignmentEnum } from 'config/enums/imageEnums';
+import { ANALYTICS_EVENT_KEYS } from 'config/analytics/analyticsKeysMap';
 
 import blobsURIModel from 'services/models/media/blobsURIModel';
+import * as analytics from 'services/analytics';
 
 import { IImageBoxProps } from './MediaList.d';
 
@@ -69,6 +71,9 @@ const ImageBox = ({
   function onImageFullSizeModeButtonClick(e: React.ChangeEvent<any>): void {
     e.stopPropagation();
     setIsImageFullViewPopupOpened(true);
+    analytics.trackEvent(
+      ANALYTICS_EVENT_KEYS.images.imagesPanel.openFullSizeMode,
+    );
   }
 
   const skeletonSize = {

diff --git a/aim/web/ui/src/components/SideBar/SideBar.tsx b/aim/web/ui/src/components/SideBar/SideBar.tsx
@@ -11,6 +11,7 @@ import ErrorBoundary from 'components/ErrorBoundary/ErrorBoundary';
 
 import { PathEnum } from 'config/enums/routesEnum';
 import { AIM_VERSION } from 'config/config';
+import { ANALYTICS_EVENT_KEYS } from 'config/analytics/analyticsKeysMap';
 
 import routes, { IRoute } from 'routes/routes';
 
@@ -106,7 +107,7 @@ function SideBar(): React.FunctionComponentElement<React.ReactNode> {
                 href='https://slack.aimstack.io'
                 rel='noreferrer'
                 className='Sidebar__bottom__anchor'
-                onClick={() => trackEvent('[Sidebar] go to slack')}
+                onClick={() => trackEvent(ANALYTICS_EVENT_KEYS.sidebar.slack)}
               >
                 <Icon name='slack' />
               </a>
@@ -117,7 +118,7 @@ function SideBar(): React.FunctionComponentElement<React.ReactNode> {
                 href='https://aimstack.readthedocs.io'
                 rel='noreferrer'
                 className='Sidebar__bottom__anchor'
-                onClick={() => trackEvent('[Sidebar] go to documentation')}
+                onClick={() => trackEvent(ANALYTICS_EVENT_KEYS.sidebar.docs)}
               >
                 <Icon name='full-docs' />
               </a>

diff --git a/aim/web/ui/src/components/TagForm/TagForm.tsx b/aim/web/ui/src/components/TagForm/TagForm.tsx
@@ -10,8 +10,10 @@ import { Badge, Text } from 'components/kit';
 import ErrorBoundary from 'components/ErrorBoundary/ErrorBoundary';
 
 import COLORS from 'config/colors/colors';
+import { ANALYTICS_EVENT_KEYS } from 'config/analytics/analyticsKeysMap';
 
 import tagsAppModel from 'services/models/tags/tagsAppModel';
+import { trackEvent } from 'services/analytics';
 
 import { ITagFormProps } from 'types/components/TagForm/TagForm';
 
@@ -116,6 +118,8 @@ function TagForm({
   );
 
   function onCreateButtonClick() {
+    trackEvent(ANALYTICS_EVENT_KEYS.tags.create);
+
     submitForm().then(() =>
       validateForm(values).then((errors) => {
         if (isEmpty(errors)) {