diff --git a/src/frontend/src/routes/+layout.svelte b/src/frontend/src/routes/+layout.svelte index 476b7286..9579d091 100644 --- a/src/frontend/src/routes/+layout.svelte +++ b/src/frontend/src/routes/+layout.svelte @@ -13,38 +13,21 @@ import type { LayoutData } from './$types'; import { type Component, type Snippet } from 'svelte'; import { MetaTags, deepMerge } from 'svelte-meta-tags'; - import { user_store } from '$lib/store/user.svelte'; - import { logout } from '$lib/remote/auth.remote'; - import { TOKEN_VALIDATE_URL } from '#consts/backend'; - import { browser } from '$app/environment'; - import { dev } from '$app/environment'; let { children, data }: { children: Snippet; data: LayoutData } = $props(); - let SvelteQueryDevtools = $state | null>(null); - if (dev) { + async function loadDevtools() { + if (!import.meta.env.DEV) return null; + const mod = await import('@tanstack/svelte-query-devtools'); - SvelteQueryDevtools = mod.SvelteQueryDevtools; + return mod.SvelteQueryDevtools; } - if (browser) { - $effect.pre(() => { - if (!data.token) return; + let SvelteQueryDevtools = $state | null>(null); - void fetch(TOKEN_VALIDATE_URL, { - credentials: 'include' - }) - .then((res) => { - if (res.ok) { - user_store.authenticate(); - } else { - logout(); - } - }) - .catch((_) => { - console.log(`Error while fetching token data`); - user_store.unauthenticate(); - }); + if (import.meta.env.DEV) { + loadDevtools().then((c) => { + SvelteQueryDevtools = c; }); } diff --git a/src/frontend/src/routes/+layout.ts b/src/frontend/src/routes/+layout.ts index 2cf3e8bb..088a042e 100644 --- a/src/frontend/src/routes/+layout.ts +++ b/src/frontend/src/routes/+layout.ts @@ -1,8 +1,12 @@ +import { TOKEN_VALIDATE_URL } from '#consts/backend'; import { browser } from '$app/environment'; import image from '$lib/assets/opengraph.png?url'; +import { logout } from '$lib/remote/auth.remote'; +import { user_store } from '$lib/store/user.svelte'; import { QueryClient } from '@tanstack/svelte-query'; import { defineBaseMetaTags } from 'svelte-meta-tags'; import type { LayoutLoad } from './$types'; + export const trailingSlash = 'always'; export const load: LayoutLoad = async ({ data, url }) => { @@ -38,5 +42,22 @@ export const load: LayoutLoad = async ({ data, url }) => { } }); + if (data.token) { + void fetch(TOKEN_VALIDATE_URL, { + credentials: 'include' + }) + .then((res) => { + if (res.ok) { + user_store.authenticate(); + } else { + logout(); + } + }) + .catch((_) => { + console.log(`Error while fetching token data`); + user_store.unauthenticate(); + }); + } + return { queryClient, ...baseTags, ...data }; };