Added analytics

src/app.jsx

@@ -2,6 +2,9 @@ import React from "react";
 import { BrowserRouter, Switch, Route, Link } from "react-router-dom";
 import { Header, Container, Divider } from "semantic-ui-react";
 
+//include tools
+import GA from './utilities/google_analytics.jsx';
+
 //include styles
 import "./styles/shared.css";
 
@@ -26,6 +29,7 @@ class App extends React.Component {
 			<div className="central">
 				<BrowserRouter>
 					<Container className="panel" style={{ display: "flex" }}>
+						{ GA.init() && <GA.RouteTracker /> }
 						<Link to="/"><Header as="h1" textAlign="center">Mecha: Immense Warfare</Header></Link>
 						<LinkButton.Group widths="4">
 							<LinkButton to="/rules" className="noPadding">Rules</LinkButton>

src/utilities/google_analytics.jsx

@@ -0,0 +1,75 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import ReactGA from 'react-ga';
+import { Route } from 'react-router-dom';
+
+import auth from '../../auth.json';
+
+class GoogleAnalytics extends React.Component {
+  componentDidMount() {
+    this.logPageChange(
+      this.props.location.pathname,
+      this.props.location.search
+    );
+  }
+
+  componentDidUpdate({location: prevLocation}) {
+    const { location: { pathname, search } } = this.props;
+    const isDifferentPathname = pathname !== prevLocation.pathname;
+    const idDifferentSearch = search !== prevLocation.search;
+
+    if (isDifferentPathname || isDifferentSearch) {
+      this.logPageChange(pathname, search);
+    }
+  }
+
+  logPageChange(pathname, search = '') {
+    const page = pathname + search;
+    const { location } = window;
+    ReactGA.set({
+      page,
+      location: `${location.origin}${page}`,
+      ...this.props.options
+    });
+    ReactGA.pageview(page);
+  }
+
+  render() {
+    return null;
+  }
+}
+
+GoogleAnalytics.propTypes = {
+  location: PropTypes.shape({
+    pathname: PropTypes.string,
+    search: PropTypes.string,
+  }).isRequired,
+  options: PropTypes.object
+}
+
+const RouteTracker = () =>
+  <Route component={GoogleAnalytics} />
+
+const init = (options = {}) => {
+  const env = auth.env || {};
+  const isGAEnabled = !!env.REACT_APP_GA_TRACKING_ID;
+
+  if (isGAEnabled) {
+    ReactGA.initialize(
+      env.REACT_APP_GA_TRACKING_ID, {
+        debug: env.REACT_APP_GA_DEBUG === 'true',
+        ...options
+      }
+    )
+  }
+
+  return isGAEnabled;
+}
+
+export default {
+  GoogleAnalytics,
+  RouteTracker,
+  init
+}
+
+