From 3aab8e481e48a84365507f659ed8991d040ef63c Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Mon, 2 Mar 2026 14:39:04 +0100
Subject: [PATCH 01/17] Added modal for use when changing the logged in user's
 password

---
 app/src/components/layout/DefaultHeader.vue | 90 +++++++++++++++++++++
 1 file changed, 90 insertions(+)

diff --git a/app/src/components/layout/DefaultHeader.vue b/app/src/components/layout/DefaultHeader.vue
index 011ba766..2792108a 100644
--- a/app/src/components/layout/DefaultHeader.vue
+++ b/app/src/components/layout/DefaultHeader.vue
@@ -1,4 +1,62 @@
 <template>
+  <!-- Modal used for changing passwords -->
+  <div
+  v-if="showPasswordModal"
+  class="fixed inset-0 z-50 flex items-center justify-center bg-black/60"
+  @click.self="closePasswordModal"
+>
+    <div class="bg-base-100 rounded-lg shadow-lg w-full max-w-md p-6">
+      <h2 class="text-lg font-semibold mb-4">Byt lösenord</h2>
+    
+      <form @submit.prevent="submitPasswordChange">
+        <div class="form-control mb-3">
+          <label class="label">
+            <span class="label-text">Användarnamn</span>
+          </label>
+          <input
+            v-model="passwordForm.username"
+            type="text"
+            class="input input-bordered w-full"
+          />
+        </div>
+      
+        <div class="form-control mb-3">
+          <label class="label">
+            <span class="label-text">Nuvarande lösenord</span>
+          </label>
+          <input
+            v-model="passwordForm.currentPassword"
+            type="password"
+            class="input input-bordered w-full"
+          />
+        </div>
+      
+        <div class="form-control mb-4">
+          <label class="label">
+            <span class="label-text">Nytt lösenord</span>
+          </label>
+          <input
+            v-model="passwordForm.newPassword"
+            type="password"
+            class="input input-bordered w-full"
+          />
+        </div>
+      
+        <div class="flex justify-end gap-2">
+          <button
+            type="button"
+            class="btn btn-ghost"
+            @click="closePasswordModal"
+          >
+            Avbryt
+          </button>
+          <button type="submit" class="btn btn-primary">
+            Spara
+          </button>
+        </div>
+      </form>
+    </div>
+  </div>
   <div data-theme="dark" :style="`background-image: url(${unsplashBackground});`"
     class="navbar justify-between gap-14 pl-6">
     <div class="">
@@ -34,6 +92,13 @@
           {{ translateUserRole(authStore.role) }}
         </span> -->
       </div>
+      <button class="btn-ghost shrink-0 btn-error btn btn-circle"
+        @click="showPasswordModal = true"
+      >
+        <span class="material-icons">
+          password
+        </span>
+      </button>
       <button @click="logout" class="btn-ghost shrink-0 text-error btn-error btn btn-circle">
         <span class="material-icons">
           logout
@@ -67,6 +132,31 @@ import unsplashBackground from '@/assets/milad-fakurian-DX7pT_guAyE-unsplash.jpg
 
 const router = useRouter();
 const authStore = useAuthStore();
