From b3948ac69c8f6380770b9e10ab094e64b26c283d Mon Sep 17 00:00:00 2001
From: Guillermo Bellmann <gbellmann@gmail.com>
Date: Tue, 13 Aug 2019 21:36:53 -0300
Subject: [PATCH 1/3] Add react-ga package

---
 package.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/package.json b/package.json
index 5d32db0..55f929b 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
     "classnames": "^2.2.6",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
+    "react-ga": "^2.6.0",
     "react-router-dom": "^5.0.0"
   },
   "devDependencies": {

From 4b1e81f5fd2da3a78f5b8602337a5320ff71cfd6 Mon Sep 17 00:00:00 2001
From: Guillermo Bellmann <gbellmann@gmail.com>
Date: Tue, 13 Aug 2019 21:37:21 -0300
Subject: [PATCH 2/3] Add helper to track pageviews

---
 src/apps/withTracker.jsx | 38 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 38 insertions(+)
 create mode 100644 src/apps/withTracker.jsx

diff --git a/src/apps/withTracker.jsx b/src/apps/withTracker.jsx
new file mode 100644
index 0000000..0faca8a
--- /dev/null
+++ b/src/apps/withTracker.jsx
@@ -0,0 +1,38 @@
+/**
+ * From ReactGA Community Wiki Page https://github.com/react-ga/react-ga/wiki/React-Router-v4-withTracker
+ */
+
+import React, { Component } from 'react';
+import ReactGA from 'react-ga';
+
+export default function withTracker(WrappedComponent, options = {}) {
+  const trackPage = (page) => {
+    ReactGA.set({
+      page,
+      ...options
+    });
+    ReactGA.pageview(page);
+  };
+
+  const HOC = class extends Component {
+    componentDidMount() {
+      const page = this.props.location.pathname;
+      trackPage(page);
+    }
+
+    componentWillReceiveProps(nextProps) {
+      const currentPage = this.props.location.pathname;
+      const nextPage = nextProps.location.pathname;
+
+      if (currentPage !== nextPage) {
+        trackPage(nextPage);
+      }
+    }
+
+    render() {
+      return <WrappedComponent {...this.props} />;
+    }
+  };
+
+  return HOC;
+}
\ No newline at end of file

From 7e1257b175493cd863fed2844f1e2eba13d229c0 Mon Sep 17 00:00:00 2001
From: Guillermo Bellmann <gbellmann@gmail.com>
Date: Tue, 13 Aug 2019 21:39:04 -0300
Subject: [PATCH 3/3] Add pageview tracking

---
 src/apps/ConferenceApp/ConferenceApp.tsx | 10 ++++++---
 src/apps/GlobalApp/GlobalApp.tsx         |  9 ++++----
 src/index.tsx                            | 27 ++++++++++++++++++++++++
 3 files changed, 39 insertions(+), 7 deletions(-)

diff --git a/src/apps/ConferenceApp/ConferenceApp.tsx b/src/apps/ConferenceApp/ConferenceApp.tsx
index 316b1a3..43c4f2a 100644
--- a/src/apps/ConferenceApp/ConferenceApp.tsx
+++ b/src/apps/ConferenceApp/ConferenceApp.tsx
@@ -23,6 +23,8 @@ import { IProps, IState } from "./types";
 import styles from "./ConferenceApp.module.scss";
 import { IEdition } from "../../types/IConference";
 import constants from "../../constants";
+import ReactGA from 'react-ga';
+import withTracker from '../withTracker';
 
 const sortByName = (itemA: any, itemB: any) => {
   if (itemA.name < itemB.name) return -1;
@@ -38,6 +40,8 @@ const Home: React.SFC<any> = ({ conferenceInfo, globalInfo }: { conferenceInfo:
 
   const globalOrganizers = globalInfo.organizers ? globalInfo.organizers.sort(sortByName) : [];
 
+  ReactGA.pageview(location.pathname);
+
   return (
     <>
       <Banner to="#about" title={conferenceInfo.name}>
@@ -114,9 +118,9 @@ export default class ConferenceApp extends React.PureComponent<IProps, IState> {
           </Header>
           {/* Body */}
           <Route exact path="/" render={() => <Home conferenceInfo={lastEdition} globalInfo={globalEdition} />} />
-          <Route path="/schedule" component={Schedule} />
-          <Route path="/conduct" component={Conduct} />
-          <Route path="/team" component={Team} />
+          <Route path="/schedule" component={withTracker(Schedule)} />
+          <Route path="/conduct" component={withTracker(Conduct)} />
+          <Route path="/team" component={withTracker(Team)} />
           {/* End body */}
           <Footer>
             <NavLink activeClassName={styles.navActive} className={styles.navLink} to="/conduct">
diff --git a/src/apps/GlobalApp/GlobalApp.tsx b/src/apps/GlobalApp/GlobalApp.tsx
index a350e12..60f27ab 100644
--- a/src/apps/GlobalApp/GlobalApp.tsx
+++ b/src/apps/GlobalApp/GlobalApp.tsx
@@ -3,6 +3,7 @@ import { BrowserRouter as Router, Route } from "react-router-dom";
 import { Header, Footer, NavLink, PageSection, Banner, About, PastEditions } from "../../components";
 import { FlagArgentina, FlagChile, FlagColombia, FlagPeru, FlagUruguay } from "../../components/SVGs";
 import { Conduct, Sponsorship, Team } from "../../pages";
+import withTracker from '../withTracker';
 
 import styles from "./GlobalApp.module.scss";
 
@@ -38,10 +39,10 @@ export default class GlobalApp extends React.PureComponent {
             <NavLink to="/team">Team</NavLink>
           </Header>
           {/* Body */}
-          <Route exact path="/" component={Home} />
-          <Route path="/conduct" component={Conduct} />
-          <Route path="/sponsorship" component={Sponsorship} />
-          <Route path="/team" component={Team} />
+          <Route exact path="/" component={withTracker(Home)} />
+          <Route path="/conduct" component={withTracker(Conduct)} />
+          <Route path="/sponsorship" component={withTracker(Sponsorship)} />
+          <Route path="/team" component={withTracker(Team)} />
           {/* End body */}
           <Footer>
             <NavLink to="/conduct">Código de conducta</NavLink>
diff --git a/src/index.tsx b/src/index.tsx
index 687a354..0226ec2 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,6 +1,7 @@
 import React from "react";
 import ReactDOM from "react-dom";
 import * as serviceWorker from "./serviceWorker";
+import ReactGA from 'react-ga';
 import { GlobalApp, ConferenceApp } from "./apps";
 
 import "./styles/global.scss";
@@ -33,8 +34,34 @@ function getConferenceId(): string {
   return toReturn;
 }
 
+function getTrackingId(conferenceId:string): string {
+  const baseCode = "UA-49706206-";
+  switch (conferenceId) {
+    case "vopen-ar":
+      return baseCode + "5";
+    case "vopen-cl":
+      return baseCode + "6";
+    case "vopen-co":
+      return baseCode + "7";
+    case "vopen-pe":
+      return baseCode + "8";
+    case "vopen-uy":
+      return baseCode + "9";
+    case "vopen-global":
+      return baseCode + "10";
+    default:
+      break;
+  }
+  return "";
+}
+
 const conferenceId = getConferenceId();
+
+const trackingId = getTrackingId(conferenceId);
+ReactGA.initialize(trackingId);
+
 const WebsiteApp = conferenceId !== "vopen-global" ? ConferenceApp : GlobalApp;
+
 ReactDOM.render(<WebsiteApp conferenceId={conferenceId} />, document.getElementById("root"));
 
 // If you want your app to work offline and load faster, you can change