How to migrate 'displayfeatures' and 'ec' plugins requirements from react-ga to react-ga4

Question

Because of the upcoming GA4, we will start using react-ga4 instead of react-ga. And we have these lines in our code for the GA initialization from the react-ga.

ReactGA.plugin.require('displayfeatures');
ReactGA.plugin.require('ec');

I couldn't find how to use them with react-ga4. Do you know how can we use them?

Note: We use the ec for ec:addImpression. Sending an impression is a bit different in GA4 & react-ga4. We send it with React.GA.event(....) now. Maybe we don't need the ec plugin at all but tbh I don't know if we're doing it correctly or not. It would have been nice to get some ideas.

Answer 1

In GA 4, sending recommended events is how you go about measuring user interaction on your e-commerce website.

You can map these events to their EC plugin counterparts for backward compatibility.

The view_item event takes the place of ec:addImpression and item parameters can be readily mapped to impression data.

The features enabled formerly via the displayfeatures plugin are enabled when ReactGA initializes your gtag property. This is because the default value for the allowAdFeatures option is enabled.

You don't have to make any changes there. However, you can enable those features explicitly by writing,

ReactGA.initialize([
  {
    trackingId: "your GA measurement id",
    gtagOptions: {
      allowAdFeatures: true
    },
  },
]);

or temporarily ad-hoc enable them and disable them

ReactGA.set('allowAdFeatures', true);
// send some hits
ReactGA.set('allowAdFeatures', false);