+const showPasswordModal = ref(false);
+
+const passwordForm = ref({
+  username: '',
+  currentPassword: '',
+  newPassword: '',
+});
+
+function closePasswordModal() {
+  showPasswordModal.value = false;
+  passwordForm.value = {
+    username: '',
+    currentPassword: '',
+    newPassword: '',
+  };
+}
+
+async function submitPasswordChange() {
+  // TODO: call your API / authStore action here
+  // e.g. await authStore.changePassword(passwordForm.value)
+
+  // console.log('Change password payload', passwordForm.value);
+
+  closePasswordModal();
+}
 
 const isAtLeastUser = computed(() => {
   return authStore.role ? hasAtLeastSecurityRole(authStore.role, 'user') : false;

From 726aed31dac4209e80ae60842d133388360e232c Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 09:04:42 +0100
Subject: [PATCH 02/17] Added a route to get the currentUser with their stored
 hashed password for use in changing the password

---
 backend/auth/src/userRoutes.ts | 41 ++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)

diff --git a/backend/auth/src/userRoutes.ts b/backend/auth/src/userRoutes.ts
index 104d7ebc..0237ed6b 100644
--- a/backend/auth/src/userRoutes.ts
+++ b/backend/auth/src/userRoutes.ts
@@ -283,6 +283,46 @@ const getUsers: RequestHandler = async (req, res) => {
   res.send(dbResponse);
 }
 
+const getCurrentUser: RequestHandler = async (req: DeleteUserRequest, res) => {
+  const userData = req.session.user;
+  const payload = req.body;
+  try {
+    if (!userData) {
+      throw new Error('no client userdata. unauthorized!');
+    }
+    if (!userData.role) {
+      throw new Error('you have no role! Thus you are not authorized!');
+    }
+    if (!payload || !payload.userId) {
+      throw new Error('no userId provided. cant delete');
+    }
+  } catch (e) {
+    const msg = extractMessageFromCatch(e, 'You give bad data!!!!');
+    res.status(400).send(msg);
+    return;
+  }
+  try {
+    if (payload.userId !== userData.userId) {
+      throw new Error('Inputted id does not match current user.');
+    }
+  } catch (e) {
+    const msg = extractMessageFromCatch(e, 'Go away. Not authorized');
+    res.status(401).send(msg);
+    return;
+  }
+
+  const dbResponse = await db.query.users.findFirst({
+    columns: {
+      userId: true,
+      username: true,
+      password: true,
+    },
+    where: (users, { eq }) => eq(users.userId, payload.userId)
+  })
+
+  res.send(dbResponse);
+}
+
 const getAdmins: RequestHandler = async (req, res) => {
   const userData = req.session.user;
 
@@ -482,6 +522,7 @@ export default function createUserRouter(): Router {
   userRouter.post('/create-sender', isLoggedIn, createSenderForVenue);
 
   userRouter.get('/me', isLoggedIn, getSelf);
+  userRouter.get('/get-current-user', isLoggedIn, getCurrentUser)
 
   userRouter.get('/jwt', isLoggedIn, getJwt);
 

From 27f95f63750ffefa20c2dba006c61a794b46093d Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 09:31:53 +0100
Subject: [PATCH 03/17] Added role to userdata that is gotten

---
 backend/auth/src/userRoutes.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/backend/auth/src/userRoutes.ts b/backend/auth/src/userRoutes.ts
index 0237ed6b..0f79a330 100644
--- a/backend/auth/src/userRoutes.ts
+++ b/backend/auth/src/userRoutes.ts
@@ -315,6 +315,7 @@ const getCurrentUser: RequestHandler = async (req: DeleteUserRequest, res) => {
     columns: {
       userId: true,
       username: true,
+      role: true,
       password: true,
     },
     where: (users, { eq }) => eq(users.userId, payload.userId)

From 4eee5cb0a358395e0d624dcb291f7c129a24b551 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 09:45:15 +0100
Subject: [PATCH 04/17] Updated route with GetCurrentUserRequest interface

---
 backend/auth/src/userRoutes.ts | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/backend/auth/src/userRoutes.ts b/backend/auth/src/userRoutes.ts
index 0f79a330..807b1876 100644
--- a/backend/auth/src/userRoutes.ts
+++ b/backend/auth/src/userRoutes.ts
@@ -209,6 +209,12 @@ interface DeleteUserRequest extends ExpressReq {
   }
 }
 
+interface GetCurrentUserRequest extends ExpressReq {
+  query: {
+    userId: UserId
+  }
+}
+
 const deleteUser: RequestHandler = async (req: DeleteUserRequest, res) => {
   try {
     const userData = req.session.user;
@@ -283,9 +289,9 @@ const getUsers: RequestHandler = async (req, res) => {
   res.send(dbResponse);
 }
 
-const getCurrentUser: RequestHandler = async (req: DeleteUserRequest, res) => {
+const getCurrentUser: RequestHandler = async (req: GetCurrentUserRequest, res) => {
   const userData = req.session.user;
-  const payload = req.body;
+  const { userId } = req.query;
   try {
     if (!userData) {
       throw new Error('no client userdata. unauthorized!');
@@ -293,7 +299,7 @@ const getCurrentUser: RequestHandler = async (req: DeleteUserRequest, res) => {
     if (!userData.role) {
       throw new Error('you have no role! Thus you are not authorized!');
     }
-    if (!payload || !payload.userId) {
+    if (!userId) {
       throw new Error('no userId provided. cant delete');
     }
   } catch (e) {
@@ -302,7 +308,7 @@ const getCurrentUser: RequestHandler = async (req: DeleteUserRequest, res) => {
     return;
   }
   try {
-    if (payload.userId !== userData.userId) {
+    if (userId !== userData.userId) {
       throw new Error('Inputted id does not match current user.');
     }
   } catch (e) {
@@ -318,7 +324,7 @@ const getCurrentUser: RequestHandler = async (req: DeleteUserRequest, res) => {
       role: true,
       password: true,
     },
-    where: (users, { eq }) => eq(users.userId, payload.userId)
+    where: (users, { eq }) => eq(users.userId, userId)
   })
 
   res.send(dbResponse);

From 815ccba396fac2e10c5f4cdd1cbebca7978efe57 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 09:58:26 +0100
Subject: [PATCH 05/17] Removed input from getCurrentUser method

---
 backend/auth/src/userRoutes.ts | 23 ++---------------------
 1 file changed, 2 insertions(+), 21 deletions(-)

diff --git a/backend/auth/src/userRoutes.ts b/backend/auth/src/userRoutes.ts
index 807b1876..37e3811c 100644
--- a/backend/auth/src/userRoutes.ts
+++ b/backend/auth/src/userRoutes.ts
@@ -209,12 +209,6 @@ interface DeleteUserRequest extends ExpressReq {
   }
 }
 
-interface GetCurrentUserRequest extends ExpressReq {
-  query: {
-    userId: UserId
-  }
-}
-
 const deleteUser: RequestHandler = async (req: DeleteUserRequest, res) => {
   try {
     const userData = req.session.user;
@@ -289,9 +283,8 @@ const getUsers: RequestHandler = async (req, res) => {
   res.send(dbResponse);
 }
 
-const getCurrentUser: RequestHandler = async (req: GetCurrentUserRequest, res) => {
+const getCurrentUser: RequestHandler = async (req, res) => {
   const userData = req.session.user;
-  const { userId } = req.query;
   try {
     if (!userData) {
       throw new Error('no client userdata. unauthorized!');
@@ -299,23 +292,11 @@ const getCurrentUser: RequestHandler = async (req: GetCurrentUserRequest, res) =
     if (!userData.role) {
       throw new Error('you have no role! Thus you are not authorized!');
     }
-    if (!userId) {
-      throw new Error('no userId provided. cant delete');
-    }
   } catch (e) {
     const msg = extractMessageFromCatch(e, 'You give bad data!!!!');
     res.status(400).send(msg);
     return;
   }
-  try {
-    if (userId !== userData.userId) {
-      throw new Error('Inputted id does not match current user.');
-    }
-  } catch (e) {
-    const msg = extractMessageFromCatch(e, 'Go away. Not authorized');
-    res.status(401).send(msg);
-    return;
-  }
 
   const dbResponse = await db.query.users.findFirst({
     columns: {
@@ -324,7 +305,7 @@ const getCurrentUser: RequestHandler = async (req: GetCurrentUserRequest, res) =
       role: true,
       password: true,
     },
-    where: (users, { eq }) => eq(users.userId, userId)
+    where: (users, { eq }) => eq(users.userId, userData.userId)
   })
 
   res.send(dbResponse);

From c82a177dd6113c8908a22ae46624ed20127ecd93 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 10:55:27 +0100
Subject: [PATCH 06/17] Added new route to use when updating a users password

---
 backend/auth/src/userRoutes.ts | 152 +++++++++++++++++++++++++++------
 1 file changed, 125 insertions(+), 27 deletions(-)

diff --git a/backend/auth/src/userRoutes.ts b/backend/auth/src/userRoutes.ts
index 37e3811c..d0c0177f 100644
--- a/backend/auth/src/userRoutes.ts
+++ b/backend/auth/src/userRoutes.ts
@@ -203,6 +203,103 @@ const updateUser: RequestHandler = async (req: UpdateUserRequest, res) => {
   }
 };
 
+interface ChangePasswordRequest extends ExpressReq {
+  body: {
+    username: string;
+    currentPassword: string;
+    newPassword: string;
+  }
+}
+
+const updateUserPassword: RequestHandler = async (req: ChangePasswordRequest, res) => {
+  const userData = req.session.user;
+  const data = req.body;
+  try {
+    if (!userData) {
+      throw new Error('no client userdata. unauthorized!');
+    }
+
+    if (!userData.role) {
+      throw new Error('you have no role! Thus you are not authorized!');
+    }
+
+    if (!data) {
+      throw new Error('no input data sent!');
+    }
+  } catch (e) {
+    const msg = extractMessageFromCatch(e, 'You give bad data!!!!');
+    res.status(400).send(msg);
+    return;
+  }
+
+  const currentUserDatabase = await db.query.users.findFirst({
+    columns: {
+      userId: true,
+      username: true,
+      role: true,
+      password: true,
+    },
+    where: (users, { eq }) => eq(users.userId, userData.userId)
+  })
+
+  try {
+    if (!currentUserDatabase) {
+      throw new Error('User not found in databse.')
+    }
+
+    if (userData.role !== currentUserDatabase.role || userData.username !== currentUserDatabase.username) {
+      throw new Error('Current user data does not match database.')
+    }
+  } catch (e) {
+    const msg = extractMessageFromCatch(e, 'Not authorized!');
+    res.status(401).send(msg);
+    return;
+  }
+
+  try {
+    if (!data.username || data.username !== currentUserDatabase.username) {
+      throw new Error('Inputted data does not match data in database!')
+    }
+
+    if (!data.currentPassword) {
+      throw new Error('Inputted data does not match data in database!')
+    }
+
+    const correct = await bcrypt.compare(data.currentPassword, currentUserDatabase.password);
+    if (!correct) {
+      throw new Error('Inputted data does not match data in database!')
+    }
+  } catch (e) {
+    const msg = extractMessageFromCatch(e, 'Not authorized!');
+    res.status(401).send(msg);
+    return;
+  }
+
+  let hashedPassword = undefined;
+  if (data.newPassword) {
+    hashedPassword = await bcrypt.hash(data.newPassword, 10);
+  }
+
+  const userUpdate = {
+    password: hashedPassword,
+  };
+
+  try {
+    const [result] = await db.update(schema.users)
+      .set(userUpdate)
+      .where(eq(schema.users.userId, currentUserDatabase.userId))
+      .returning();
+    const resultWithoutPassword = exclude(result, 'password');
+    res.status(201).send(resultWithoutPassword);
+    return;
+  } catch (e) {
+    const errorMsg = extractMessageFromCatch(e, 'failed to update user!');
+    console.error(errorMsg);
+    res.status(501).send(errorMsg);
+    return;
+  }
+}
+
 interface DeleteUserRequest extends ExpressReq {
   body: {
     userId: UserId
@@ -283,33 +380,33 @@ const getUsers: RequestHandler = async (req, res) => {
   res.send(dbResponse);
 }
 
-const getCurrentUser: RequestHandler = async (req, res) => {
-  const userData = req.session.user;
-  try {
-    if (!userData) {
-      throw new Error('no client userdata. unauthorized!');
-    }
-    if (!userData.role) {
-      throw new Error('you have no role! Thus you are not authorized!');
-    }
-  } catch (e) {
-    const msg = extractMessageFromCatch(e, 'You give bad data!!!!');
-    res.status(400).send(msg);
-    return;
-  }
-
-  const dbResponse = await db.query.users.findFirst({
-    columns: {
-      userId: true,
-      username: true,
-      role: true,
-      password: true,
-    },
-    where: (users, { eq }) => eq(users.userId, userData.userId)
-  })
+// const getCurrentUser: RequestHandler = async (req, res) => {
+//   const userData = req.session.user;
+//   try {
+//     if (!userData) {
+//       throw new Error('no client userdata. unauthorized!');
+//     }
+//     if (!userData.role) {
+//       throw new Error('you have no role! Thus you are not authorized!');
+//     }
+//   } catch (e) {
+//     const msg = extractMessageFromCatch(e, 'You give bad data!!!!');
+//     res.status(400).send(msg);
+//     return;
+//   }
 
-  res.send(dbResponse);
-}
+//   const dbResponse = await db.query.users.findFirst({
+//     columns: {
+//       userId: true,
+//       username: true,
+//       role: true,
+//       password: true,
+//     },
+//     where: (users, { eq }) => eq(users.userId, userData.userId)
+//   })
+
+//   res.send(dbResponse);
+// }
 
 const getAdmins: RequestHandler = async (req, res) => {
   const userData = req.session.user;
@@ -510,7 +607,8 @@ export default function createUserRouter(): Router {
   userRouter.post('/create-sender', isLoggedIn, createSenderForVenue);
 
   userRouter.get('/me', isLoggedIn, getSelf);
-  userRouter.get('/get-current-user', isLoggedIn, getCurrentUser)
+  userRouter.post('/change-Password', isLoggedIn, updateUserPassword)
+  // userRouter.get('/get-current-user', isLoggedIn, getCurrentUser)
 
   userRouter.get('/jwt', isLoggedIn, getJwt);
 

From 5acd2b9a82255436592cd2c511c96b8992d12dcd Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 11:00:29 +0100
Subject: [PATCH 07/17] added changePassword method

---
 app/src/modules/authClient.ts | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)

diff --git a/app/src/modules/authClient.ts b/app/src/modules/authClient.ts
index 77cba39b..3e9d278c 100644
--- a/app/src/modules/authClient.ts
+++ b/app/src/modules/authClient.ts
@@ -8,6 +8,12 @@ const completeAuthUrl = `http://${import.meta.env.EXPOSED_SERVER_URL}:${import.m
 // console.log('authUrl: ', completeAuthUrl);
 const authEndpoint = axios.create({ baseURL: completeAuthUrl, withCredentials: true });
 
+interface ChangePasswordRequest {
+  username: string;
+  currentPassword: string;
+  newPassword: string;
+}
+
 export function createUser(username: string, password: string, role: UserRole) {
   return handleResponse(() => authEndpoint.post('/user/create', {
     role: role.toString(),
@@ -179,6 +185,24 @@ export const loginWithAutoToken = async (username: string, password: string) =>
   return latestJwtToken;
 };
 
+export const changePassword = async (data: ChangePasswordRequest) => {
+  try {
+    const username = data.username;
+    const currentPassword = data.currentPassword;
+    const newPassword = data.newPassword;
+
+    await authEndpoint.post('/user/change-Password', {
+      username,
+      currentPassword,
+      newPassword,
+    })
+
+    return Promise.resolve();
+  } catch (e) {
+    return Promise.reject(Error(e.response.data));
+  }
+};
+
 // export const deleteUser = (uuid: string) => authEndpoint.post('delete-user', { uuid });
 // export const createUser = (payload: { username: string, password: string, gathering?: string, role: NonGuestUserRole }) => handleResponse<Omit<UserWithIncludes, 'password'>>(() => authEndpoint.post('create', payload));
 // export const updateUser = (payload: { uuid: string, username?: string, password?: string, gathering?: string, role?: NonGuestUserRole }) => handleResponse<Omit<UserWithIncludes, 'password'>>(() => authEndpoint.post('update', payload));

From e0474475388d79e09e87e9d0d36bb242f1c4864a Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 11:08:33 +0100
Subject: [PATCH 08/17] Added changePassword method to the authstore

---
 app/src/stores/authStore.ts | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/app/src/stores/authStore.ts b/app/src/stores/authStore.ts
index 1c1dd97b..85c516c2 100644
--- a/app/src/stores/authStore.ts
+++ b/app/src/stores/authStore.ts
@@ -1,9 +1,15 @@
 import { defineStore } from 'pinia';
-import { logout as authLogout, login as authLogin, userAutoToken, guestAutoToken } from '@/modules/authClient';
+import { logout as authLogout, login as authLogin, userAutoToken, guestAutoToken, changePassword as authChangePassword } from '@/modules/authClient';
 import { hasAtLeastSecurityRole, type JwtPayload } from 'schemas';
 import jwtDecode from 'jwt-decode';
 import { computed, ref } from 'vue';
 
+interface ChangePasswordRequest {
+  username: string;
+  currentPassword: string;
+  newPassword: string;
+}
+
 const browserHasCookie = () => {
   const cookieValue = document.cookie
     .split('; ')
@@ -84,6 +90,10 @@ export const useAuthStore = defineStore('auth', () => {
     });
   }
 
+  async function changePassword(data: ChangePasswordRequest) {
+    authChangePassword(data);
+  }
+
   return {
     isAuthenticated,
     isNotGuest: isLoggedIn,
@@ -100,6 +110,7 @@ export const useAuthStore = defineStore('auth', () => {
     restoreFromSession,
     logout,
     login,
+    changePassword,
     routePrefix,
   };
 }, {

From ff2dccab4dea39f363285fbeb3289c25c662dc24 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 12:47:08 +0100
Subject: [PATCH 09/17] Updated submitPasswordChange to now call on the new
 changePassword method in authstore

---
 app/src/components/layout/DefaultHeader.vue | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/app/src/components/layout/DefaultHeader.vue b/app/src/components/layout/DefaultHeader.vue
index 2792108a..873e5bda 100644
--- a/app/src/components/layout/DefaultHeader.vue
+++ b/app/src/components/layout/DefaultHeader.vue
@@ -150,11 +150,8 @@ function closePasswordModal() {
 }
 
 async function submitPasswordChange() {
-  // TODO: call your API / authStore action here
-  // e.g. await authStore.changePassword(passwordForm.value)
-
-  // console.log('Change password payload', passwordForm.value);
-
+  await authStore.changePassword(passwordForm.value)
+  console.log('Password changed');
   closePasswordModal();
 }
 

From edd0be03d8223a8a4b29f09bc804b5d6e01b6ba5 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Tue, 3 Mar 2026 12:51:51 +0100
Subject: [PATCH 10/17] Made it so change password button only shows if the
 user logged in has the user role

---
 app/src/components/layout/DefaultHeader.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/app/src/components/layout/DefaultHeader.vue b/app/src/components/layout/DefaultHeader.vue
index 873e5bda..b6d6c2b0 100644
--- a/app/src/components/layout/DefaultHeader.vue
+++ b/app/src/components/layout/DefaultHeader.vue
@@ -92,7 +92,9 @@
           {{ translateUserRole(authStore.role) }}
         </span> -->
       </div>
-      <button class="btn-ghost shrink-0 btn-error btn btn-circle"
+      <button
+        v-if="authStore.role === 'user'"
+        class="btn-ghost shrink-0 btn-error btn btn-circle"
         @click="showPasswordModal = true"
       >
         <span class="material-icons">

From 642c0b8c89177adf4e692e033a8d9819a62fab6f Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Wed, 4 Mar 2026 14:22:38 +0100
Subject: [PATCH 11/17] Removed username from inputted data as it is not needed

---
 app/src/modules/authClient.ts  | 3 ---
 app/src/stores/authStore.ts    | 1 -
 backend/auth/src/userRoutes.ts | 7 +------
 3 files changed, 1 insertion(+), 10 deletions(-)

diff --git a/app/src/modules/authClient.ts b/app/src/modules/authClient.ts
index 3e9d278c..a0234d01 100644
--- a/app/src/modules/authClient.ts
+++ b/app/src/modules/authClient.ts
@@ -9,7 +9,6 @@ const completeAuthUrl = `http://${import.meta.env.EXPOSED_SERVER_URL}:${import.m
 const authEndpoint = axios.create({ baseURL: completeAuthUrl, withCredentials: true });
 
 interface ChangePasswordRequest {
-  username: string;
   currentPassword: string;
   newPassword: string;
 }
@@ -187,12 +186,10 @@ export const loginWithAutoToken = async (username: string, password: string) =>
 
 export const changePassword = async (data: ChangePasswordRequest) => {
   try {
-    const username = data.username;
     const currentPassword = data.currentPassword;
     const newPassword = data.newPassword;
 
     await authEndpoint.post('/user/change-Password', {
-      username,
       currentPassword,
       newPassword,
     })
diff --git a/app/src/stores/authStore.ts b/app/src/stores/authStore.ts
index 85c516c2..175515c4 100644
--- a/app/src/stores/authStore.ts
+++ b/app/src/stores/authStore.ts
@@ -5,7 +5,6 @@ import jwtDecode from 'jwt-decode';
 import { computed, ref } from 'vue';
 
 interface ChangePasswordRequest {
-  username: string;
   currentPassword: string;
   newPassword: string;
 }
diff --git a/backend/auth/src/userRoutes.ts b/backend/auth/src/userRoutes.ts
index d0c0177f..d919693b 100644
--- a/backend/auth/src/userRoutes.ts
+++ b/backend/auth/src/userRoutes.ts
@@ -205,7 +205,6 @@ const updateUser: RequestHandler = async (req: UpdateUserRequest, res) => {
 
 interface ChangePasswordRequest extends ExpressReq {
   body: {
-    username: string;
     currentPassword: string;
     newPassword: string;
   }
@@ -219,7 +218,7 @@ const updateUserPassword: RequestHandler = async (req: ChangePasswordRequest, re
       throw new Error('no client userdata. unauthorized!');
     }
 
-    if (!userData.role) {
+    if (userData.role === "guest" || userData.role === "god") {
       throw new Error('you have no role! Thus you are not authorized!');
     }
 
@@ -235,7 +234,6 @@ const updateUserPassword: RequestHandler = async (req: ChangePasswordRequest, re
   const currentUserDatabase = await db.query.users.findFirst({
     columns: {
       userId: true,
-      username: true,
       role: true,
       password: true,
     },
@@ -257,9 +255,6 @@ const updateUserPassword: RequestHandler = async (req: ChangePasswordRequest, re
   }
 
   try {
-    if (!data.username || data.username !== currentUserDatabase.username) {
-      throw new Error('Inputted data does not match data in database!')
-    }
 
     if (!data.currentPassword) {
       throw new Error('Inputted data does not match data in database!')

From 6976299a88af33139ad31256a6786aae24379fa7 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Thu, 5 Mar 2026 09:25:44 +0100
Subject: [PATCH 12/17] Removed lingering code that referenced username

---
 backend/auth/src/userRoutes.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/backend/auth/src/userRoutes.ts b/backend/auth/src/userRoutes.ts
index d919693b..b01c995a 100644
--- a/backend/auth/src/userRoutes.ts
+++ b/backend/auth/src/userRoutes.ts
@@ -245,7 +245,7 @@ const updateUserPassword: RequestHandler = async (req: ChangePasswordRequest, re
       throw new Error('User not found in databse.')
     }
 
-    if (userData.role !== currentUserDatabase.role || userData.username !== currentUserDatabase.username) {
+    if (userData.role !== currentUserDatabase.role) {
       throw new Error('Current user data does not match database.')
     }
   } catch (e) {

From 151f63f739177c14ba4bbe7ceb8b8bfc961ae696 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Thu, 5 Mar 2026 09:27:34 +0100
Subject: [PATCH 13/17] Moved the change password modal out to it's own
 component

---
 app/src/components/ChangePasswordModal.vue  | 119 ++++++++++++++++++++
 app/src/components/layout/DefaultHeader.vue |  87 ++------------
 2 files changed, 131 insertions(+), 75 deletions(-)
 create mode 100644 app/src/components/ChangePasswordModal.vue

diff --git a/app/src/components/ChangePasswordModal.vue b/app/src/components/ChangePasswordModal.vue
new file mode 100644
index 00000000..7741a79b
--- /dev/null
+++ b/app/src/components/ChangePasswordModal.vue
@@ -0,0 +1,119 @@
+<template>
+<div
+  v-if="modelValue"
+  class="fixed inset-0 z-50 flex items-center justify-center bg-black/60"
+  @click.self="onCancel"
+>
+    <div class="bg-base-100 rounded-lg shadow-lg w-full max-w-md p-6">
+      <h2 class="text-lg font-semibold mb-4">Byt lösenord</h2>
+    
+      <form @submit.prevent="onSubmit">
+        <div class="form-control mb-3">
+          <label class="label">
+            <span class="label-text">Nuvarande lösenord</span>
+          </label>
+          <input
+            v-model="passwordForm.currentPassword"
+            type="password"
+            class="input input-bordered w-full"
+            :class="{'input-error': !passwordsMatch}"
+          />
+        </div>
+      
+        <div class="form-control mb-3">
+          <label class="label">
+            <span class="label-text">Bekräfta nuvarande lösenord</span>
+          </label>
+          <input
+            v-model="currentPasswordCheck"
+            type="password"
+            class="input input-bordered w-full"
+            :class="{'input-error': !passwordsMatch}"
+          />
+          <p v-if="!passwordsMatch" class="mt-1 text-sm text-error">
+            Lösenorden stämmer inte överens.
+          </p>
+        </div>
+      
+        <div class="form-control mb-4">
+          <label class="label">
+            <span class="label-text">Nytt lösenord</span>
+          </label>
+          <input
+            v-model="passwordForm.newPassword"
+            type="password"
+            class="input input-bordered w-full"
+          />
+        </div>
+      
+        <div class="flex justify-end gap-2">
+          <button
+            type="button"
+            class="btn btn-ghost"
+            @click="onCancel"
+          >
+            Avbryt
+          </button>
+          <button type="submit" class="btn btn-primary">
+            Spara
+          </button>
+        </div>
+      </form>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, computed } from 'vue';
+
+const props = defineProps<{
+  modelValue: boolean,
+}>();
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: boolean): void;
+  (e: 'submit', payload: {
+    currentPassword: string;
+    newPassword: string;
+  }): void;
+}>();
+
+const emptyForm = () => ({
+  currentPassword: '',
+  newPassword: '',
+});
+
+const passwordForm = ref(emptyForm());
+const currentPasswordCheck = ref('');
+
+const passwordsMatch = computed(() =>
+  currentPasswordCheck.value === '' ||
+  passwordForm.value.currentPassword === currentPasswordCheck.value
+);
+
+watch(
+  () => props.modelValue,
+  (open) => {
+    if (open) {
+      passwordForm.value = emptyForm();
+      currentPasswordCheck.value = '';
+    }
+  }
+);
+
+function close() {
+  emit('update:modelValue', false);
+}
+
+function onCancel() {
+  close();
+}
+
+function onSubmit() {
+  if (!passwordsMatch.value) {
+    return;
+  }
+    emit('submit', { ...passwordForm.value });
+    close();
+}
+</script>
\ No newline at end of file
diff --git a/app/src/components/layout/DefaultHeader.vue b/app/src/components/layout/DefaultHeader.vue
index b6d6c2b0..d0ae38d7 100644
--- a/app/src/components/layout/DefaultHeader.vue
+++ b/app/src/components/layout/DefaultHeader.vue
@@ -1,62 +1,10 @@
 <template>
   <!-- Modal used for changing passwords -->
-  <div
-  v-if="showPasswordModal"
-  class="fixed inset-0 z-50 flex items-center justify-center bg-black/60"
-  @click.self="closePasswordModal"
->
-    <div class="bg-base-100 rounded-lg shadow-lg w-full max-w-md p-6">
-      <h2 class="text-lg font-semibold mb-4">Byt lösenord</h2>
-    
-      <form @submit.prevent="submitPasswordChange">
-        <div class="form-control mb-3">
-          <label class="label">
-            <span class="label-text">Användarnamn</span>
-          </label>
-          <input
-            v-model="passwordForm.username"
-            type="text"
-            class="input input-bordered w-full"
-          />
-        </div>
-      
-        <div class="form-control mb-3">
-          <label class="label">
-            <span class="label-text">Nuvarande lösenord</span>
-          </label>
-          <input
-            v-model="passwordForm.currentPassword"
-            type="password"
-            class="input input-bordered w-full"
-          />
-        </div>
-      
-        <div class="form-control mb-4">
-          <label class="label">
-            <span class="label-text">Nytt lösenord</span>
-          </label>
-          <input
-            v-model="passwordForm.newPassword"
-            type="password"
-            class="input input-bordered w-full"
-          />
-        </div>
-      
-        <div class="flex justify-end gap-2">
-          <button
-            type="button"
-            class="btn btn-ghost"
-            @click="closePasswordModal"
-          >
-            Avbryt
-          </button>
-          <button type="submit" class="btn btn-primary">
-            Spara
-          </button>
-        </div>
-      </form>
-    </div>
-  </div>
+  <ChangePasswordModal
+    v-model="showPasswordModal"
+    @submit="handlePasswordSubmit"
+  />
+  
   <div data-theme="dark" :style="`background-image: url(${unsplashBackground});`"
     class="navbar justify-between gap-14 pl-6">
     <div class="">
@@ -131,30 +79,19 @@ import { useAuthStore } from '@/stores/authStore';
 import { hasAtLeastSecurityRole, translateUserRole } from 'schemas';
 import { computed, ref } from 'vue';
 import unsplashBackground from '@/assets/milad-fakurian-DX7pT_guAyE-unsplash.jpg';
+import ChangePasswordModal from '@/components/ChangePasswordModal.vue';
 
 const router = useRouter();
 const authStore = useAuthStore();
 const showPasswordModal = ref(false);
 
-const passwordForm = ref({
-  username: '',
-  currentPassword: '',
-  newPassword: '',
-});
-
-function closePasswordModal() {
-  showPasswordModal.value = false;
-  passwordForm.value = {
-    username: '',
-    currentPassword: '',
-    newPassword: '',
-  };
-}
-
-async function submitPasswordChange() {
-  await authStore.changePassword(passwordForm.value)
+async function handlePasswordSubmit(payload: {
+  currentPassword: string;
+  newPassword: string;
+}) {
+  await authStore.changePassword(payload);
   console.log('Password changed');
-  closePasswordModal();
+  showPasswordModal.value = false;
 }
 
 const isAtLeastUser = computed(() => {

From f3683f1379173a49dde31271aecefb9677baa4f6 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Fri, 6 Mar 2026 08:25:33 +0100
Subject: [PATCH 14/17] Changed to daisyUI

---
 app/src/components/ChangePasswordModal.vue | 62 +++++++++++-----------
 1 file changed, 30 insertions(+), 32 deletions(-)

diff --git a/app/src/components/ChangePasswordModal.vue b/app/src/components/ChangePasswordModal.vue
index 7741a79b..97de929b 100644
--- a/app/src/components/ChangePasswordModal.vue
+++ b/app/src/components/ChangePasswordModal.vue
@@ -1,14 +1,16 @@
 <template>
-<div
-  v-if="modelValue"
-  class="fixed inset-0 z-50 flex items-center justify-center bg-black/60"
-  @click.self="onCancel"
->
-    <div class="bg-base-100 rounded-lg shadow-lg w-full max-w-md p-6">
+  <dialog
+    class="modal"
+    :class="{ 'modal-open': modelValue }"
+    @click.self="onCancel"
+  >
+  
+    <div class="modal-box">
+      <button @click="onCancel" class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
       <h2 class="text-lg font-semibold mb-4">Byt lösenord</h2>
-    
-      <form @submit.prevent="onSubmit">
-        <div class="form-control mb-3">
+
+      <form @submit.prevent="onSubmit" class="space-y-3">
+        <div class="form-control">
           <label class="label">
             <span class="label-text">Nuvarande lösenord</span>
           </label>
@@ -16,11 +18,11 @@
             v-model="passwordForm.currentPassword"
             type="password"
             class="input input-bordered w-full"
-            :class="{'input-error': !passwordsMatch}"
+            :class="{ 'input-error': !passwordsMatch }"
           />
         </div>
-      
-        <div class="form-control mb-3">
+
+        <div class="form-control">
           <label class="label">
             <span class="label-text">Bekräfta nuvarande lösenord</span>
           </label>
@@ -28,14 +30,14 @@
             v-model="currentPasswordCheck"
             type="password"
             class="input input-bordered w-full"
-            :class="{'input-error': !passwordsMatch}"
+            :class="{ 'input-error': !passwordsMatch }"
           />
           <p v-if="!passwordsMatch" class="mt-1 text-sm text-error">
             Lösenorden stämmer inte överens.
           </p>
         </div>
-      
-        <div class="form-control mb-4">
+
+        <div class="form-control">
           <label class="label">
             <span class="label-text">Nytt lösenord</span>
           </label>
@@ -45,8 +47,8 @@
             class="input input-bordered w-full"
           />
         </div>
-      
-        <div class="flex justify-end gap-2">
+
+        <div class="modal-action">
           <button
             type="button"
             class="btn btn-ghost"
@@ -60,22 +62,19 @@
         </div>
       </form>
     </div>
-  </div>
+  </dialog>
 </template>
 
 <script setup lang="ts">
 import { ref, watch, computed } from 'vue';
 
 const props = defineProps<{
-  modelValue: boolean,
+  modelValue: boolean
 }>();
 
 const emit = defineEmits<{
   (e: 'update:modelValue', value: boolean): void;
-  (e: 'submit', payload: {
-    currentPassword: string;
-    newPassword: string;
-  }): void;
+  (e: 'submit', payload: { currentPassword: string; newPassword: string }): void;
 }>();
 
 const emptyForm = () => ({
@@ -86,9 +85,10 @@ const emptyForm = () => ({
 const passwordForm = ref(emptyForm());
 const currentPasswordCheck = ref('');
 
-const passwordsMatch = computed(() =>
-  currentPasswordCheck.value === '' ||
-  passwordForm.value.currentPassword === currentPasswordCheck.value
+const passwordsMatch = computed(
+  () =>
+    currentPasswordCheck.value === '' ||
+    passwordForm.value.currentPassword === currentPasswordCheck.value,
 );
 
 watch(
@@ -98,7 +98,7 @@ watch(
       passwordForm.value = emptyForm();
       currentPasswordCheck.value = '';
     }
-  }
+  },
 );
 
 function close() {
@@ -110,10 +110,8 @@ function onCancel() {
 }
 
 function onSubmit() {
-  if (!passwordsMatch.value) {
-    return;
-  }
-    emit('submit', { ...passwordForm.value });
-    close();
+  if (!passwordsMatch.value) return;
+  emit('submit', { ...passwordForm.value });
+  close();
 }
 </script>
\ No newline at end of file

From be15a233961b67e2e426bbb3bcac93d7d7a05455 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Mon, 9 Mar 2026 11:47:29 +0100
Subject: [PATCH 15/17] Added the change password function to the hamburger
 menu that is used when the screen size is smaller

---
 app/src/components/layout/DefaultHeader.vue | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/app/src/components/layout/DefaultHeader.vue b/app/src/components/layout/DefaultHeader.vue
index d0ae38d7..37fc5f4b 100644
--- a/app/src/components/layout/DefaultHeader.vue
+++ b/app/src/components/layout/DefaultHeader.vue
@@ -65,6 +65,9 @@
             {{ route.label }}
           </RouterLink>
         </li>
+        <li>
+          <a @click="changePasswordHamburgerMenu">Ändra lösenord</a>
+        </li>
         <li class="text-error">
           <a @click="logout">{{ isAtLeastUser ? 'Logga ut' : 'Avsluta' }}</a>
         </li>
@@ -94,6 +97,11 @@ async function handlePasswordSubmit(payload: {
   showPasswordModal.value = false;
 }
 
+const changePasswordHamburgerMenu = async () => {
+  showPasswordModal.value = true;
+  closeMenu();
+}
+
 const isAtLeastUser = computed(() => {
   return authStore.role ? hasAtLeastSecurityRole(authStore.role, 'user') : false;
 })

From 5f94bf890c62f43cb58030e70a8c87c9d0802677 Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Fri, 10 Apr 2026 11:25:48 +0200
Subject: [PATCH 16/17] Made it so it is the new password that you need to
 write twice to confirm

---
 app/src/components/ChangePasswordModal.vue | 24 +++++++++++-----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/app/src/components/ChangePasswordModal.vue b/app/src/components/ChangePasswordModal.vue
index 97de929b..1125447b 100644
--- a/app/src/components/ChangePasswordModal.vue
+++ b/app/src/components/ChangePasswordModal.vue
@@ -24,28 +24,28 @@
 
         <div class="form-control">
           <label class="label">
-            <span class="label-text">Bekräfta nuvarande lösenord</span>
+            <span class="label-text">Nytt lösenord</span>
           </label>
           <input
-            v-model="currentPasswordCheck"
+            v-model="passwordForm.newPassword"
             type="password"
             class="input input-bordered w-full"
-            :class="{ 'input-error': !passwordsMatch }"
           />
-          <p v-if="!passwordsMatch" class="mt-1 text-sm text-error">
-            Lösenorden stämmer inte överens.
-          </p>
         </div>
 
         <div class="form-control">
           <label class="label">
-            <span class="label-text">Nytt lösenord</span>
+            <span class="label-text">Bekräfta nytt lösenord</span>
           </label>
           <input
-            v-model="passwordForm.newPassword"
+            v-model="newPasswordCheck"
             type="password"
             class="input input-bordered w-full"
+            :class="{ 'input-error': !passwordsMatch }"
           />
+          <p v-if="!passwordsMatch" class="mt-1 text-sm text-error">
+            Lösenorden stämmer inte överens.
+          </p>
         </div>
 
         <div class="modal-action">
@@ -83,12 +83,12 @@ const emptyForm = () => ({
 });
 
 const passwordForm = ref(emptyForm());
-const currentPasswordCheck = ref('');
+const newPasswordCheck = ref('');
 
 const passwordsMatch = computed(
   () =>
-    currentPasswordCheck.value === '' ||
-    passwordForm.value.currentPassword === currentPasswordCheck.value,
+    newPasswordCheck.value === '' ||
+    passwordForm.value.currentPassword === newPasswordCheck.value,
 );
 
 watch(
@@ -96,7 +96,7 @@ watch(
   (open) => {
     if (open) {
       passwordForm.value = emptyForm();
-      currentPasswordCheck.value = '';
+      newPasswordCheck.value = '';
     }
   },
 );

From 3d1be3a9a15a35b57ea4e9c428d4fe88334b5e0d Mon Sep 17 00:00:00 2001
From: Darkdusk <johan.svensson.01@hotmail.com>
Date: Fri, 10 Apr 2026 11:34:52 +0200
Subject: [PATCH 17/17] Moved the newpassword confirmation in to the ref

---
 app/src/components/ChangePasswordModal.vue | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/app/src/components/ChangePasswordModal.vue b/app/src/components/ChangePasswordModal.vue
index 1125447b..12dae57d 100644
--- a/app/src/components/ChangePasswordModal.vue
+++ b/app/src/components/ChangePasswordModal.vue
@@ -38,7 +38,7 @@
             <span class="label-text">Bekräfta nytt lösenord</span>
           </label>
           <input
-            v-model="newPasswordCheck"
+            v-model="passwordForm.newPasswordConfirm"
             type="password"
             class="input input-bordered w-full"
             :class="{ 'input-error': !passwordsMatch }"
@@ -80,15 +80,14 @@ const emit = defineEmits<{
 const emptyForm = () => ({
   currentPassword: '',
   newPassword: '',
+  newPasswordConfirm: '',
 });
 
 const passwordForm = ref(emptyForm());
-const newPasswordCheck = ref('');
 
-const passwordsMatch = computed(
-  () =>
-    newPasswordCheck.value === '' ||
-    passwordForm.value.currentPassword === newPasswordCheck.value,
+const passwordsMatch = computed(() =>
+    passwordForm.value.newPasswordConfirm === '' ||
+    passwordForm.value.newPassword === passwordForm.value.newPasswordConfirm,
 );
 
 watch(
@@ -96,7 +95,7 @@ watch(
   (open) => {
     if (open) {
       passwordForm.value = emptyForm();
-      newPasswordCheck.value = '';
+      passwordForm.value.newPasswordConfirm = '';
     }
   },
 );