Make composable reactive

This commit is contained in:
Elia Bieri 2023-05-17 14:56:15 +02:00 committed by Daniel Egger
parent 8793b30b56
commit 1d97ec9dcf
1 changed files with 5 additions and 16 deletions

View File

@ -1,29 +1,18 @@
import { useCourseSessionsStore } from "@/stores/courseSessions";
import type { CourseSession } from "@/types";
import log from "loglevel";
import { computed } from "vue";
export function useCurrentCourseSession(): CourseSession {
/**
* We often need the current course session in our components.
* With this composable we can get it easily.
* ATTENTION: The value is not reactive! So the components need to be re-rendered
* when the value changes. This is currently done with the "switchedCourseSession"
* event handler in the App.vue component.
*/
export function useCurrentCourseSession() {
const store = useCourseSessionsStore();
const currentCourseSession = computed(() => store.currentCourseSession);
if (!currentCourseSession.value) {
if (!store.currentCourseSession) {
log.error(
"currentCourseSession is only defined in pages with :courseSlug in the route"
);
throw new Error(
`currentCourseSession is not defined in the store.
`currentCourseSession is not defined in the store.
It is only defined in pages with :courseSlug in the route`
);
} else {
// return a NON-REACTIVE copy of the value (read above)
return currentCourseSession.value;
}
return store.currentCourseSession;
}