redux-thunk-lifecycle

Lifecycle events for Redux Thunk using decorators

Highlights

• Decorator which adds _REQUEST, _SUCCESS & _FAILURE actions to a thunk
• Middleware for handling _FAILURE actions globally

Installation

yarn add redux-thunk-lifecycle

or

npm install --save redux-thunk-lifecycle

Usage

  import { lifecycle } from 'redux-thunk-lifecycle';

The decorator only works on class methods so you'll have to place thunks inside classes. (This has an added bonus that thunks referencing other thunks via this can be mocked) NOTE: Arrow function methods might not work (requires Babel configuration).

class Thunks {
  @lifecycle(GET_USERS)
  loadUsers(page) {
    return (dispatch) =>
      API.getUsers(page)
        .then(() => dispatch({ type: 'SOMETHING_ELSE' }));
  }
}
 
const thunks = new Thunks();
export default thunks;
export const { loadUsers } = thunks;

@lifecycle will wrap the loadUsers thunk and make it dispatch a couple of lifecycle actions using the supplied GET_USERS key.

• before: {type: GET_USERS_REQUEST}
• after-success: { type: GET_USERS_SUCCESS, payload }
• after-failure: { type: GET_USERS_FAILURE, payload }

The result of the thunk will still be returned as if the decorator were never there in the first place.