diff --git a/.gitignore b/.gitignore
index b946d3a..176d675 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,6 +4,9 @@ logs/**
/**/node_modules
/**/dl
+#passwords
+auth.json
+
#log files
/**/*.log
diff --git a/package.json b/package.json
index c3be4a3..a65931d 100644
--- a/package.json
+++ b/package.json
@@ -9,18 +9,18 @@
},
"author": "",
"license": "ISC",
- "dependencies": {
- "papaparse": "^4.6.2"
- },
+ "dependencies": {},
"devDependencies": {
"@babel/core": "^7.2.0",
"@babel/preset-env": "^7.2.0",
"@babel/preset-react": "^7.0.0",
"babel-loader": "^8.0.4",
"css-loader": "^2.0.0",
+ "papaparse": "^4.6.2",
"prop-types": "^15.6.2",
"react": "^16.6.3",
"react-dom": "^16.6.3",
+ "react-ga": "^2.5.6",
"react-markdown": "^4.0.4",
"react-router-dom": "^4.3.1",
"semantic-ui-react": "^0.83.0",
diff --git a/src/app.jsx b/src/app.jsx
index cb410ab..fd2a228 100644
--- a/src/app.jsx
+++ b/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 {
+ { GA.init() && }
Rules
diff --git a/src/utilities/google_analytics.jsx b/src/utilities/google_analytics.jsx
new file mode 100644
index 0000000..ea8c2ca
--- /dev/null
+++ b/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 = () =>
+
+
+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
+}
+
+