feat: integrate observability
This commit is contained in:
23
packages/next-observability/src/analytics/auto-tracker.tsx
Normal file
23
packages/next-observability/src/analytics/auto-tracker.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect } from "react";
|
||||
import { usePathname, useSearchParams } from "next/navigation";
|
||||
import { useAnalytics } from "./context";
|
||||
|
||||
/**
|
||||
* Automatically tracks pageviews on client-side route changes in Next.js.
|
||||
*/
|
||||
export function AnalyticsAutoTracker() {
|
||||
const pathname = usePathname();
|
||||
const searchParams = useSearchParams();
|
||||
const analytics = useAnalytics();
|
||||
|
||||
useEffect(() => {
|
||||
if (!pathname) return;
|
||||
|
||||
const url = `${pathname}${searchParams?.size ? `?${searchParams.toString()}` : ""}`;
|
||||
analytics.trackPageview(url);
|
||||
}, [pathname, searchParams, analytics]);
|
||||
|
||||
return null;
|
||||
}
|
||||
50
packages/next-observability/src/analytics/context.tsx
Normal file
50
packages/next-observability/src/analytics/context.tsx
Normal file
@@ -0,0 +1,50 @@
|
||||
"use client";
|
||||
|
||||
import { createContext, useContext, ReactNode, useMemo } from "react";
|
||||
import type { AnalyticsService } from "@mintel/observability";
|
||||
import {
|
||||
NoopAnalyticsService,
|
||||
UmamiAnalyticsService,
|
||||
} from "@mintel/observability";
|
||||
|
||||
const AnalyticsContext = createContext<AnalyticsService>(
|
||||
new NoopAnalyticsService(),
|
||||
);
|
||||
|
||||
export interface AnalyticsContextProviderProps {
|
||||
service?: AnalyticsService;
|
||||
config?: {
|
||||
enabled: boolean;
|
||||
websiteId?: string;
|
||||
apiEndpoint: string;
|
||||
};
|
||||
children: ReactNode;
|
||||
}
|
||||
|
||||
export function AnalyticsContextProvider({
|
||||
service,
|
||||
config,
|
||||
children,
|
||||
}: AnalyticsContextProviderProps) {
|
||||
const activeService = useMemo(() => {
|
||||
if (service) return service;
|
||||
if (config) return new UmamiAnalyticsService(config);
|
||||
return new NoopAnalyticsService();
|
||||
}, [service, config]);
|
||||
|
||||
return (
|
||||
<AnalyticsContext.Provider value={activeService}>
|
||||
{children}
|
||||
</AnalyticsContext.Provider>
|
||||
);
|
||||
}
|
||||
|
||||
export function useAnalytics() {
|
||||
const context = useContext(AnalyticsContext);
|
||||
if (!context) {
|
||||
throw new Error(
|
||||
"useAnalytics must be used within an AnalyticsContextProvider",
|
||||
);
|
||||
}
|
||||
return context;
|
||||
}
|
||||
Reference in New Issue
Block a user