anonkey / redux-normalizr

Redux normalizr customizable middleware

redux-normalizr

Installation

npm install --save redux-normalizr

Usage

Functions

• normalizrMiddleware ⇒ Boolean

Return a middleware for redux applyMiddleware function.

Typedefs

• GetDataCb ⇒ Object

This callback fetch the data to normalize in the action

• PostNormalizeCb ⇒ Object

This callback trigger after normalization and can mutate data

• OnNextCb ⇒ Object

This callback trigger just before leaving for mutate the action or dispatch actions

GetDataCb ⇒ Object

This callback fetch the data to normalize in the action

Kind: Callback Returns: Object - data to normalize

Param	Type	Description
store	ReduxStore	redux store
action	ReduxAction	redux action

PostNormalizeCb ⇒ Object

This callback trigger after normalization and can mutate data

Kind: Callback Returns: Object - mutated data

Param	Type	Description
normalizedData	ReduxAction	redux action

OnNextCb ⇒ Object

This callback trigger just before leaving for mutate the action or dispatch actions

Kind: Callback Returns: Object - normalized data

Param	Type	Description
store	ReduxStore	redux store
action	ReduxAction	redux action
normalizedData	ReduxAction	redux action
originalData	Object	original data

normalizrMiddleware(options) ⇒ Boolean

Return a normalizer-middleware for redux

Kind: global function
Returns: Boolean - shouldBeProcessed

Param	Type	Description
options	Object	middleware options
options.getActionData	GetDataCb	getData in action object
options.onNextAction	OnNextCb	mutate action before sending
options.onNormalizeData	PostNormalizeCb	mutate data after normalizr
options.actionFilter	String | Regex	filter of action type to handle

import normalizrMiddleware from 'redux-normalizer'

applyMiddleware(normalizrMiddleware({}));

Examples

Simple use case

A simple usage could be :

import { compose, createStore, applyMiddleware } from 'redux';
import normalizrMiddleware from 'redux-normalizr';
import reducers from './reducers';

export default initialState => createStore(
  reducers,
  initialState,
  compose(applyMiddleware(
      normalizrMiddleware({}),
    )
  ))

In this case all actions with a field :

{
  meta: {
    schema: normalizerSchema,
  }
}

will have it payload field replaced by :

normalize(payload, schema)

A use-case with redux-promise middleware

import normalizrMiddleware from 'redux-normalizr';
import reducers from './reducers'
/**
 *  Catch all resolved promise, normalize payload.data field,
 *  send normalized data to a reducer which act as localStore
 *  and send only id's to UI reducers
 */
const onNextAction = (store, action, normalizedData) => {
  store.dispatch({
    type: 'STORE_UPDATE',
    payload: normalizedData.entities,
  });

  return ({
    ...action,
    payload: {
      ...action.payload,
      data: normalizedData.result,
    },
  });
};

const getActionData = (store, action) => action.payload.data;

const normalizrConfig = {
  onNextAction,
  getActionData,
  actionFilter: /_FULFILLED$/,
};

/**
 * Create store with reducers and middlewares
 * @param  {Object}     initialState    store initial state
 * @return {ReduxStore} the redux store generated
 */
export default initialState => createStore(
  reducers,
  initialState,
  compose(applyMiddleware(
    promise(),
    normalizrMiddleware(normalizrConfig),
    thunk,
  ))
);