Track pending requests in AjaxCache

1 files changed, 46 insertions, 24 deletions

diff --git a/app/assets/javascripts/lib/utils/ajax_cache.js b/app/assets/javascripts/lib/utils/ajax_cache.js
index d99eefb5089..cf030d613df 100644
--- a/app/assets/javascripts/lib/utils/ajax_cache.js
+++ b/app/assets/javascripts/lib/utils/ajax_cache.js
@@ -1,32 +1,54 @@
-const AjaxCache = {
-  internalStorage: { },
+class AjaxCache {
+  constructor() {
+    this.internalStorage = { };
+    this.pendingRequests = { };
+  }
+
   get(endpoint) {
     return this.internalStorage[endpoint];
-  },
+  }
+
   hasData(endpoint) {
     return Object.prototype.hasOwnProperty.call(this.internalStorage, endpoint);
-  },
-  purge(endpoint) {
+  }
+
+  remove(endpoint) {
     delete this.internalStorage[endpoint];
-  },
+  }
+
   retrieve(endpoint) {
-    if (AjaxCache.hasData(endpoint)) {
-      return Promise.resolve(AjaxCache.get(endpoint));
+    if (this.hasData(endpoint)) {
+      return Promise.resolve(this.get(endpoint));
     }
 
-    return new Promise((resolve, reject) => {
-      $.ajax(endpoint) // eslint-disable-line promise/catch-or-return
-      .then(data => resolve(data),
-        (jqXHR, textStatus, errorThrown) => {
-          const error = new Error(`${endpoint}: ${errorThrown}`);
-          error.textStatus = textStatus;
-          reject(error);
-        },
-      );
-    })
-    .then((data) => { this.internalStorage[endpoint] = data; })
-    .then(() => AjaxCache.get(endpoint));
-  },
-};
-
-export default AjaxCache;
+    let pendingRequest = this.pendingRequests[endpoint];
+
+    if (!pendingRequest) {
+      pendingRequest = new Promise((resolve, reject) => {
+        // jQuery 2 is not Promises/A+ compatible (missing catch)
+        $.ajax(endpoint) // eslint-disable-line promise/catch-or-return
+        .then(data => resolve(data),
+          (jqXHR, textStatus, errorThrown) => {
+            const error = new Error(`${endpoint}: ${errorThrown}`);
+            error.textStatus = textStatus;
+            reject(error);
+          },
+        );
+      })
+      .then((data) => {
+        this.internalStorage[endpoint] = data;
+        delete this.pendingRequests[endpoint];
+      })
+      .catch((error) => {
+        delete this.pendingRequests[endpoint];
+        throw error;
+      });
+
+      this.pendingRequests[endpoint] = pendingRequest;
+    }
+
+    return pendingRequest.then(() => this.get(endpoint));
+  }
+}
+
+export default new AjaxCache();