microsoft / redux-dynamic-modules

Modularize Redux by dynamically loading reducers and middlewares.
https://redux-dynamic-modules.js.org
MIT License
1.07k stars 116 forks source link

Provide access to saga completion promise #134

Closed simlrh closed 3 years ago

simlrh commented 4 years ago

For SSR it can be useful to run some sagas and await their completion before rendering the page. Eg:

// Run apiSaga
const sagaTask = sagaMiddleware.run(apiSaga);
// Send an action apiSaga is waiting for
store.dispatch({ type: 'GET_DATA_FROM_API' });
// Cancel all sagas still waiting for actions
store.dispatch(END);
// Await completion of sagas not waiting for actions
// This allows apiSaga to finish the api query and 'put' the data to the store
await sagaTask.done;
// Render the page including the api data
renderSSR();

This PR adds a function to the redux-dynamic-modules-saga IExtension to get a promise for the completion of all currently running sagas, allowing the above pattern when using redux-dynamic-modules. Eg:

const sagaExtension = getSagaExtension({});
const store: IModuleStore<IState> = createStore(
  {
    initialState: {},
    enhancers: [],
    extensions: [sagaExtension],
  },
  getApiModule()
);
store.dispatch({ type: 'GET_DATA_FROM_API' });
store.dispatch(END);
await sagaExtension.done();
renderSSR();
msftclas commented 4 years ago

CLA assistant check
All CLA requirements met.

simlrh commented 4 years ago

Unfortunately there was a breaking change in redux-saga@1.0.0 where they moved Task.done to Task.toPromise(). I've added the last commit to handle this but it's a bit hacky.

abettadapur commented 4 years ago

@simlrh Just sign the CLA and I will merge!

simlrh commented 4 years ago

Done

aslanyi commented 4 years ago

Any progress?

fostyfost commented 4 years ago

Hey. Look at my example. It may be useful to you. And you can learn some new ideas on how to improve your library. https://github.com/fostyfost/next-with-redux-dynamic-modules

Tsouef commented 4 years ago

Hey, any news ?