From 778413d4c0f9a33d21dc10c482c3d685480db8fb Mon Sep 17 00:00:00 2001
From: Jaanus Sellin <sellinjaanus@gmail.com>
Date: Wed, 14 Aug 2024 11:56:03 +0300
Subject: [PATCH] feat: plausible for events export (#7868)

Plausible for events exports. And small cleanup.
---
 .../component/events/EventLog/EventActions.tsx  | 17 ++++++++++++++---
 frontend/src/hooks/usePlausibleTracker.ts       |  3 ++-
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/frontend/src/component/events/EventLog/EventActions.tsx b/frontend/src/component/events/EventLog/EventActions.tsx
index 2b51d9e6ee..679372e818 100644
--- a/frontend/src/component/events/EventLog/EventActions.tsx
+++ b/frontend/src/component/events/EventLog/EventActions.tsx
@@ -12,6 +12,7 @@ import {
 import FileDownload from '@mui/icons-material/FileDownload';
 import type { EventSchema } from '../../../openapi';
 import { json2csv } from 'json-2-csv';
+import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
 
 const StyledActions = styled('div')(({ theme }) => ({
     display: 'flex',
@@ -29,6 +30,7 @@ interface IEventActions {
 
 export const EventActions: FC<IEventActions> = ({ events }) => {
     const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
+    const { trackEvent } = usePlausibleTracker();
 
     const open = Boolean(anchorEl);
     const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
@@ -53,6 +55,12 @@ export const EventActions: FC<IEventActions> = ({ events }) => {
 
         URL.revokeObjectURL(url);
         setAnchorEl(null);
+
+        trackEvent('events-exported', {
+            props: {
+                eventType: 'json',
+            },
+        });
     };
 
     const exportCsv = () => {
@@ -68,13 +76,16 @@ export const EventActions: FC<IEventActions> = ({ events }) => {
         const a = document.createElement('a');
         a.href = url;
         a.download = fileName;
-        a.style.display = 'none';
-        document.body.appendChild(a);
         a.click();
-        document.body.removeChild(a);
 
         URL.revokeObjectURL(url);
         setAnchorEl(null);
+
+        trackEvent('events-exported', {
+            props: {
+                eventType: 'csv',
+            },
+        });
     };
 
     return (
diff --git a/frontend/src/hooks/usePlausibleTracker.ts b/frontend/src/hooks/usePlausibleTracker.ts
index 1ef083ab08..8ae1095310 100644
--- a/frontend/src/hooks/usePlausibleTracker.ts
+++ b/frontend/src/hooks/usePlausibleTracker.ts
@@ -65,7 +65,8 @@ export type CustomEvents =
     | 'command-bar'
     | 'new-in-unleash-click'
     | 'new-in-unleash-dismiss'
-    | 'search-opened';
+    | 'search-opened'
+    | 'events-exported';
 
 export const usePlausibleTracker = () => {
     const plausible = useContext(PlausibleContext);