63 lines
2.5 KiB
JavaScript
63 lines
2.5 KiB
JavaScript
'use client';
|
|
import { useEffect } from 'react';
|
|
import { gtag } from '../consent/googleConsent.js';
|
|
import { CONSENT_COOKIE, DEFAULT_CONSENT, parseConsent, setDefaultConsent } from '../consent/index.js';
|
|
const GTM_SCRIPT = (id)=>`https://www.googletagmanager.com/gtm.js?id=${id}`;
|
|
const GA4_SCRIPT = (id)=>`https://www.googletagmanager.com/gtag/js?id=${id}`;
|
|
/** Reads the current consent state from cookie, or defaults if none. */ function readConsent() {
|
|
if (typeof document === 'undefined') {
|
|
return DEFAULT_CONSENT;
|
|
}
|
|
const raw = document.cookie.split('; ').find((c)=>c.startsWith(`${CONSENT_COOKIE}=`))?.split('=')[1];
|
|
return parseConsent(raw) ?? DEFAULT_CONSENT;
|
|
}
|
|
function injectScript(src) {
|
|
if (document.querySelector(`script[src="${src}"]`)) {
|
|
return;
|
|
}
|
|
const s = document.createElement('script');
|
|
s.src = src;
|
|
s.async = true;
|
|
document.head.appendChild(s);
|
|
}
|
|
/**
|
|
* Loads Google Analytics — GTM if a container ID is set, otherwise GA4 gtag.
|
|
*
|
|
* Consent Mode is initialised to the visitor's stored consent BEFORE the tag
|
|
* loads (via setDefaultConsent from the consent module), so tags respect the
|
|
* choice from the first hit; useConsent sends an update the moment the visitor
|
|
* decides. IDs are public and come from SiteIntegrations, passed in as props
|
|
* (the client project reads them server-side).
|
|
*
|
|
* Renders nothing — it only injects the scripts. Mount once, high in the tree
|
|
* (e.g. root layout), inside ConsentProvider.
|
|
*/ export function Analytics({ ga4MeasurementId, gtmContainerId }) {
|
|
useEffect(()=>{
|
|
if (!ga4MeasurementId && !gtmContainerId) {
|
|
return;
|
|
}
|
|
// 1. Consent Mode default = the visitor's stored choice, before tags load.
|
|
setDefaultConsent(readConsent());
|
|
// 2. Load the tag.
|
|
if (gtmContainerId) {
|
|
window.dataLayer = window.dataLayer || [];
|
|
window.dataLayer.push({
|
|
event: 'gtm.js',
|
|
'gtm.start': Date.now()
|
|
});
|
|
injectScript(GTM_SCRIPT(gtmContainerId));
|
|
} else if (ga4MeasurementId) {
|
|
injectScript(GA4_SCRIPT(ga4MeasurementId));
|
|
// Uses the shared gtag (pushes `arguments`, as Google's tags expect);
|
|
// real gtag.js wires itself up once the script loads.
|
|
gtag('js', new Date());
|
|
gtag('config', ga4MeasurementId);
|
|
}
|
|
}, [
|
|
ga4MeasurementId,
|
|
gtmContainerId
|
|
]);
|
|
return null;
|
|
} //# sourceMappingURL=Analytics.js.map
|
|
|
|
//# sourceMappingURL=Analytics.js.map
|