feat: tracking

apps/frontend/src/app/(app)/layout.tsx

@@ -82,6 +82,8 @@ export default async function AppLayout({ children }: { children: ReactNode }) {
           disableXAnalytics={!!process.env.DISABLE_X_ANALYTICS}
           sentryDsn={process.env.NEXT_PUBLIC_SENTRY_DSN!}
           extensionId={process.env.EXTENSION_ID || ''}
+          googleAdsId={process.env.NEXT_PUBLIC_GTM_ID}
+          googleAdsTrialTracking={process.env.NEXT_PUBLIC_TRACKING_TRIAL}
           language={language}
           transloadit={
             process.env.TRANSLOADIT_AUTH && process.env.TRANSLOADIT_TEMPLATE

apps/frontend/src/components/layout/gtm.component.tsx

@@ -3,25 +3,32 @@
 import Script from 'next/script';
 import { FC, useEffect } from 'react';
 import { useUser } from '@gitroom/frontend/components/layout/user.context';
+import { useVariables } from '@gitroom/react/helpers/variable.context';
 
 export const TrialTracker: FC = () => {
   const user = useUser();
+  const { googleAdsId, googleAdsTrialTracking } = useVariables();
   useEffect(() => {
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-expect-error
-    if (typeof window === 'undefined' || !user?.id || !window.dataLayer) return;
+    if (
+      typeof window === 'undefined' ||
+      !user?.id ||
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-expect-error
+      !window.gtag ||
+      !googleAdsId ||
+      !googleAdsTrialTracking
+    )
+      return;
     const params = new URLSearchParams(window.location.search);
     if (params.get('onboarding') !== 'true') return;
-    const check = params.get('check') || 'unknown';
     const key = `gtm_start_trial_${user?.id}`;
     if (sessionStorage.getItem(key)) return;
     sessionStorage.setItem(key, '1');
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-expect-error
-    window.dataLayer = window.dataLayer || [];
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-expect-error
-    window.dataLayer.push({ event: 'start_trial', check });
+    gtag('event', 'conversion', {
+      send_to: `${googleAdsId}/${googleAdsTrialTracking}`,
+    });
   }, [user]);
   return null;
 };

libraries/react-shared-libraries/src/helpers/variable.context.tsx

@@ -29,6 +29,8 @@ interface VariableContextInterface {
   transloadit: string[];
   sentryDsn: string;
   extensionId: string;
+  googleAdsId?: string;
+  googleAdsTrialTracking?: string;
 }
 const VariableContext = createContext({
   stripeClient: '',
@@ -36,6 +38,8 @@ const VariableContext = createContext({
   isGeneral: true,
   genericOauth: false,
   oauthLogoUrl: '',
+  googleAdsId: '',
+  googleAdsTrialTracking: '',
   oauthDisplayName: '',
   mcpUrl: '',
   cloudflareUrl: '',