feat: loading skeleton on the manga detail page

The detail loader now streams its six-call bundle instead of blocking
navigation on it. The page component is a thin {#await} wrapper: it shows a
MangaDetailSkeleton (cover + meta + chapter rows) while the bundle loads,
renders the extracted DetailView once resolved, and shows an inline
not-found on a 404 (previously the framework error page). Extracting
DetailView also makes it remount per navigation, so its tag/bookmark/reaction
state re-seeds cleanly on manga-to-manga moves.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

frontend/src/routes/manga/[id]/+page.ts

@@ -4,30 +4,34 @@ import { listMyBookmarksOrEmpty } from '$lib/api/bookmarks';
 import { getMyReadProgressForManga } from '$lib/api/read_progress';
 import { getMyReactionForManga } from '$lib/api/reactions';
 import type { PageLoad } from './$types';
+import type { DetailData } from './types';
 
 export const ssr = false;
 
-export const load: PageLoad = async ({ params }) => {
-    const [manga, chapters, bookmarks, readProgress, reaction, similar] = await Promise.all([
+export const load: PageLoad = ({ params }) => {
+    // Streamed (the load doesn't await) so the page renders a
+    // MangaDetailSkeleton while the bundle loads instead of blocking
+    // navigation on all six calls. A getManga 404 / any hard failure rejects
+    // the bundle and is handled by the page's {:catch}.
+    const bundle: Promise<DetailData> = Promise.all([
         getManga(params.id),
         listChapters(params.id),
         listMyBookmarksOrEmpty(),
-        // Null when guest or never-read — page handles both cases.
+        // Null when guest or never-read — the page handles both cases.
         getMyReadProgressForManga(params.id),
-        // Null when guest or not reacted — seeds the like/dislike toggle.
         // Non-critical: any failure degrades to an unset toggle, never a
         // broken page.
         getMyReactionForManga(params.id).catch(() => null),
-        // Recommendations are non-critical: a failure here must not break
-        // the detail page, so fall back to an empty list.
+        // Recommendations are non-critical: fall back to an empty list.
         getSimilarMangas(params.id).catch(() => [] as MangaCard[])
-    ]);
-    return {
+    ]).then(([manga, chapters, bookmarks, readProgress, reaction, similar]) => ({
         manga,
         chapters: chapters.items,
         bookmarks: bookmarks.items,
         readProgress,
         reaction,
         similar
-    };
+    }));
+
+    return { bundle };
 };

frontend/src/routes/manga/[id]/types.ts

@@ -0,0 +1,19 @@
+import type { MangaCard, MangaDetail } from '$lib/api/mangas';
+import type { Chapter } from '$lib/api/chapters';
+import type { Bookmark } from '$lib/api/bookmarks';
+import type { ReadProgressForManga } from '$lib/api/read_progress';
+import type { Reaction } from '$lib/api/reactions';
+
+/**
+ * The manga detail bundle. Streamed from the loader (see +page.ts) and passed
+ * to DetailView once resolved, so the page can render a skeleton while it
+ * loads. Shape matches the loader's previous flat return.
+ */
+export type DetailData = {
+    manga: MangaDetail;
+    chapters: Chapter[];
+    bookmarks: Bookmark[];
+    readProgress: ReadProgressForManga | null;
+    reaction: Reaction | null;
+    similar: MangaCard[];
+};