Merge pull request #4 from Badiapp/tracking-consumer

[feat] tracking consumer for class components

README.md

@@ -207,6 +207,21 @@ const Room = ({ roomId }) => {
 }
 ```
 
+### Using the library with class components
+For the cases that you need to use the library with class components, import the context and use it as a common [provider/consumer](https://reactjs.org/docs/context.html#reactcreatecontext) component:
+``` jsx
+import { TrackingContext } from 'treacker'
+
+class MyClass extends React.Component {
+  componentDidMount() {
+    const tracking = this.context;
+
+    tracking.track('user-component.loaded')
+  }
+}
+MyClass.contextType = TrackingContext;
+```
+
 ### HOC
 WIP: `withTracking()`
 

example/child-components.js

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react'
 
-import { useTracking } from '../dist/bundle-esm'
+import { useTracking } from '../dist/bundle.esm'
 
 const ChildComponent = () => {
   const tracking = useTracking()

example/index.js

@@ -1,7 +1,7 @@
 import React, { useState } from 'react'
 import ReactDOM from 'react-dom'
 
-import { TrackingProvider } from '../dist/bundle-esm'
+import { TrackingProvider } from '../dist/bundle.esm'
 import ChildComponent from './child-components'
 
 function App () {

src/index.js

@@ -1,5 +1,6 @@
 export { trackingManager } from './lib/tracking'
 export { registerTrackingListener } from './lib/helpers'
 export { useTracking } from './react/hooks'
-export { TrackingProvider } from './react/provider-consumer'
+export { TrackingProvider, TrackingConsumer } from './react/provider-consumer'
 export { withTracking } from './react/with-tracking'
+export { TrackingContext } from './react/context'

src/react/provider-consumer.js

@@ -4,6 +4,8 @@ import PropTypes from 'prop-types'
 import { trackingManager } from '../lib/tracking'
 import { TrackingContext } from './context'
 
+export const TrackingConsumer = TrackingContext.Consumer
+
 export const TrackingProvider = ({
   id,
   children,