redux-thunkster v0.3.0
Redux Thunkster 🔭 ·
Redux middleware for observing actions and dispatching new actions based on the observed.
Instalation
npm install --save thunkster
Usage
const { createStore, applyMiddleware } = require('redux');
const thunkster = require('thunkster');
// Sample root reducer
const reducer = (state = {}, action) => {
return {
...state,
...action.payload,
};
};
// Create Redux store
const store = createStore(reducer, applyMiddleware(thunkster)); // <- Add the middleware
// Thunkster
const handler = (action, dispatch, getState) => {
// Every action will go through every subscribed handler
if (action.type === 'ACTION') {
// Based on the action, you can dispatch any other action (even after a delay, like a thunk)
dispatch({
type: 'ACTION_LISTENER',
payload: {
listened: true,
},
});
}
};
// Subscribe to dispatcher (returns unsubscribe function)
const unsubscribe = thunkster.subscribe(handler);
Why thunkster
Using thunks
is great but their make your code more entangled. Take this simple exaple:
"Lets display a loader when fetching data."
Here is how a thunk could look like
const loadData = () => {
return (dispatch, getState) => {
dispatch({ type: 'SHOW_LOADER' });
dispatch({ type: 'REQUEST' });
fetch('/api/get-data').then(
data => {
dispatch({ type: 'REQUEST_SUCCESS', data });
dispatch({ type: 'HIDE_LOADER' });
},
err => {
dispatch({ type: 'REQUEST_ERR', err });
dispatch({ type: 'HIDE_LOADER' });
}
);
};
};
Now the data loading module is dependent on loading module. If we wanted to remove the loader for some reason, we would have to go through all modules using our loader and remove it - not very nice, is it?
So one of the option is to use something like redux-saga
which listens on the corresponding actions (i.e. REQUEST
and can dispatch the SHOW_LOADER
action). This works great, but working with generators is cumbersome and usually you need to use just a few of their features. It is like a using a cannon to shoot down a fly. Thunkster is simple, easy to implement solution for observing actions.
License
This project is licensed under the terms of the MIT license.