Skip to content

Commit 3d23fd4

Browse files
KurtGokhanKurtGokhan
committed
fix google analytics usage
1 parent 4745112 commit 3d23fd4

6 files changed

Lines changed: 34 additions & 48 deletions

File tree

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@
5252
"@types/body-scroll-lock": "^3.1.0",
5353
"@types/debounce": "^1.2.1",
5454
"@types/github-slugger": "^1.3.0",
55+
"@types/gtag.js": "^0.0.12",
5556
"@types/mdx-js__react": "^1.5.5",
5657
"@types/node": "^18.11.19",
5758
"@types/parse-numeric-range": "^0.0.1",

‎src/components/Layout/Feedback.tsx‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
* Copyright (c) Facebook, Inc. and its affiliates.
33
*/
44

5-
import { useState } from 'react';
65
import { useRouter } from 'next/router';
7-
import { ga } from '../../utils/analytics';
6+
import { useState } from 'react';
87

9-
export function Feedback({ onSubmit = () => {} }: { onSubmit?: () => void }) {
8+
export function Feedback({ onSubmit = () => { } }: { onSubmit?: () => void }) {
109
const { asPath } = useRouter();
1110
const cleanedPath = asPath.split(/[\?\#]/)[0];
1211
// Reset on route changes.
@@ -48,13 +47,12 @@ const thumbsDownIcon = (
4847
function sendGAEvent(isPositive: boolean) {
4948
// Fragile. Don't change unless you've tested the network payload
5049
// and verified that the right events actually show up in GA.
51-
ga(
52-
'send',
50+
window.gtag(
5351
'event',
54-
'button',
5552
'feedback',
56-
window.location.pathname,
57-
isPositive ? '1' : '0'
53+
{
54+
value: isPositive ? 1 : 0,
55+
}
5856
);
5957
}
6058

‎src/pages/_app.tsx‎

Lines changed: 2 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -5,24 +5,14 @@
55
import { AppProps } from 'next/app';
66
import { useRouter } from 'next/router';
77
import { useEffect } from 'react';
8-
import { ga } from '../utils/analytics';
8+
import { GA_TRACKING_ID } from '../utils/analytics';
99

1010
import '@docsearch/css';
1111
import { GlobalUnityProvider } from 'components/unity';
1212
import '../styles/algolia.css';
1313
import '../styles/index.css';
1414
import '../styles/sandpack.css';
1515

16-
if (typeof window !== 'undefined') {
17-
if (process.env.NODE_ENV === 'production') {
18-
ga('create', process.env.NEXT_PUBLIC_GA_TRACKING_ID, 'auto');
19-
}
20-
const terminationEvent = 'onpagehide' in window ? 'pagehide' : 'unload';
21-
window.addEventListener(terminationEvent, function () {
22-
ga('send', 'timing', 'JS Dependencies', 'unload');
23-
});
24-
}
25-
2616
export default function MyApp({ Component, pageProps }: AppProps) {
2717
const router = useRouter();
2818

@@ -44,8 +34,7 @@ export default function MyApp({ Component, pageProps }: AppProps) {
4434
useEffect(() => {
4535
const handleRouteChange = (url: string) => {
4636
const cleanedUrl = url.split(/[\?\#]/)[0];
47-
ga('set', 'page', cleanedUrl);
48-
ga('send', 'pageview');
37+
window.gtag('config', GA_TRACKING_ID, { page_path: cleanedUrl });
4938
};
5039
router.events.on('routeChangeComplete', handleRouteChange);
5140
return () => {

‎src/pages/_document.tsx‎

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,30 @@
33
*/
44

55
import { Head, Html, Main, NextScript } from 'next/document';
6+
import Script from 'next/script';
7+
import { GA_TRACKING_ID } from 'utils/analytics';
68

79
const MyDocument = () => {
810
// @todo specify language in HTML?
911
return (
1012
<Html lang="en">
11-
<Head />
13+
<Head>
14+
{!!GA_TRACKING_ID && <>
15+
<Script
16+
src={`https://www.googletagmanager.com/gtag/js?id=${GA_TRACKING_ID}`}
17+
strategy="afterInteractive"
18+
/>
19+
<Script id="google-analytics" strategy="afterInteractive">
20+
{`
21+
window.dataLayer = window.dataLayer || [];
22+
function gtag(){window.dataLayer.push(arguments);}
23+
gtag('js', new Date());
24+
25+
gtag('config', '${GA_TRACKING_ID}');
26+
`}
27+
</Script>
28+
</>}
29+
</Head>
1230
<body className="font-sans antialiased text-lg bg-wash dark:bg-wash-dark text-secondary dark:text-secondary-dark leading-base">
1331
<script
1432
dangerouslySetInnerHTML={{

‎src/utils/analytics.ts‎

Lines changed: 1 addition & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1 @@
1-
/*
2-
* Copyright (c) Facebook, Inc. and its affiliates.
3-
*/
4-
5-
let buffer: Array<any> = [];
6-
let galite: null | Function = null;
7-
let galitePromise: null | Promise<any> = null;
8-
9-
export function ga(...args: any[]): void {
10-
if (typeof galite === 'function') {
11-
galite.apply(null, args);
12-
return;
13-
}
14-
buffer.push(args);
15-
if (!galitePromise) {
16-
// @ts-ignore
17-
galitePromise = import('ga-lite').then((mod) => {
18-
galite = mod.default;
19-
galitePromise = null;
20-
buffer.forEach((args) => {
21-
mod.default.apply(null, args);
22-
});
23-
buffer = [];
24-
});
25-
}
26-
}
1+
export const GA_TRACKING_ID = process.env.NEXT_PUBLIC_GA_TRACKING_ID ?? '';

‎yarn.lock‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2122,6 +2122,11 @@
21222122
resolved "https://registry.yarnpkg.com/@types/github-slugger/-/github-slugger-1.3.0.tgz#16ab393b30d8ae2a111ac748a015ac05a1fc5524"
21232123
integrity sha512-J/rMZa7RqiH/rT29TEVZO4nBoDP9XJOjnbbIofg7GQKs4JIduEO3WLpte+6WeUz/TcrXKlY+bM7FYrp8yFB+3g==
21242124

2125+
"@types/gtag.js@^0.0.12":
2126+
version "0.0.12"
2127+
resolved "https://registry.yarnpkg.com/@types/gtag.js/-/gtag.js-0.0.12.tgz#095122edca896689bdfcdd73b057e23064d23572"
2128+
integrity sha512-YQV9bUsemkzG81Ea295/nF/5GijnD2Af7QhEofh7xu+kvCN6RdodgNwwGWXB5GMI3NoyvQo0odNctoH/qLMIpg==
2129+
21252130
"@types/hast@^2.0.0", "@types/hast@^2.3.2":
21262131
version "2.3.4"
21272132
resolved "https://registry.yarnpkg.com/@types/hast/-/hast-2.3.4.tgz#8aa5ef92c117d20d974a82bdfb6a648b08c0bafc"

0 commit comments

Comments
 (0)