Listen for state changes from redux-thunk action creator

Question

I can't see a clear way to know when a particular action has fired or particular state has updated from the context of a redux-thunk action creator.

I want to do something like this:

1. Dispatch an action
2. Detect a possible recoverable error condition
3. Error condition dispatches a different action signalling recovery process initiating
4. Wait for recovery to complete
5. Proceed with current action or re-dispatch it

Concrete example:

1. User interaction triggers API call action
2. Note that API call failed, needs login
3. Dispatch 'LOGIN_REQUIRED' action, which pops up a <dialog> for user.
4. Wait for logged in state to change (or LOGIN_SUCCESS action to occur, whatever).
5. Make same API call again

Answer 1

If you want to check for a specific action to be dispatched, you'll need middleware.

If you want to, in effect, "subscribe a given bit of state", Redux doesn't provide a built-in way to do that. There are, however, a number of utilities that implement that kind of logic for you. See the Redux FAQ at http://redux.js.org/docs/FAQ.html#store-setup-subscriptions , and also the list of store subscription addons in my Redux addons catalog. (The list of Redux middlewares may also have something useful for the "listen for an action" scenario.)

Answer 2

for visualizing what happens in store you can use:

import {composeWithDevTools} from 'redux-devtools-extension';

and create your store as: (for instance with thunk middleware)

const store = `createStore(rootReducer,composeWithDevTools(applyMiddleware(thunk)));`

then you can use the extention in browser. you can have access to your state by {connect} from 'react-redux' as props. your actions then will change the state via reducers, this will cause your component receive new props so you can have your logic in

componentWillReceiveProps(nextProps) {/*your business logic*/}