easy-reducer

0.1.4 • Public • Published

easy-reducer

Build Status Code Climate Test Coverage Issue Count

Easier reducers with less boilerplate.

Easy reducers generates action creators and types, and makes your reducers reusable.

Installing

npm install --save easy-reducer

NPM

Using easy reducers

import easyReducerCreator from 'easy-reducer'
import { createStore, applyMiddleware, combineReducers } from 'redux'
import thunk from 'redux-thunk'
 
const defaultState = {
  test: 'data'
}
const syncActions = {
   // previous state is always the last argument.
  testDataPlusNum (num, state) {
    return {...state, test: 'data' + num}
  },
  testDataPlusTwoNum (num1, num2, state) {
    return {...state, test: 'data' + num1 + '' + num2}
  }
}
 
// async actions are handled differently, and are meant to be used with redux-thunk
const asyncActions = {
  // syncActions, dispatch, getState (from thunk), are always the last arguments.
  asyncStateModifyer (num, syncActions, dispatch, getState) {
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve(dispatch(syncActions.testDataPlusNum(num)))
      }, 20)
    })
  },
}
 
const testReducerCreator = easyReducerCreator(defaultState, syncActions, asyncActions)
// testReducer1 now has all the action creators you would use for your methods, with the types TR1/methodName
export const testReducer1 = testReducerCreator('TR1')
 
// generated types as constants for reference with RXJS epics or whatever
// EG: {testDataPlusNum: 'TR1/testDataPlusNum', testDataPlusTwoNum: 'TR1/testDataPlusTwoNum'}
console.log(testReducer1.TYPES) 
 
// Reducers are reusable with different ID's
export const testReducer2 = testReducerCreator('TR2')
 
export const store = createStore(combineReducers({
  // a reducer property is attached, which serves as the actual reducer.
  testReducer1: testReducer1.reducer,
  testReducer2: testReducer2.reducer
}), undefined, applyMiddleware(thunk))
 
store.dispatch(testReducer1.testDataPlusNum(1))
store.dispatch(testReducer1.asyncStateModifyer(2))
.then(() => store.dispatch(testReducer2.testDataPlusTwoNum(3, 4)))

Package Sidebar

Install

npm i easy-reducer

Weekly Downloads

1

Version

0.1.4

License

MIT

Last publish

Collaborators

  • ericwooley