From 925c1838ba2b2d06682468f85bd8844ac4f20e62 Mon Sep 17 00:00:00 2001
From: Anton Mushnin <anton.mushnin@gmail.com>
Date: Tue, 14 May 2024 17:00:30 +0300
Subject: [PATCH 1/4] declaring gtag function

---
 web/global.d.ts   | 1 +
 web/tsconfig.json | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)
 create mode 100644 web/global.d.ts

diff --git a/web/global.d.ts b/web/global.d.ts
new file mode 100644
index 00000000..ae072d7b
--- /dev/null
+++ b/web/global.d.ts
@@ -0,0 +1 @@
+declare function gtag(command: string, eventName: string, params?: any): void;
diff --git a/web/tsconfig.json b/web/tsconfig.json
index 1acdbba3..4dd09057 100644
--- a/web/tsconfig.json
+++ b/web/tsconfig.json
@@ -21,7 +21,8 @@
     "**/*.tsx",
     "src/theme/components/button",
     "types/**/*.d.ts",
-    "node_modules/eslint-plugin-react/lib/types.d.ts"
+    "node_modules/eslint-plugin-react/lib/types.d.ts",
+    "global.d.ts"
   ],
   "exclude": ["node_modules", "metadata"]
 }

From 2b6e03ae2375ea8e287eea19a8a54c16f2033033 Mon Sep 17 00:00:00 2001
From: Anton Mushnin <anton.mushnin@gmail.com>
Date: Tue, 14 May 2024 17:01:06 +0300
Subject: [PATCH 2/4] Google Analytics IDs

---
 web/src/constants.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/web/src/constants.ts b/web/src/constants.ts
index 60dfb2f4..aba3c883 100644
--- a/web/src/constants.ts
+++ b/web/src/constants.ts
@@ -95,3 +95,6 @@ export const blbImage = (idx: number) =>
 
 export const NUMBER_OF_BLB_IMAGES = 16;
 export const HUMBUG_REPORT_VERSION = "0.0.3";
+
+export const GA_MEASUREMENT_ID = "G-7GHX3XTZT3";
+export const GTM_ID = "GTM-KSQM8K8K";

From 4336b08c4309f29e92d10871abb1344c7757253e Mon Sep 17 00:00:00 2001
From: Anton Mushnin <anton.mushnin@gmail.com>
Date: Tue, 14 May 2024 17:02:19 +0300
Subject: [PATCH 3/4] google analytics scripts

---
 web/pages/_app.tsx      | 22 +++++++++++++++++++++-
 web/pages/_document.tsx |  4 ++--
 2 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/web/pages/_app.tsx b/web/pages/_app.tsx
index 2ce33cd6..6b28b095 100644
--- a/web/pages/_app.tsx
+++ b/web/pages/_app.tsx
@@ -11,6 +11,7 @@ import { GameContextProvider } from "../src/contexts/GameContext";
 import { UserProvider } from "../src/contexts/UserContext";
 import Script from "next/script";
 import ErrorBoundary from "../src/components/layout/ErrorBoundary";
+import { GA_MEASUREMENT_ID, GTM_ID } from "../src/constants";
 
 export default function App({ Component, pageProps }: AppProps) {
   const [queryClient] = useState(new QueryClient());
@@ -26,7 +27,26 @@ export default function App({ Component, pageProps }: AppProps) {
                     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','GTM-KSQM8K8K');`,
+                    })(window,document,'script','dataLayer',${GTM_ID});`,
+          }}
+        />
+        {/* Global Site Tag (gtag.js) - Google Analytics */}
+        <Script
+          src={`https://www.googletagmanager.com/gtag/js?id=${GA_MEASUREMENT_ID}`}
+          strategy="afterInteractive"
+        />
+        <Script
+          id="gtag-init"
+          strategy="afterInteractive"
+          dangerouslySetInnerHTML={{
+            __html: `
+            window.dataLayer = window.dataLayer || [];
+            function gtag(){dataLayer.push(arguments);}
+            gtag('js', new Date());
+            gtag('config', '${GA_MEASUREMENT_ID}', {
+              page_path: window.location.pathname,
+            });
+          `,
           }}
         />
         <ChakraProvider theme={theme}>
diff --git a/web/pages/_document.tsx b/web/pages/_document.tsx
index 97bf8a42..885eb60f 100644
--- a/web/pages/_document.tsx
+++ b/web/pages/_document.tsx
@@ -1,5 +1,5 @@
 import { Html, Head, Main, NextScript } from "next/document";
-import { FULLCOUNT_ASSETS_PATH } from "../src/constants";
+import { FULLCOUNT_ASSETS_PATH, GTM_ID } from "../src/constants";
 
 export default function Document() {
   return (
@@ -36,7 +36,7 @@ export default function Document() {
         {/*<!-- Google Tag Manager (noscript) -->*/}
         <noscript>
           <iframe
-            src="https://www.googletagmanager.com/ns.html?id=GTM-KSQM8K8K"
+            src={`https://www.googletagmanager.com/ns.html?id=${GTM_ID}`}
             height="0"
             width="0"
             style={{ display: "none", visibility: "hidden" }}

From a6ff55a5a7cd7fb76176bc9ed906c2b27b350f26 Mon Sep 17 00:00:00 2001
From: Anton Mushnin <anton.mushnin@gmail.com>
Date: Tue, 14 May 2024 17:02:42 +0300
Subject: [PATCH 4/4] report sign up to google analytics

---
 web/src/hooks/useSignUp.tsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/web/src/hooks/useSignUp.tsx b/web/src/hooks/useSignUp.tsx
index db72b22a..ac4d1656 100644
--- a/web/src/hooks/useSignUp.tsx
+++ b/web/src/hooks/useSignUp.tsx
@@ -21,6 +21,13 @@ const useSignUp = () => {
       sendReport("signed up", { username: variables.username, email: variables.email }, [
         `user_token: ${response.data.id}`,
       ]);
+      if (typeof gtag === "function") {
+        gtag("set", "user_properties", {
+          user_status: "signed_up",
+        });
+      } else {
+        console.warn("gtag function is not defined");
+      }
 
       getUser();
     },