Home

Awesome

redux-immutablejs

Redux & Immutable integration

This is a small library that aims to provide integration tools between Redux & ImmutableJs that fully conforms Redux actions & reducers standards.

  1. An alternative to combineReducers that supports ImmutableJs for store initial state.
  2. An optional handler map reducer creator with immutable support.

Setup

Initial State

Using combineReducers it is possible to provide createStore with initial state using Immutable Iterable type, i.e:

import { createStore } from 'redux';
import { combineReducers } from 'redux-immutablejs';

import Immutable from 'immutable';
import * as reducers from './reducers';

const reducer = combineReducers(reducers);
const state = Immutable.fromJS({});

const store = reducer(state);
export default createStore(reducer, store);

Immutable Handler Map reducer creator

Using createReducer is an optional function that creates a reducer from a collection of handlers. In addition to getting rid of the switch statement, it also provides the following benefits:

  1. If the given initialState type is mutated, it will get converted to an immutable type.
  2. An error is produced in case a reducer handler returns a mutated state (not recommended but this behavior can be disabled)
import { createReducer } from 'redux-immutablejs'
const initialState = Immutable.fromJS({ isAuth: false })

/**
 * Reducer domain that handles authentication & authorization.
 **/
export default createReducer(initialState, {
  [LOGIN]: (state, action) => state.merge({
    isAuth: true,
    token: action.payload.token
  }),

  [LOGOUT]: (domain) => domain.merge({
    isAuth: false,
    current_identity: {},
    token: undefined
  })
})

If you want to specify the Immutable type to be used for implicit conversion, pass an constructor function at the end:

export default createReducer([], {
  [ADD_STUFF]: (state, { stuff }) => state.add(stuff)
}, true, ::Immutable.OrderedSet);

Please note that this is optional and combineReducers should work just fine if you prefer the old switch way.

FAQ

How this library is different from 'redux-immutable' ?

This library doesn't dictate any specific reducer structure. While redux-immutable focuses on CRC, this library provides some conversion middlewares from FSA to CCA and vise versa. If you feel like going with Redux's vanilla is the right approach, then consider using our library.