Create thunk generator to dispatch Flux-Standard-Action in each phase of Promise.
Switch branches/tags
Nothing to show
Clone or download
Pull request Compare This branch is 20 commits ahead, 4 commits behind kpaxqin:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
examples/todo-mvc
lib
src
test
.eslintrc
.gitignore
README.md
package-lock.json
package.json

README.md

redux-promise-thunk

This lib can help you dispatch FSA(flux standard action) in each phase of your promise;

You need to use redux thunk as one of your middleware to make this lib work.

Install

npm i redux-promise-thunk

Usage

createPromiseThunk(actionName, promiseCreator [, metaCreator])

createPromiseThunk will create an action creator, but instead of action object, it returns a thunk function, which will be processed by redux-thunk.

The action creator created by createPromiseThunk only receives one parameter and will pass it to promiseCreator. Example:

//editTodo is a thunk
const editTodo = createPromiseThunk('EDIT_TODO', function(todo) {
  return todoApi.edit(todo); //todoApi.edit() should return a Promise object;
});

//TodoItem.jsx
const {editTodo} = bindActionCreators(actions, dispatch);

class TodoItem extends Component {
  //...
  handleEdit(todo) {
    editTodo(todo);//only one parameter is allowed, and will be passed to promiseCreator;
  }
  //...
}

The thunk function will dispatch following flux standard actions(FSA) for the promise you returned in promiseCreator:

Name When payload meta.asyncStep
${actionName}_START promiseCreator(data) been called first argument of promiseCreator 'START'
${actionName}_COMPLETED promise resolved value of promise 'COMPLETED'
${actionName}_FAILED promise rejected reason of promise 'FAILED'

Example

Check examples/todo-mvc for further info, the TodoActions.editTodo shows optimistic update with composed thunk. and loadingMiddleWare shows how to do some aspect things like loading label with action.meta.asyncStep