Add a reloading meta flag to reloading store entries

Author: carlobeltrame

src/index.js

@@ -155,19 +155,27 @@ function HalJsonVuex (store, axios, options) {
    */
   function load (uri, forceReload) {
     const existsInStore = !isUnknown(uri)
-    const isLoading = existsInStore && (store.state[opts.apiName][uri]._meta || {}).loading
 
-    if (!existsInStore) {
-      store.commit('addEmpty', uri)
-    }
+    const isLoading = existsInStore && (store.state[opts.apiName][uri]._meta || {}).loading
     if (isLoading) {
       // Reuse the loading entity and load promise that is already waiting for a pending API request
       return store.state[opts.apiName][uri]
     }
 
+    if (!existsInStore) {
+      store.commit('addEmpty', uri)
+    } else if (forceReload) {
+      store.commit('reloading', uri)
+    }
+
     let dataFinishedLoading = Promise.resolve(store.state[opts.apiName][uri])
-    if (!existsInStore || forceReload) {
+    if (!existsInStore) {
       dataFinishedLoading = loadFromApi(uri)
+    } else if (forceReload) {
+      dataFinishedLoading = loadFromApi(uri).catch(error => {
+        store.commit('reloadingFailed', uri)
+        throw error
+      })
     } else if (store.state[opts.apiName][uri]._meta.load) {
       // reuse the existing promise from the store if possible
       dataFinishedLoading = store.state[opts.apiName][uri]._meta.load

src/storeModule.js

@@ -22,6 +22,22 @@ export const mutations = {
       Vue.set(state, uri, data[uri])
     })
   },
+  /**
+   * Marks a single entity in the Vuex store as reloading, meaning a reloading network request is currently ongoin.
+   * @param state Vuex state
+   * @param uri   URI of the entity that is currently being reloaded
+   */
+  reloading (state, uri) {
+    if (state[uri]) Vue.set(state[uri]._meta, 'reloading', true)
+  },
+  /**
+   * Marks a single entity in the Vuex store as normal again, after it has been marked as reloading before.
+   * @param state Vuex state
+   * @param uri   URI of the entity that is currently being reloaded
+   */
+  reloadingFailed (state, uri) {
+    if (state[uri]) Vue.set(state[uri]._meta, 'reloading', false)
+  },
   /**
    * Removes a single entity from the Vuex store.
    * @param state Vuex state