Wrong page title in Google Analytics about redux-beacon

[coluccini]

What about having the title from the state and pass it to the pageView event definitions using the nextState instead leaving GA to use current page's title?

[ttmarek]

Hi @JacekKosciesza.

@coluccini is on the money. I would go about your problem in a very similar way.
First I would probably make a map of routes to page titles. Something like:

const pageTitles = {
  '/profile': 'Profile',
  '/accounts/payout': 'Payout',
  '/accounts/deposit': 'Deposit',
};

Then I would create a top level reducer to store the current page title in state. The reducer would listen to each ROUTER_NAVIGATION action and update the state using the url from the action payload and the map from above. Then your page view event definition could be written like so:

const pageView = (
  action: RouterNavigationAction<RouterStateSnapshot>,
  prevState, // won't need this
  nextState,
): PageView => ({
  hitType: 'pageview',
  page: action.payload.routerState.url,
  title: nextState.pageTitle, // or whatever you decide to call this property
});

This event definition would give you correct page titles in Google Analytics.

One additional benefit to this approach is you would have a single source of truth for the current page title and you could use this value from state in the ngOnInit method.