From 017b1b93c854ff8a83fde360c59fa4c07b65d6d9 Mon Sep 17 00:00:00 2001
From: ernstmul <ernst.mulders@gmail.com>
Date: Wed, 5 Mar 2025 15:51:36 +0100
Subject: [PATCH] Update exiting clicks to enum

---
 src/lib/actions/analytics.ts           | 4 ++++
 src/lib/components/fakeModal.svelte    | 8 ++++----
 src/lib/components/modalSideCol.svelte | 4 ++--
 src/lib/components/modalWrapper.svelte | 6 +++---
 src/lib/layout/breadcrumbs.svelte      | 4 ++--
 src/lib/layout/header.svelte           | 6 +++---
 6 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/src/lib/actions/analytics.ts b/src/lib/actions/analytics.ts
index 2a592b8af..a6050a508 100644
--- a/src/lib/actions/analytics.ts
+++ b/src/lib/actions/analytics.ts
@@ -139,9 +139,13 @@ export function isTrackingAllowed() {
 }
 
 export enum Click {
+    BreadcrumbClick = 'click_breadcrumb',
     KeyCreateClick = 'click_key_create',
+    MenuDropDownClick = 'click_menu_dropdown',
+    ModalCloseClick = 'click_close_modal',
     PlatformCreateClick = 'click_platform_create',
     OrganizationClickCreate = 'click_create_organization',
+    OrganizationClickUpgrade = 'click_organization_upgrade',
     OnboardingSetupDatabaseClick = 'click_onboarding_setup_database',
     OnboardingApiReferencesClick = 'click_onboarding_api_references',
     OnboardingTutorialsClick = 'click_onboarding_tutorials',
diff --git a/src/lib/components/fakeModal.svelte b/src/lib/components/fakeModal.svelte
index 23bb89aa7..23ff6c99e 100644
--- a/src/lib/components/fakeModal.svelte
+++ b/src/lib/components/fakeModal.svelte
@@ -2,7 +2,7 @@
     import { Alert } from '$lib/components';
     import { onMount } from 'svelte';
     import Form from '$lib/elements/forms/form.svelte';
-    import { trackEvent } from '$lib/actions/analytics';
+    import { Click, trackEvent } from '$lib/actions/analytics';
     import { clickOnEnter } from '$lib/helpers/a11y';
 
     export let show = false;
@@ -23,7 +23,7 @@
 
     function handleBLur(event: MouseEvent) {
         if (event.target === backdrop) {
-            trackEvent('click_close_modal', {
+            trackEvent(Click.ModalCloseClick, {
                 from: 'backdrop'
             });
             closeModal();
@@ -38,7 +38,7 @@
     function handleKeydown(event: KeyboardEvent) {
         if (event.key === 'Escape') {
             event.preventDefault();
-            trackEvent('click_close_modal', {
+            trackEvent(Click.ModalCloseClick, {
                 from: 'escape'
             });
             closeModal();
@@ -100,7 +100,7 @@
                                 aria-label="Close Modal"
                                 title="Close Modal"
                                 on:click={() =>
-                                    trackEvent('click_close_modal', {
+                                    trackEvent(Click.ModalCloseClick, {
                                         from: 'button'
                                     })}
                                 on:click={closeModal}>
diff --git a/src/lib/components/modalSideCol.svelte b/src/lib/components/modalSideCol.svelte
index ef737433a..af61e0496 100644
--- a/src/lib/components/modalSideCol.svelte
+++ b/src/lib/components/modalSideCol.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
     import { ModalWrapper } from '$lib/components';
-    import { trackEvent } from '$lib/actions/analytics';
+    import { Click, trackEvent } from '$lib/actions/analytics';
 
     export let show = false;
     export let title = '';
@@ -28,7 +28,7 @@
                         aria-label="Close Modal"
                         title="Close Modal"
                         on:click={() =>
-                            trackEvent('click_close_modal', {
+                            trackEvent(Click.ModalCloseClick, {
                                 from: 'button'
                             })}
                         on:click={close}>
diff --git a/src/lib/components/modalWrapper.svelte b/src/lib/components/modalWrapper.svelte
index b33bbe204..09129b01c 100644
--- a/src/lib/components/modalWrapper.svelte
+++ b/src/lib/components/modalWrapper.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
     import { createEventDispatcher, onDestroy, onMount } from 'svelte';
-    import { trackEvent } from '$lib/actions/analytics';
+    import { Click, trackEvent } from '$lib/actions/analytics';
     import { disableCommands } from '$lib/commandCenter';
 
     export let show = false;
@@ -23,7 +23,7 @@
 
     function handleBLur(event: MouseEvent) {
         if (event.target === dialog) {
-            trackEvent('click_close_modal', {
+            trackEvent(Click.ModalCloseClick, {
                 from: 'backdrop'
             });
             closeModal();
@@ -50,7 +50,7 @@
     function handleKeydown(event: KeyboardEvent) {
         if (event.key === 'Escape') {
             event.preventDefault();
-            trackEvent('click_close_modal', {
+            trackEvent(Click.ModalCloseClick, {
                 from: 'escape'
             });
             closeModal();
diff --git a/src/lib/layout/breadcrumbs.svelte b/src/lib/layout/breadcrumbs.svelte
index d700654e2..0c214b7e4 100644
--- a/src/lib/layout/breadcrumbs.svelte
+++ b/src/lib/layout/breadcrumbs.svelte
@@ -6,12 +6,12 @@
 </script>
 
 <script lang="ts">
-    import { trackEvent } from '$lib/actions/analytics';
+    import { Click, trackEvent } from '$lib/actions/analytics';
 
     export let breadcrumbs: Breadcrumb[];
 
     function track() {
-        trackEvent('click_breadcrumb');
+        trackEvent(Click.BreadcrumbClick);
     }
 </script>
 
diff --git a/src/lib/layout/header.svelte b/src/lib/layout/header.svelte
index deeb75a5d..07685c62f 100644
--- a/src/lib/layout/header.svelte
+++ b/src/lib/layout/header.svelte
@@ -6,7 +6,7 @@
     import { user } from '$lib/stores/user';
     import { organizationList, organization, newOrgModal } from '$lib/stores/organization';
     import { page } from '$app/stores';
-    import { trackEvent } from '$lib/actions/analytics';
+    import { Click, trackEvent } from '$lib/actions/analytics';
     import { tooltip } from '$lib/actions/tooltip';
     import { toggleCommandCenter } from '$lib/commandCenter/commandCenter.svelte';
     import Button from '$lib/elements/forms/button.svelte';
@@ -53,7 +53,7 @@
     }
 
     $: if (showDropdown) {
-        trackEvent('click_menu_dropdown');
+        trackEvent(Click.MenuDropDownClick);
     }
 
     const slideFade: typeof slide = (node, options) => {
@@ -97,7 +97,7 @@
                 disabled={$organization?.markedForDeletion}
                 href={$upgradeURL}
                 on:click={() => {
-                    trackEvent('click_organization_upgrade', {
+                    trackEvent(Click.OrganizationClickUpgrade, {
                         from: 'button',
                         source: 'top_nav'
                     });