A generic module to track user actions inside Shore
npm install @shore/shore-tracker
Ensure you are in an ES6 environment, if not use polyfills!
import { initialize } from '@shore/shore-tracker';
// 1. Initializing the tracker
initialize({
trackMethod: analytics.track // The track method of some third party analytics tracker
});
import { createReduxMiddleware } from '@shore/shore-tracker';
import actionTypes from 'constants/action-types';
const { HIDE, SHOW, SAVE } = actionTypes.currentCustomer.additionalAttributes;
const Shore = window.Shore;
// Sample helper method to generate event data
const generateTrackerData = eventName => (state, actionPayload) => ({
eventName,
eventPayload: {
...actionPayload,
...{
'Merchant uuid': Shore.merchant_uuid,
'Merchant account id': Shore.merchant_account_id,
'Merchant name': Shore.merchantName,
'Merchant account name': Shore.merchant_account_name,
name: Shore.merchant_account_full_name,
phone: Shore.merchantPhone,
website: Shore.merchantWebsite,
},
},
});
// This map tells which redux action will be track with what data
const mapping = {
[HIDE]: generateTrackerData('customer_detail_additional_attributes_hide'),
[SHOW]: generateTrackerData('customer_detail_additional_attributes_show'),
[SAVE]: generateTrackerData('customer_detail_additional_attributes_save')
};
// Creating the middleware
const trackerMiddleware = createReduxMiddleware(mapping);
// Then when creating redux store you can use it like so
let store = createStore(
reducers,
applyMiddleware(trackerMiddleware)
)
// Then redux will track the actions mentioned inside the mapping
- Add tests
- Add documentation for how to use it for non redux app