Make composable reactive
This commit is contained in:
parent
8793b30b56
commit
1d97ec9dcf
|
|
@ -1,20 +1,10 @@
|
|||
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"
|
||||
);
|
||||
|
|
@ -22,8 +12,7 @@ export function useCurrentCourseSession(): CourseSession {
|
|||
`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;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue