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