redux-analytics

import { createStore, applyMiddleware } from 'redux'; import analytics from 'redux-analytics'; // Mock analytics tracking library const track = (type, payload) => { console.log('Analytics Event:', type, payload); // In a real app, this would send data to Google Analytics, Segment, etc. }; // Redux reducer (minimal for demonstration) const initialState = { user: { id: 'user-123', plan: 'premium' }, app: { version: '1.0.0' } }; function rootReducer(state = initialState, action) { switch (action.type) { case 'USER_LOGGED_IN': return { ...state, user: { ...state.user, id: action.payload.userId } }; default: return state; } } // Analytics middleware setup const analyticsMiddleware = analytics(({ type, payload }, state) => { // Example: Augment analytics payload with shared state data track(type, { ...state.app, userId: state.user.id, ...payload }); }); // Create Redux store const store = createStore(rootReducer, applyMiddleware(analyticsMiddleware)); // Dispatch an action with valid analytics metadata store.dispatch({ type: 'ITEM_ADDED_TO_CART', payload: { itemId: 'sku789', quantity: 2 }, meta: { analytics: { type: 'ecommerce_add_to_cart', payload: { product: 'Super Widget', value: 19.99 } } } }); // Dispatch another action without analytics metadata (should be ignored by middleware) store.dispatch({ type: 'UPDATE_UI_SETTING', payload: { theme: 'dark' } }); // Dispatch an action with invalid analytics meta (should log an error to console) store.dispatch({ type: 'INVALID_ANALYTICS_ACTION', meta: { analytics: { // Missing payload, thus not a valid FSA for analytics meta type: 'invalid_event' } } });