kyeo76 / redux-nprogress

🔨 WIP: Redux Middleware, Reducer, Component & Actions for the most popular progress bar
27 stars 6 forks source link

Update docs for usage between promises and thunks #7

Open eudaimos opened 7 years ago

eudaimos commented 7 years ago

@jaredt67 thanks again for putting this together and making it so easy to utilize nprogress in a redux-based app. It really makes it simple.

I might be a bit dense, but I lost a bunch of time trying to get the example to work the way I'd like. I was hoping to use the nprogress key in my actions to remove the import dependency on redux-nprogress in my action files, but what I found is that the nprogress key only seems to work when using redux-promise-middleware and dispatching payloads that are Promises. What happens is the redux-nprogress middleware never acts on the resulting (SUCCESS/ERROR) action types I pass in the original (LOAD) action's nprogress prop, so the nprogress bar never completes and disappears (i.e. the END_TASK actions never fire).

Since I'm (currently) strictly using redux-thunk and thunk-based action creators for async flows, I can only use the beginTask() & endTask() action creators to make it work.

I'm not asking you to change the API, although if you think it should work the way I'm asking, please let me know.

I'm asking that you simply state these dependencies explicitly (specifically the redux-promise-middleware) within the README documentation in order to save the next person a bunch of time.

Thanks again, and I hope I can assist with any modifications this needs. It's really making it easy.

kyeo76 commented 7 years ago

@eudaimos hello! could you please provide an example of the action?

nazimjamil commented 6 years ago

I encountered the same issue as @eudaimos, so his action would be similar to mine I assume

{
   type: LOGIN_FORM_SUBMIT,
   nprogress: [
     LOGIN_FORM_SUCCESS,
     LOGIN_FORM_FAIL,
   ],
}

Where the actions specified in ngprogress would be the the subsequent async actions triggered.

As mentioned, the hard dependency on redux-promise-middleware to automagically manage ngprogress would be very useful to know beforehand.