import { Download as DownloadIcon, FileText } from "lucide-react";
import Link from "next/link";
import { prisma } from "@/lib/db/prisma";

export const dynamic = "force-dynamic";
const perPage = 10;
const size = (value: bigint) => { const bytes = Number(value); return bytes >= 1024 * 1024 ? `${(bytes / 1024 / 1024).toFixed(1)} MB` : `${Math.ceil(bytes / 1024)} KB`; };

export default async function DownloadPage({ searchParams }: { searchParams: Promise<{ q?: string; category?: string; className?: string; page?: string }> }) {
  const query = await searchParams; const q = query.q?.trim().slice(0, 100) ?? ""; const page = Math.max(1, Number.parseInt(query.page ?? "1", 10) || 1);
  const where = { ...(q ? { OR: [{ name: { contains: q } }, { description: { contains: q } }] } : {}), ...(query.category ? { category: query.category } : {}), ...(query.className ? { className: query.className } : {}) };
  const [rows, total, categories, classes] = await Promise.all([prisma.download.findMany({ where, orderBy: { createdAt: "desc" }, skip: (page - 1) * perPage, take: perPage }), prisma.download.count({ where }), prisma.download.findMany({ distinct: ["category"], select: { category: true }, orderBy: { category: "asc" } }), prisma.download.findMany({ where: { className: { not: null } }, distinct: ["className"], select: { className: true }, orderBy: { className: "asc" } })]);
  const pages = Math.max(1, Math.ceil(total / perPage)); const pageHref = (target: number) => { const params = new URLSearchParams(); if (q) params.set("q", q); if (query.category) params.set("category", query.category); if (query.className) params.set("className", query.className); params.set("page", String(target)); return `/download?${params}`; };
  return <main className="mx-auto min-h-[70vh] max-w-5xl px-5 py-20"><p className="text-xs font-bold uppercase tracking-widest text-emerald-600">Sumber belajar</p><h1 className="mt-3 text-5xl font-black">Download</h1><form className="mt-8 grid gap-3 sm:grid-cols-4"><input name="q" defaultValue={q} placeholder="Cari file..." className="h-11 rounded-xl border bg-white px-4 sm:col-span-2 dark:bg-slate-900"/><select name="category" defaultValue={query.category ?? ""} className="h-11 rounded-xl border bg-white px-3 dark:bg-slate-900"><option value="">Semua kategori</option>{categories.map((item) => <option key={item.category}>{item.category}</option>)}</select><select name="className" defaultValue={query.className ?? ""} className="h-11 rounded-xl border bg-white px-3 dark:bg-slate-900"><option value="">Semua kelas</option>{classes.map((item) => item.className && <option key={item.className}>{item.className}</option>)}</select><button className="rounded-xl bg-emerald-500 px-5 py-2 font-bold text-white">Cari dan filter</button></form><p className="mt-6 text-sm text-slate-500">{total} file ditemukan</p><div className="mt-6 space-y-4">{rows.map((item) => <article key={item.id} className="flex flex-wrap items-center gap-5 rounded-2xl border bg-white p-5 dark:bg-slate-900"><FileText className="size-7 text-emerald-500"/><div><h2 className="font-bold">{item.name}</h2><p className="text-xs text-slate-500">{item.category}{item.className ? ` · ${item.className}` : ""} · {size(item.sizeBytes)} · {item.downloadCount} unduhan</p>{item.description && <p className="mt-2 text-sm text-slate-500">{item.description}</p>}</div><a href={`/api/downloads/${item.id}`} className="ml-auto inline-flex items-center gap-2 rounded-xl bg-emerald-500 px-4 py-2 font-bold text-white"><DownloadIcon className="size-4"/>Unduh</a></article>)}{!rows.length && <p className="border-y border-dashed py-12 text-center text-slate-500">Belum ada file yang cocok.</p>}</div><nav aria-label="Paginasi" className="mt-10 flex items-center justify-center gap-4">{page > 1 && <Link href={pageHref(page - 1)} className="rounded-xl border px-4 py-2 font-semibold">Sebelumnya</Link>}<span className="text-sm text-slate-500">Halaman {Math.min(page, pages)} dari {pages}</span>{page < pages && <Link href={pageHref(page + 1)} className="rounded-xl border px-4 py-2 font-semibold">Berikutnya</Link>}</nav></main>;
}