setup

.babelrc

@@ -0,0 +1,11 @@
+{
+    "presets": [
+        ["es2015", {
+        "loose": true
+        }],
+        "react"
+    ],
+    "plugins": [
+        "transform-class-properties"
+    ]
+}

.gitignore

@@ -0,0 +1,8 @@
+logs
+*.log
+
+node_modules
+
+.DS_Store
+
+/build/

.npmignore

@@ -0,0 +1,8 @@
+/.*
+
+/node_modules/
+
+/src/
+
+/webpack.*
+/server.js

package.json

@@ -1,10 +1,10 @@
 {
   "name": "react-tracker",
   "version": "1.0.0",
-  "description": "Track actions whthin your component with a tracker redux-like!",
+  "description": "Track actions within your React app with a tracker redux-like!",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "build": "webpack"
   },
   "repository": {
     "type": "git",
@@ -21,5 +21,23 @@
   "bugs": {
     "url": "https://github.com/faouzioudouh/react-tracker/issues"
   },
-  "homepage": "https://github.com/faouzioudouh/react-tracker#readme"
+  "homepage": "https://github.com/faouzioudouh/react-tracker#readme",
+  "devDependencies": {
+    "babel-cli": "^6.24.1",
+    "babel-loader": "^7.1.2",
+    "babel-plugin-transform-class-properties": "^6.24.1",
+    "babel-plugin-transform-object-assign": "^6.22.0",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-react": "^6.24.1",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0",
+    "webpack": "^3.6.0"
+  },
+  "dependencies": {
+    "hoist-non-react-statics": "^2.2.1",
+    "prop-types": "^15.5.10"
+  },
+  "peerDependencies": {
+    "react": "*"
+  }
 }

src/HOCs/provideTrackEvent.js

@@ -0,0 +1,28 @@
+import React from 'react'
+import { getDisplayName } from '../utils';
+import Types from '../types';
+
+const provideTrackEvent = (Component, mapTrackerEventToProps) => {
+    const displayName = getDisplayName(Component);
+
+    const trackEventProvider = (props, context) => {
+        const trackEvent = context.tracker.dispatch;
+
+        if (!trackEvent) {
+            throw Error(`Could not find tracker in the context of ` + `"${displayName}"`);
+        }
+
+        const propsWithTrackEvent = Object.assign({}, props, { trackEvent });
+
+        return React.createElement(Component, propsWithTrackEvent)
+    }
+
+    trackEventProvider.displayName = displayName;
+    trackEventProvider.contextTypes = {
+        tracker: Types.tracker.isRequired
+    };
+
+    return trackEventProvider;
+}
+
+export default provideTrackEvent;

src/Tracker.js

@@ -0,0 +1,35 @@
+export default class Tracker {
+    constructor(subscribers) {
+        this.trackingHistory = [];
+        this.subscribers = subscribers || [];
+    }
+
+    subscribe(eventType, callback) {
+        this.subscribers = [...this.subscribers, Object.assign({}, { [eventType]: callback })];
+    }
+
+    dispatch = (event) => {
+        const { type, data } = event || {};
+
+        if (!type) {
+            return null;
+        }
+
+        for (let subscriber in this.subscribers) {
+
+            if (Object.prototype.hasOwnProperty.call(this.subscribers, subscriber)) {
+                if (typeof this.subscribers[subscriber] === 'function' && subscriber === type) {
+                    const save = this.subscribers[subscriber](event, this.trackingHistory);
+
+                    if (save) {
+                        this.trackingHistory = [...this.trackingHistory, save];
+                    }
+                }
+            }
+        }
+    }
+
+    getHistory() {
+        return this.trackingHistory;
+    }
+}

src/components/TrackerProvider.js

@@ -0,0 +1,33 @@
+import { Component, Children } from 'react';
+import Types from '../types';
+
+export default class TrackerProvider extends Component {
+    getChildContext() {
+        console.log('from here: ', this.tracker);
+        return {
+            tracker: this.tracker
+        }
+    }
+
+    constructor(props, context) {
+        super(props, context)
+        this.tracker = props.tracker;
+
+        console.log('from here constrc: ', this.tracker);
+    }
+
+    render() {
+        console.log('from here render: ', this.tracker);
+
+        return Children.only(this.props.children)
+    }
+}
+
+TrackerProvider.propTypes = {
+    tracker: Types.tracker.isRequired,
+    children: Types.element.isRequired,
+};
+
+TrackerProvider.childContextTypes = {
+    tracker: Types.tracker.isRequired,
+};

src/index.js

@@ -0,0 +1,5 @@
+import TrackerProvider from './components/TrackerProvider';
+import provideTrackEvent from './HOCs/provideTrackEvent';
+import Tracker from './Tracker';
+
+export { Tracker, TrackerProvider, provideTrackEvent };

src/types.js

@@ -0,0 +1,10 @@
+import propTypes from 'prop-types';
+
+const Types = Object.assign({}, propTypes, {
+  tracker: propTypes.shape({
+    subscribe: propTypes.func.isRequired,
+    dispatch: propTypes.func.isRequired,
+  })
+});
+
+export default Types;

src/utils/index.js

@@ -0,0 +1,8 @@
+export const getDisplayName = WrappedComponent => {
+    const wrappedComponentName = WrappedComponent.displayName
+        || WrappedComponent.name
+        || 'Component';
+
+
+    return `TrackEventProvider(${wrappedComponentName})`;
+}

webpack.config.js

@@ -0,0 +1,42 @@
+'use strict';
+
+const path = require('path');
+const { ReactLoadablePlugin } = require('webpack');
+
+module.exports = {
+entry: {
+    index: './src/index.js'
+},
+output: {
+    path: path.join(__dirname, 'build'),
+    publicPath: 'build/',
+    filename: 'index.js',
+    chunkFilename: 'react-tracker.js',    
+    sourceMapFilename: 'react-tracker.map',
+    library: 'ReactTracker',
+    libraryTarget: 'umd'
+},
+module: {
+    rules: [
+    {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        use: {
+        loader: 'babel-loader',
+        options: {
+            babelrc: false,
+            presets: [
+            ['es2015', { modules: false }],
+            'react',
+            ],
+            plugins: [
+            'transform-class-properties',
+            'transform-object-assign',
+            ],
+        }
+        },
+    },
+    ],
+},
+devtool: 'inline-source-map'
+};