From 7283dd298cc941904aa5f4494735d3ddcc069bc6 Mon Sep 17 00:00:00 2001
From: Joyelle Ndagijimana <njoyelle2@gmail.com>
Date: Sun, 16 Mar 2025 16:53:10 +0100
Subject: [PATCH 01/11] feat: nieuwe Vue bestanden die bij de nieuwe router
 passen

---
 frontend/src/views/classes/UserAssignments.vue        | 11 +++++++++++
 frontend/src/views/classes/UserClasses.vue            | 11 +++++++++++
 frontend/src/views/discussions/UserDiscussions.vue    | 11 +++++++++++
 frontend/src/views/{ => homepage}/StudentHomepage.vue |  0
 frontend/src/views/{ => homepage}/TeacherHomepage.vue |  0
 frontend/src/views/homepage/UserHomePage.vue          | 11 +++++++++++
 6 files changed, 44 insertions(+)
 create mode 100644 frontend/src/views/classes/UserAssignments.vue
 create mode 100644 frontend/src/views/classes/UserClasses.vue
 create mode 100644 frontend/src/views/discussions/UserDiscussions.vue
 rename frontend/src/views/{ => homepage}/StudentHomepage.vue (100%)
 rename frontend/src/views/{ => homepage}/TeacherHomepage.vue (100%)
 create mode 100644 frontend/src/views/homepage/UserHomePage.vue

diff --git a/frontend/src/views/classes/UserAssignments.vue b/frontend/src/views/classes/UserAssignments.vue
new file mode 100644
index 00000000..73336fa3
--- /dev/null
+++ b/frontend/src/views/classes/UserAssignments.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+<main></main>
+</template>
+
+<style scoped>
+
+</style>
diff --git a/frontend/src/views/classes/UserClasses.vue b/frontend/src/views/classes/UserClasses.vue
new file mode 100644
index 00000000..73336fa3
--- /dev/null
+++ b/frontend/src/views/classes/UserClasses.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+<main></main>
+</template>
+
+<style scoped>
+
+</style>
diff --git a/frontend/src/views/discussions/UserDiscussions.vue b/frontend/src/views/discussions/UserDiscussions.vue
new file mode 100644
index 00000000..73336fa3
--- /dev/null
+++ b/frontend/src/views/discussions/UserDiscussions.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+<main></main>
+</template>
+
+<style scoped>
+
+</style>
diff --git a/frontend/src/views/StudentHomepage.vue b/frontend/src/views/homepage/StudentHomepage.vue
similarity index 100%
rename from frontend/src/views/StudentHomepage.vue
rename to frontend/src/views/homepage/StudentHomepage.vue
diff --git a/frontend/src/views/TeacherHomepage.vue b/frontend/src/views/homepage/TeacherHomepage.vue
similarity index 100%
rename from frontend/src/views/TeacherHomepage.vue
rename to frontend/src/views/homepage/TeacherHomepage.vue
diff --git a/frontend/src/views/homepage/UserHomePage.vue b/frontend/src/views/homepage/UserHomePage.vue
new file mode 100644
index 00000000..73336fa3
--- /dev/null
+++ b/frontend/src/views/homepage/UserHomePage.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+<main></main>
+</template>
+
+<style scoped>
+
+</style>

From cd86497b41f54d6518a961cd55d1b14e408e9e97 Mon Sep 17 00:00:00 2001
From: Joyelle Ndagijimana <njoyelle2@gmail.com>
Date: Sun, 16 Mar 2025 16:54:03 +0100
Subject: [PATCH 02/11] =?UTF-8?q?feat:=20route=20ge=C3=AFnitialiseerd?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/MenuBar.vue |  1 +
 frontend/src/router/index.ts        | 65 ++++++++++-------------------
 2 files changed, 23 insertions(+), 43 deletions(-)

diff --git a/frontend/src/components/MenuBar.vue b/frontend/src/components/MenuBar.vue
index 7d7c4d88..ce4a3a61 100644
--- a/frontend/src/components/MenuBar.vue
+++ b/frontend/src/components/MenuBar.vue
@@ -9,6 +9,7 @@
 
     // Instantiate variables to use in html to render right
     // Links and content dependent on the role (student or teacher)
+    //TODO: use localStorage to know which one in logged in, teacher or student
     const isTeacher = route.path.includes("teacher");
 
     const userId = route.params.id as string;
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 079c39ef..e69d9fc0 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -1,13 +1,6 @@
-import { createRouter, createWebHistory } from "vue-router";
+import {createRouter, createWebHistory} from "vue-router";
 import MenuBar from "@/components/MenuBar.vue";
