Fix Google Analytics tracking #81
Conversation
src/components/App/index.js
Outdated
| const defaultHistory = createHistory(); | ||
|
|
||
| const TrackedSearchPage = trackedComponentEnahncer(ConnectedSearchTracePage); |
There was a problem hiding this comment.
Why break this up? If we do it at the top level container, we don't have to add it to each page.
If our concern is that the Page only mounts once, I would hook into React router page change event and do it there.
There was a problem hiding this comment.
Scratch my comment, didn't realize we were on react router v4.
There was a problem hiding this comment.
I'm wondering if we can do something similar to this helper library
https://github.com/pshrmn/rrc/blob/master/docs/OnUpdate.md
It would be nice if we could listen to all changes on the location without explicitly putting it on each page component. That way, when a new page is added, it will automatically start tracking it without having to use this HOC. Thoughts?
There was a problem hiding this comment.
Hm, could possibly connect it to the store and use state.location instead... I'll look into that.
There was a problem hiding this comment.
@saminzadeh Moved tracking into Page.
|
|
||
| componentDidMount() { | ||
| const { pathname, search } = this.props.location; | ||
| trackPageView(pathname, search); |
There was a problem hiding this comment.
Nice, I think this is more robust.
One comment, given that the GA key will come through the HTTP Config service (async), we need to make sure the key is initialized beforehand so we don't miss any page view events
There was a problem hiding this comment.
Yeah, I might make a separate ticket for that. Don't want to hold up fixing GA tracking or getting the menu working.
* Fix Google Analytics tracking * Google Analytics tracking moved to a higher level component * Misc css tweak Signed-off-by: vvvprabhakar <[email protected]>
Fix #80.
Created an HOC that checks the state of the router and tracks a page-view whenever the URL or query string changes. This is necessary because react-router v4 did away with the onUpdate lifecycle event.