79 lines
3.1 KiB
TypeScript
79 lines
3.1 KiB
TypeScript
import { getDracinCategoryDetail } from '@/lib/dramabox';
|
|
import DracinCard from '@/components/DracinCard';
|
|
import { Button } from '@/components/ui/button';
|
|
import Link from 'next/link';
|
|
import { redirect } from 'next/navigation';
|
|
|
|
interface PageProps {
|
|
params: Promise<{ id: string }>;
|
|
searchParams: Promise<{ page?: string }>;
|
|
}
|
|
|
|
export default async function DracinCategoryDetailPage(props: PageProps) {
|
|
const params = await props.params;
|
|
const searchParams = await props.searchParams;
|
|
|
|
if (!params.id) redirect('/dracin/categories');
|
|
|
|
const page = Number(searchParams.page) || 1;
|
|
const { books, categoryName, totalPages } = await getDracinCategoryDetail(params.id, page, 20);
|
|
|
|
return (
|
|
<div className="pt-24 px-4 md:px-16 min-h-screen">
|
|
<div className="mb-8">
|
|
<h1 className="text-2xl font-bold text-white mb-2">{categoryName || `Category ${params.id}`}</h1>
|
|
<p className="text-gray-400">Browse dramas in this category.</p>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4">
|
|
{books.length > 0 ? (
|
|
books.map((item, idx) => (
|
|
<DracinCard key={`${item.id}-${idx}`} item={item} />
|
|
))
|
|
) : (
|
|
<div className="col-span-full text-center text-gray-500 py-20">
|
|
No dramas found in this category.
|
|
</div>
|
|
)}
|
|
</div>
|
|
|
|
{/* Pagination Controls */}
|
|
{totalPages > 1 && (
|
|
<div className="flex justify-center gap-4 mt-8 pb-8">
|
|
<Button
|
|
disabled={page <= 1}
|
|
variant="outline"
|
|
className="bg-zinc-800 text-white border-zinc-700 hover:bg-zinc-700 hover:text-white disabled:opacity-50"
|
|
asChild
|
|
>
|
|
{page > 1 ? (
|
|
<Link href={`/dracin/category/${params.id}?page=${page - 1}`}>
|
|
Previous
|
|
</Link>
|
|
) : (
|
|
<span>Previous</span>
|
|
)}
|
|
</Button>
|
|
<span className="flex items-center text-white px-4">
|
|
Page {page} of {totalPages}
|
|
</span>
|
|
<Button
|
|
disabled={page >= totalPages}
|
|
variant="outline"
|
|
className="bg-zinc-800 text-white border-zinc-700 hover:bg-zinc-700 hover:text-white disabled:opacity-50"
|
|
asChild
|
|
>
|
|
{page < totalPages ? (
|
|
<Link href={`/dracin/category/${params.id}?page=${page + 1}`}>
|
|
Next
|
|
</Link>
|
|
) : (
|
|
<span>Next</span>
|
|
)}
|
|
</Button>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|