feat: adding posthog

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "thatconference.com",
-	"version": "5.2.3",
+	"version": "5.2.4",
 	"description": "THATConference.com website",
 	"main": "index.js",
 	"type": "module",
@@ -78,6 +78,7 @@
 		"postcss": "^8.4.31",
 		"postcss-cli": "^10.1.0",
 		"postcss-load-config": "^4.0.1",
+		"posthog-js": "^1.95.1",
 		"prettier": "^3.0.3",
 		"prettier-plugin-svelte": "^3.0.3",
 		"prettier-plugin-tailwindcss": "^0.5.6",

src/routes/+layout.server.js

@@ -9,7 +9,7 @@ const body = {
 	variables: {}
 };
 
-async function queryMe(accessToken) {
+async function queryMe(fetch, accessToken) {
 	return await fetch(config.api.direct, {
 		method: 'POST',
 		headers: {
@@ -25,7 +25,7 @@ async function queryMe(accessToken) {
 }
 
 export const load = loadFlashMessage(async (event) => {
-	let { locals } = event;
+	let { locals, fetch } = event;
 	const auth0Session = await locals.getSession();
 
 	let user = {
@@ -36,7 +36,7 @@ export const load = loadFlashMessage(async (event) => {
 	};
 
 	if (user.isAuthenticated) {
-		user.profile = await queryMe(user.accessToken);
+		user.profile = await queryMe(fetch, user.accessToken);
 	}
 
 	locals.user = user;

src/routes/+layout.svelte

@@ -7,6 +7,7 @@
 	import { navigating, page, updated } from '$app/stores';
 	import { beforeNavigate } from '$app/navigation';
 	import { browser, dev } from '$app/environment';
+	import posthog from 'posthog-js';
 
 	import lodash from 'lodash';
 	import * as Sentry from '@sentry/svelte';
@@ -29,6 +30,7 @@
 
 	const { isEmpty } = lodash;
 	const flash = getFlash(page);
+	let currentPath = '';
 
 	beforeNavigate(({ willUnload, to, from }) => {
 		// https://kit.svelte.dev/docs/configuration#version
@@ -50,6 +52,17 @@
 				_hsq.push(['trackPageView']);
 			}
 		});
+
+		posthog.init('phc_g3DmFJkVOQwUMd3LIpvB6NEXfcoH64NLzM6se5Lra4', {
+			api_host: 'https://thatconference.com/ingest',
+			capture_pageview: false,
+			capture_pageleave: false,
+			loaded(ph) {
+				if (ph.isFeatureEnabled('enable-session-recording')) {
+					ph.config.disable_session_recording = false;
+				}
+			}
+		});
 	}
 
 	onMount(() => {
@@ -67,6 +80,26 @@
 				useDefaultLauncher: true
 			});
 		}
+		if (typeof window !== 'undefined') {
+			const unsubscribePage = page.subscribe(($page) => {
+				if (currentPath && currentPath !== $page.url.pathname) {
+					posthog.capture('$pageleave');
+				}
+
+				currentPath = $page.url.pathname;
+				posthog.capture('$pageview');
+			});
+
+			const handleBeforeUnload = () => {
+				posthog.capture('$pageleave');
+			};
+			window.addEventListener('beforeunload', handleBeforeUnload);
+
+			return () => {
+				unsubscribePage();
+				window.removeEventListener('beforeunload', handleBeforeUnload);
+			};
+		}
 	});
 
 	$: if (!isEmpty(data.user.profile)) {
@@ -78,6 +111,13 @@
 				id
 			});
 
+			console.log('identify');
+			posthog.identify(id, {
+				email,
+				firstName,
+				lastName
+			});
+
 			let _hsq = (window._hsq = window._hsq || []);
 			_hsq.push([
 				'identify',

vercel.json

@@ -1,4 +1,10 @@
 {
+	"rewrites": [
+		{
+			"source": "/ingest/:path(.*)",
+			"destination": "https://app.posthog.com/:path*"
+		}
+	],
 	"headers": [
 		{
 			"source": "/(.*)",
@@ -17,5 +23,5 @@
 				}
 			]
 		}
-	]
+	]	
 }