Middleware: Is it possible to get next state

[Bart]

Hello,

I'm new to the middleware part of redux-zero and I wan't to write a small middleware that get the state after the application of the action. Is this possible with the middleware implementation of redux-zero?

Something like this doesn't work in my application:

const logger = store => next => action => {
  console.log("state before change", store.getState());
  const result = next(action); 
  console.log("state after change", store.getState());
  return result;
};

result will be a Promise which will resolve to undefined

I also tried to resolve the promise with async/await

Am I doing something wrong?

Other than that I'm loving redux-zero :-)

Thx and greetings from Cologne

Bart

[Matheus Lima]

Hi @tranquille

Thanks opening this.

What exactly is going on? What's the error that you're getting?

Btw, you should read the unit tests of the middleware. Maybe it'll help you out.

[Kiho Chang]

I have working middleware example here https://github.com/Kiho/redux-zero/blob/middleware-svt/examples/svelte/middleware/src/middleware/promise-middleware.ts
It's written for Svelte but it should work for React or other platform without modification

[Bart]

Hi, thanks for the fast reply @matheusml @Kiho , I already read the unit test of the middleware and also the example.

After reading my question again I see that I didn't explain correctly what my problem is.

In my middleware function I wan't to obtain the state after the execution of an action. I'm only able to get the state before it will be changed by the action. In my example I'm showing the implementation i tried to run, unfortunately this snippet does not work as a middleware. The given action will not be executed.

[Kiho Chang]

@tranquille this should work as long as you are passing promise as a action.

const middleware = store => next => action => {
  console.log("state before change", store.getState());
  const result = next(action).then(() => {
    console.log("state after change", store.getState());
  }); 
  return result;
}

https://github.com/Kiho/redux-zero/blob/middleware-svt/examples/svelte/middleware/src/middleware/logger-middleware.ts

[Matheus Lima]

Hi @tranquille

With this last comment, I think I can close this. If you have any more questions, please feel free to ask.

Thanks

[Bart]

@Kiho thank you very much, the hint with the promise as a action helped me a lot. It's now working as expected.

Also thank you and @matheusml for the fast support!