From 0653800cb887dee922d42deb187b0cb66fb65db3 Mon Sep 17 00:00:00 2001
From: David Leek <david@getunleash.io>
Date: Thu, 3 Oct 2024 15:35:34 +0200
Subject: [PATCH] chore: plausible event for event timeline signals tip click
 (#8349)

---
 .../EventTimelineEventGroup.tsx                      |  6 +++++-
 .../EventTimelineHeader/EventTimelineHeader.tsx      |  6 +++++-
 .../EventTimelineHeader/EventTimelineHeaderTip.tsx   | 11 ++++++++++-
 frontend/src/component/menu/Header/Header.tsx        | 12 +++++++-----
 frontend/src/hooks/usePlausibleTracker.ts            |  4 +---
 5 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/frontend/src/component/events/EventTimeline/EventTimelineEventGroup/EventTimelineEventGroup.tsx b/frontend/src/component/events/EventTimeline/EventTimelineEventGroup/EventTimelineEventGroup.tsx
index 638870814c..5e2aeb64d1 100644
--- a/frontend/src/component/events/EventTimeline/EventTimelineEventGroup/EventTimelineEventGroup.tsx
+++ b/frontend/src/component/events/EventTimeline/EventTimelineEventGroup/EventTimelineEventGroup.tsx
@@ -34,7 +34,11 @@ export const EventTimelineEventGroup = ({
 
     const position = `${((eventTime - startTime) / timelineDuration) * 100}%`;
     const trackHover = () => {
-        trackEvent('event-timeline-event-hover');
+        trackEvent('event-timeline', {
+            props: {
+                eventType: 'event hover',
+            },
+        });
     };
 
     return (
diff --git a/frontend/src/component/events/EventTimeline/EventTimelineHeader/EventTimelineHeader.tsx b/frontend/src/component/events/EventTimeline/EventTimelineHeader/EventTimelineHeader.tsx
index 1e44005da5..deb6ba0390 100644
--- a/frontend/src/component/events/EventTimeline/EventTimelineHeader/EventTimelineHeader.tsx
+++ b/frontend/src/component/events/EventTimeline/EventTimelineHeader/EventTimelineHeader.tsx
@@ -124,7 +124,11 @@ export const EventTimelineHeader = ({
                         aria-label='close'
                         size='small'
                         onClick={() => {
-                            trackEvent('event-timeline-close');
+                            trackEvent('event-timeline', {
+                                props: {
+                                    eventType: 'close',
+                                },
+                            });
                             setOpen(false);
                         }}
                     >
diff --git a/frontend/src/component/events/EventTimeline/EventTimelineHeader/EventTimelineHeaderTip.tsx b/frontend/src/component/events/EventTimeline/EventTimelineHeader/EventTimelineHeaderTip.tsx
index 5794ef3c1b..248c4f3d1b 100644
--- a/frontend/src/component/events/EventTimeline/EventTimelineHeader/EventTimelineHeaderTip.tsx
+++ b/frontend/src/component/events/EventTimeline/EventTimelineHeader/EventTimelineHeaderTip.tsx
@@ -7,6 +7,7 @@ import { useContext } from 'react';
 import { useEventTimelineContext } from '../EventTimelineContext';
 import { Link, useNavigate } from 'react-router-dom';
 import SensorsIcon from '@mui/icons-material/Sensors';
+import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
 
 const StyledTip = styled('div')({
     display: 'flex',
@@ -30,6 +31,7 @@ export const EventTimelineHeaderTip = () => {
     const { isAdmin } = useContext(AccessContext);
     const signalsEnabled = useUiFlag('signals');
     const { signalEndpoints, loading } = useSignalEndpoints();
+    const { trackEvent } = usePlausibleTracker();
 
     if (
         !signalsSuggestionSeen &&
@@ -50,7 +52,14 @@ export const EventTimelineHeaderTip = () => {
                             external sources in real-time within Unleash
                         </>
                     }
-                    onClick={() => navigate(signalsLink)}
+                    onClick={() => {
+                        trackEvent('event-timeline', {
+                            props: {
+                                eventType: 'signals clicked',
+                            },
+                        });
+                        navigate(signalsLink);
+                    }}
                     onDelete={() => setSignalsSuggestionSeen(true)}
                 />
             </StyledTip>
diff --git a/frontend/src/component/menu/Header/Header.tsx b/frontend/src/component/menu/Header/Header.tsx
index 40a36c2e19..cd3be43cc6 100644
--- a/frontend/src/component/menu/Header/Header.tsx
+++ b/frontend/src/component/menu/Header/Header.tsx
@@ -200,11 +200,13 @@ const Header = () => {
                                 >
                                     <StyledIconButton
                                         onClick={() => {
-                                            trackEvent(
-                                                showTimeline
-                                                    ? 'event-timeline-close'
-                                                    : 'event-timeline-open',
-                                            );
+                                            trackEvent('event-timeline', {
+                                                props: {
+                                                    eventType: showTimeline
+                                                        ? 'close'
+                                                        : 'open',
+                                                },
+                                            });
                                             setShowTimeline(!showTimeline);
                                         }}
                                         size='large'
diff --git a/frontend/src/hooks/usePlausibleTracker.ts b/frontend/src/hooks/usePlausibleTracker.ts
index fb807fd976..e2e2167f1c 100644
--- a/frontend/src/hooks/usePlausibleTracker.ts
+++ b/frontend/src/hooks/usePlausibleTracker.ts
@@ -67,9 +67,7 @@ export type CustomEvents =
     | 'new-in-unleash-dismiss'
     | 'search-opened'
     | 'events-exported'
-    | 'event-timeline-open'
-    | 'event-timeline-close'
-    | 'event-timeline-event-hover'
+    | 'event-timeline'
     | 'onboarding';
 
 export const usePlausibleTracker = () => {