From bd355599c7bb2ebc7d24f425b2426288bae39d07 Mon Sep 17 00:00:00 2001 From: Matthew Grove Date: Sun, 5 Sep 2021 21:00:02 +0100 Subject: [PATCH] Add Google Analytics --- src/App.js | 62 ++++++++++++++++++++++++++----------------- src/CreateSet.js | 5 ++++ src/EditSet.js | 5 ++++ src/Error404.js | 7 ++++- src/GroupPage.js | 5 ++++ src/History.js | 5 ++++ src/LoggedInHome.js | 5 ++++ src/Login.js | 5 ++++ src/PrivacyPolicy.js | 7 ++++- src/Progress.js | 5 ++++ src/SetPage.js | 5 ++++ src/Settings.js | 5 ++++ src/TermsOfService.js | 7 ++++- src/UserGroups.js | 11 ++++++++ src/UserSets.js | 5 ++++ 15 files changed, 117 insertions(+), 27 deletions(-) diff --git a/src/App.js b/src/App.js index 2de2b9a..c809b53 100644 --- a/src/App.js +++ b/src/App.js @@ -26,6 +26,7 @@ import "firebase/auth"; import "firebase/functions"; import "firebase/app-check"; import "firebase/firestore"; +import "firebase/analytics"; // TODO: app check debug token set in index.html - remove before deploy @@ -71,6 +72,7 @@ const themes = [ ]; const db = firebase.firestore(); +const analytics = firebase.analytics(); class App extends React.Component { constructor(props) { @@ -88,17 +90,29 @@ class App extends React.Component { user: userData, }; - if (userData) await firebase.firestore() - .collection("users") - .doc(userData.uid) - .get() - .then((userDoc) => { - newState.sound = userDoc.data().sound; - newState.theme = userDoc.data().theme; - }).catch((error) => { - newState.sound = true; - newState.theme = "default"; - }); + if (userData) { + if (firebase.auth().currentUser.metadata.creationTime === + firebase.auth().currentUser.metadata.lastSignInTime) { + analytics.logEvent("sign_up", { + method: userData.providerId, + }); + } else { + analytics.logEvent("login", { + method: userData.providerId, + }); + } + await firebase.firestore() + .collection("users") + .doc(userData.uid) + .get() + .then((userDoc) => { + newState.sound = userDoc.data().sound; + newState.theme = userDoc.data().theme; + }).catch((error) => { + newState.sound = true; + newState.theme = "default"; + }); + } this.setState(newState); }); @@ -203,40 +217,40 @@ class App extends React.Component { <> - + - + - + - + - + - + - + - + - + - + - + - + @@ -251,7 +265,7 @@ class App extends React.Component { - + diff --git a/src/CreateSet.js b/src/CreateSet.js index 7f5f4c5..b232534 100644 --- a/src/CreateSet.js +++ b/src/CreateSet.js @@ -47,6 +47,11 @@ export default withRouter(class CreateSet extends React.Component { componentDidMount() { document.title = "Create Set | Parandum"; this.setNameInput.focus(); + + this.props.logEvent("select_content", { + content_type: "main_page", + item_id: "create_set", + }); } componentWillUnmount() { diff --git a/src/EditSet.js b/src/EditSet.js index d279ae4..115e309 100644 --- a/src/EditSet.js +++ b/src/EditSet.js @@ -109,6 +109,11 @@ export default withRouter(class EditSet extends Component { setInaccessible: true, }); }); + + this.props.logEvent("select_content", { + content_type: "edit_set", + item_id: this.props.match.params.setId, + }); } componentWillUnmount = () => { diff --git a/src/Error404.js b/src/Error404.js index c090d7b..cbbf89c 100644 --- a/src/Error404.js +++ b/src/Error404.js @@ -3,7 +3,7 @@ import NavBar from './NavBar'; import Footer from "./Footer"; import { HomeRounded as HomeRoundedIcon } from "@material-ui/icons"; -export default function PageNotFound() { +export default function Error404(props) { const navbarItems = [ { type: "link", @@ -15,6 +15,11 @@ export default function PageNotFound() { document.title = "Error 404 | Parandum"; + props.logEvent("select_content", { + content_type: "main_page", + item_id: "error_404", + }); + return (
diff --git a/src/GroupPage.js b/src/GroupPage.js index 0b13543..1d23494 100644 --- a/src/GroupPage.js +++ b/src/GroupPage.js @@ -119,6 +119,11 @@ export default withRouter(class GroupPage extends Component { this.setState(newState); }); }); + + this.props.logEvent("select_content", { + content_type: "group", + item_id: this.props.match.params.groupId, + }); } componentWillUnmount() { diff --git a/src/History.js b/src/History.js index bc8cc57..03f3b04 100644 --- a/src/History.js +++ b/src/History.js @@ -77,6 +77,11 @@ export default class History extends Component { }).catch((error) => { console.log(`Couldn't retrieve progress history: ${error}`); }); + + this.props.logEvent("select_content", { + content_type: "main_page", + item_id: "history", + }); } componentWillUnmount() { diff --git a/src/LoggedInHome.js b/src/LoggedInHome.js index 2b74c1e..dc05b9a 100644 --- a/src/LoggedInHome.js +++ b/src/LoggedInHome.js @@ -160,6 +160,11 @@ export default withRouter(class LoggedInHome extends React.Component { ]).then(() => { this.setState(newState); }); + + this.props.logEvent("select_content", { + content_type: "main_page", + item_id: "logged_in_home", + }); } componentWillUnmount() { diff --git a/src/Login.js b/src/Login.js index 8dda8c4..5933045 100644 --- a/src/Login.js +++ b/src/Login.js @@ -26,6 +26,11 @@ export default function Login(props) { document.body.style.overflow = "hidden"; document.title = "Login | Parandum"; + props.logEvent("select_content", { + content_type: "main_page", + item_id: "login", + }); + return ( <> diff --git a/src/PrivacyPolicy.js b/src/PrivacyPolicy.js index a7f547c..e09269d 100644 --- a/src/PrivacyPolicy.js +++ b/src/PrivacyPolicy.js @@ -3,7 +3,7 @@ import { HomeRounded as HomeRoundedIcon } from "@material-ui/icons"; import NavBar from "./NavBar"; import Footer from "./Footer"; -export default function PrivacyPolicy() { +export default function PrivacyPolicy(props) { const navbarItems = [ { type: "link", @@ -13,6 +13,11 @@ export default function PrivacyPolicy() { } ]; + props.logEvent("select_content", { + content_type: "main_page", + item_id: "privacy", + }); + return (
diff --git a/src/Progress.js b/src/Progress.js index 68e9420..ee01494 100644 --- a/src/Progress.js +++ b/src/Progress.js @@ -182,6 +182,11 @@ export default withRouter(class Progress extends React.Component { this.setState(newState, () => { if (!setDone) this.answerInput.focus() }); + + this.props.logEvent("select_content", { + content_type: "progress", + item_id: this.props.match.params.progressId, + }); } componentWillUnmount() { diff --git a/src/SetPage.js b/src/SetPage.js index 9bbf5be..1fa1413 100644 --- a/src/SetPage.js +++ b/src/SetPage.js @@ -95,6 +95,11 @@ export default withRouter(class SetPage extends React.Component { }); console.log(`Can't access set: ${error}`); }); + + this.props.logEvent("select_content", { + content_type: "set", + item_id: this.props.match.params.setId, + }); } componentWillUnmount() { diff --git a/src/Settings.js b/src/Settings.js index 0c12635..cf853b4 100644 --- a/src/Settings.js +++ b/src/Settings.js @@ -37,6 +37,11 @@ export default withRouter(class Settings extends Component { componentDidMount() { document.title = "Settings | Parandum"; + + this.props.logEvent("select_content", { + content_type: "main_page", + item_id: "settings", + }); } componentWillUnmount() { diff --git a/src/TermsOfService.js b/src/TermsOfService.js index 9e432b3..aa09cd4 100644 --- a/src/TermsOfService.js +++ b/src/TermsOfService.js @@ -4,7 +4,7 @@ import NavBar from "./NavBar"; import Footer from "./Footer"; import { Link } from "react-router-dom"; -export default function TermsOfService() { +export default function TermsOfService(props) { const navbarItems = [ { type: "link", @@ -14,6 +14,11 @@ export default function TermsOfService() { } ]; + props.logEvent("select_content", { + content_type: "main_page", + item_id: "tos", + }); + return (
diff --git a/src/UserGroups.js b/src/UserGroups.js index 232f31f..494ac3f 100644 --- a/src/UserGroups.js +++ b/src/UserGroups.js @@ -76,6 +76,11 @@ export default withRouter(class UserGroups extends Component { this.setState(newState); }); + + this.props.logEvent("select_content", { + content_type: "main_page", + item_id: "groups", + }); } componentWillUnmount() { @@ -112,6 +117,9 @@ export default withRouter(class UserGroups extends Component { this.state.functions.createGroup(this.state.groupName) .then((result) => { + this.props.logEvent("join_group", { + group_id: result.data, + }); this.props.history.push(`/groups/${result.data}`); this.stopCreateGroupLoading(); }).catch((error) => { @@ -136,6 +144,9 @@ export default withRouter(class UserGroups extends Component { .set({ role: "member", }).then(() => { + this.props.logEvent("join_group", { + group_id: joinCodeDoc.data().group, + }); this.props.history.push(`/groups/${joinCodeDoc.data().group}`); this.stopJoinGroupLoading(); }); diff --git a/src/UserSets.js b/src/UserSets.js index a9ebf4e..0591b7f 100644 --- a/src/UserSets.js +++ b/src/UserSets.js @@ -51,6 +51,11 @@ export default withRouter(class UserSets extends Component { userSets: querySnapshot.docs, }) }); + + this.props.logEvent("select_content", { + content_type: "main_page", + item_id: "sets", + }); } componentWillUnmount() {