-import StudentHomepage from "@/views/StudentHomepage.vue";
-import StudentAssignments from "@/views/assignments/StudentAssignments.vue";
-import StudentClasses from "@/views/classes/StudentClasses.vue";
-import StudentDiscussions from "@/views/discussions/StudentDiscussions.vue";
-import TeacherHomepage from "@/views/TeacherHomepage.vue";
-import TeacherAssignments from "@/views/assignments/TeacherAssignments.vue";
-import TeacherClasses from "@/views/classes/TeacherClasses.vue";
-import TeacherDiscussions from "@/views/discussions/TeacherDiscussions.vue";
+import StudentHomepage from "@/views/homepage/StudentHomepage.vue";
 import SingleAssignment from "@/views/assignments/SingleAssignment.vue";
 import SingleClass from "@/views/classes/SingleClass.vue";
 import SingleDiscussion from "@/views/discussions/SingleDiscussion.vue";
@@ -16,6 +9,9 @@ import CreateClass from "@/views/classes/CreateClass.vue";
 import CreateAssignment from "@/views/assignments/CreateAssignment.vue";
 import CreateDiscussion from "@/views/discussions/CreateDiscussion.vue";
 import CallbackPage from "@/views/CallbackPage.vue";
+import UserDiscussions from "@/views/discussions/UserDiscussions.vue";
+import UserClasses from "@/views/classes/UserClasses.vue";
+import UserAssignments from "@/views/classes/UserAssignments.vue";
 
 const router = createRouter({
     history: createWebHistory(import.meta.env.BASE_URL),
@@ -34,93 +30,76 @@ const router = createRouter({
             path: "/callback",
             component: CallbackPage,
         },
+
         {
-            path: "/student/:id",
+            path: "/user",
             component: MenuBar,
+            meta: {requiresAuth: true},
             children: [
                 {
                     path: "home",
-                    name: "StudentHomePage",
+                    name: "UserHomePage",
                     component: StudentHomepage,
                 },
                 {
                     path: "assignment",
-                    name: "StudentAssignments",
-                    component: StudentAssignments,
+                    name: "UserAssignments",
+                    component: UserAssignments,
                 },
                 {
                     path: "class",
-                    name: "StudentClasses",
-                    component: StudentClasses,
+                    name: "UserClasses",
+                    component: UserClasses,
                 },
                 {
                     path: "discussion",
-                    name: "StudentDiscussions",
-                    component: StudentDiscussions,
+                    name: "UserDiscussions",
+                    component: UserDiscussions,
                 },
             ],
         },
 
-        {
-            path: "/teacher/:id",
-            component: MenuBar,
-            children: [
-                {
-                    path: "home",
-                    name: "TeacherHomepage",
-                    component: TeacherHomepage,
-                },
-                {
-                    path: "assignment",
-                    name: "TeacherAssignments",
-                    component: TeacherAssignments,
-                },
-                {
-                    path: "class",
-                    name: "TeacherClasses",
-                    component: TeacherClasses,
-                },
-                {
-                    path: "discussion",
-                    name: "TeacherDiscussions",
-                    component: TeacherDiscussions,
-                },
-            ],
-        },
         {
             path: "/assignment/create",
             name: "CreateAssigment",
             component: CreateAssignment,
+            meta: {requiresAuth: true},
         },
         {
             path: "/assignment/:id",
             name: "SingleAssigment",
             component: SingleAssignment,
+            meta: {requiresAuth: true},
         },
         {
             path: "/class/create",
             name: "CreateClass",
             component: CreateClass,
+            meta: {requiresAuth: true},
         },
         {
             path: "/class/:id",
             name: "SingleClass",
             component: SingleClass,
+            meta: {requiresAuth: true},
         },
         {
             path: "/discussion/create",
             name: "CreateDiscussion",
             component: CreateDiscussion,
+            meta: {requiresAuth: true},
         },
         {
             path: "/discussion/:id",
             name: "SingleDiscussion",
             component: SingleDiscussion,
+            meta: {requiresAuth: true},
         },
         {
             path: "/:catchAll(.*)",
             name: "NotFound",
             component: NotFound,
+            meta: {requiresAuth: true},
         },
     ],
 });

