miel.truyen/nx
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

fix(nx-dev): only track analytics in prod envs (#31367)

Browse Source 
Refactors the tracking scripts on the nx website and only runs them in
prod environments
This commit is contained in:
Juri Strumpflohner 2025-05-28 14:12:50 +02:00 committed by GitHub
parent 9ab5d820ab
commit 4fb362a5ac
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 48 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
nx-dev/nx-dev/app/global-scripts.tsx
View File

@ -1,8 +1,16 @@
import Script from 'next/script';
export default function GlobalScripts({ gaMeasurementId }) {
export default function GlobalScripts({ gaMeasurementId, gtmMeasurementId }) {
// Don't load analytics scripts in development
const isProduction = process.env.NODE_ENV === 'production';
if (!isProduction) {
return null;
}
return (
<>
{/* Google Analytics (gtag) */}
<Script
id="gtag-script-dependency"
strategy="afterInteractive"
@ -22,6 +30,35 @@ export default function GlobalScripts({ gaMeasurementId }) {
`,
}}
/>
{/* Google Tag Manager */}
{gtmMeasurementId && (
<>
<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','${gtmMeasurementId}');
`,
}}
/>
{/* Google Tag Manager - NoScript */}
<noscript>
<iframe
src={`https://www.googletagmanager.com/ns.html?id=${gtmMeasurementId}`}
height="0"
width="0"
style={{ display: 'none', visibility: 'hidden' }}
/>
</noscript>
</>
)}
{/* Apollo.io Embed Code */}
<Script
type="text/javascript"

6
nx-dev/nx-dev/app/layout.tsx
View File

@ -52,6 +52,7 @@ export const viewport: Viewport = {
export default function RootLayout({ children }: { children: ReactNode }) {
const gaMeasurementId = 'UA-88380372-10';
const gtmMeasurementId = 'GTM-KW8423B6';
return (
<html lang="en" className="h-full scroll-smooth" suppressHydrationWarning>
<AppRouterAnalytics gaMeasurementId={gaMeasurementId} />
@ -80,7 +81,10 @@ export default function RootLayout({ children }: { children: ReactNode }) {
{children}
{/* <LiveStreamNotifier /> */}
<FrontendObservability />
<GlobalScripts gaMeasurementId={gaMeasurementId} />
<GlobalScripts
gaMeasurementId={gaMeasurementId}
gtmMeasurementId={gtmMeasurementId}
/>
</body>
</html>
);

97
nx-dev/nx-dev/pages/_app.tsx
View File

@ -9,6 +9,7 @@ import '../styles/main.css';
import Link from 'next/link';
import { WebinarNotifier } from '@nx/nx-dev/ui-common';
import { FrontendObservability } from '../lib/components/frontend-observability';
import GlobalScripts from '../app/global-scripts';
export default function CustomApp({
Component,
@ -88,98 +89,10 @@ export default function CustomApp({
{/* <LiveStreamNotifier /> */}
<WebinarNotifier />
{/* Global Site Tag (gtag.js) - Google Analytics */}
<Script
id="gtag-script-dependency"
strategy="afterInteractive"
src={`https://www.googletagmanager.com/gtag/js?id=${gaMeasurementId}`}
/>
<Script
id="gtag-script-loader"
strategy="afterInteractive"
dangerouslySetInnerHTML={{
__html: `
window.dataLayer = window.dataLayer || [];
function gtag(){ dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', '${gaMeasurementId}', {
page_path: window.location.pathname,
});
`,
}}
/>
<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','${gtmMeasurementId}');
`,
}}
/>
{/* Google Tag Manager - NoScript */}
<noscript>
<iframe
src={`https://www.googletagmanager.com/ns.html?id=${gtmMeasurementId}`}
height="0"
width="0"
style={{ display: 'none', visibility: 'hidden' }}
/>
</noscript>
{/* Apollo.io Embed Code */}
<Script
type="text/javascript"
id="apollo-script-loader"
strategy="afterInteractive"
dangerouslySetInnerHTML={{
__html: `function initApollo(){var n=Math.random().toString(36).substring(7),o=document.createElement("script"); o.src="https://assets.apollo.io/micro/website-tracker/tracker.iife.js?nocache="+n,o.async=!0,o.defer=!0,o.onload=function(){window.trackingFunctions.onLoad({appId:"65e1db2f1976f30300fd8b26"})},document.head.appendChild(o)}initApollo();`,
}}
/>
{/* HubSpot Analytics */}
<Script
id="hs-script-loader"
strategy="afterInteractive"
src="https://js.hs-scripts.com/2757427.js"
/>
{/* HubSpot FORMS Embed Code */}
<Script
type="text/javascript"
id="hs-forms-script-loader"
strategy="afterInteractive"
src="//js.hsforms.net/forms/v2.js"
/>
{/* Hotjar Analytics */}
<Script
id="hotjar-script-loader"
strategy="afterInteractive"
dangerouslySetInnerHTML={{
__html: `
(function(h,o,t,j,a,r){
h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
h._hjSettings={hjid:2774127,hjsv:6};
a=o.getElementsByTagName('head')[0];
r=o.createElement('script');r.async=1;
r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
a.appendChild(r);
})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');`,
}}
/>
<Script
id="twitter-campain-pixelcode"
strategy="afterInteractive"
dangerouslySetInnerHTML={{
__html: `
!function(e,t,n,s,u,a){e.twq||(s=e.twq=function(){s.exe?s.exe.apply(s,arguments):s.queue.push(arguments);
},s.version='1.1',s.queue=[],u=t.createElement(n),u.async=!0,u.src='https://static.ads-twitter.com/uwt.js',
a=t.getElementsByTagName(n)[0],a.parentNode.insertBefore(u,a))}(window,document,'script');
twq('config','obtp4');
`,
}}
{/* All tracking scripts consolidated in GlobalScripts component */}
<GlobalScripts
gaMeasurementId={gaMeasurementId}
gtmMeasurementId={gtmMeasurementId}
/>
</>
);