lexich/redux-api

How to include loading/progress indicators?

Open

#164 opened on Aug 4, 2017

View on GitHub
 (4 comments) (0 reactions) (0 assignees)JavaScript (496 stars) (95 forks)batch import
help wanted

Description

Sorry for the stupid question, but it seems I have to write a lot of code to simply show a loading indicator with redux-api. Is there a recommended approach?

What I tried:

Approach 1: Show and hide a loading indicator depending on the state of the metadata loading attribute. This approach takes a lot of code, because each resource in redux-api has its own loading attribute.

Approach 2: Dispatch SHOW/HIDE actions to toggle the loading indicator. I implemented this using the prefetch and postfetch hooks.

    prefetch: [
      function({actions, dispatch, getState}, cb) {
        dispatch(showLoading())
        cb()
      }
    ],
    postfetch: [
      function({data, actions, dispatch, getState, request}) {
        dispatch(hideLoading())
      }
    ]

But again I have to do this for each resource separately, which adds a lot of duplicated code to my reduxApi definition. I also have to deal with the callback chain, which seems odd, if I want to handle a loading indicator.

How do you guys do it? There must be a simple way to show a loading indicator with redux-api, right?

Contributor guide