Redux Utilities

This is a small library with some helper functions useful for applications build with Redux.

Create Action Types

Usage:

// model-action-types.js
 
import { createActionTypes } from 'redux-utilities'
 
export default createActionTypes(
  [
    {
      FETCH: ['START', 'SUCCESS', 'FAIL'],
      SAVE: ['START', 'SUCCESS', 'FAIL']
    },
    ['SET_DATA']
  ],
  'MODEL'
)

Will export an object:

{
  FETCH: {
    START: 'MODEL.FETCH.START',
    SUCCESS: 'MODEL.FETCH.SUCCESS',
    FAIL: 'MODEL.FETCH.FAIL'
  },
  SAVE: {
    START: 'MODEL.SAVE.START',
    SUCCESS: 'MODEL.SAVE.SUCCESS',
    FAIL: 'MODEL.SAVE.FAIL'
  },
  SET_DATA: 'MODEL.SET_DATA'
}

Create Reducer

Usage:

// model-reducer.js
 
import { createReducer } from 'redux-utilities'
 
import MODEL from './model-action-types'
 
const initState = {
  isLoading: false,
  isSaving: false,
  data: [],
  error: null
}
 
export default createReducer({
  [MODEL.FETCH.START]: state => (
    { ...state, isLoading: true }
  )
  [MODEL.FETCH.SUCCESS]: (state, { data }) => (
    { ...state, isLoading: false, data }
  )
  [MODEL.FETCH.FAIL]: state => (
    { ...state, isLoading: false, error: { message: 'Could not fetch...' } }
  )
 
  [MODEL.SET_DATA]: (state, { field, value }) => (
    { ...state, data: { ...state.data, [field]: value } }
  )
    
  [MODEL.SAVE.START]: state => (
    { ...state, isSaving: true }
  )
  [MODEL.SAVE.SUCCESS]: (state, { data }) => (
    { ...state, isSaving: false }
  )
  [MODEL.SAVE.FAIL]: state => (
    { ...state, isSaving: false, error: { message: 'Could not save...' } }
  )
    
  ...
    
}, initState)

Will export a reducer that can be used with Redux's combineReducer function:

import modelReducer from './model-reducer.js'
 
...
combineReducers({
  modelReducer,
  ...
})
...

Create Module Factory

Docs: WIP

Contributing

If you want to contribute or share your ideas, please feel free to contact me.

License

Copyright (c) 2017 Matko Bulic
Licensed under the MIT License