feat: update to new ga

poooi · Sep 27, 2024 · efbc1b8 · efbc1b8
1 parent cda3125
commit efbc1b8
Show file tree

Hide file tree

Showing 4 changed files with 47 additions and 79 deletions.
diff --git a/packages/web/package.json b/packages/web/package.json
@@ -29,7 +29,6 @@
     "random": "^3.0.6",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-ga": "^3.3.1",
     "react-i18next": "^11.18.6",
     "react-markdown": "^8.0.3",
     "react-typist": "^2.0.5",

diff --git a/packages/web/public/index.html b/packages/web/public/index.html
@@ -1,65 +1,52 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <!--
-      manifest.json provides metadata used when your web app is installed on a
-      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
 
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <meta
-      name="description"
-      content="Scalable KanColle browser and tool, for Windows, macOS and Linux. 一个可扩展的舰队Collection浏览器。拡張可能な艦隊これくしょんブラウザ。"
-    />
-    <title>poi | KanColle Browser | 舰娘专用浏览器 | 艦これ専ブラ</title>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
+<head>
+  <meta charset="utf-8" />
+  <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <meta name="theme-color" content="#000000" />
+  <!--
+        manifest.json provides metadata used when your web app is installed on a
+        user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+      -->
+  <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+  <!--
+        Notice the use of %PUBLIC_URL% in the tags above.
+        It will be replaced with the URL of the `public` folder during the build.
+        Only files inside the `public` folder can be referenced from the HTML.
 
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
+        Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+        work correctly both with client-side routing and a non-root public URL.
+        Learn how to configure a non-root public URL by running `npm run build`.
+      -->
+  <meta name="description"
+    content="Scalable KanColle browser and tool, for Windows, macOS and Linux. 一个可扩展的舰队Collection浏览器。拡張可能な艦隊これくしょんブラウザ。" />
+  <title>poi | KanColle Browser | 舰娘专用浏览器 | 艦これ専ブラ</title>
+</head>
+
+<body>
+  <noscript>You need to enable JavaScript to run this app.</noscript>
+  <div id="root"></div>
+  <!--
+        This HTML file is a template.
+        If you open it directly in the browser, you will see an empty page.
+
+        You can add webfonts, meta tags, or analytics to this file.
+        The build step will place the bundled scripts into the <body> tag.
+
+        To begin the development, run `npm start` or `yarn start`.
+        To create a production bundle, use `npm run build` or `yarn build`.
+      -->
+  <!-- Google tag (gtag.js) -->
+  <script async src="https://www.googletagmanager.com/gtag/js?id=G-L74D6BJK8Q"></script>
+  <script>
+    window.dataLayer = window.dataLayer || [];
+    function gtag() { dataLayer.push(arguments); }
+    gtag('js', new Date());
+
+    gtag('config', 'G-L74D6BJK8Q');
+  </script>
+</body>
 
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-    <script>
-      ;(function(i, s, o, g, r, a, m) {
-        i['GoogleAnalyticsObject'] = r
-        ;(i[r] =
-          i[r] ||
-          function() {
-            ;(i[r].q = i[r].q || []).push(arguments)
-          }),
-          (i[r].l = 1 * new Date())
-        ;(a = s.createElement(o)), (m = s.getElementsByTagName(o)[0])
-        a.async = 1
-        a.src = g
-        m.parentNode.insertBefore(a, m)
-      })(
-        window,
-        document,
-        'script',
-        'https://www.google-analytics.com/analytics.js',
-        'ga',
-      )
-      ga('create', 'UA-83274947-1', 'auto')
-      ga('send', 'pageview')
-    </script>
-  </body>
 </html>
diff --git a/packages/web/src/pages/_app.tsx b/packages/web/src/pages/_app.tsx
@@ -1,13 +1,11 @@
 import { AppProps } from 'next/app'
 import dynamic from 'next/dynamic'
-import { FC, useReducer, useEffect } from 'react'
+import { FC, useReducer } from 'react'
 import styled, { createGlobalStyle, ThemeProvider } from 'styled-components'
 import classNames from 'classnames'
 import { config } from '@fortawesome/fontawesome-svg-core'
 import * as Sentry from '@sentry/browser'
 import Head from 'next/head'
-import ReactGA from 'react-ga'
-import Router from 'next/router'
 
 import {
   darkTheme,
@@ -30,11 +28,6 @@ if (process.env.NODE_ENV === 'production') {
   })
 }
 
-const logPageView = () => {
-  ReactGA.set({ page: window.location.pathname })
-  ReactGA.pageview(window.location.pathname)
-}
-
 const FoucFix = dynamic<any>(
   () => import('../components/no-ssr/fouc-fix').then((mod) => mod.FoucFix),
   { ssr: false },
@@ -110,12 +103,6 @@ const App: FC<AppProps> = ({ Component, pageProps }) => {
     true,
   )
 
-  useEffect(() => {
-    ReactGA.initialize('UA-83274947-1')
-    logPageView()
-    Router.events.on('routeChangeComplete', logPageView)
-  }, [])
-
   return (
     <ThemeProvider theme={isDark ? darkTheme : lightTheme}>
       <DispatchThemeChangeContext.Provider value={dispatch}>

diff --git a/yarn.lock b/yarn.lock
@@ -12551,11 +12551,6 @@ react-element-to-jsx-string@^14.3.4:
     is-plain-object "5.0.0"
     react-is "17.0.2"
 
-react-ga@^3.3.1:
-  version "3.3.1"
-  resolved "https://registry.yarnpkg.com/react-ga/-/react-ga-3.3.1.tgz#d8e1f4e05ec55ed6ff944dcb14b99011dfaf9504"
-  integrity sha512-4Vc0W5EvXAXUN/wWyxvsAKDLLgtJ3oLmhYYssx+YzphJpejtOst6cbIHCIyF50Fdxuf5DDKqRYny24yJ2y7GFQ==
-
 react-i18next@^11.18.6:
   version "11.18.6"
   resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-11.18.6.tgz#e159c2960c718c1314f1e8fcaa282d1c8b167887"