yiekheng 1c74348fae Sync URL and prev/next nav with the chapter being viewed
Once continuous scroll crosses a chapter boundary, the URL was stuck at
the originally-opened chapter so browser back / reload would jump the
user back there. Double-tap left/right also walked off the wrong chapter
since prevChapter/nextChapter were frozen at mount time.

- replaceState the URL as currentChapterNum changes (no server refetch).
- Derive prevChapter/nextChapter dynamically via useMemo on
  currentChapterNum, dropping the now-redundant server-computed props.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-12 14:40:13 +08:00

70 lines
1.9 KiB
TypeScript

import { notFound } from "next/navigation";
import { prisma } from "@/lib/db";
import { PageReader } from "@/components/PageReader";
import type { Metadata } from "next";
type Props = {
params: Promise<{ slug: string; chapter: string }>;
};
export async function generateMetadata({ params }: Props): Promise<Metadata> {
const { slug, chapter } = await params;
const chapterNum = parseInt(chapter, 10);
if (isNaN(chapterNum)) return { title: "Not Found" };
const manga = await prisma.manga.findUnique({ where: { slug } });
if (!manga) return { title: "Not Found" };
return {
title: `${manga.title} — Ch. ${chapterNum}`,
description: `Read chapter ${chapterNum} of ${manga.title}`,
};
}
export default async function ChapterReaderPage({ params }: Props) {
const { slug, chapter } = await params;
const chapterNum = parseInt(chapter, 10);
if (isNaN(chapterNum)) notFound();
const [manga, initialChapterMeta] = await Promise.all([
prisma.manga.findUnique({
where: { slug },
include: {
chapters: {
orderBy: { number: "asc" },
include: {
_count: { select: { pages: true } },
},
},
},
}),
prisma.page.findMany({
where: { chapter: { number: chapterNum, manga: { slug } } },
orderBy: { number: "asc" },
select: { number: true, width: true, height: true },
}),
]);
if (!manga) notFound();
const currentChapter = manga.chapters.find((c) => c.number === chapterNum);
if (!currentChapter) notFound();
const allChapters = manga.chapters.map((c) => ({
id: c.id,
number: c.number,
title: c.title,
totalPages: c._count.pages,
}));
return (
<PageReader
mangaSlug={manga.slug}
mangaTitle={manga.title}
startChapterNumber={currentChapter.number}
chapters={allChapters}
initialChapterMeta={initialChapterMeta}
/>
);
}