Novelty Polygonal Mathematics
Wondering what’s next for npm?Check out our public roadmap! »

zustand-saga
TypeScript icon, indicating that this package has built-in type declarations

1.0.5 • Public • Published

Use as Zustand middleware and run a saga independent of Redux for a Zustand store. From within the saga, yield the provided setState effect to update the store or the normal Saga select effect to retrieve the store.

import create from 'zustand';
import {takeEvery, select} from 'redux-saga/effects';
import sagaMiddleware, {setState} from 'zustand-saga';
 
const INCREMENT = 'INCREMENT';
 
const [useStore] = create(sagaMiddleware(saga, (set, get, store) => ({
  counter: 0,
  increment: amount => store.putActionToSaga({type: INCREMENT, amount}),
})));
 
function* increment({type, amount}) {
  const counter = yield select(state => state.counter);
  yield setState({counter: counter + amount});
  // or
  yield setState(({counter}) => ({counter: counter + amount}));
}
 
function* saga() {
  yield takeEvery(INCREMENT, increment);
}
 
function Component() {
  const increment = useStore(store => store.increment);
  useEffect(() => {
    increment(100);
  }, []);
 
  ...
}

Install

npm i zustand-saga

DownloadsWeekly Downloads

23

Version

1.0.5

License

MIT

Unpacked Size

202 kB

Total Files

9

Last publish

Collaborators

  • avatar