feat: start tracking project tab navigation

Unleash · Oct 25, 2024 · ff6ca92 · ff6ca92
1 parent bd44023
commit ff6ca92
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/frontend/src/component/project/Project/Project.tsx b/frontend/src/component/project/Project/Project.tsx
@@ -44,6 +44,7 @@ import { ProjectApplications } from '../ProjectApplications/ProjectApplications'
 import { ProjectInsights } from './ProjectInsights/ProjectInsights';
 import useProjectOverview from 'hooks/api/getters/useProjectOverview/useProjectOverview';
 import { ProjectArchived } from './ArchiveProject/ProjectArchived';
+import { usePlausibleTracker } from '../../../hooks/usePlausibleTracker';
 
 const StyledBadge = styled(Badge)(({ theme }) => ({
     position: 'absolute',
@@ -65,6 +66,7 @@ interface ITab {
 
 export const Project = () => {
     const projectId = useRequiredPathParam('projectId');
+    const { trackEvent } = usePlausibleTracker();
     const params = useQueryParams();
     const { project, loading, error, refetch } = useProjectOverview(projectId);
     const ref = useLoading(loading, '[data-loading-project=true]');
@@ -252,7 +254,16 @@ export const Project = () => {
                                     key={tab.title}
                                     label={tab.title}
                                     value={tab.path}
-                                    onClick={() => navigate(tab.path)}
+                                    onClick={() => {
+                                        if (tab.title !== 'Flags') {
+                                            trackEvent('project-navigation', {
+                                                props: {
+                                                    eventType: tab.title,
+                                                },
+                                            });
+                                        }
+                                        navigate(tab.path);
+                                    }}
                                     data-testid={`TAB_${tab.title}`}
                                     iconPosition={
                                         tab.isEnterprise ? 'end' : undefined

diff --git a/frontend/src/hooks/usePlausibleTracker.ts b/frontend/src/hooks/usePlausibleTracker.ts
@@ -71,7 +71,8 @@ export type CustomEvents =
     | 'onboarding'
     | 'personal-dashboard'
     | 'order-environments'
-    | 'unleash-ai-chat';
+    | 'unleash-ai-chat'
+    | 'project-navigation';
 
 export const usePlausibleTracker = () => {
     const plausible = useContext(PlausibleContext);