feat: add cloud gtm injection

global.d.ts

@@ -30,6 +30,7 @@ interface Window {
       badge?: string
     }
   }
+  dataLayer?: Array<Record<string, unknown>>
 }
 
 interface Navigator {

src/router.ts

@@ -36,6 +36,17 @@ function getBasePath(): string {
 
 const basePath = getBasePath()
 
+function pushPageView(): void {
+  if (!isCloud) return
+
+  const dataLayer = window.dataLayer ?? (window.dataLayer = [])
+  dataLayer.push({
+    event: 'page_view',
+    page_location: window.location.href,
+    page_title: document.title
+  })
+}
+
 const router = createRouter({
   history: isFileProtocol
     ? createWebHashHistory()
@@ -93,6 +104,10 @@ installPreservedQueryTracker(router, [
   }
 ])
 
+router.afterEach(() => {
+  pushPageView()
+})
+
 if (isCloud) {
   const { flags } = useFeatureFlags()
   const PUBLIC_ROUTE_NAMES = new Set([

src/stores/firebaseAuthStore.ts

@@ -81,6 +81,31 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
 
   const buildApiUrl = (path: string) => `${getComfyApiBaseUrl()}${path}`
 
+  const pushDataLayerEvent = (event: Record<string, unknown>) => {
+    if (!isCloud || typeof window === 'undefined') return
+    const dataLayer = window.dataLayer ?? (window.dataLayer = [])
+    dataLayer.push(event)
+  }
+
+  const hashSha256 = async (value: string): Promise<string | undefined> => {
+    if (typeof crypto === 'undefined' || !crypto.subtle) return
+    const data = new TextEncoder().encode(value)
+    const hash = await crypto.subtle.digest('SHA-256', data)
+    return Array.from(new Uint8Array(hash))
+      .map((b) => b.toString(16).padStart(2, '0'))
+      .join('')
+  }
+
+  const trackSignUp = async (method: 'email' | 'google' | 'github') => {
+    const userId = currentUser.value?.uid
+    const hashedUserId = userId ? await hashSha256(userId) : undefined
+    pushDataLayerEvent({
+      event: 'sign_up',
+      method,
+      ...(hashedUserId ? { user_id: hashedUserId } : {})
+    })
+  }
+
   // Providers
   const googleProvider = new GoogleAuthProvider()
   googleProvider.addScope('email')
@@ -347,6 +372,7 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
         method: 'email',
         is_new_user: true
       })
+      await trackSignUp('email')
     }
 
     return result
@@ -365,6 +391,9 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
         method: 'google',
         is_new_user: isNewUser
       })
+      if (isNewUser) {
+        await trackSignUp('google')
+      }
     }
 
     return result
@@ -383,6 +412,9 @@ export const useFirebaseAuthStore = defineStore('firebaseAuth', () => {
         method: 'github',
         is_new_user: isNewUser
       })
+      if (isNewUser) {
+        await trackSignUp('github')
+      }
     }
 
     return result

vite.config.mts

@@ -51,6 +51,16 @@ const DISTRIBUTION: 'desktop' | 'localhost' | 'cloud' =
       ? 'cloud'
       : 'localhost'
 
+const ENABLE_GTM =
+  process.env.ENABLE_GTM === 'true' || (!IS_DEV && DISTRIBUTION === 'cloud')
+const GTM_CONTAINER_ID = 'GTM-NP9JM6K7'
+const GTM_SCRIPT = `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+})(window,document,'script','dataLayer','${GTM_CONTAINER_ID}');`
+const GTM_NO_SCRIPT = `<iframe src="https://www.googletagmanager.com/ns.html?id=${GTM_CONTAINER_ID}" height="0" width="0" style="display:none;visibility:hidden"></iframe>`
+
 // Nightly builds are from main branch; RC/stable builds are from core/* branches
 // Can be overridden via IS_NIGHTLY env var for testing
 const IS_NIGHTLY =
@@ -416,7 +426,33 @@ export default defineConfig({
             }
           })
         ]
-      : [])
+      : []),
+    // Google Tag Manager (cloud distribution only)
+    {
+      name: 'inject-gtm',
+      transformIndexHtml: {
+        order: 'post',
+        handler(html) {
+          if (!ENABLE_GTM) return html
+
+          return {
+            html,
+            tags: [
+              {
+                tag: 'script',
+                children: GTM_SCRIPT,
+                injectTo: 'head-prepend'
+              },
+              {
+                tag: 'noscript',
+                children: GTM_NO_SCRIPT,
+                injectTo: 'body-prepend'
+              }
+            ]
+          }
+        }
+      }
+    }
   ],
 
   build: {