From 376c206b29f410acb73212bfdcef33e5aeebd4f5 Mon Sep 17 00:00:00 2001
From: Daniel Egger <daniel.egger@gmail.com>
Date: Wed, 9 Nov 2022 16:25:33 +0100
Subject: [PATCH] Refactor getting data with promise cache

---
 client/src/fetchHelpers.ts          | 14 ++++++++++++++
 client/src/stores/competence.ts     |  4 ++--
 client/src/stores/completion.ts     |  4 ++--
 client/src/stores/courseSessions.ts | 10 ++--------
 client/src/stores/learningPath.ts   |  4 ++--
 client/src/stores/user.ts           |  6 ++++--
 6 files changed, 26 insertions(+), 16 deletions(-)

diff --git a/client/src/fetchHelpers.ts b/client/src/fetchHelpers.ts
index e57a75c8..fc8ca46c 100644
--- a/client/src/fetchHelpers.ts
+++ b/client/src/fetchHelpers.ts
@@ -56,3 +56,17 @@ export const itPost = (url: RequestInfo, data: unknown, options: RequestInit = {
 export const itGet = (url: RequestInfo) => {
   return itPost(url, {}, { method: "GET" });
 };
+
+const itGetPromiseCache = new Map<string, Promise<any>>();
+
+export function bustItGetCache() {
+  itGetPromiseCache.clear();
+}
+
+export const itGetCached = (url: RequestInfo): Promise<any> => {
+  if (!itGetPromiseCache.has(url.toString())) {
+    itGetPromiseCache.set(url.toString(), itGet(url));
+  }
+
+  return itGetPromiseCache.get(url.toString()) as Promise<any>;
+};
diff --git a/client/src/stores/competence.ts b/client/src/stores/competence.ts
index c13c73df..5e09769f 100644
--- a/client/src/stores/competence.ts
+++ b/client/src/stores/competence.ts
@@ -1,4 +1,4 @@
-import { itGet } from "@/fetchHelpers";
+import { itGetCached } from "@/fetchHelpers";
 import { useCompletionStore } from "@/stores/completion";
 import type {
   BaseCourseWagtailPage,
@@ -95,7 +95,7 @@ export const useCompetenceStore = defineStore({
         await this.parseCompletionData();
         return this.competenceProfilePage;
       }
-      const competenceProfilePageData = await itGet(`/api/course/page/${slug}/`);
+      const competenceProfilePageData = await itGetCached(`/api/course/page/${slug}/`);
 
       if (!competenceProfilePageData) {
         throw `No competenceProfilePageData found with: ${slug}`;
diff --git a/client/src/stores/completion.ts b/client/src/stores/completion.ts
index e6e25ff0..1dcaee26 100644
--- a/client/src/stores/completion.ts
+++ b/client/src/stores/completion.ts
@@ -1,4 +1,4 @@
-import { itGet, itPost } from "@/fetchHelpers";
+import { itGetCached, itPost } from "@/fetchHelpers";
 import type { BaseCourseWagtailPage, CourseCompletion } from "@/types";
 import { defineStore } from "pinia";
 
@@ -19,7 +19,7 @@ export const useCompletionStore = defineStore({
       if (this.completionData && !reload) {
         return this.completionData;
       }
-      const completionData = await itGet(`/api/course/completion/${courseId}/`);
+      const completionData = await itGetCached(`/api/course/completion/${courseId}/`);
 
       if (!completionData) {
         throw `No completionData found with: ${courseId}`;
diff --git a/client/src/stores/courseSessions.ts b/client/src/stores/courseSessions.ts
index cdecd32c..6f73d5f0 100644
--- a/client/src/stores/courseSessions.ts
+++ b/client/src/stores/courseSessions.ts
@@ -1,4 +1,4 @@
-import { itGet } from "@/fetchHelpers";
+import { itGetCached } from "@/fetchHelpers";
 import type { CourseSession } from "@/types";
 import log from "loglevel";
 import { defineStore } from "pinia";
@@ -6,7 +6,6 @@ import { ref } from "vue";
 
 export const useCourseSessionsStore = defineStore("courseSessions", () => {
   const courseSessions = ref<CourseSession[] | undefined>(undefined);
-  let loadPromise: Promise<CourseSession[]> | undefined = undefined;
 
   async function loadCourseSessionsData(reload = false) {
     log.debug("loadCourseSessionsData called");
@@ -14,12 +13,7 @@ export const useCourseSessionsStore = defineStore("courseSessions", () => {
       return courseSessions.value;
     }
 
-    if (!loadPromise) {
-      loadPromise = itGet(`/api/course/sessions/`);
-    }
-
-    const courseSessionsData = await loadPromise;
-
+    const courseSessionsData = await itGetCached(`/api/course/sessions/`);
     if (!courseSessionsData) {
       throw `No courseSessionData found for user`;
     }
diff --git a/client/src/stores/learningPath.ts b/client/src/stores/learningPath.ts
index 3ea7a9b2..6f57ae1f 100644
--- a/client/src/stores/learningPath.ts
+++ b/client/src/stores/learningPath.ts
@@ -1,4 +1,4 @@
-import { itGet } from "@/fetchHelpers";
+import { itGetCached } from "@/fetchHelpers";
 import { LearningPath } from "@/services/learningPath";
 import { useCompletionStore } from "@/stores/completion";
 import { defineStore } from "pinia";
@@ -23,7 +23,7 @@ export const useLearningPathStore = defineStore({
       if (this.learningPath && !reload) {
         return this.learningPath;
       }
-      const learningPathData = await itGet(`/api/course/page/${slug}/`);
+      const learningPathData = await itGetCached(`/api/course/page/${slug}/`);
       const completionData = await completionStore.loadCompletionData(
         learningPathData.course.id
       );
diff --git a/client/src/stores/user.ts b/client/src/stores/user.ts
index 83bc6bbe..fef704bb 100644
--- a/client/src/stores/user.ts
+++ b/client/src/stores/user.ts
@@ -1,6 +1,6 @@
 import * as log from "loglevel";
 
-import { itGet, itPost } from "@/fetchHelpers";
+import { bustItGetCache, itGetCached, itPost } from "@/fetchHelpers";
 import { useAppStore } from "@/stores/app";
 import { defineStore } from "pinia";
 
@@ -43,6 +43,8 @@ export const useUserStore = defineStore({
           .then((data) => {
             this.$state = data;
             this.loggedIn = true;
+            log.debug("bust cache");
+            bustItGetCache();
             log.debug(`redirect to ${next}`);
             window.location.href = next;
           })
@@ -68,7 +70,7 @@ export const useUserStore = defineStore({
     },
     fetchUser() {
       const appStore = useAppStore();
-      itGet("/api/core/me/")
+      itGetCached("/api/core/me/")
         .then((data) => {
           this.$state = data;
           this.loggedIn = true;