diff --git a/app/src/components/nav/ProjectMenu.tsx b/app/src/components/nav/ProjectMenu.tsx
index a14022e..ab65092 100644
--- a/app/src/components/nav/ProjectMenu.tsx
+++ b/app/src/components/nav/ProjectMenu.tsx
@@ -197,26 +197,6 @@ const ProjectOption = ({
spacing={4}
>
{proj.name}
-
- }
- variant="ghost"
- size="xs"
- p={0}
- onMouseEnter={() => setGearHovered(true)}
- onMouseLeave={() => setGearHovered(false)}
- _hover={{ bgColor: isActive ? "gray.300" : "gray.100", transitionDelay: 0 }}
- borderRadius={4}
- />
);
};
diff --git a/app/src/pages/_app.tsx b/app/src/pages/_app.tsx
index 3cd0ce3..afcb894 100644
--- a/app/src/pages/_app.tsx
+++ b/app/src/pages/_app.tsx
@@ -8,7 +8,7 @@ import { ChakraThemeProvider } from "~/theme/ChakraThemeProvider";
import { SyncAppStore } from "~/state/sync";
import NextAdapterApp from "next-query-params/app";
import { QueryParamProvider } from "use-query-params";
-import { SessionIdentifier } from "~/utils/analytics/clientAnalytics";
+import { PosthogAppProvider } from "~/utils/analytics/posthog";
const MyApp: AppType<{ session: Session | null }> = ({
Component,
@@ -34,14 +34,15 @@ const MyApp: AppType<{ session: Session | null }> = ({
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
>
);
diff --git a/app/src/utils/analytics/clientAnalytics.ts b/app/src/utils/analytics/clientAnalytics.ts
deleted file mode 100644
index 50bd5d2..0000000
--- a/app/src/utils/analytics/clientAnalytics.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { type Session } from "next-auth";
-import { useSession } from "next-auth/react";
-import { useEffect } from "react";
-
-import posthog from "posthog-js";
-import { env } from "~/env.mjs";
-
-// Make sure we're in the browser
-const enableBrowserAnalytics = typeof window !== "undefined";
-
-if (env.NEXT_PUBLIC_POSTHOG_KEY && enableBrowserAnalytics) {
- posthog.init(env.NEXT_PUBLIC_POSTHOG_KEY, {
- api_host: `${env.NEXT_PUBLIC_HOST}/ingest`,
- });
-}
-
-export const identifySession = (session: Session) => {
- if (!session.user) return;
- posthog.identify(session.user.id, {
- name: session.user.name,
- email: session.user.email,
- });
-};
-
-export const SessionIdentifier = () => {
- const session = useSession().data;
- useEffect(() => {
- if (session && enableBrowserAnalytics) identifySession(session);
- }, [session]);
- return null;
-};
diff --git a/app/src/utils/analytics/posthog.tsx b/app/src/utils/analytics/posthog.tsx
new file mode 100644
index 0000000..c26c8fe
--- /dev/null
+++ b/app/src/utils/analytics/posthog.tsx
@@ -0,0 +1,42 @@
+"use client";
+import { type Session } from "next-auth";
+import { useSession } from "next-auth/react";
+import React, { ReactNode, useEffect } from "react";
+import { PostHogProvider } from "posthog-js/react";
+
+import posthog from "posthog-js";
+import { env } from "~/env.mjs";
+import { useRouter } from "next/router";
+
+// Make sure we're in the browser
+const inBrowser = typeof window !== "undefined";
+
+export const PosthogAppProvider = ({ children }: { children: ReactNode }) => {
+ const session = useSession().data;
+ const router = useRouter();
+
+ useEffect(() => {
+ // Track page views
+ const handleRouteChange = () => posthog?.capture("$pageview");
+ router.events.on("routeChangeComplete", handleRouteChange);
+
+ return () => {
+ router.events.off("routeChangeComplete", handleRouteChange);
+ };
+ }, [router.events]);
+
+ useEffect(() => {
+ if (env.NEXT_PUBLIC_POSTHOG_KEY && inBrowser && session && session.user) {
+ posthog.init(env.NEXT_PUBLIC_POSTHOG_KEY, {
+ api_host: `${env.NEXT_PUBLIC_HOST}/ingest`,
+ });
+
+ posthog.identify(session.user.id, {
+ name: session.user.name,
+ email: session.user.email,
+ });
+ }
+ }, [session]);
+
+ return {children};
+};