From fd2aaadedb48e5436376dff24db0d666864e3af2 Mon Sep 17 00:00:00 2001
From: Christian Cueni <christian.cueni@iterativ.ch>
Date: Mon, 12 Dec 2022 13:22:24 +0100
Subject: [PATCH] Add conditional Cockpit link to navigation

---
 client/src/components/MainNavigationBar.vue | 15 ++++++++++++++-
 client/src/components/MobileMenu.vue        |  4 ++--
 client/src/locales/de.json                  |  1 +
 client/src/stores/courseSessions.ts         |  9 +++++++++
 4 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/client/src/components/MainNavigationBar.vue b/client/src/components/MainNavigationBar.vue
index d313395b..80394067 100644
--- a/client/src/components/MainNavigationBar.vue
+++ b/client/src/components/MainNavigationBar.vue
@@ -183,7 +183,20 @@ const profileDropdownData: DropdownListItem[] = [
               class="nav-item"
               :class="{ 'nav-item--active': inCompetenceProfile() }"
             >
-              KompetenzNavi
+              {{ $t("competences.title") }}
+            </router-link>
+
+            <router-link
+              v-if="
+                inCourse() &&
+                courseSessionsStore.courseSessionForRoute &&
+                courseSessionsStore.hasCockpit
+              "
+              :to="`${courseSessionsStore.courseSessionForRoute.course_url}/cockpit`"
+              class="nav-item"
+              :class="{ 'nav-item--active': inCockpit() }"
+            >
+              {{ $t("cockpit.title") }}
             </router-link>
 
             <div class="hidden lg:block flex-auto"></div>
diff --git a/client/src/components/MobileMenu.vue b/client/src/components/MobileMenu.vue
index 30dc5070..1dba6ae2 100644
--- a/client/src/components/MobileMenu.vue
+++ b/client/src/components/MobileMenu.vue
@@ -59,8 +59,8 @@ const clickLink = (to: string | undefined) => {
                 </button>
               </li>
               <li class="mt-6">
-                <button @click="clickLink(courseSession?.competence_url)">
-                  KompetenzNavi
+                <button @click="clickLink(`${courseSession?.course_url}/cockpit`)">
+                  {{ $t("cockpit.title") }}
                 </button>
               </li>
             </ul>
diff --git a/client/src/locales/de.json b/client/src/locales/de.json
index 1b3470aa..fb2b953f 100644
--- a/client/src/locales/de.json
+++ b/client/src/locales/de.json
@@ -77,6 +77,7 @@
     "faq": "FAQ"
   },
   "cockpit": {
+    "title": "Cockpit",
     "tasksDone": "Erledigte Transferaufträge von Teilnehmer.",
     "feedbacksDone": "Abgeschickte Feedbacks von Teilnehmer.",
     "examsDone": "Abgelegte Prüfungen von Teilnehmer.",
diff --git a/client/src/stores/courseSessions.ts b/client/src/stores/courseSessions.ts
index 0e726193..956f9d0d 100644
--- a/client/src/stores/courseSessions.ts
+++ b/client/src/stores/courseSessions.ts
@@ -5,6 +5,7 @@ import log from "loglevel";
 
 import { defineStore } from "pinia";
 import { useRoute } from "vue-router";
+import { useUserStore } from "./user";
 
 export type CourseSessionsStoreState = {
   courseSessions: CourseSession[] | undefined;
@@ -30,6 +31,14 @@ export const useCourseSessionsStore = defineStore({
         return _.uniqBy(state.courseSessions, "course.id");
       }
     },
+    hasCockpit() {
+      const userStore = useUserStore();
+      return (
+        this.courseSessionForRoute.experts.filter(
+          (expert) => expert.user_id === userStore.id
+        ).length > 0
+      );
+    },
   },
   actions: {
     async loadCourseSessionsData(reload = false) {