diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte
index 83be0358..43ca6524 100644
--- a/web/src/routes/+layout.svelte
+++ b/web/src/routes/+layout.svelte
@@ -6,12 +6,14 @@
import { queryClient } from '$lib/query/client';
import { user } from '$lib/auth/store.svelte';
import Shell from '$lib/components/Shell.svelte';
+ import QueueDrawer from '$lib/components/QueueDrawer.svelte';
import {
registerAudioEl,
reportTimeUpdate,
reportDuration,
reportStateFromAudio,
- player
+ player,
+ closeQueueDrawer
} from '$lib/player/store.svelte';
import { useMediaSession } from '$lib/player/mediaSession.svelte';
import { useEventsDispatcher } from '$lib/player/events.svelte';
@@ -65,6 +67,16 @@
}
});
+ $effect(() => {
+ const handler = (e: KeyboardEvent) => {
+ if (e.key === 'Escape' && player.queueDrawerOpen) {
+ closeQueueDrawer();
+ }
+ };
+ document.addEventListener('keydown', handler);
+ return () => document.removeEventListener('keydown', handler);
+ });
+
useMediaSession();
useEventsDispatcher();
applyMetaThemeColor();
@@ -82,6 +94,8 @@
onerror={() => reportStateFromAudio('error', audioEl?.error?.message)}
>
+
+
{#if user.value !== null && page.url.pathname !== '/login'}
{@render children()}
diff --git a/web/src/routes/+layout.ts b/web/src/routes/+layout.ts
index ea7719a7..82e10c06 100644
--- a/web/src/routes/+layout.ts
+++ b/web/src/routes/+layout.ts
@@ -1,10 +1,13 @@
import type { LayoutLoad } from './$types';
-import { bootstrap } from '$lib/auth/store.svelte';
+import { bootstrap, user } from '$lib/auth/store.svelte';
+import { restoreQueue } from '$lib/player/store.svelte';
export const ssr = false; // adapter-static fallback; we're SPA-only
export const prerender = false;
export const load: LayoutLoad = async () => {
await bootstrap();
+ const userId = user.value?.id;
+ if (userId) restoreQueue(userId);
return {};
};