From 4f67b1e9fe22b7214474fa10d380f53c423cc457 Mon Sep 17 00:00:00 2001
From: Joyelle Ndagijimana <njoyelle2@gmail.com>
Date: Sun, 16 Mar 2025 16:55:20 +0100
Subject: [PATCH 03/11] feat: linter verbeteringen

---
 frontend/src/components/MenuBar.vue | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/frontend/src/components/MenuBar.vue b/frontend/src/components/MenuBar.vue
index ce4a3a61..f085f4ed 100644
--- a/frontend/src/components/MenuBar.vue
+++ b/frontend/src/components/MenuBar.vue
@@ -18,9 +18,7 @@
     const name = "Kurt Cobain";
     const initials = name
         .split(" ")
-        .map((n) => {
-            return n[0];
-        })
+        .map((n) => n[0])
         .join("");
 
     const languages = ref([

From 53cec2a3c4801addda80f0372fdf14d3e9e6a393 Mon Sep 17 00:00:00 2001
From: Lint Action <lint-action@samuelmeuli.com>
Date: Sun, 16 Mar 2025 16:20:39 +0000
Subject: [PATCH 04/11] style: fix linting issues met Prettier

---
 frontend/src/router/index.ts                   | 18 +++++++++---------
 frontend/src/views/classes/UserAssignments.vue | 10 +++-------
 frontend/src/views/classes/UserClasses.vue     | 10 +++-------
 .../src/views/discussions/UserDiscussions.vue  | 10 +++-------
 frontend/src/views/homepage/UserHomePage.vue   | 10 +++-------
 5 files changed, 21 insertions(+), 37 deletions(-)

diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index e69d9fc0..a50d813e 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -1,4 +1,4 @@
-import {createRouter, createWebHistory} from "vue-router";
+import { createRouter, createWebHistory } from "vue-router";
 import MenuBar from "@/components/MenuBar.vue";
 import StudentHomepage from "@/views/homepage/StudentHomepage.vue";
 import SingleAssignment from "@/views/assignments/SingleAssignment.vue";
@@ -34,7 +34,7 @@ const router = createRouter({
         {
             path: "/user",
             component: MenuBar,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
             children: [
                 {
                     path: "home",
@@ -63,43 +63,43 @@ const router = createRouter({
             path: "/assignment/create",
             name: "CreateAssigment",
             component: CreateAssignment,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/assignment/:id",
             name: "SingleAssigment",
             component: SingleAssignment,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/class/create",
             name: "CreateClass",
             component: CreateClass,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/class/:id",
             name: "SingleClass",
             component: SingleClass,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/discussion/create",
             name: "CreateDiscussion",
             component: CreateDiscussion,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/discussion/:id",
             name: "SingleDiscussion",
             component: SingleDiscussion,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/:catchAll(.*)",
             name: "NotFound",
             component: NotFound,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
     ],
 });
diff --git a/frontend/src/views/classes/UserAssignments.vue b/frontend/src/views/classes/UserAssignments.vue
index 73336fa3..1a35a59f 100644
--- a/frontend/src/views/classes/UserAssignments.vue
+++ b/frontend/src/views/classes/UserAssignments.vue
@@ -1,11 +1,7 @@
-<script setup lang="ts">
-
-</script>
+<script setup lang="ts"></script>
 
 <template>
-<main></main>
+    <main></main>
 </template>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/frontend/src/views/classes/UserClasses.vue b/frontend/src/views/classes/UserClasses.vue
index 73336fa3..1a35a59f 100644
--- a/frontend/src/views/classes/UserClasses.vue
+++ b/frontend/src/views/classes/UserClasses.vue
@@ -1,11 +1,7 @@
-<script setup lang="ts">
-
-</script>
+<script setup lang="ts"></script>
 
 <template>
-<main></main>
+    <main></main>
 </template>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/frontend/src/views/discussions/UserDiscussions.vue b/frontend/src/views/discussions/UserDiscussions.vue
index 73336fa3..1a35a59f 100644
--- a/frontend/src/views/discussions/UserDiscussions.vue
+++ b/frontend/src/views/discussions/UserDiscussions.vue
@@ -1,11 +1,7 @@
-<script setup lang="ts">
-
-</script>
+<script setup lang="ts"></script>
 
 <template>
-<main></main>
+    <main></main>
 </template>
 
-<style scoped>
-
-</style>
+<style scoped></style>
diff --git a/frontend/src/views/homepage/UserHomePage.vue b/frontend/src/views/homepage/UserHomePage.vue
index 73336fa3..1a35a59f 100644
--- a/frontend/src/views/homepage/UserHomePage.vue
+++ b/frontend/src/views/homepage/UserHomePage.vue
@@ -1,11 +1,7 @@
-<script setup lang="ts">
-
-</script>
+<script setup lang="ts"></script>
 
 <template>
-<main></main>
+    <main></main>
 </template>
 
-<style scoped>
-
-</style>
+<style scoped></style>

From 0d15d068cdcb1a8f87080eb5f161999551c023d3 Mon Sep 17 00:00:00 2001
From: Joyelle Ndagijimana <njoyelle2@gmail.com>
Date: Mon, 17 Mar 2025 11:20:48 +0100
Subject: [PATCH 05/11] feat: logged-in check toegevoegd in de router

---
 frontend/src/components/MenuBar.vue | 22 ++++++++++------------
 frontend/src/router/index.ts        | 20 +++++++++++++++++++-
 2 files changed, 29 insertions(+), 13 deletions(-)

diff --git a/frontend/src/components/MenuBar.vue b/frontend/src/components/MenuBar.vue
index f085f4ed..122d08e2 100644
--- a/frontend/src/components/MenuBar.vue
+++ b/frontend/src/components/MenuBar.vue
@@ -1,26 +1,24 @@
 <script setup lang="ts">
     import { ref } from "vue";
-    import { useRoute } from "vue-router";
-    import dwengoLogo from "../../../assets/img/dwengo-groen-zwart.svg";
     import { useI18n } from "vue-i18n";
 
-    const route = useRoute();
+    // Import assets
+    import dwengoLogo from "../../../assets/img/dwengo-groen-zwart.svg";
+
     const { t, locale } = useI18n();
 
     // Instantiate variables to use in html to render right
     // Links and content dependent on the role (student or teacher)
-    //TODO: use localStorage to know which one in logged in, teacher or student
-    const isTeacher = route.path.includes("teacher");
+    const path = "/user";
 
-    const userId = route.params.id as string;
-
-    const role = isTeacher ? "teacher" : "student";
+    const role = localStorage.getItem("activeRole");
     const name = "Kurt Cobain";
     const initials = name
         .split(" ")
         .map((n) => n[0])
         .join("");
 
+    // Available languages
     const languages = ref([
         { name: "English", code: "en" },
         { name: "Nederlands", code: "nl" },
@@ -41,7 +39,7 @@
                 <ul>
                     <li>
                         <router-link
-                            :to="`/${role}/${userId}`"
+                            :to="`${path}`"
                             class="dwengo_home"
                         >
                             <img
@@ -55,7 +53,7 @@
                     </li>
                     <li>
                         <router-link
-                            :to="`/${role}/${userId}/assignment`"
+                            :to="`/user/assignment`"
                             class="menu_item"
                         >
                             {{ t("assignments") }}
@@ -63,14 +61,14 @@
                     </li>
                     <li>
                         <router-link
-                            :to="`/${role}/${userId}/class`"
+                            :to="`${path}/class`"
                             class="menu_item"
                             >{{ t("classes") }}</router-link
                         >
                     </li>
                     <li>
                         <router-link
-                            :to="`/${role}/${userId}/discussion`"
+                            :to="`${path}/discussion`"
                             class="menu_item"
                             >{{ t("discussions") }}
                         </router-link>
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index e69d9fc0..92c3feab 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -12,6 +12,7 @@ import CallbackPage from "@/views/CallbackPage.vue";
 import UserDiscussions from "@/views/discussions/UserDiscussions.vue";
 import UserClasses from "@/views/classes/UserClasses.vue";
 import UserAssignments from "@/views/classes/UserAssignments.vue";
+import authState from "@/services/auth/auth-service.ts";
 
 const router = createRouter({
     history: createWebHistory(import.meta.env.BASE_URL),
@@ -20,15 +21,18 @@ const router = createRouter({
             path: "/",
             name: "home",
             component: () => import("../views/HomePage.vue"),
+            meta: {requiresAuth: false}
         },
         {
             path: "/login",
             name: "LoginPage",
             component: () => import("../views/LoginPage.vue"),
+            meta: {requiresAuth: false},
         },
         {
             path: "/callback",
             component: CallbackPage,
+            meta: {requiresAuth: false}
         },
 
         {
@@ -99,9 +103,23 @@ const router = createRouter({
             path: "/:catchAll(.*)",
             name: "NotFound",
             component: NotFound,
-            meta: {requiresAuth: true},
+            meta: {requiresAuth: false}
         },
     ],
 });
 
+router.beforeEach(async (to, from, next) => {
+
+    // Verify if user is logged in for paths that require access
+    if (to.meta.requiresAuth) {
+        if (!authState.isLoggedIn) {
+            next("/login");
+        } else {
+            next();
+        }
+    } else {
+        next();
+    }
+});
+
 export default router;

From d5551446812a32da7219a341643f1510612d77f8 Mon Sep 17 00:00:00 2001
From: Lint Action <lint-action@samuelmeuli.com>
Date: Mon, 17 Mar 2025 10:23:28 +0000
Subject: [PATCH 06/11] style: fix linting issues met Prettier

---
 frontend/src/router/index.ts | 25 ++++++++++++-------------
 1 file changed, 12 insertions(+), 13 deletions(-)

diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 92c3feab..715b047c 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -1,4 +1,4 @@
-import {createRouter, createWebHistory} from "vue-router";
+import { createRouter, createWebHistory } from "vue-router";
 import MenuBar from "@/components/MenuBar.vue";
 import StudentHomepage from "@/views/homepage/StudentHomepage.vue";
 import SingleAssignment from "@/views/assignments/SingleAssignment.vue";
@@ -21,24 +21,24 @@ const router = createRouter({
             path: "/",
             name: "home",
             component: () => import("../views/HomePage.vue"),
-            meta: {requiresAuth: false}
+            meta: { requiresAuth: false },
         },
         {
             path: "/login",
             name: "LoginPage",
             component: () => import("../views/LoginPage.vue"),
-            meta: {requiresAuth: false},
+            meta: { requiresAuth: false },
         },
         {
             path: "/callback",
             component: CallbackPage,
-            meta: {requiresAuth: false}
+            meta: { requiresAuth: false },
         },
 
         {
             path: "/user",
             component: MenuBar,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
             children: [
                 {
                     path: "home",
@@ -67,49 +67,48 @@ const router = createRouter({
             path: "/assignment/create",
             name: "CreateAssigment",
             component: CreateAssignment,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/assignment/:id",
             name: "SingleAssigment",
             component: SingleAssignment,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/class/create",
             name: "CreateClass",
             component: CreateClass,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/class/:id",
             name: "SingleClass",
             component: SingleClass,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/discussion/create",
             name: "CreateDiscussion",
             component: CreateDiscussion,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/discussion/:id",
             name: "SingleDiscussion",
             component: SingleDiscussion,
-            meta: {requiresAuth: true},
+            meta: { requiresAuth: true },
         },
         {
             path: "/:catchAll(.*)",
             name: "NotFound",
             component: NotFound,
-            meta: {requiresAuth: false}
+            meta: { requiresAuth: false },
         },
     ],
 });
 
 router.beforeEach(async (to, from, next) => {
-
     // Verify if user is logged in for paths that require access
     if (to.meta.requiresAuth) {
         if (!authState.isLoggedIn) {

From 37ecad30ea5f8c890c14bb8b7565d5287cfb4db3 Mon Sep 17 00:00:00 2001
From: Joyelle Ndagijimana <njoyelle2@gmail.com>
Date: Mon, 17 Mar 2025 11:26:38 +0100
Subject: [PATCH 07/11] feat: todo in menubar toevoegen

---
 frontend/src/components/MenuBar.vue | 2 ++
 frontend/src/router/index.ts        | 2 +-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/MenuBar.vue b/frontend/src/components/MenuBar.vue
index 122d08e2..b6adf606 100644
--- a/frontend/src/components/MenuBar.vue
+++ b/frontend/src/components/MenuBar.vue
@@ -12,6 +12,8 @@
     const path = "/user";
 
     const role = localStorage.getItem("activeRole");
+
+    //TODO: use authState form services map to get user token
     const name = "Kurt Cobain";
     const initials = name
         .split(" ")
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 715b047c..1bac40ef 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -109,7 +109,7 @@ const router = createRouter({
 });
 
 router.beforeEach(async (to, from, next) => {
-    // Verify if user is logged in for paths that require access
+    // Verify if user is logged in for paths that require authentication
     if (to.meta.requiresAuth) {
         if (!authState.isLoggedIn) {
             next("/login");

From 49f1a98eece9160f828f27753761cf9c3db079d7 Mon Sep 17 00:00:00 2001
From: Joyelle Ndagijimana <njoyelle2@gmail.com>
Date: Tue, 18 Mar 2025 09:25:18 +0100
Subject: [PATCH 08/11] feat: login redirect opgelost

---
 frontend/src/router/index.ts               |  4 ++--
 frontend/src/services/auth/auth-service.ts | 17 +++++++++--------
 2 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 1bac40ef..5f2c4624 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -109,9 +109,9 @@ const router = createRouter({
 });
 
 router.beforeEach(async (to, from, next) => {
-    // Verify if user is logged in for paths that require authentication
+    // Verify if user is logged in before accessing certain routes
     if (to.meta.requiresAuth) {
-        if (!authState.isLoggedIn) {
+        if (!authState.isLoggedIn.value) {
             next("/login");
         } else {
             next();
diff --git a/frontend/src/services/auth/auth-service.ts b/frontend/src/services/auth/auth-service.ts
index 53f8cb61..03ec8e54 100644
--- a/frontend/src/services/auth/auth-service.ts
+++ b/frontend/src/services/auth/auth-service.ts
@@ -20,6 +20,15 @@ async function getUserManagers(): Promise<UserManagersForRoles> {
     };
 }
 
+/**
+ * Information about the current authentication state.
+ */
+const authState = reactive<AuthState>({
+    user: null,
+    accessToken: null,
+    activeRole: authStorage.getActiveRole() || null,
+});
+
 /**
  * Load the information about who is currently logged in from the IDP.
  */
@@ -35,14 +44,6 @@ async function loadUser(): Promise<User | null> {
     return user;
 }
 
-/**
- * Information about the current authentication state.
- */
-const authState = reactive<AuthState>({
-    user: null,
-    accessToken: null,
-    activeRole: authStorage.getActiveRole() || null,
-});
 
 const isLoggedIn = computed(() => authState.user !== null);
 

From 07f65398bbdcfabd36c916af2dd015a8f82d5116 Mon Sep 17 00:00:00 2001
From: Lint Action <lint-action@samuelmeuli.com>
Date: Tue, 18 Mar 2025 08:25:58 +0000
Subject: [PATCH 09/11] style: fix linting issues met Prettier

---
 frontend/src/services/auth/auth-service.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/src/services/auth/auth-service.ts b/frontend/src/services/auth/auth-service.ts
index 03ec8e54..2b3d2807 100644
--- a/frontend/src/services/auth/auth-service.ts
+++ b/frontend/src/services/auth/auth-service.ts
@@ -44,7 +44,6 @@ async function loadUser(): Promise<User | null> {
     return user;
 }
 
-
 const isLoggedIn = computed(() => authState.user !== null);
 
 /**

From 9d8e364e3ba7def0f94c2790c8bec70b649b439f Mon Sep 17 00:00:00 2001
From: Joyelle Ndagijimana <njoyelle2@gmail.com>
Date: Tue, 18 Mar 2025 09:32:33 +0100
Subject: [PATCH 10/11] feat: authState in plaats van localStorage

---
 frontend/src/components/MenuBar.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/MenuBar.vue b/frontend/src/components/MenuBar.vue
index b6adf606..2b084d64 100644
--- a/frontend/src/components/MenuBar.vue
+++ b/frontend/src/components/MenuBar.vue
@@ -2,6 +2,9 @@
     import { ref } from "vue";
     import { useI18n } from "vue-i18n";
 
+    import auth from "@/services/auth/auth-service.ts";
+
+
     // Import assets
     import dwengoLogo from "../../../assets/img/dwengo-groen-zwart.svg";
 
@@ -11,7 +14,7 @@
     // Links and content dependent on the role (student or teacher)
     const path = "/user";
 
-    const role = localStorage.getItem("activeRole");
+    const role = auth.authState.activeRole;
 
     //TODO: use authState form services map to get user token
     const name = "Kurt Cobain";

From 2c475d287d138f6cb715c4d0af3b8dda1d1ddec8 Mon Sep 17 00:00:00 2001
From: Lint Action <lint-action@samuelmeuli.com>
Date: Tue, 18 Mar 2025 08:33:24 +0000
Subject: [PATCH 11/11] style: fix linting issues met Prettier

---
 frontend/src/components/MenuBar.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/src/components/MenuBar.vue b/frontend/src/components/MenuBar.vue
index 2b084d64..f942babc 100644
--- a/frontend/src/components/MenuBar.vue
+++ b/frontend/src/components/MenuBar.vue
@@ -4,7 +4,6 @@
 
     import auth from "@/services/auth/auth-service.ts";
 
-
     // Import assets
     import dwengoLogo from "../../../assets/img/dwengo-groen-zwart.svg";