RHOAIENG-9215 Reorganize Existing Segment Tracking Implementation

frontend/src/app/TelemetrySetup.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useSegmentTracking } from '~/utilities/useSegmentTracking';
-import { useTrackHistory } from '~/utilities/useTrackHistory';
+import { useSegmentTracking } from '~/concepts/analyticsTracking/useSegmentTracking';
+import { useTrackHistory } from '~/concepts/analyticsTracking/useTrackHistory';
 
 const TelemetrySetup: React.FC = () => {
   useSegmentTracking();

frontend/src/components/ExternalLink.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons';
-import { fireTrackingEventRaw } from '~/utilities/segmentIOUtils';
+import { fireTrackingEventRaw } from '~/concepts/analyticsTracking/segmentIOUtils';
 
 type ExternalLinkProps = {
   text: string;

frontend/src/components/OdhDocCard.tsx

@@ -21,7 +21,7 @@ import {
   launchQuickStart,
   LaunchStatusEnum,
 } from '~/utilities/quickStartUtils';
-import { fireTrackingEvent } from '~/utilities/segmentIOUtils';
+import { fireTrackingEvent } from '~/concepts/analyticsTracking/segmentIOUtils';
 import BrandImage from './BrandImage';
 import DocCardBadges from './DocCardBadges';
 import { useQuickStartCardSelected } from './useQuickStartCardSelected';

frontend/src/utilities/__tests__/useWatchSegmentKey.spec.ts → frontend/src/concepts/analyticsTracking/__tests__/useWatchSegmentKey.spec.ts

@@ -1,8 +1,8 @@
-import { useWatchSegmentKey } from '~/utilities/useWatchSegmentKey';
 import { testHook } from '~/__tests__/unit/testUtils/hooks';
-import { fetchSegmentKey } from '~/services/segmentKeyService';
+import { fetchSegmentKey } from '~/concepts/analyticsTracking/segmentKeyService';
+import { useWatchSegmentKey } from '~/concepts/analyticsTracking/useWatchSegmentKey';
 
-jest.mock('~/services/segmentKeyService', () => ({
+jest.mock('~/concepts/analyticsTracking/segmentKeyService', () => ({
   fetchSegmentKey: jest.fn(),
 }));
 

frontend/src/utilities/segmentIOUtils.tsx → frontend/src/concepts/analyticsTracking/segmentIOUtils.tsx

@@ -1,5 +1,5 @@
-import { TrackingEventProperties } from '~/types';
-import { DEV_MODE, INTERNAL_DASHBOARD_VERSION } from './const';
+import { DEV_MODE, INTERNAL_DASHBOARD_VERSION } from '~/utilities/const';
+import { TrackingEventProperties } from '~/concepts/analyticsTracking/trackingProperties';
 
 // The following is like the original method below, but allows for more 'free form' properties.
 // eslint-disable-next-line @typescript-eslint/no-explicit-any,@typescript-eslint/explicit-module-boundary-types

frontend/src/services/segmentKeyService.ts → frontend/src/concepts/analyticsTracking/segmentKeyService.ts

@@ -1,5 +1,6 @@
 import axios from '~/utilities/axios';
-import { ODHSegmentKey } from '~/types';
+
+import { ODHSegmentKey } from '~/concepts/analyticsTracking/trackingProperties';
 
 export const fetchSegmentKey = (): Promise<ODHSegmentKey> => {
   const url = '/api/segment-key';

frontend/src/concepts/analyticsTracking/trackingProperties.ts

@@ -0,0 +1,25 @@
+export type ODHSegmentKey = {
+  segmentKey: string;
+};
+
+export enum TrackingOutcome {
+  submit = 'submit',
+  cancel = 'cancel',
+}
+
+export type TrackingEventProperties = {
+  name?: string;
+  anonymousID?: string;
+  type?: string;
+  term?: string;
+  accelerator?: string;
+  acceleratorCount?: number;
+  lastSelectedSize?: string;
+  lastSelectedImage?: string;
+  projectName?: string;
+  notebookName?: string;
+  lastActivity?: string;
+  outcome?: TrackingOutcome;
+  success?: boolean;
+  error?: string;
+};

frontend/src/utilities/useSegmentTracking.ts → frontend/src/concepts/analyticsTracking/useSegmentTracking.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useAppContext } from '~/app/AppContext';
-import { initSegment } from '~/utilities/segmentIOUtils';
 import { useAppSelector } from '~/redux/hooks';
+import { initSegment } from './segmentIOUtils';
 import { useWatchSegmentKey } from './useWatchSegmentKey';
 
 export const useSegmentTracking = (): void => {

frontend/src/utilities/useWatchSegmentKey.tsx → frontend/src/concepts/analyticsTracking/useWatchSegmentKey.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { fetchSegmentKey } from '~/services/segmentKeyService';
-import { ODHSegmentKey } from '~/types';
-import { POLL_INTERVAL } from './const';
+import { POLL_INTERVAL } from '~/utilities/const';
+import { ODHSegmentKey } from '~/concepts/analyticsTracking/trackingProperties';
+import { fetchSegmentKey } from './segmentKeyService';
 
 export const useWatchSegmentKey = (): {
   segmentKey: string;

frontend/src/pages/enabledApplications/EnabledApplications.tsx

@@ -5,7 +5,7 @@ import { useWatchComponents } from '~/utilities/useWatchComponents';
 import { OdhApplication } from '~/types';
 import ApplicationsPage from '~/pages/ApplicationsPage';
 import OdhAppCard from '~/components/OdhAppCard';
-import { fireTrackingEvent } from '~/utilities/segmentIOUtils';
+import { fireTrackingEvent } from '~/concepts/analyticsTracking/segmentIOUtils';
 
 const description = `Launch your enabled applications, view documentation, or get started with quick start instructions and tasks.`;
 

frontend/src/pages/exploreApplication/ExploreApplications.tsx

@@ -14,7 +14,7 @@ import ApplicationsPage from '~/pages/ApplicationsPage';
 import { OdhApplication } from '~/types';
 import { useQueryParams } from '~/utilities/useQueryParams';
 import { removeQueryArgument, setQueryArgument } from '~/utilities/router';
-import { fireTrackingEvent } from '~/utilities/segmentIOUtils';
+import { fireTrackingEvent } from '~/concepts/analyticsTracking/segmentIOUtils';
 import { ODH_PRODUCT_NAME } from '~/utilities/const';
 import { useAppContext } from '~/app/AppContext';
 import GetStartedPanel from './GetStartedPanel';

frontend/src/pages/exploreApplication/GetStartedPanel.tsx

@@ -19,7 +19,7 @@ import { ExternalLinkAltIcon } from '@patternfly/react-icons';
 import { OdhApplication } from '~/types';
 import MarkdownView from '~/components/MarkdownView';
 import { markdownConverter } from '~/utilities/markdown';
-import { fireTrackingEvent } from '~/utilities/segmentIOUtils';
+import { fireTrackingEvent } from '~/concepts/analyticsTracking/segmentIOUtils';
 import { useAppContext } from '~/app/AppContext';
 
 const DEFAULT_BETA_TEXT =

frontend/src/pages/home/projects/ProjectCard.tsx

@@ -19,7 +19,7 @@ import TruncatedText from '~/components/TruncatedText';
 import { SectionType } from '~/concepts/design/utils';
 import TypeBorderedCard from '~/concepts/design/TypeBorderedCard';
 import { getProjectOwner } from '~/concepts/projects/utils';
-import { fireTrackingEventRaw } from '~/utilities/segmentIOUtils';
+import { fireTrackingEventRaw } from '~/concepts/analyticsTracking/segmentIOUtils';
 import { getDescriptionFromK8sResource, getDisplayNameFromK8sResource } from '~/concepts/k8s/utils';
 
 interface ProjectCardProps {

frontend/src/pages/home/useEnableTeamSection.tsx

@@ -13,7 +13,7 @@ import InfoGalleryItem from '~/concepts/design/InfoGalleryItem';
 import { useBrowserStorage } from '~/components/browserStorage';
 import { SupportedArea } from '~/concepts/areas';
 import useIsAreaAvailable from '~/concepts/areas/useIsAreaAvailable';
-import { fireTrackingEventRaw } from '~/utilities/segmentIOUtils';
+import { fireTrackingEventRaw } from '~/concepts/analyticsTracking/segmentIOUtils';
 
 export const useEnableTeamSection = (): React.ReactNode => {
   const navigate = useNavigate();

frontend/src/pages/learningCenter/LearningCenterToolbar.tsx

@@ -25,7 +25,7 @@ import {
 } from '@patternfly/react-icons';
 import { removeQueryArgument, setQueryArgument } from '~/utilities/router';
 import { useQueryParams } from '~/utilities/useQueryParams';
-import { fireTrackingEvent } from '~/utilities/segmentIOUtils';
+import { fireTrackingEvent } from '~/concepts/analyticsTracking/segmentIOUtils';
 import {
   SEARCH_FILTER_KEY,
   DOC_SORT_KEY,

frontend/src/pages/notebookController/screens/server/SpawnerPage.tsx

@@ -37,7 +37,7 @@ import useNotification from '~/utilities/useNotification';
 import { NotebookControllerContext } from '~/pages/notebookController/NotebookControllerContext';
 import ImpersonateAlert from '~/pages/notebookController/screens/admin/ImpersonateAlert';
 import useNamespaces from '~/pages/notebookController/useNamespaces';
-import { fireTrackingEvent } from '~/utilities/segmentIOUtils';
+import { fireTrackingEvent } from '~/concepts/analyticsTracking/segmentIOUtils';
 import { getEnvConfigMap, getEnvSecret } from '~/services/envService';
 import useNotebookAcceleratorProfile from '~/pages/projects/screens/detail/notebooks/useNotebookAcceleratorProfile';
 import { SupportedArea, useIsAreaAvailable } from '~/concepts/areas';

frontend/src/pages/projects/notebook/NotebookRouteLink.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Button, ButtonVariant, Flex, FlexItem, Icon, Tooltip } from '@patternfly/react-core';
 import { ExclamationCircleIcon, ExternalLinkAltIcon } from '@patternfly/react-icons';
 import { NotebookKind } from '~/k8sTypes';
-import { fireTrackingEventRaw } from '~/utilities/segmentIOUtils';
+import { fireTrackingEventRaw } from '~/concepts/analyticsTracking/segmentIOUtils';
 import { getDisplayNameFromK8sResource } from '~/concepts/k8s/utils';
 import useRouteForNotebook from './useRouteForNotebook';
 import { hasStopAnnotation } from './utils';

frontend/src/pages/projects/notebook/NotebookStatusToggle.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Flex, Switch } from '@patternfly/react-core';
 import { startNotebook, stopNotebook } from '~/api';
-import { fireTrackingEvent } from '~/utilities/segmentIOUtils';
+import { fireTrackingEvent } from '~/concepts/analyticsTracking/segmentIOUtils';
 import useNotebookAcceleratorProfile from '~/pages/projects/screens/detail/notebooks/useNotebookAcceleratorProfile';
 import useNotebookDeploymentSize from '~/pages/projects/screens/detail/notebooks/useNotebookDeploymentSize';
 import { computeNotebooksTolerations } from '~/utilities/tolerations';

frontend/src/pages/projects/screens/projects/DeleteProjectModal.tsx

@@ -2,9 +2,9 @@ import * as React from 'react';
 import { ProjectKind } from '~/k8sTypes';
 import { deleteProject } from '~/api';
 import DeleteModal from '~/pages/projects/components/DeleteModal';
-import { fireTrackingEvent } from '~/utilities/segmentIOUtils';
-import { TrackingOutcome } from '~/types';
+import { fireTrackingEvent } from '~/concepts/analyticsTracking/segmentIOUtils';
 import { getDisplayNameFromK8sResource } from '~/concepts/k8s/utils';
+import { TrackingOutcome } from '~/concepts/analyticsTracking/trackingProperties';
 
 type DeleteProjectModalProps = {
   onClose: (deleted: boolean) => void;

frontend/src/pages/projects/screens/projects/ManageProjectModal.tsx

@@ -11,8 +11,9 @@ import {
 import NameDescriptionField from '~/concepts/k8s/NameDescriptionField';
 import { NameDescType } from '~/pages/projects/types';
 import { ProjectsContext } from '~/concepts/projects/ProjectsContext';
-import { fireTrackingEventRaw } from '~/utilities/segmentIOUtils';
-import { TrackingOutcome } from '~/types';
+import { fireTrackingEventRaw } from '~/concepts/analyticsTracking/segmentIOUtils';
+
+import { TrackingOutcome } from '~/concepts/analyticsTracking/trackingProperties';
 
 type ManageProjectModalProps = {
   editProjectData?: ProjectKind;

frontend/src/pages/projects/screens/spawner/SpawnerFooter.tsx

@@ -20,8 +20,11 @@ import { ProjectDetailsContext } from '~/pages/projects/ProjectDetailsContext';
 import { AppContext } from '~/app/AppContext';
 import usePreferredStorageClass from '~/pages/projects/screens/spawner/storage/usePreferredStorageClass';
 import { ProjectSectionID } from '~/pages/projects/screens/detail/types';
-import { fireTrackingEvent, fireTrackingEventRaw } from '~/utilities/segmentIOUtils';
-import { TrackingOutcome } from '~/types';
+import {
+  fireTrackingEvent,
+  fireTrackingEventRaw,
+} from '~/concepts/analyticsTracking/segmentIOUtils';
+import { TrackingOutcome } from '~/concepts/analyticsTracking/trackingProperties';
 import {
   createConfigMapsAndSecretsForNotebook,
   createPvcDataForNotebook,

frontend/src/types.ts

@@ -3,8 +3,8 @@
  */
 
 import {
-  WatchK8sResult,
   K8sResourceCommon as SDKK8sResourceCommon,
+  WatchK8sResult,
 } from '@openshift/dynamic-plugin-sdk-utils';
 import { AxiosError } from 'axios';
 import { EnvironmentFromVariable } from '~/pages/projects/types';
@@ -267,10 +267,6 @@ declare global {
   }
 }
 
-export type ODHSegmentKey = {
-  segmentKey: string;
-};
-
 export type ApplicationAction = {
   label: string;
   href: string;
@@ -282,28 +278,6 @@ export type Section = {
   actions: ApplicationAction[];
 };
 
-export enum TrackingOutcome {
-  submit = 'submit',
-  cancel = 'cancel',
-}
-
-export type TrackingEventProperties = {
-  name?: string;
-  anonymousID?: string;
-  type?: string;
-  term?: string;
-  accelerator?: string;
-  acceleratorCount?: number;
-  lastSelectedSize?: string;
-  lastSelectedImage?: string;
-  projectName?: string;
-  notebookName?: string;
-  lastActivity?: string;
-  outcome?: TrackingOutcome;
-  success?: boolean;
-  error?: string;
-};
-
 export type NotebookPort = {
   name: string;
   containerPort: number;