feat: add PostHog telemetry with privacy-focused tracking

Integrate optional PostHog telemetry to track page views, RDAP queries,
user interactions, and errors while maintaining user privacy.

Key features:
- Type-safe event tracking with discriminated unions
- Automatic source map upload for production error tracking
- Privacy protections (query targets excluded from successful lookups)
- Do Not Track (DNT) header support
- Optional telemetry (disabled by default without environment variables)
- Error boundary with automatic error tracking
- Context-based telemetry integration throughout UI components

Environment variables required for telemetry:
- NEXT_PUBLIC_POSTHOG_KEY: PostHog project API key (client-side)
- NEXT_PUBLIC_POSTHOG_HOST: PostHog API endpoint (client-side)
- POSTHOG_PERSONAL_API_KEY: Source map upload key (server-side)
This commit is contained in:
2025-10-23 18:00:24 -05:00
parent 5fcf9dd94b
commit 5fde7d249f
15 changed files with 858 additions and 17 deletions

View File

@@ -9,21 +9,27 @@ import "overlayscrollbars/overlayscrollbars.css";
import "@/styles/globals.css";
import { DateFormatProvider } from "@/contexts/DateFormatContext";
import { TelemetryProvider } from "@/contexts/TelemetryContext";
import ErrorBoundary from "@/components/ErrorBoundary";
const MyApp: AppType = ({ Component, pageProps }) => {
return (
<ThemeProvider
attribute="class"
defaultTheme="system"
// Cloudflare Rocket Loader breaks the script injection and causes theme flashing
scriptProps={{ "data-cfasync": "false" }}
>
<Theme accentColor="indigo" grayColor="slate" radius="medium" scaling="100%">
<DateFormatProvider>
<Component {...pageProps} />
</DateFormatProvider>
</Theme>
</ThemeProvider>
<ErrorBoundary>
<ThemeProvider
attribute="class"
defaultTheme="system"
// Cloudflare Rocket Loader breaks the script injection and causes theme flashing
scriptProps={{ "data-cfasync": "false" }}
>
<Theme accentColor="indigo" grayColor="slate" radius="medium" scaling="100%">
<TelemetryProvider>
<DateFormatProvider>
<Component {...pageProps} />
</DateFormatProvider>
</TelemetryProvider>
</Theme>
</ThemeProvider>
</ErrorBoundary>
);
};