redux-reducers

Unobtrusive reusable redux reducers

WARNING

Experimental - do not use in production.

Usage

Given the following action creator and reducer:

function add(payload) {
  return {
    type: 'ADD',
    payload
  };
}
 
add(1) // { type: 'ADD', payload: 1 }
 
function addReducer(state = 0, action) {
  switch (action.type) {
    case 'ADD':
      return state + action.payload;
    default:
      return state;
  }
}
 

wrapActionCreator(idCreator, actionCreator)

import { wrapActionCreator } from 'redux-reducers';
 
const wrappedAdd = wrapActionCreator('target ID', add);
 
wrappedAdd(1) // creates an action that will only be targeted by wrapped reducers

wrapReducer(idCreator, reducer)

import { createStore, combineReducers } from 'redux';
import { wrapReducer, wrapActionCreator } from 'redux-reducers';
 
const reducer = combineReducers({
  one: wrapReducer('target ID', addReducer),
  two: wrapReducer('two', addReducer),
});
 
const store = createStore(reducer);
 
const wrappedAdd = wrapActionCreator('target ID', add);
 
store.dispatch(wrappedAdd(1));
 
store.getState(); // { one: 1, two: 0 }

wrapDispatch(dispatch, idCreator)

import { createStore } from 'redux';
import { wrapDispatch } from 'redux-reducers';
 
const store = createStore(reducer);
 
const dispatchToMyTarget = wrapDispatch(store.dispatch, 'my target');
 
dispatchToMyTarget(action); // action that will be picked up by reducers that target that id

idCreator

idCreator can be a string, number or a function, where the function is of the form:

idCreator(action) {
  return action.meta.id;
}

composeReducers(reducers)

Compose reducers from right to left.

const action = {
  type: ACTION_TYPE,
  payload: 1,
};
 
function reducerOne(state = 0, action) {
  switch (action.type) {
    case ACTION_TYPE:
      return state + action.payload;
    default:
      return state;
  }
}
 
function reducerTwo(state = 0, action) {
  switch (action.type) {
    case ACTION_TYPE:
      return state + action.payload;
    default:
      return state;
  }
}
 
const composedReducer = composeReducers(reducerThree, reducerTwo);
 
composedReducer(0, action); // 2