Redux utilities
Installation
With yarn
:
yarn install @malfaitrobin/redux
With npm
:
npm install --save @malfaitrobin/redux
Table of Contents
Action creators
Some utilities to work with action creators. All the actions are FSA (Flux Standard Actions) compliant, if you manage to create an action that is not FSA Compliant, it will throw an error.
createAction
A utility to create FSA compliant actions using a type
, optional payload
and optional meta
property.
import { createAction } from "@malfaitrobin/redux";
// A simple action
const action = createAction("FOO");
// { type: 'FOO' }
// An action with a payload
const action = createAction("FOO", { value: 5 });
// { type: 'FOO', payload: { value: 5 } }
// An action with a payload and meta information
const action = createAction("FOO", { value: 5 }, { foo: "bar" });
// { type: 'FOO', payload: { value: 5 }, meta: { foo: 'bar' } }
createErrorAction
A utility to create FSA compliant error actions using a type
, optional payload
and optional meta
property.
The payload must be an Error object. It also adds the { error: true }
flag.
import { createErrorAction } from "@malfaitrobin/redux";
// A simple action
const action = createErrorAction("FOO");
// { type: 'FOO', error: true }
// An action with a payload
const action = createErrorAction("FOO", new Error("msg"));
// { type: 'FOO', payload: new Error('msg'), error: true }
// An action with a payload and meta information
const action = createErrorAction("FOO", new Error("msg"), {
foo: "bar"
});
// { type: 'FOO', payload: new Error('msg'), meta: { foo: 'bar' }, error: true }
createReducer
This creates a simple reducer that takes a
pattern
which is an object and an optionaldefaultState
. If the type you are handling is not defined, it will return thestate
without touching it.
import { createReducer } from "@malfaitrobin/redux";
const defaultState = {
value: 0
};
const reducer = createReducer(
{
FOO: (state, action) => state
},
defaultState
);
createReducerCreator
This is a factory that allows you to create a
createReducer
function but prepared with some middleware. This allows us to keep thecreateReducer
clean and simple but it gives the power to write more advanced reducers.
import { createReducerCreator } from "@malfaitrobin/redux";
const createReducer = createReducerCreator(/* ...middleware */);
const defaultState = {
value: 0
};
const reducer = createReducer(
{
FOO: (state, action) => state
},
defaultState
);