Refactor course url handling

client/src/components/header/CoursePreviewBar.vue

@@ -24,7 +24,7 @@ const { t } = useTranslation();
           <div class="flex space-x-8">
             <router-link
               data-cy="preview-learn-path-link"
-              :to="getLearningPathUrl(courseSession)"
+              :to="getLearningPathUrl(courseSession.course.slug)"
               class="preview-nav-item"
               :class="{ 'preview-nav-item--active': inLearningPath() }"
             >
@@ -33,7 +33,7 @@ const { t } = useTranslation();
 
             <router-link
               data-cy="preview-competence-profile-link"
-              :to="getCompetenceNaviUrl(courseSession)"
+              :to="getCompetenceNaviUrl(courseSession.course.slug)"
               class="preview-nav-item"
               :class="{ 'preview-nav-item--active': inCompetenceProfile() }"
             >

client/src/components/header/MainNavigationBar.vue

@@ -75,7 +75,9 @@ onMounted(() => {
         v-if="userStore.loggedIn"
         :show="state.showMobileNavigationMenu"
         :course-session="courseSessionsStore.currentCourseSession"
-        :media-url="getMediaCenterUrl(courseSessionsStore.currentCourseSession)"
+        :media-url="
+          getMediaCenterUrl(courseSessionsStore.currentCourseSession?.course?.slug)
+        "
         :user="userStore"
         @closemodal="state.showMobileNavigationMenu = false"
         @logout="userStore.handleLogout()"
@@ -142,7 +144,11 @@ onMounted(() => {
 
                     <router-link
                       data-cy="navigation-preview-link"
-                      :to="getLearningPathUrl(courseSessionsStore.currentCourseSession)"
+                      :to="
+                        getLearningPathUrl(
+                          courseSessionsStore.currentCourseSession.course.slug
+                        )
+                      "
                       target="_blank"
                       class="nav-item"
                     >
@@ -155,7 +161,11 @@ onMounted(() => {
                   <template v-else>
                     <router-link
                       data-cy="navigation-learning-path-link"
-                      :to="getLearningPathUrl(courseSessionsStore.currentCourseSession)"
+                      :to="
+                        getLearningPathUrl(
+                          courseSessionsStore.currentCourseSession.course.slug
+                        )
+                      "
                       class="nav-item"
                       :class="{ 'nav-item--active': inLearningPath() }"
                     >
@@ -165,7 +175,9 @@ onMounted(() => {
                     <router-link
                       data-cy="navigation-competence-profile-link"
                       :to="
-                        getCompetenceNaviUrl(courseSessionsStore.currentCourseSession)
+                        getCompetenceNaviUrl(
+                          courseSessionsStore.currentCourseSession.course.slug
+                        )
                       "
                       class="nav-item"
                       :class="{ 'nav-item--active': inCompetenceProfile() }"
@@ -180,7 +192,11 @@ onMounted(() => {
             <div class="flex items-stretch justify-start space-x-8">
               <router-link
                 v-if="inCourse() && courseSessionsStore.currentCourseSession"
-                :to="getMediaCenterUrl(courseSessionsStore.currentCourseSession)"
+                :to="
+                  getMediaCenterUrl(
+                    courseSessionsStore.currentCourseSession.course.slug
+                  )
+                "
                 data-cy="medialibrary-link"
                 class="nav-item-no-mobile"
                 :class="{ 'nav-item--active': inMediaLibrary() }"

client/src/components/header/MobileMenu.vue

@@ -72,7 +72,7 @@ const courseSessionsStore = useCourseSessionsStore();
                 <li class="mb-6">
                   <button
                     data-cy="navigation-mobile-preview-link"
-                    @click="clickLink(getLearningPathUrl(courseSession))"
+                    @click="clickLink(getLearningPathUrl(courseSession.course.slug))"
                   >
                     {{ $t("a.VorschauTeilnehmer") }}
                   </button>
@@ -82,7 +82,7 @@ const courseSessionsStore = useCourseSessionsStore();
                 <li class="mb-6">
                   <button
                     data-cy="navigation-mobile-learning-path-link"
-                    @click="clickLink(getLearningPathUrl(courseSession))"
+                    @click="clickLink(getLearningPathUrl(courseSession.course.slug))"
                   >
                     {{ $t("general.learningPath") }}
                   </button>
@@ -90,7 +90,7 @@ const courseSessionsStore = useCourseSessionsStore();
                 <li class="mb-6">
                   <button
                     data-cy="navigation-mobile-competence-profile-link"
-                    @click="clickLink(getCompetenceNaviUrl(courseSession))"
+                    @click="clickLink(getCompetenceNaviUrl(courseSession.course.slug))"
                   >
                     {{ $t("competences.title") }}
                   </button>
@@ -99,7 +99,7 @@ const courseSessionsStore = useCourseSessionsStore();
               <li class="mb-6">
                 <button
                   data-cy="medialibrary-link"
-                  @click="clickLink(getMediaCenterUrl(courseSession))"
+                  @click="clickLink(getMediaCenterUrl(courseSession.course.slug))"
                 >
                   {{ $t("a.Mediathek") }}
                 </button>

client/src/pages/DashboardPage.vue

@@ -23,7 +23,7 @@ const getNextStepLink = (courseSession: CourseSession) => {
     if (courseSessionsStore.hasCockpit(courseSession)) {
       return `${courseSession.course_url}/cockpit`;
     }
-    return getLearningPathUrl(courseSession);
+    return getLearningPathUrl(courseSession.course.slug);
   });
 };
 </script>

client/src/pages/cockpit/cockpitPage/CockpitPage.vue

@@ -36,6 +36,7 @@ function userCountStatusForCircle(userId: string) {
 
 <template>
   <div class="bg-gray-200">
+    <div v-if="cockpitStore.circles?.length">
       <div v-if="cockpitStore.currentCircle" class="container-large">
         <div class="mb-9 flex flex-col lg:flex-row lg:items-center lg:justify-between">
           <h1>Cockpit</h1>
@@ -208,6 +209,7 @@ function userCountStatusForCircle(userId: string) {
         </span>
       </div>
     </div>
+  </div>
 </template>
 
 <style scoped></style>

client/src/pages/learningPath/selfEvaluationPage/SelfEvaluation.vue

@@ -11,6 +11,7 @@ import eventBus from "@/utils/eventBus";
 import { useRouteQuery } from "@vueuse/router";
 import { computed, onUnmounted } from "vue";
 import { getPreviousRoute } from "@/router/history";
+import { getCompetenceNaviUrl } from "@/utils/utils";
 
 log.debug("LearningContent.vue setup");
 
@@ -127,7 +128,7 @@ onUnmounted(() => {
             <div class="mt-6 lg:mt-12">
               {{ $t("selfEvaluation.progressText") }}
               <router-link
-                :to="courseSession.competence_url"
+                :to="getCompetenceNaviUrl(courseSession.course.slug)"
                 class="text-primary-500 underline"
               >
                 {{ $t("selfEvaluation.progressLink") }}

client/src/utils/utils.ts

@@ -1,34 +1,31 @@
-import type { AssignmentType, CourseSession } from "@/types";
+import type { AssignmentType } from "@/types";
 import { useTranslation } from "i18next-vue";
 
 export function assertUnreachable(msg: string): never {
   throw new Error("Didn't expect to get here, " + msg);
 }
 
-function createCourseUrl(
+function createCourseUrl(courseSlug: string | undefined, specificSub: string): string {
-  courseSession: CourseSession | undefined,
+  if (!courseSlug) {
-  specificSub: string
+    return "/";
-): string {
-  if (!courseSession) {
-    return "";
   }
 
   if (["learn", "media", "competence"].includes(specificSub)) {
-    return `${courseSession.course_url}/${specificSub}`;
+    return `/course/${courseSlug}/${specificSub}`;
   }
-  return courseSession.course_url;
+  return `/course/${courseSlug}`;
 }
 
-export function getCompetenceNaviUrl(courseSession: CourseSession | undefined): string {
+export function getCompetenceNaviUrl(courseSlug: string | undefined): string {
-  return createCourseUrl(courseSession, "competence");
+  return createCourseUrl(courseSlug, "competence");
 }
 
-export function getMediaCenterUrl(courseSession: CourseSession | undefined): string {
+export function getMediaCenterUrl(courseSlug: string | undefined): string {
-  return createCourseUrl(courseSession, "media");
+  return createCourseUrl(courseSlug, "media");
 }
 
-export function getLearningPathUrl(courseSession: CourseSession | undefined): string {
+export function getLearningPathUrl(courseSlug: string | undefined): string {
-  return createCourseUrl(courseSession, "learn");
+  return createCourseUrl(courseSlug, "learn");
 }
 
 export function getAssignmentTypeTitle(assignmentType: AssignmentType): string {