From 65d4d4bd343dc0d681313355699b221554e999d6 Mon Sep 17 00:00:00 2001 From: jess Date: Mon, 21 Aug 2023 03:55:48 +0900 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20GA=EC=84=A4=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/mobile/index.html | 18 --------------- packages/mobile/package.json | 1 + packages/mobile/src/App.tsx | 4 +++- .../mobile/src/components/atoms/GA/index.tsx | 9 ++++++++ packages/mobile/src/hooks/useGA.ts | 22 +++++++++++++++++++ yarn.lock | 5 +++++ 6 files changed, 40 insertions(+), 19 deletions(-) create mode 100644 packages/mobile/src/components/atoms/GA/index.tsx create mode 100644 packages/mobile/src/hooks/useGA.ts diff --git a/packages/mobile/index.html b/packages/mobile/index.html index 98c0a186..559f15d6 100644 --- a/packages/mobile/index.html +++ b/packages/mobile/index.html @@ -46,24 +46,6 @@ href="https://cbnu-cmi.s3.ap-northeast-2.amazonaws.com/images/1678586426871.png" rel="icon" /> - - - - -
diff --git a/packages/mobile/package.json b/packages/mobile/package.json index af51464f..c33c0dee 100644 --- a/packages/mobile/package.json +++ b/packages/mobile/package.json @@ -21,6 +21,7 @@ "react": "^18.0.0", "react-device-detect": "^2.2.2", "react-dom": "^18.0.0", + "react-ga": "^3.3.1", "react-helmet": "^6.1.0", "react-helmet-async": "^1.3.0", "react-hot-toast": "^2.3.0", diff --git a/packages/mobile/src/App.tsx b/packages/mobile/src/App.tsx index d5e15289..e709b897 100644 --- a/packages/mobile/src/App.tsx +++ b/packages/mobile/src/App.tsx @@ -7,9 +7,10 @@ import Article from "src/page/Article"; import ArticleDetail from "src/page/Article/Detail"; import Board from "src/page/Board"; import BoardArticle from "src/page/Board/Article"; +import "src/polyfills"; import { isWebView } from "src/utils/webview"; -import "src/polyfills"; +import GA from "./components/atoms/GA"; import useFCMToken from "./hooks/useFCMToken"; import useWindowSizeDetect from "./hooks/useWindowSizeDetect"; import "./mobile.scss"; @@ -74,6 +75,7 @@ function App() { return ( + {routes.map((route) => { return ( diff --git a/packages/mobile/src/components/atoms/GA/index.tsx b/packages/mobile/src/components/atoms/GA/index.tsx new file mode 100644 index 00000000..384cb28f --- /dev/null +++ b/packages/mobile/src/components/atoms/GA/index.tsx @@ -0,0 +1,9 @@ +import useGA from "src/hooks/useGA"; + +const GA = () => { + useGA(); + + return null; +}; + +export default GA; diff --git a/packages/mobile/src/hooks/useGA.ts b/packages/mobile/src/hooks/useGA.ts new file mode 100644 index 00000000..f727a6e0 --- /dev/null +++ b/packages/mobile/src/hooks/useGA.ts @@ -0,0 +1,22 @@ +import { useEffect, useState } from "react"; +import ReactGA from "react-ga"; +import { useLocation } from "react-router-dom"; + +const useGA = () => { + const location = useLocation(); + const [ initialized, setInitialized ] = useState(false); + + useEffect(() => { + ReactGA.initialize("G-90WFEB8J9K"); + + setInitialized(true); + }, []); + + useEffect(() => { + if (initialized) { + ReactGA.pageview(location.pathname + location.search); + } + }, [ initialized, location ]); +}; + +export default useGA; diff --git a/yarn.lock b/yarn.lock index 002b1218..11aef2e8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -14234,6 +14234,11 @@ react-fast-compare@^3.1.1, react-fast-compare@^3.2.0: resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb" integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA== +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-helmet-async@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/react-helmet-async/-/react-helmet-async-1.3.0.tgz#7bd5bf8c5c69ea9f02f6083f14ce33ef545c222e"