From ed224bebfb28ab69b9bf930ffde0c5da81d475dc Mon Sep 17 00:00:00 2001
From: andrewwallacespeckle <andrew@speckle.systems>
Date: Sat, 19 Apr 2025 13:11:40 +0100
Subject: [PATCH] Move Project CTA Clicked

---
 .../frontend-2/components/projects/Dashboard.vue | 15 ++++++++++++---
 .../components/workspace/ProjectList.vue         | 16 ++++++++++++++--
 .../frontend-2/pages/projects/[id]/index.vue     | 15 ++++++++++-----
 3 files changed, 36 insertions(+), 10 deletions(-)

diff --git a/packages/frontend-2/components/projects/Dashboard.vue b/packages/frontend-2/components/projects/Dashboard.vue
index 889362d5a..5cd09fcc9 100644
--- a/packages/frontend-2/components/projects/Dashboard.vue
+++ b/packages/frontend-2/components/projects/Dashboard.vue
@@ -4,7 +4,7 @@
     <div v-if="!showEmptyState" class="flex flex-col gap-4">
       <ProjectsMoveToWorkspaceAlert
         v-if="isWorkspacesEnabled"
-        @move-project="(id) => onMoveProject(id)"
+        @move-project="(id) => onMoveProject(id, 'projects')"
       />
       <div class="flex items-center gap-2 mb-2">
         <Squares2X2Icon class="h-5 w-5" />
@@ -66,7 +66,7 @@
       <ProjectsDashboardFilled
         :projects="projects"
         show-workspace-link
-        @move-project="(id) => onMoveProject(id)"
+        @move-project="(id) => onMoveProject(id, 'project_card')"
       />
       <InfiniteLoading
         :settings="{ identifier: infiniteLoaderId }"
@@ -91,6 +91,7 @@ import type { Nullable, Optional, StreamRoles } from '@speckle/shared'
 import { useDebouncedTextInput, type InfiniteLoaderState } from '@speckle/ui-components'
 import { MagnifyingGlassIcon, Squares2X2Icon } from '@heroicons/vue/24/outline'
 import { useUserProjectsUpdatedTracking } from '~~/lib/user/composables/projectUpdates'
+import { useMixpanel } from '~/lib/core/composables/mp'
 
 graphql(`
   fragment ProjectsDashboard_UserProjectCollection on UserProjectCollection {
@@ -193,7 +194,15 @@ const infiniteLoad = async (state: InfiniteLoaderState) => {
   }
 }
 
-const onMoveProject = (projectId: string) => {
+const mixpanel = useMixpanel()
+
+const onMoveProject = (projectId: string, location: string) => {
+  mixpanel.track('Move Project CTA Clicked', {
+    location,
+    // eslint-disable-next-line camelcase
+    workspace_id:
+      projects.value?.items.find((p) => p.id === projectId)?.workspace?.id || undefined
+  })
   emittedProjectId.value = projectId
   showMoveProjectDialog.value = true
 }
diff --git a/packages/frontend-2/components/workspace/ProjectList.vue b/packages/frontend-2/components/workspace/ProjectList.vue
index a39679934..63a098f7f 100644
--- a/packages/frontend-2/components/workspace/ProjectList.vue
+++ b/packages/frontend-2/components/workspace/ProjectList.vue
@@ -22,7 +22,7 @@
         v-if="workspace"
         :icon="Squares2X2Icon"
         :workspace-info="workspace"
-        @show-move-projects-dialog="showMoveProjectsDialog = true"
+        @show-move-projects-dialog="onMoveProject"
         @show-new-project-dialog="openNewProject = true"
         @show-invite-dialog="showInviteDialog = true"
       />
@@ -61,7 +61,7 @@
           :can-create-project="canCreateProject"
           :can-move-project-to-workspace="canMoveProjectToWorkspace"
           @new-project="openNewProject = true"
-          @move-project="showMoveProjectsDialog = true"
+          @move-project="onMoveProject"
         />
       </section>
 
@@ -101,6 +101,7 @@ import { workspaceRoute } from '~/lib/common/helpers/route'
 import { useBillingActions } from '~/lib/billing/composables/actions'
 import { useWorkspacesWizard } from '~/lib/workspaces/composables/wizard'
 import type { WorkspaceWizardState } from '~/lib/workspaces/helpers/types'
+import { useMixpanel } from '~/lib/core/composables/mp'
 
 graphql(`
   fragment WorkspaceProjectList_Workspace on Workspace {
@@ -227,6 +228,17 @@ const clearSearch = () => {
 
 const hasFinalized = ref(false)
 
+const mixpanel = useMixpanel()
+
+const onMoveProject = () => {
+  mixpanel.track('Move Project CTA Clicked', {
+    location: 'workspace',
+    // eslint-disable-next-line camelcase
+    workspace_id: props.workspaceSlug
+  })
+  showMoveProjectsDialog.value = true
+}
+
 onResult((queryResult) => {
   if (
     queryResult.data?.workspaceBySlug.creationState?.completed === false &&
diff --git a/packages/frontend-2/pages/projects/[id]/index.vue b/packages/frontend-2/pages/projects/[id]/index.vue
index 395ff238a..890e151cf 100644
--- a/packages/frontend-2/pages/projects/[id]/index.vue
+++ b/packages/frontend-2/pages/projects/[id]/index.vue
@@ -85,6 +85,7 @@ import type { LayoutMenuItem } from '~~/lib/layout/helpers/components'
 import { EllipsisHorizontalIcon } from '@heroicons/vue/24/solid'
 import { HorizontalDirection } from '~~/lib/common/composables/window'
 import { useCopyProjectLink } from '~~/lib/projects/composables/projectManagement'
+import { useMixpanel } from '~/lib/core/composables/mp'
 
 graphql(`
   fragment ProjectPageProject on Project {
@@ -146,6 +147,7 @@ const route = useRoute()
 const router = useRouter()
 const copyProjectLink = useCopyProjectLink()
 const { isLoggedIn } = useActiveUser()
+const mixpanel = useMixpanel()
 
 const projectId = computed(() => route.params.id as string)
 const token = computed(() => route.query.token as Optional<string>)
@@ -322,6 +324,13 @@ const disableLegacyMoveProjectButton = computed(
   () => !project.value?.permissions.canMoveToWorkspace.authorized
 )
 
+const onMoveProject = () => {
+  mixpanel.track('Move Project CTA Clicked', {
+    location: 'project'
+  })
+  showMoveDialog.value = true
+}
+
 const onActionChosen = (params: { item: LayoutMenuItem; event: MouseEvent }) => {
   const { item } = params
 
@@ -330,12 +339,8 @@ const onActionChosen = (params: { item: LayoutMenuItem; event: MouseEvent }) =>
       copyProjectLink(projectId.value)
       break
     case ActionTypes.Move:
-      showMoveDialog.value = true
+      onMoveProject()
       break
   }
 }
-
-const onMoveProject = () => {
-  showMoveDialog.value = true
-}
 </script>