@ta-interaktiv/react-tracking NPM

React Tracking

React component that grabs the current tracking data from the Newsnet API and sets up the appropriate trackers (WEMF, Google Tag Manager).

Installation

yarn add @ta-interaktiv/react-tracking

API

Tracking

Tracking

Extends React.PureComponent

Component to track visits to a website, accessing the Newsnet API for all tracking information. Currently supports GTM, WEMF and Webseismo. Additional Providers need to be added separately.

Parameters

props Props
- props.articleId string? Article ID of the link article in the CD. If not available it will assume that content is being loaded in an iframe. So, yes, you can use this component without adding the articleId attribute. Make sure that you also pass an article ID when passing in the statistics configuration and GTM ID directly, otherwise WEMF won't track!
- props.gtmId string? Google Tag Manager ID. If this isn't passed in, the component will fetch the necessary data from the Newsnet API.
- props.statisticsConfigs Array<Statistic>? Array with statistics configuration objects as provided by Newsnet API. Together with the GTM ID, passing these in will prevent the component from making a network request.

Examples

Use the Newsnet API to get the necessary data

import Tracking from '@ta-interaktiv/react-tracking'
function YourComponent (props) {
  return (
    <div>
      <Tracking articleId='3352335' />
    </div>
  )
}

Add in data directly, circumventing network requests

// Access Newsnet API somewhere and get data
let newsnetData = fetch('m.tenant.ch/api/articles/111111/external_services')

render () {
  return (
    <Tracking articleId={111111}
              gtmId={newsnetData.configs.gtm_id}
              statisticsConfig={newsnetData.statistics}
    />
  )
}