wehub-resource-sync
81 lines
2.4 KiB
TypeScript
81 lines
2.4 KiB
TypeScript
"use client"
|
|
|
|
import React, { useEffect, useState } from "react"
|
|
import Script from "next/script"
|
|
|
|
// import { Analytics as VercelAnalytics } from "@vercel/analytics/react"
|
|
|
|
export function Analytics() {
|
|
const gtmId = process.env.NEXT_PUBLIC_GTM_ID
|
|
|
|
// GA measurement ID: prefer env var, fallback to the ID you provided
|
|
const gaId = process.env.NEXT_PUBLIC_GA_AI_ID
|
|
|
|
// Mode: 'ga' | 'gtm' | null (not decided yet)
|
|
const [mode, setMode] = useState<null | "ga" | "gtm">(null)
|
|
|
|
useEffect(() => {
|
|
try {
|
|
const path = window.location.pathname || ""
|
|
const isR = path.includes("/r/")
|
|
const isUiView = path.startsWith("/ui/view")
|
|
|
|
if (isUiView) {
|
|
// Disable analytics for /ui/view routes
|
|
setMode(null)
|
|
return
|
|
}
|
|
|
|
if (isR) {
|
|
setMode("ga")
|
|
} else {
|
|
setMode("gtm")
|
|
}
|
|
} catch {
|
|
// noop
|
|
setMode("gtm")
|
|
}
|
|
}, [])
|
|
|
|
// Not ready yet
|
|
if (!mode) return null
|
|
|
|
return (
|
|
<>
|
|
{mode === "gtm" && gtmId && (
|
|
<>
|
|
<Script
|
|
id="gtm-script"
|
|
strategy="afterInteractive"
|
|
dangerouslySetInnerHTML={{
|
|
__html: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','${gtmId}');`,
|
|
}}
|
|
/>
|
|
|
|
<noscript
|
|
dangerouslySetInnerHTML={{
|
|
__html: `<iframe src="https://www.googletagmanager.com/ns.html?id=${gtmId}" height="0" width="0" style="display:none;visibility:hidden"></iframe>`,
|
|
}}
|
|
/>
|
|
</>
|
|
)}
|
|
|
|
{mode === "ga" && gaId && (
|
|
<>
|
|
<Script
|
|
src={`https://www.googletagmanager.com/gtag/js?id=${gaId}`}
|
|
strategy="afterInteractive"
|
|
data-ga
|
|
/>
|
|
<Script id="gtag-init" strategy="afterInteractive">
|
|
{`window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', '${gaId}');`}
|
|
</Script>
|
|
</>
|
|
)}
|
|
|
|
{/* If you also want Vercel Analytics, uncomment the import above and
|
|
add <VercelAnalytics /> here. */}
|
|
</>
|
|
)
|
|
}
|