Merge pull request #64 from prisma/update-posthog

fix: posthog integration

Author: aidankmcalister

claim-db-worker/app/layout.tsx

@@ -6,7 +6,7 @@ import { Navbar } from "../components/Navbar";
 import { Footer } from "../components/Footer";
 import { DropProvider } from "./contexts/DropContext";
 import { Toaster } from "react-hot-toast";
-import { PageViewTracker } from "@/components/PageViewTracker";
+import { PostHogProvider } from "@/components/PostHogProvider";
 
 const barlow = Barlow({
   weight: ["400", "500", "700", "800", "900"],
@@ -54,15 +54,16 @@ export default function RootLayout({
           src="https://cdn.tolt.io/tolt.js"
           data-tolt="fda67739-7ed0-42d2-b716-6da0edbec191"
         />
-        <PageViewTracker />
         <Toaster toastOptions={{ duration: 4000 }} />
-        <DropProvider>
-          <div className="flex items-center justify-center flex-col min-h-screen max-w-screen-xl mx-auto w-full">
-            <Navbar />
-            {children}
-            <Footer />
-          </div>
-        </DropProvider>
+        <PostHogProvider>
+          <DropProvider>
+            <div className="flex items-center justify-center flex-col min-h-screen max-w-screen-xl mx-auto w-full">
+              <Navbar />
+              {children}
+              <Footer />
+            </div>
+          </DropProvider>
+        </PostHogProvider>
       </body>
     </html>
   );

claim-db-worker/components/PostHogProvider.tsx

@@ -0,0 +1,37 @@
+"use client";
+
+import posthog, { PostHog } from "posthog-js";
+import { PostHogProvider as PHProvider } from "posthog-js/react";
+
+declare global {
+  interface Window {
+    posthog: PostHog;
+  }
+}
+
+export function PostHogProvider({ children }: { children: React.ReactNode }) {
+  if (
+    typeof window !== "undefined" &&
+    process.env.NEXT_PUBLIC_POSTHOG_API_KEY
+  ) {
+    posthog.init(process.env.NEXT_PUBLIC_POSTHOG_API_KEY || "", {
+      api_host:
+        process.env.NEXT_PUBLIC_POSTHOG_API_HOST ||
+        "https://proxyhog.prisma-data.net",
+      person_profiles: "identified_only",
+      capture_pageview: true,
+      capture_pageleave: true,
+      autocapture: true,
+      debug: process.env.NODE_ENV === "development", // Enable debug in development
+      loaded: (posthog) => {
+        if (process.env.NODE_ENV === "development") {
+          console.log("PostHog initialized in debug mode");
+          // Make posthog available globally for debugging
+          window.posthog = posthog;
+        }
+      },
+    });
+  }
+
+  return <PHProvider client={posthog}>{children}</PHProvider>;
+}

claim-db-worker/package.json

@@ -25,6 +25,7 @@
     "lucide-react": "^0.541.0",
     "next": "15.4.6",
     "pg": "^8.16.3",
+    "posthog-js": "^1.282.0",
     "prisma": "^6.14.0",
     "react": "19.1.0",
     "react-dom": "19.1.0",