redux-heat 🔥
Redux side-effects as a function of state.
- Reducers and action creators as pure functions;
- It is not a middleware, so setup and testing are super easy;
- Follows the same pattern as React (decide what to do based on the state and not the actions);
- Effects are pure functions.
Install
Add it as a dependency in your project:
npm install --save redux-heatUsage
Here is a simple example to fetch user details once the id of the user changes is the Redux store:
import subscribe from 'redux-heat'
// Define a selector to define what data to check for changes
const getUserId = state => state.userId
// Action creators
const setUserDetails = user => ({ type: 'SET_USER_DETAILS', payload: user })
const notifyUserFetchFailed = error => ({ type: 'FETCH_USER_FAILED', payload: e })
const fetchUser = userId => fetch(`/user/${userId}`)
// Describe the effect based on state changes
const fetchUserHeat = state => ({
fn: fetchUser,
args: [getUserId(state)],
onValue: setUserDetails,
onError: notifyUserFetchFailed
})
// Then subscribe the effect to the Redux store
subscribe(reduxStore, [fetchUserHeat])