diff --git a/app/PostHogPageView.tsx b/app/PostHogPageView.tsx
new file mode 100644
index 0000000..61e275d
--- /dev/null
+++ b/app/PostHogPageView.tsx
@@ -0,0 +1,29 @@
+// app/PostHogPageView.tsx
+'use client'
+
+import { usePathname, useSearchParams } from "next/navigation";
+import { useEffect } from "react";
+import { usePostHog } from 'posthog-js/react';
+
+export default function PostHogPageView() : null {
+ const pathname = usePathname();
+ const searchParams = useSearchParams();
+ const posthog = usePostHog();
+ // Track pageviews
+ useEffect(() => {
+ if (pathname && posthog) {
+ let url = window.origin + pathname
+ if (searchParams.toString()) {
+ url = url + `?${searchParams.toString()}`
+ }
+ posthog.capture(
+ '$pageview',
+ {
+ '$current_url': url,
+ }
+ )
+ }
+ }, [pathname, searchParams, posthog])
+
+ return null
+}
\ No newline at end of file
diff --git a/app/layout.tsx b/app/layout.tsx
index 160bead..05ef262 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -2,7 +2,12 @@
import './globals.css'
import { SessionProvider } from "next-auth/react";
import { AuthProvider } from './contexts/AuthContext';
+import { PHProvider } from './providers';
+import dynamic from 'next/dynamic'
+const PostHogPageView = dynamic(() => import('./PostHogPageView'), {
+ ssr: false,
+})
export default function RootLayout({
children,
@@ -11,11 +16,15 @@ export default function RootLayout({
}) {
return (
-
-
+
+
+
+
{children}
-
-
+
+
+
+
)
diff --git a/app/providers/index.tsx b/app/providers/index.tsx
index 8e1a77b..2acf4a1 100644
--- a/app/providers/index.tsx
+++ b/app/providers/index.tsx
@@ -2,6 +2,16 @@
import { useSession, signIn } from "next-auth/react"
import Loader from '@/components/Loader';
+import posthog from 'posthog-js'
+import { PostHogProvider } from 'posthog-js/react'
+
+if (typeof window !== 'undefined') {
+ posthog.init(process.env.NEXT_PUBLIC_POSTHOG_KEY!, {
+ api_host: process.env.NEXT_PUBLIC_POSTHOG_HOST,
+ capture_pageview: false // Disable automatic pageview capture, as we capture manually
+ })
+}
+
export default function AdminSessionProvider({
children
}: {
@@ -24,3 +34,12 @@ export default function AdminSessionProvider({
)
}
+
+
+export function PHProvider({
+ children,
+}: {
+ children: React.ReactNode
+}) {
+ return {children}
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 369ab3a..5c8374e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,6 +21,7 @@
"next": "13.4.9",
"next-auth": "4.23.1",
"postcss": "^8.4.29",
+ "posthog-js": "^1.130.0",
"qrcode.react": "^3.1.0",
"react": "18.2.0",
"react-datepicker": "^4.17.0",
@@ -2949,6 +2950,11 @@
"reusify": "^1.0.4"
}
},
+ "node_modules/fflate": {
+ "version": "0.4.8",
+ "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.4.8.tgz",
+ "integrity": "sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA=="
+ },
"node_modules/file-entry-cache": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz",
@@ -4904,6 +4910,15 @@
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
"integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ=="
},
+ "node_modules/posthog-js": {
+ "version": "1.130.0",
+ "resolved": "https://registry.npmjs.org/posthog-js/-/posthog-js-1.130.0.tgz",
+ "integrity": "sha512-bCrw5HunoXLybO20Q1bYEg68i5WCZWKxhStYJK4OR/9jrm7GwZ53GDrN78p8apFi0EH5ay4YZGbLFSkg+SsZWQ==",
+ "dependencies": {
+ "fflate": "^0.4.8",
+ "preact": "^10.19.3"
+ }
+ },
"node_modules/preact": {
"version": "10.19.6",
"resolved": "https://registry.npmjs.org/preact/-/preact-10.19.6.tgz",
diff --git a/package.json b/package.json
index 080f9dd..b044441 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
"next": "13.4.9",
"next-auth": "4.23.1",
"postcss": "^8.4.29",
+ "posthog-js": "^1.130.0",
"qrcode.react": "^3.1.0",
"react": "18.2.0",
"react-datepicker": "^4.17.0",