From 76fba5ed4cc7da729183d8d9702c6ec0fbd29993 Mon Sep 17 00:00:00 2001
From: Jeff Chen <hello@jeff.yt>
Date: Thu, 25 Aug 2022 10:37:22 -0600
Subject: [PATCH] wip

---
 lib/gtag.js         | 12 ++++++------
 package-lock.json   | 14 ++++++++++++++
 package.json        |  1 +
 pages/_app.jsx      |  1 +
 pages/_document.jsx | 11 -----------
 5 files changed, 22 insertions(+), 17 deletions(-)

diff --git a/lib/gtag.js b/lib/gtag.js
index cfa6da9..d61534c 100644
--- a/lib/gtag.js
+++ b/lib/gtag.js
@@ -1,17 +1,17 @@
+import { track } from '@minimal-analytics/ga4';
+
 export const GA_TRACKING_ID = "UA-135975758-1";
 
 // https://developers.google.com/analytics/devguides/collection/gtagjs/pages
 export const pageview = url => {
-  window.gtag("config", GA_TRACKING_ID, {
-    page_path: url,
-  });
+  track(GA_TRACKING_ID, { event: { page_path: url} })
 };
 
 // https://developers.google.com/analytics/devguides/collection/gtagjs/events
 export const event = ({ action, category, label, value }) => {
-  window.gtag("event", action, {
+  track(GA_TRACKING_ID, { type: action, event: {
     event_category: category,
     event_label: label,
-    value: value,
-  });
+    value
+  }});
 };
diff --git a/package-lock.json b/package-lock.json
index 91366c7..d03c148 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,7 @@
       "name": "website",
       "version": "0.1.0",
       "dependencies": {
+        "@minimal-analytics/ga4": "^1.8.7",
         "@silvenon/remark-smartypants": "^1.0.0",
         "confetti-js": "^0.0.18",
         "crypto-js": "^4.1.1",
@@ -2358,6 +2359,14 @@
         "@jridgewell/sourcemap-codec": "^1.4.10"
       }
     },
+    "node_modules/@minimal-analytics/ga4": {
+      "version": "1.8.7",
+      "resolved": "https://registry.npmjs.org/@minimal-analytics/ga4/-/ga4-1.8.7.tgz",
+      "integrity": "sha512-W6BVFkdOJEq8aG4i+Kg/itLD2QpJQq97oA6nrGFtWy3CIhUj1EOXOzmhd2KCl2SQd4OPY3rZBtDbczyTZYcL0Q==",
+      "engines": {
+        "node": ">=16.3.0"
+      }
+    },
     "node_modules/@next/bundle-analyzer": {
       "version": "12.2.5",
       "resolved": "https://registry.npmjs.org/@next/bundle-analyzer/-/bundle-analyzer-12.2.5.tgz",
@@ -10292,6 +10301,11 @@
         "@jridgewell/sourcemap-codec": "^1.4.10"
       }
     },
+    "@minimal-analytics/ga4": {
+      "version": "1.8.7",
+      "resolved": "https://registry.npmjs.org/@minimal-analytics/ga4/-/ga4-1.8.7.tgz",
+      "integrity": "sha512-W6BVFkdOJEq8aG4i+Kg/itLD2QpJQq97oA6nrGFtWy3CIhUj1EOXOzmhd2KCl2SQd4OPY3rZBtDbczyTZYcL0Q=="
+    },
     "@next/bundle-analyzer": {
       "version": "12.2.5",
       "resolved": "https://registry.npmjs.org/@next/bundle-analyzer/-/bundle-analyzer-12.2.5.tgz",
diff --git a/package.json b/package.json
index 74c0586..b59ecbf 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
     "start": "next start"
   },
   "dependencies": {
+    "@minimal-analytics/ga4": "^1.8.7",
     "@silvenon/remark-smartypants": "^1.0.0",
     "confetti-js": "^0.0.18",
     "crypto-js": "^4.1.1",
diff --git a/pages/_app.jsx b/pages/_app.jsx
index f8787b5..9f8bfda 100644
--- a/pages/_app.jsx
+++ b/pages/_app.jsx
@@ -32,6 +32,7 @@ function MyApp({ Component, pageProps }) {
   const [loaded, setLoaded] = useState(false);
 
   useEffect(() => {
+    pageview(window.location.pathname);
     setLoaded(true);
   }, []);
 
diff --git a/pages/_document.jsx b/pages/_document.jsx
index bb1ce3d..bd19c17 100644
--- a/pages/_document.jsx
+++ b/pages/_document.jsx
@@ -103,17 +103,6 @@ export default class MyDocument extends Document {
           <Main />
           <NextScript />
         </body>
-
-        {/* Global Site Tag (gtag.js) - Google Analytics */}
-        <script
-          async
-          src={`https://www.googletagmanager.com/gtag/js?id=${GA_TRACKING_ID}`}
-        />
-        <script
-          dangerouslySetInnerHTML={{
-            __html: `window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}gtag('js',new Date());gtag('config','${GA_TRACKING_ID}',{page_path:window.location.pathname});`,
-          }}
-        />
       </Html>
     );
   }