65 lines
1.9 KiB
TypeScript
65 lines
1.9 KiB
TypeScript
'use client';
|
|
|
|
import Script from 'next/script';
|
|
import { usePathname, useSearchParams } from 'next/navigation';
|
|
import { useEffect } from 'react';
|
|
|
|
export default function GoogleAnalytics() {
|
|
const pathname = usePathname();
|
|
const searchParams = useSearchParams();
|
|
const GA_MEASUREMENT_ID = process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID;
|
|
|
|
useEffect(() => {
|
|
if (!GA_MEASUREMENT_ID) return;
|
|
|
|
const cookieConsent = localStorage.getItem('cookieConsent');
|
|
if (cookieConsent !== 'accepted') return;
|
|
|
|
const url = pathname + (searchParams?.toString() ? `?${searchParams.toString()}` : '');
|
|
|
|
if (typeof window.gtag !== 'undefined') {
|
|
window.gtag('config', GA_MEASUREMENT_ID, {
|
|
page_path: url,
|
|
});
|
|
}
|
|
}, [pathname, searchParams, GA_MEASUREMENT_ID]);
|
|
|
|
const cookieConsent = typeof window !== 'undefined' ? localStorage.getItem('cookieConsent') : null;
|
|
|
|
if (!GA_MEASUREMENT_ID || cookieConsent !== 'accepted') {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Script
|
|
strategy="afterInteractive"
|
|
src={`https://www.googletagmanager.com/gtag/js?id=${GA_MEASUREMENT_ID}`}
|
|
/>
|
|
<Script
|
|
id="google-analytics"
|
|
strategy="afterInteractive"
|
|
dangerouslySetInnerHTML={{
|
|
__html: `
|
|
window.dataLayer = window.dataLayer || [];
|
|
function gtag(){dataLayer.push(arguments);}
|
|
gtag('js', new Date());
|
|
|
|
gtag('config', '${GA_MEASUREMENT_ID}', {
|
|
page_path: window.location.pathname,
|
|
});
|
|
`,
|
|
}}
|
|
/>
|
|
</>
|
|
);
|
|
}
|
|
|
|
// Add gtag to window object for TypeScript
|
|
declare global {
|
|
interface Window {
|
|
gtag: (command: string, id: string, config?: any) => void;
|
|
dataLayer: any[];
|
|
}
|
|
}
|