feat: mentor dashboard

client/src/pages/cockpit/cockpitPage/mentor/MentorOverview.vue

@@ -14,11 +14,6 @@ const statusFilter = ref([
   { name: "Zu erledigen", id: "todo" },
 ]);
 
-interface Circle {
-  id: string;
-  title: string;
-}
-
 const circleFilterValue = ref({ name: "Circle: Alle", id: "_all" });
 
 const circleFilter = computed(() => {
@@ -26,7 +21,7 @@ const circleFilter = computed(() => {
 
   return [
     { name: "Circle: Alle", id: "_all" },
-    ...summary.value.circles.map((circle: Circle) => ({
+    ...summary.value.circles.map((circle) => ({
       name: `Circle: ${circle.title}`,
       id: circle.id,
     })),
@@ -36,7 +31,7 @@ const circleFilter = computed(() => {
 
 <template>
   {{ summary }}
-  <div class="bg-white" v-if="summary">
+  <div v-if="summary" class="bg-white">
     <div class="flex flex-col space-x-2 lg:flex-row">
       <ItDropdownSelect
         v-model="statusFilterValue"

client/src/services/mentorCockpit.ts

@@ -0,0 +1,70 @@
+import { itGetCached } from "@/fetchHelpers";
+import type { Ref } from "vue";
+import { ref, watchEffect } from "vue";
+
+interface Participant {
+  id: string;
+  first_name: string;
+  last_name: string;
+  email: string;
+  username: string;
+  avatar_url: string;
+  language: string;
+}
+
+interface Circle {
+  id: number;
+  title: string;
+}
+
+interface Completion {
+  status: string;
+  user_id: string;
+  last_name: string;
+}
+
+interface PraxisAssignment {
+  id: string;
+  title: string;
+  circle_id: string;
+  pending_evaluations: number;
+  completions: Completion[];
+}
+
+interface Summary {
+  participants: Participant[];
+  circles: Circle[];
+  praxis_assignments: PraxisAssignment[];
+}
+
+export const useMentorCockpit = (
+  courseSessionId: string | Ref<string> | (() => string)
+) => {
+  const isLoading = ref(false);
+  const summary: Ref<Summary | null> = ref(null);
+  const error = ref(null);
+
+  const fetchData = () => {
+    summary.value = null;
+    error.value = null;
+
+    itGetCached(`/api/mentor/${courseSessionId}/summary`)
+      .then((response) => {
+        summary.value = response;
+      })
+      .catch((err) => (error.value = err))
+      .finally(() => {
+        isLoading.value = false;
+      });
+  };
+
+  watchEffect(() => {
+    fetchData();
+  });
+
+  return {
+    isLoading,
+    summary,
+    error,
+  };
+};

client/src/stores/mentorCockpit.ts

@@ -1,10 +0,0 @@
-import { defineStore } from "pinia";
-import { ref } from "vue";
-
-export const useMentorCockpitStore = defineStore("mentorCockpit", () => {
-  const isLoading = ref(false);
-
-  return {
-    isLoading,
-  };
-});