wrapped routes in GAListener

This commit is contained in:
bill bittner 2018-02-15 17:04:49 -08:00
parent 0efc25a5c1
commit 9a3e9cad6a
2 changed files with 36 additions and 9 deletions

View file

@ -0,0 +1,25 @@
import React from 'react';
import GoogleAnalytics from 'react-ga';
import { withRouter } from 'react-router-dom';
// const config = require('../../../../config/speechConfig.js');
const googleApiKey = 'UA-60403362-3'; // config.analytics.googleId;
GoogleAnalytics.initialize(googleApiKey);
class GAListener extends React.Component {
componentDidMount () {
this.sendPageView(this.props.history.location);
this.props.history.listen(this.sendPageView);
}
sendPageView (location) {
GoogleAnalytics.set({ page: location.pathname });
GoogleAnalytics.pageview(location.pathname);
}
render () {
return this.props.children;
}
}
export default withRouter(GAListener);

View file

@ -2,8 +2,8 @@ import React from 'react';
import PropTypes from 'prop-types';
import { Provider } from 'react-redux';
import { BrowserRouter, Route, Switch } from 'react-router-dom';
import withAnalytics from 'utils/googleAnalytics';
import GAListener from 'components/GAListener';
import PublishPage from 'components/PublishPage';
import AboutPage from 'components/AboutPage';
import LoginPage from 'containers/LoginPage';
@ -13,14 +13,16 @@ import FourOhFourPage from 'components/FourOhFourPage';
const Root = ({ store }) => (
<Provider store={store}>
<BrowserRouter>
<Switch>
<Route exact path="/" component={withAnalytics(PublishPage)} />
<Route exact path="/about" component={withAnalytics(AboutPage)} />
<Route exact path="/login" component={withAnalytics(LoginPage)} />
<Route exact path="/:identifier/:claim" component={withAnalytics(ShowPage)} />
<Route exact path="/:claim" component={withAnalytics(ShowPage)} />
<Route component={withAnalytics(FourOhFourPage)} />
</Switch>
<GAListener>
<Switch>
<Route exact path="/" component={PublishPage} />
<Route exact path="/about" component={AboutPage} />
<Route exact path="/login" component={LoginPage} />
<Route exact path="/:identifier/:claim" component={ShowPage} />
<Route exact path="/:claim" component={ShowPage} />
<Route component={FourOhFourPage} />
</Switch>
</GAListener>
</BrowserRouter>
</Provider>
);