0

Is it possible to wait for some redux state change in an async function to write code without callbacks in one handler.

async function processSomething() {
   const results = await showModal();
   // work with results
}

async function showModal() {
   dispatch(showModalForm()); // Change Modal form to be active
   // wait till modal is closed. (state.active)
   return getState().someResults;
}

======

I've generally done it combining these answers:

Resolve Javascript Promise outside the Promise constructor scope

Getting an error "A non-serializable value was detected in the state" when using redux toolkit - but NOT with normal redux

Роман Коптев
  • 1,555
  • 1
  • 13
  • 35
  • Does this https://stackoverflow.com/questions/40946046/wait-for-a-redux-action-to-finish-dispatching answer your question? – Lin Du Apr 23 '23 at 09:11
  • @LinDu I create a Promise, await it in `show()` and pass `resolve` to the form using redux state. I resolve it in `handleSubmit` so `show` returns submitted data. It works transparently for the user. He calls `show` and await data from the modal form. The only bad thing the `resolve` function is not serializable, that is in some contradiction with the redux principles. – Роман Коптев Apr 23 '23 at 09:28
  • Hi, you should use a thunk, redux state is sync by concept. You never run async logic agains state, you dispatch sync actions from async thunk, action creator or middleware… – antokhio Apr 24 '23 at 21:57
  • https://blog.isquaredsoftware.com/2017/07/practical-redux-part-10-managing-modals/ This may help you – antokhio Apr 24 '23 at 22:01

0 Answers0