Skip to content

samouss/simple-redux-utils

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

32 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Simple redux utils

npm version Build Status

Installation

npm install --save simple-redux-utils

Usage

Import the module in your application:

// From ES6
import * as reduxUtils from 'simple-redux-utils'
import { createReducer } from 'simple-redux-utils';

// From CJS
const reduxUtils = require('simple-redux-utils');

// From global
const reduxUtils = simpleReduxUtils.default;

Documentation

Reducers

# createReducer(initialState, handler)

const reducer = createReducer({}, {
  ['ACTION']: (state, action) => state,
});

Return the initialState if no action match.

initialState

Type: any

handler

Type: { actionType: (previousState, action) => nextState } | default: {}

Actions

# asyncActionWith(fn, ...actions)(...params)(dispatch)

const fn = (...params) =>
  Promise.resolve(params);

const request = payload => ({
  type: 'REQUEST',
  payload,
});

const success = payload => ({
  type: 'SUCCESS',
  payload,
});

const failure = payload => ({
  type: 'FAILURE',
  payload,
});

export const action = id =>
  asyncActionWith(
    fn,
    request,
    success,
    failure,
  )(id);

dispatch(action(id));
fn

Type: (...params: Array<any>): Promise<any>

The function to execute in the action creator.

actions

Type: Array<(payload: any) => ACTION>

Array of 3 action creators (REQUEST, SUCCESS, FAILURE).

params

Type: any

Parameters for the function (will be dispatch in REQUEST action).

dispatch

Type: (ACTION) => any

Redux dipatch function.

# bindActionToPromise(actionCreator)(dispatch)

const actionCreator = payload => ({
  type: 'ACTION',
  payload,
})

const boundAction = bindActionToPromise(actionCreator);

dispatch(boundAction(payload));

// Usage with Redux Saga
function* saga() {
  const action = take('ACTION');
  const resolver = getResolverBindActionToPromise(action);

  try {
    yield call(fn, value);
    yield put(actionCreator());

    resolver.resolve();
  } catch(error) {
    resolver.reject(error);
  }
}
actionCreator

Type: (payload: any) => ACTION

payload

Type: any

dispatch

Type: (ACTION) => any

Redux dipatch function.

# getPromiseResolverBoundToPromise(action)

const resolver = getPromiseResolverBoundToPromise(action);

resolver.resolve();
resolver.reject();
action

Type: ACTION

Sagas

# throws(error)

const saga = function* saga() {
  yield put(request());

  try {
    const response = yield call(fetch);

    yield put(success(response));
    yield response;
  } catch (error) {
    // We can handle error at this level
    yield put(failure(error));
    yield call(throws, error);
  }
}

const main = function* main() {
  try {
    yield call(saga);
    yield call(otherSagaWhoCanDispatchActionLikePrevious);
    yield put(success());
  } catch (error) {
    // Or at this one
    // Useful for dispatch different action
    yield put(failure(error));
  }
}
error

Type: { [KEY: any]: any }

# wrapSagaWithResolver(saga, action)

export const watch = function* watch() {
  while (true) {
    const action = yield take(ACTION);

    yield fork(wrapSagaWithResolver, saga, action);
  }
};

const boundAction = bindActionToPromise(actionCreator);

dispatch(boundAction(payload)).then(() => {
  // Enable the possibility to call `.then` on dispatch when action creator
  // has been bound to promise with `bindActionToPromise`
})
saga

Type: function* () => any

action

Type: ACTION

MUST have been bound to promise with bindActionToPromise.

Run the test

npm test

About

Simple Redux utils for facilitate workflow

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages