98 lines
2.8 KiB
TypeScript
98 lines
2.8 KiB
TypeScript
import Link from "next/link"
|
|
import { ChevronLeft } from "lucide-react"
|
|
import { prisma } from "@/lib/prisma"
|
|
import { NovelCard } from "@/components/novel-card"
|
|
import { notFound } from "next/navigation"
|
|
|
|
export const dynamic = "force-dynamic"
|
|
|
|
function collapseSeriesRows<T extends { id: string; seriesId?: string | null }>(rows: T[]): T[] {
|
|
const pickedSeries = new Set<string>()
|
|
const output: T[] = []
|
|
|
|
for (const row of rows) {
|
|
if (!row.seriesId) {
|
|
output.push(row)
|
|
continue
|
|
}
|
|
|
|
if (pickedSeries.has(row.seriesId)) continue
|
|
pickedSeries.add(row.seriesId)
|
|
output.push(row)
|
|
}
|
|
|
|
return output
|
|
}
|
|
|
|
export default async function GenreDetailPage({ params }: { params: Promise<{ slug: string }> }) {
|
|
const { slug } = await params
|
|
|
|
const genre = await prisma.genre.findUnique({
|
|
where: { slug }
|
|
})
|
|
|
|
if (!genre) {
|
|
notFound()
|
|
}
|
|
|
|
const allNovelsRaw = await prisma.novel.findMany({
|
|
where: {
|
|
genres: {
|
|
some: {
|
|
genreId: genre.id
|
|
}
|
|
}
|
|
},
|
|
select: {
|
|
id: true,
|
|
slug: true,
|
|
title: true,
|
|
authorName: true,
|
|
coverColor: true,
|
|
coverUrl: true,
|
|
rating: true,
|
|
views: true,
|
|
totalChapters: true,
|
|
status: true,
|
|
seriesId: true,
|
|
},
|
|
orderBy: {
|
|
updatedAt: "desc"
|
|
},
|
|
take: 80
|
|
})
|
|
|
|
const allNovels = collapseSeriesRows(allNovelsRaw).slice(0, 20)
|
|
|
|
// Basic layout without sort for purely server side representation without search params. Optional searchParams can be added later if needed.
|
|
return (
|
|
<div className="mx-auto max-w-6xl px-4 py-6">
|
|
<div className="mb-6">
|
|
<Link href="/the-loai" className="mb-2 inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground transition-colors">
|
|
<ChevronLeft className="h-4 w-4" /> Thể Loại
|
|
</Link>
|
|
<h1 className="text-2xl font-bold text-foreground">{genre.name}</h1>
|
|
<p className="mt-1 text-sm text-muted-foreground">{genre.description}</p>
|
|
</div>
|
|
|
|
<div className="mb-4 flex items-center justify-between">
|
|
<p className="text-sm text-muted-foreground">{allNovels.length} truyện</p>
|
|
<div className="w-40" /> {/* Spacer for symmetry if we add sort later */}
|
|
</div>
|
|
|
|
{allNovels.length === 0 ? (
|
|
<div className="flex flex-col items-center justify-center py-20 text-muted-foreground">
|
|
<p className="text-lg font-medium">Chưa có truyện nào</p>
|
|
<p className="text-sm">Thể loại này chưa có truyện, hãy quay lại sau.</p>
|
|
</div>
|
|
) : (
|
|
<div className="grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4">
|
|
{allNovels.map((novel) => (
|
|
<NovelCard key={novel.id} novel={novel} />
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|