[Docs] posthog Integration (#761)

<!--

Make sure you've read the CONTRIBUTING.md guidelines:
https://github.com/stack-auth/stack-auth/blob/dev/CONTRIBUTING.md

-->

<!-- ELLIPSIS_HIDDEN -->


----

> [!IMPORTANT]
> Integrates PostHog for page view tracking in the documentation site
with necessary rewrites and components.
> 
>   - **Integration**:
> - Adds PostHog integration to track page views in `layout.tsx` using
`PostHogPageView` and `CSPostHogProvider`.
>     - Adds `posthog-js` to `package.json` dependencies.
>   - **Rewrites**:
> - Adds proxy rewrites in `next.config.mjs` to prevent ad blockers from
blocking PostHog requests.
>   - **Components**:
> - Creates `PostHogPageView` in `pageview.tsx` and
`pageview-dynamic.tsx` to capture page views.
> - Implements `CSPostHogProvider` in `posthog-provider.tsx` to
initialize PostHog with specific settings.
> 
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for 5551f4ffc4. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>


<!-- ELLIPSIS_HIDDEN -->
This commit is contained in:
Madison 2025-07-14 13:49:36 -05:00 committed by GitHub
parent 292c411844
commit c93086c379
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 126 additions and 963 deletions

View File

@ -26,6 +26,19 @@ const config = {
},
async rewrites() {
return [
// PostHog proxy rewrites to prevent ad blockers
{
source: "/consume/static/:path*",
destination: "https://eu-assets.i.posthog.com/static/:path*",
},
{
source: "/consume/:path*",
destination: "https://eu.i.posthog.com/:path*",
},
{
source: "/consume/decide",
destination: "https://eu.i.posthog.com/decide",
},
// Redirect .mdx requests to the llms.mdx route handler
{
source: '/docs/:path*.mdx',

View File

@ -43,6 +43,7 @@
"minimatch": "^10.0.1",
"next": "15.3.2",
"next-themes": "^0.4.6",
"posthog-js": "^1.235.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-remove-scroll": "^2.7.0",

View File

@ -1,6 +1,8 @@
import { StackProvider, StackTheme } from '@stackframe/stack';
import { RootProvider } from 'fumadocs-ui/provider';
import { Inter } from 'next/font/google';
import PostHogPageView from '../components/pageview';
import { CSPostHogProvider } from '../components/posthog-provider';
import { stackServerApp } from '../stack';
import './global.css';
@ -14,17 +16,20 @@ export default function Layout({ children }: { children: React.ReactNode }) {
<head>
</head>
<body className="flex flex-col min-h-screen">
<StackProvider app={stackServerApp}>
<StackTheme>
<RootProvider
search={{
enabled: false, // Completely disable fumadocs search
}}
>
{children}
</RootProvider>
</StackTheme>
</StackProvider>
<CSPostHogProvider>
<PostHogPageView />
<StackProvider app={stackServerApp}>
<StackTheme>
<RootProvider
search={{
enabled: false, // Completely disable fumadocs search
}}
>
{children}
</RootProvider>
</StackTheme>
</StackProvider>
</CSPostHogProvider>
</body>
</html>
);

View File

@ -0,0 +1,27 @@
'use client';
import { usePathname, useSearchParams } from "next/navigation";
import { usePostHog } from 'posthog-js/react';
import { useEffect } from "react";
export default function PostHogPageView(): null {
const pathname = usePathname();
const searchParams = useSearchParams();
const posthog = usePostHog();
useEffect(() => {
if (pathname) {
let url = window.origin + pathname;
if (searchParams.toString()) {
url = url + `?${searchParams.toString()}`;
}
posthog.capture(
'$pageview',
{
'$current_url': url,
}
);
}
}, [pathname, searchParams, posthog]);
return null;
}

View File

@ -0,0 +1,9 @@
'use client';
import dynamic from "next/dynamic";
const PageView = dynamic(() => import('./pageview-dynamic'), {
ssr: false,
});
export default PageView;

View File

@ -0,0 +1,24 @@
'use client';
import posthog from 'posthog-js';
import { PostHogProvider } from 'posthog-js/react';
import { useEffect } from 'react';
export function CSPostHogProvider({ children }: { children: React.ReactNode }) {
useEffect(() => {
if (typeof window !== 'undefined') {
const postHogKey = "phc_vIUFi0HzHo7oV26OsaZbUASqxvs8qOmap1UBYAutU4k";
if (postHogKey.length > 5) {
posthog.init(postHogKey, {
api_host: "/consume",
ui_host: "https://eu.i.posthog.com",
capture_pageview: false,
capture_pageleave: true,
person_profiles: 'identified_only'
});
}
}
}, []);
return <PostHogProvider client={posthog}>{children}</PostHogProvider>;
}

File diff suppressed because it is too large Load Diff