Implementing a Flag Middleware for Redux

const { applyMiddleware, createStore } = require('redux');

// Action types
const FLAG_TOGGLE = 'FLAG_TOGGLE';
const FLAG_UPDATE = 'FLAG_UPDATE';

// Sample flag-toggle action creator
const toggleFlag = (flagName, value) => ({
  type: FLAG_TOGGLE,
  payload: { flagName, value }
});

// Middleware that handles flag-related actions
const flagMiddleware = store => next => action => {
  if (action.type === FLAG_TOGGLE) {
    // Add custom logic for feature flags here
    console.log(`Toggling feature flag: ${action.payload.flagName}`);
    // Dispatch a new action with updated flag value
    store.dispatch({
      type: FLAG_UPDATE,
      payload: action.payload
    });
  } else {
    // For non-flag actions, just pass the action on to the next middleware
    return next(action);
  }
};

// Reducer for handling flag state updates (simplified example)
const flagReducer = (state = {}, action) => {
  if (action.type === FLAG_UPDATE) {
    return {
      ...state,
      [action.payload.flagName]: action.payload.value
    };
  }
  return state;
};

// Create store with middleware applied
const store = createStore(
  flagReducer,
  applyMiddleware(flagMiddleware)
);

// Dispatch a sample flag toggle action
store.dispatch(toggleFlag('new-feature', true));