From bdcef60cab6a61e1717661e918c42e3650d23fee Mon Sep 17 00:00:00 2001
From: Elias Schneider <login@eliasschneider.com>
Date: Wed, 4 Jun 2025 08:52:34 +0200
Subject: [PATCH] fix: don't load app config and user on every route change

---
 frontend/src/{hooks.ts => hooks.client.ts} |  4 +--
 frontend/src/lib/utils/redirection-util.ts | 25 +++++++++++++++++
 frontend/src/routes/+layout.svelte         |  8 ++++++
 frontend/src/routes/+layout.ts             | 31 +---------------------
 4 files changed, 36 insertions(+), 32 deletions(-)
 rename frontend/src/{hooks.ts => hooks.client.ts} (75%)
 create mode 100644 frontend/src/lib/utils/redirection-util.ts

diff --git a/frontend/src/hooks.ts b/frontend/src/hooks.client.ts
similarity index 75%
rename from frontend/src/hooks.ts
rename to frontend/src/hooks.client.ts
index f71323e7..2f9fb085 100644
--- a/frontend/src/hooks.ts
+++ b/frontend/src/hooks.client.ts
@@ -1,7 +1,7 @@
-import type { HandleServerError } from '@sveltejs/kit';
+import type { HandleClientError } from '@sveltejs/kit';
 import { AxiosError } from 'axios';
 
-export const handleError: HandleServerError = async ({ error, message, status }) => {
+export const handleError: HandleClientError = async ({ error, message, status }) => {
 	if (error instanceof AxiosError) {
 		message = error.response?.data.error || message;
 		status = error.response?.status || status;
diff --git a/frontend/src/lib/utils/redirection-util.ts b/frontend/src/lib/utils/redirection-util.ts
new file mode 100644
index 00000000..a927cac4
--- /dev/null
+++ b/frontend/src/lib/utils/redirection-util.ts
@@ -0,0 +1,25 @@
+import type { User } from '$lib/types/user.type';
+
+// Returns the path to redirect to based on the current path and user authentication status
+// If no redirect is needed, it returns null
+export function getAuthRedirectPath(path: string, user: User | null) {
+	const isSignedIn = !!user;
+	const isAdmin = user?.isAdmin;
+
+	const isUnauthenticatedOnlyPath =
+		path == '/login' || path.startsWith('/login/') || path == '/lc' || path.startsWith('/lc/');
+	const isPublicPath = ['/authorize', '/device', '/health', '/healthz'].includes(path);
+	const isAdminPath = path == '/settings/admin' || path.startsWith('/settings/admin/');
+
+	if (!isUnauthenticatedOnlyPath && !isPublicPath && !isSignedIn) {
+		return '/login';
+	}
+
+	if (isUnauthenticatedOnlyPath && isSignedIn) {
+		return '/settings';
+	}
+
+	if (isAdminPath && !isAdmin) {
+		return '/settings';
+	}
+}
diff --git a/frontend/src/routes/+layout.svelte b/frontend/src/routes/+layout.svelte
index 25999ab3..5b9dffbe 100644
--- a/frontend/src/routes/+layout.svelte
+++ b/frontend/src/routes/+layout.svelte
@@ -1,4 +1,6 @@
 <script lang="ts">
+	import { goto } from '$app/navigation';
+	import { page } from '$app/state';
 	import ConfirmDialog from '$lib/components/confirm-dialog/confirm-dialog.svelte';
 	import Error from '$lib/components/error.svelte';
 	import Header from '$lib/components/header/header.svelte';
@@ -6,6 +8,7 @@
 	import { m } from '$lib/paraglide/messages';
 	import appConfigStore from '$lib/stores/application-configuration-store';
 	import userStore from '$lib/stores/user-store';
+	import { getAuthRedirectPath } from '$lib/utils/redirection-util';
 	import { ModeWatcher } from 'mode-watcher';
 	import type { Snippet } from 'svelte';
 	import '../app.css';
@@ -21,6 +24,11 @@
 
 	const { user, appConfig } = data;
 
+	const redirectPath = getAuthRedirectPath(page.url.pathname, user);
+	if (redirectPath) {
+		goto(redirectPath);
+	}
+
 	if (user) {
 		userStore.setUser(user);
 	}
diff --git a/frontend/src/routes/+layout.ts b/frontend/src/routes/+layout.ts
index 686dde83..1fb83573 100644
--- a/frontend/src/routes/+layout.ts
+++ b/frontend/src/routes/+layout.ts
@@ -1,12 +1,10 @@
-import { goto } from '$app/navigation';
 import AppConfigService from '$lib/services/app-config-service';
 import UserService from '$lib/services/user-service';
-import type { User } from '$lib/types/user.type';
 import type { LayoutLoad } from './$types';
 
 export const ssr = false;
 
-export const load: LayoutLoad = async ({ url }) => {
+export const load: LayoutLoad = async () => {
 	const userService = new UserService();
 	const appConfigService = new AppConfigService();
 
@@ -21,35 +19,8 @@ export const load: LayoutLoad = async ({ url }) => {
 
 	const [user, appConfig] = await Promise.all([userPromise, appConfigPromise]);
 
-	const redirectPath = await getRedirectPath(url.pathname, user);
-	if (redirectPath) {
-		goto(redirectPath);
-	}
-
 	return {
 		user,
 		appConfig
 	};
 };
-
-const getRedirectPath = async (path: string, user: User | null) => {
-	const isSignedIn = !!user;
-	const isAdmin = user?.isAdmin;
-
-	const isUnauthenticatedOnlyPath =
-		path == '/login' || path.startsWith('/login/') || path == '/lc' || path.startsWith('/lc/');
-	const isPublicPath = ['/authorize', '/device', '/health', '/healthz'].includes(path);
-	const isAdminPath = path == '/settings/admin' || path.startsWith('/settings/admin/');
-
-	if (!isUnauthenticatedOnlyPath && !isPublicPath && !isSignedIn) {
-		return '/login';
-	}
-
-	if (isUnauthenticatedOnlyPath && isSignedIn) {
-		return '/settings';
-	}
-
-	if (isAdminPath && !isAdmin) {
-		return '/settings';
-	}
-};