Added MixPanel referral tracking; updated button in navbar.

Author: Culpable

public/scripts/referral-tracking.js

@@ -0,0 +1,98 @@
+(function() {
+    // Function to get query parameter value by name
+    function getQueryParam(param) {
+        const urlParams = new URLSearchParams(window.location.search);
+        return urlParams.get(param);
+    }
+
+    // Function to get the initial referrer
+    function getInitialReferrer() {
+        return document.referrer;
+    }
+
+    // Function to get the referring domain
+    function getReferringDomain(referrer) {
+        try {
+            const url = new URL(referrer);
+            return url.hostname;
+        } catch (e) {
+            return null;
+        }
+    }
+
+    // Store initial referrer and referring domain to avoid redundant calls
+    const initialReferrer = getInitialReferrer();
+    const referringDomain = getReferringDomain(initialReferrer);
+
+    // Function to check if the referrer or browser is Facebook
+    function isFacebookSource() {
+        const userAgent = navigator.userAgent.toLowerCase();
+        return (
+            (referringDomain && referringDomain.includes('facebook.com')) ||
+            userAgent.includes('fb') ||
+            userAgent.includes('facebook')
+        );
+    }
+
+    // Function to check if the referrer is Google
+    function isGoogleSource() {
+        return (
+            referringDomain && referringDomain.includes('google.com')
+        );
+    }
+
+    // Function to check if the referrer is Bing
+    function isBingSource() {
+        return (
+            referringDomain && referringDomain.includes('bing.com')
+        );
+    }
+
+    // Determine referral source
+    let referralSource = 'Direct or Other';
+
+    const fbclid = getQueryParam('fbclid');
+    const utmSource = getQueryParam('utm_source');
+
+    if (fbclid) {
+        referralSource = 'Facebook';
+    } else if (utmSource) {
+        const normalisedUtmSource = utmSource.toLowerCase();
+        if (normalisedUtmSource === 'chatgpt.com') {
+            referralSource = 'ChatGPT';
+        } else if (normalisedUtmSource === 'perplexity.ai') {
+            referralSource = 'Perplexity';
+        } else if (normalisedUtmSource === 'deepseek.com') {
+            referralSource = 'DeepSeek';
+        } else {
+            referralSource = normalisedUtmSource;
+        }
+    } else if (isFacebookSource()) {
+        referralSource = 'Facebook';
+    } else if (isGoogleSource()) {
+        referralSource = 'Google';
+    } else if (isBingSource()) {
+        referralSource = 'Bing';
+    } // No need for an else here as 'Direct or Other' is already set by default
+
+    // Polling mechanism to ensure MixPanel is loaded before tracking
+    var maxAttempts = 10;
+    var attempts = 0;
+    var interval = 100; // in milliseconds
+
+    function trackReferralSource() {
+        attempts++;
+        // Safely check if mixpanel is defined and ready
+        if (window.mixpanelLoaded && typeof window.mixpanel !== 'undefined' && typeof window.mixpanel.track === 'function') {
+            window.mixpanel.track('Referral Source Identified', {
+                'Referral Source': referralSource
+            });
+        } else if (attempts < maxAttempts) {
+            // Retry after a short delay
+            setTimeout(trackReferralSource, interval);
+        }
+    }
+
+    // Start tracking referral source
+    trackReferralSource();
+})(); 

src/app/page.jsx

@@ -235,6 +235,11 @@ export default function Home() {
           __html: JSON.stringify(organizationSchema)
         }}
       />
+      <Script
+        id="referral-tracking"
+        src="/scripts/referral-tracking.js"
+        strategy="afterInteractive"
+      />
       <Hero />
       <main>
         {/* Commented out logo cloud for now */}

src/components/MixpanelProvider.jsx

@@ -16,6 +16,7 @@ export default function MixpanelProvider() {
   useEffect(() => {
     console.log('Initializing Mixpanel with Session Replay...');
     initMixpanel();
+    // Flag is now set in initMixpanel
   }, []);
 
   // Track page views whenever the pathname changes

src/components/navbar.jsx

@@ -10,6 +10,7 @@ import { motion } from 'framer-motion'
 import { Link } from './link'
 import { Logo } from './logo'
 import { PlusGrid, PlusGridItem, PlusGridRow } from './plus-grid'
+import { Button } from './button'
 
 const links = [
   { href: '/pricing', label: 'Pricing' },
@@ -26,10 +27,10 @@ function DesktopNav() {
           {label === 'Book a Demo' ? (
             <Link
               href={href}
-              className="inline-flex items-center mx-2 text-sm font-semibold transition"
+              className="flex items-center px-2 py-3"
             >
-              <div className="rounded-full px-4 py-2.5 bg-black text-white hover:bg-gray-800 transition">
-                <span className="relative top-px">{label}</span>
+              <div className="rounded-full px-4 py-2 bg-black text-white hover:bg-gray-800 transition">
+                <span className="text-sm font-medium">{label}</span>
               </div>
             </Link>
           ) : (
@@ -73,14 +74,9 @@ function MobileNav() {
             key={href}
           >
             {label === 'Book a Demo' ? (
-              <Link 
-                href={href} 
-                className="inline-flex items-center mx-2 text-sm font-semibold transition"
-              >
-                <div className="rounded-full px-4 py-1.5 bg-black text-white hover:bg-gray-800 transition">
-                  <span className="relative top-px">{label}</span>
-                </div>
-              </Link>
+              <div className="mx-2">
+                <Button href={href}>{label}</Button>
+              </div>
             ) : (
               <Link href={href} className="text-base font-medium text-gray-950">
                 {label}

src/lib/mixpanelClient.js

@@ -24,6 +24,12 @@ export const initMixpanel = () => {
     record_idle_timeout_ms: 600000,
     record_min_ms: 3000,
   });
+  
+  // Explicitly expose mixpanel instance globally
+  window.mixpanel = mixpanel;
+  
+  // Set flag for referral tracking script
+  window.mixpanelLoaded = true;
 };
 
 /**