Fix login not redirecting

frontend/package.json

@@ -63,6 +63,7 @@
 		"highlight.js": "^11.11.1",
 		"i18next": "^25.6.0",
 		"i18next-browser-languagedetector": "^8.2.0",
+		"jose": "^6.1.0",
 		"js-cookie": "^3.0.5",
 		"jws": "^4.0.0",
 		"luxon": "^3.7.2",

frontend/pnpm-lock.yaml

@@ -151,6 +151,9 @@ importers:
             i18next-browser-languagedetector:
                 specifier: ^8.2.0
                 version: 8.2.0
+            jose:
+                specifier: ^6.1.0
+                version: 6.1.0
             js-cookie:
                 specifier: ^3.0.5
                 version: 3.0.5
@@ -3379,6 +3382,12 @@ packages:
             }
         hasBin: true
 
+    jose@6.1.0:
+        resolution:
+            {
+                integrity: sha512-TTQJyoEoKcC1lscpVDCSsVgYzUDg/0Bt3WE//WiTPK6uOCQC2KZS4MpugbMWt/zyjkopgZoXhZuCi00gLudfUA==
+            }
+
     js-cookie@3.0.5:
         resolution:
             {
@@ -5597,6 +5606,8 @@ snapshots:
             '@ckeditor/ckeditor5-utils': 47.1.0
             ckeditor5: 47.1.0
             es-toolkit: 1.39.5
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-font@47.1.0':
         dependencies:
@@ -5606,6 +5617,8 @@ snapshots:
             '@ckeditor/ckeditor5-ui': 47.1.0
             '@ckeditor/ckeditor5-utils': 47.1.0
             ckeditor5: 47.1.0
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-fullscreen@47.1.0':
         dependencies:
@@ -5616,6 +5629,8 @@ snapshots:
             '@ckeditor/ckeditor5-ui': 47.1.0
             '@ckeditor/ckeditor5-utils': 47.1.0
             ckeditor5: 47.1.0
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-heading@47.1.0':
         dependencies:
@@ -5636,6 +5651,8 @@ snapshots:
             '@ckeditor/ckeditor5-ui': 47.1.0
             '@ckeditor/ckeditor5-utils': 47.1.0
             ckeditor5: 47.1.0
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-horizontal-line@47.1.0':
         dependencies:
@@ -5645,6 +5662,8 @@ snapshots:
             '@ckeditor/ckeditor5-utils': 47.1.0
             '@ckeditor/ckeditor5-widget': 47.1.0
             ckeditor5: 47.1.0
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-html-embed@47.1.0':
         dependencies:
@@ -5654,6 +5673,8 @@ snapshots:
             '@ckeditor/ckeditor5-utils': 47.1.0
             '@ckeditor/ckeditor5-widget': 47.1.0
             ckeditor5: 47.1.0
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-html-support@47.1.0':
         dependencies:
@@ -5701,6 +5722,8 @@ snapshots:
             '@ckeditor/ckeditor5-ui': 47.1.0
             '@ckeditor/ckeditor5-utils': 47.1.0
             ckeditor5: 47.1.0
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-language@47.1.0':
         dependencies:
@@ -5708,6 +5731,8 @@ snapshots:
             '@ckeditor/ckeditor5-ui': 47.1.0
             '@ckeditor/ckeditor5-utils': 47.1.0
             ckeditor5: 47.1.0
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-link@47.1.0':
         dependencies:
@@ -5722,6 +5747,8 @@ snapshots:
             '@ckeditor/ckeditor5-widget': 47.1.0
             ckeditor5: 47.1.0
             es-toolkit: 1.39.5
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-list@47.1.0':
         dependencies:
@@ -5735,6 +5762,8 @@ snapshots:
             '@ckeditor/ckeditor5-ui': 47.1.0
             '@ckeditor/ckeditor5-utils': 47.1.0
             ckeditor5: 47.1.0
+        transitivePeerDependencies:
+            - supports-color
 
     '@ckeditor/ckeditor5-markdown-gfm@47.1.0':
         dependencies:
@@ -7663,6 +7692,8 @@ snapshots:
 
     jiti@2.6.1: {}
 
+    jose@6.1.0: {}
+
     js-cookie@3.0.5: {}
 
     js-yaml@4.1.0:

frontend/src/hooks.server.ts

@@ -3,7 +3,7 @@
 // SPDX-License-Identifier: MPL-2.0
 
 import type { Handle } from '@sveltejs/kit';
-import jws from 'jws';
+import * as jose from 'jose';
 
 /** @type {import('@sveltejs/kit').Handle} */
 export const handle: Handle = async ({ event, resolve }) => {
@@ -12,13 +12,13 @@ export const handle: Handle = async ({ event, resolve }) => {
 		event.locals.email = null;
 		return resolve(event);
 	}
-	const jwt = jws.decode(access_token.replace('Bearer ', ''));
+	const jwt = jose.decodeJwt(access_token.replace('Bearer ', ''));
 	if (!jwt) {
 		event.locals.email = null;
 		return resolve(event);
 	}
 	// if token expires, do a request to get a new one and set the response-cookies on the response
-	if (Date.now() >= jwt.payload.exp * 1000) {
+	if (Date.now() >= jwt.exp * 1000) {
 		const res = await fetch(`${process.env.API_URL}/api/v1/users/check`, {
 			method: 'GET',
 			headers: {
@@ -37,6 +37,6 @@ export const handle: Handle = async ({ event, resolve }) => {
 			return resp;
 		}
 	}
-	event.locals.email = jwt.payload.sub;
+	event.locals.email = jwt.sub;
 	return resolve(event);
 };

frontend/src/routes/account/login/+page.svelte

@@ -99,27 +99,27 @@ SPDX-License-Identifier: MPL-2.0
 		{:else if selected_method === null}
 			<!--			<p>SelectWindow</p>-->
 			<div transition:slide|global>
-				<SelectMethod bind:session_data bind:step bind:selected_method />
+				<SelectMethod {session_data} {step} bind:selected_method />
 			</div>
 		{:else if selected_method === 'PASSWORD'}
 			<!--			<p>PasswordWindow</p>-->
 			<div transition:slide|global>
-				<PasswordComponent bind:session_data bind:done bind:step bind:selected_method />
+				<PasswordComponent {session_data} bind:done bind:step bind:selected_method />
 			</div>
 		{:else if selected_method === 'PASSKEY'}
 			<!--			<p>WebauthnWindow</p>-->
 			<div transition:slide|global>
-				<WebauthnComponent bind:session_data bind:done bind:step bind:selected_method />
+				<WebauthnComponent {session_data} bind:done bind:step bind:selected_method />
 			</div>
 		{:else if selected_method === 'BACKUP'}
 			<!--			<p>BackupWindow</p>-->
 			<div transition:slide|global>
-				<BackupComponent bind:session_data bind:done bind:step bind:selected_method />
+				<BackupComponent {session_data} bind:done bind:step bind:selected_method />
 			</div>
 		{:else if selected_method === 'TOTP'}
 			<!--			<p>TotpWindow</p>-->
 			<div transition:slide|global>
-				<TotpComponent bind:session_data bind:done bind:step bind:selected_method />
+				<TotpComponent {session_data} bind:done bind:step bind:selected_method />
 			</div>
 		{/if}
 	</div>

frontend/src/routes/account/login/select_method.svelte

@@ -6,19 +6,14 @@ SPDX-License-Identifier: MPL-2.0
 <script lang="ts">
 	let { session_data = {}, step, selected_method = $bindable() } = $props();
 
-	let available_methods = $state();
+	const set_available_methods = (step_var: number): string => {
-
-	const set_available_methods = (step_var: number) => {
 		if (step_var === 1) {
-			available_methods = session_data.step_1;
+			return session_data.step_1;
 		} else if (step_var === 2) {
-			available_methods = session_data.step_2;
+			return session_data.step_2;
 		}
 	};
-
+	let available_methods = $derived(set_available_methods(step));
-	$effect.pre(() => {
-		set_available_methods(step);
-	});
 </script>
 
 <div class="px-6 py-4">