diff --git a/src/App.tsx b/src/App.tsx index 5dd7ec4..f327437 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -17,6 +17,7 @@ import Header from "./components/Header"; import TableOfContentsPage from "./pages/TableOfContentsPage"; import AccountPage from "./pages/AccountPage"; import { useEffect } from "react"; +import { isProd } from "./lib/isProd"; import ReactGA from "react-ga"; import { useUser } from "./user-context"; @@ -26,9 +27,7 @@ const chapters = content.reduce((chapters, item) => ( : [...chapters, ...item.chapters] ), []); -const prod = document.location.hostname === "grammar.lingdocs.com"; - -if (prod) { +if (isProd) { ReactGA.initialize("UA-196576671-2"); ReactGA.set({ anonymizeIp: true }); } @@ -37,7 +36,7 @@ function App(props: RouteComponentProps) { const [navOpen, setNavOpen] = useState(false); const { user } = useUser(); function logAnalytics() { - if (prod && !(user?.admin)) { + if (isProd && !(user?.admin)) { ReactGA.pageview(window.location.pathname); }; } diff --git a/src/games/GameCore.tsx b/src/games/GameCore.tsx index fc0cad4..954cc76 100644 --- a/src/games/GameCore.tsx +++ b/src/games/GameCore.tsx @@ -19,6 +19,7 @@ import { Types, } from "@lingdocs/pashto-inflector"; import ReactGA from "react-ga"; +import { isProd } from "../lib/isProd"; const errorVibration = 200; function GameCore({ questions, Display, timeLimit, Instructions, studyLink, id }:{ @@ -37,14 +38,20 @@ function GameCore({ questions, Display, timeLimit, Instructions, studyLink, i const [questionBox, setQuestionBox] = useState>(questions()); const [timerKey, setTimerKey] = useState(1); + function logGameEvent(action: string) { + if (isProd && !(user?.admin)) { + ReactGA.event({ + category: "Game", + action: `${action} - ${id}`, + label: id, + }); + } + } + function handleCallback(correct: true | JSX.Element) { if (correct === true) handleAdvance(); else { - ReactGA.event({ - category: "Game", - action: "fail on game", - label: id, - }); + logGameEvent("fail on game"); setFinish({ msg: "fail", answer: correct }); navigator.vibrate(errorVibration); } @@ -73,11 +80,7 @@ function GameCore({ questions, Display, timeLimit, Instructions, studyLink, i }).catch(console.error); } function handleFinish() { - ReactGA.event({ - category: "Game", - action: "passed game", - label: id, - }); + logGameEvent("passed game") setFinish("pass"); rewardRef.current?.rewardMe(); if (!user) return; @@ -93,11 +96,7 @@ function GameCore({ questions, Display, timeLimit, Instructions, studyLink, i setCurrent(undefined); } function handleRestart() { - ReactGA.event({ - category: "Game", - action: "started game", - label: id, - }); + logGameEvent("started game"); const newQuestionBox = questions(); const { value } = newQuestionBox.next(); // just for type safety -- the generator will have at least one question @@ -108,11 +107,7 @@ function GameCore({ questions, Display, timeLimit, Instructions, studyLink, i setTimerKey(prev => prev + 1); } function handleTimeOut() { - ReactGA.event({ - category: "Game", - action: "timeout on game", - label: id, - }); + logGameEvent("timeout on game") setFinish("time out"); navigator.vibrate(errorVibration); } diff --git a/src/lib/isProd.ts b/src/lib/isProd.ts new file mode 100644 index 0000000..93e9143 --- /dev/null +++ b/src/lib/isProd.ts @@ -0,0 +1 @@ +export const isProd = document.location.hostname === "grammar.lingdocs.com";