Some refactoring in course sessions

client/src/router/index.ts

@@ -2,6 +2,7 @@ import DashboardPage from "@/pages/DashboardPage.vue";
 import LoginPage from "@/pages/LoginPage.vue";
 import { redirectToLoginIfRequired, updateLoggedIn } from "@/router/guards";
 import { useAppStore } from "@/stores/app";
+import { useCourseSessionsStore } from "@/stores/courseSessions";
 import { createRouter, createWebHistory } from "vue-router";
 
 const router = createRouter({
@@ -165,11 +166,11 @@ router.beforeEach(updateLoggedIn);
 router.beforeEach(redirectToLoginIfRequired);
 
 router.beforeEach((to) => {
-  const appStore = useAppStore();
+  const courseSessionStore = useCourseSessionsStore();
   if (to.params.courseSlug) {
-    appStore.currentCourseSlug = to.params.courseSlug as string;
+    courseSessionStore.currentCourseSlug = to.params.courseSlug as string;
   } else {
-    appStore.currentCourseSlug = "";
+    courseSessionStore.currentCourseSlug = "";
   }
 });
 

client/src/stores/app.ts

@@ -32,7 +32,6 @@ export const useAppStore = defineStore({
       showMainNavigationBar: showMainNavigationBarInitialState(),
       userLoaded: false,
       routingFinished: false,
-      currentCourseSlug: "",
     } as AppState),
   getters: {},
   actions: {},

client/src/stores/completion.ts

@@ -1,5 +1,4 @@
 import { bustItGetCache, itGetCached, itPost } from "@/fetchHelpers";
-import { useAppStore } from "@/stores/app";
 import { useCourseSessionsStore } from "@/stores/courseSessions";
 import { useUserStore } from "@/stores/user";
 import type { BaseCourseWagtailPage, CourseCompletion } from "@/types";
@@ -31,8 +30,8 @@ export const useCompletionStore = defineStore({
       courseSessionId: number | undefined = undefined
     ) {
       if (!courseSessionId) {
-        const appStore = useAppStore();
-        const courseSlug = appStore.currentCourseSlug;
+        const courseSessionsStore = useCourseSessionsStore();
+        const courseSlug = courseSessionsStore.currentCourseSlug;
         if (courseSlug) {
           const courseSessionsStore = useCourseSessionsStore();
           const courseSession = courseSessionsStore.courseSessionForCourse(courseSlug);

client/src/stores/courseSessions.ts

@@ -12,7 +12,6 @@ import uniqBy from "lodash/uniqBy";
 import log from "loglevel";
 import { defineStore } from "pinia";
 import { computed, ref } from "vue";
-import { useRoute } from "vue-router";
 import { useCircleStore } from "./circle";
 import { useUserStore } from "./user";
 
@@ -73,6 +72,8 @@ export const useCourseSessionsStore = defineStore("courseSessions", () => {
     new Map<string, number>()
   );
 
+  const currentCourseSlug = ref("");
+
   // these will become getters
   const userCourses = computed(() =>
     // TODO: refactor after implementing of Klassenkonzept
@@ -123,19 +124,12 @@ export const useCourseSessionsStore = defineStore("courseSessions", () => {
     });
   }
 
-  const courseSlugForRoute = computed(() => {
-    const route = useRoute();
-    return (route.params.courseSlug as string) ?? undefined;
-  });
-
   const courseSessionForRoute = computed(() => {
-    const courseSlug = courseSlugForRoute.value;
-    return courseSessionForCourse(courseSlug);
+    return courseSessionForCourse(currentCourseSlug.value);
   });
 
   const courseSessionsForRoute = computed(() => {
-    const courseSlug = courseSlugForRoute.value;
-    return courseSessionsForCourse(courseSlug);
+    return courseSessionsForCourse(currentCourseSlug.value);
   });
 
   const hasCockpit = computed(() => {
@@ -218,6 +212,7 @@ export const useCourseSessionsStore = defineStore("courseSessions", () => {
   }
 
   return {
+    currentCourseSlug,
     courseSessions,
     userCourses,
     courseSessionForRoute,