import Link from "next/link";
import { deleteStudent } from "../phase6-actions";
import { prisma } from "@/lib/db/prisma";
import { importStudents } from "./import-actions";

export const dynamic = "force-dynamic";
const perPage = 15;

export default async function StudentPage({ searchParams }: { searchParams: Promise<{ q?: string; classId?: string; status?: string; page?: string; imported?: string; failed?: string; errors?: 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 status = ["ACTIVE", "GRADUATED", "INACTIVE"].includes(query.status ?? "") ? query.status as "ACTIVE" | "GRADUATED" | "INACTIVE" : undefined;
  const where = { ...(q ? { OR: [{ name: { contains: q } }, { nis: { contains: q } }, { nisn: { contains: q } }, { email: { contains: q } }] } : {}), ...(query.classId ? { classId: query.classId } : {}), ...(status ? { status } : {}) };
  const [rows, total, classes] = await Promise.all([
    prisma.student.findMany({ where, include: { class: true }, orderBy: { name: "asc" }, skip: (page - 1) * perPage, take: perPage }),
    prisma.student.count({ where }),
    prisma.class.findMany({ orderBy: { name: "asc" }, select: { id: true, name: true } }),
  ]);
  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.classId) params.set("classId", query.classId); if (status) params.set("status", status); params.set("page", String(target)); return `/dashboard/siswa?${params}`; };
  return <div>
    <div className="flex flex-wrap items-center justify-between gap-4"><div><h1 className="text-3xl font-black">Siswa</h1><p className="mt-1 text-sm text-slate-500">{total} siswa ditemukan</p></div><Link href="/dashboard/siswa/baru" className="rounded-xl bg-emerald-500 px-4 py-2 font-bold text-white">Tambah siswa</Link></div>
    {(query.imported || query.failed) && <div role="status" className="mt-6 rounded-2xl border border-emerald-200 bg-emerald-50 p-4 text-sm text-emerald-900 dark:border-emerald-900 dark:bg-emerald-950/30 dark:text-emerald-200"><p><b>{Number(query.imported) || 0} siswa berhasil diimpor.</b> {Number(query.failed) || 0} baris gagal atau dilewati.</p>{query.errors && <p className="mt-2 text-xs leading-5 opacity-80">{query.errors}</p>}</div>}
    <section className="mt-6 rounded-2xl border bg-white p-5 dark:bg-slate-900"><div className="flex flex-wrap items-start justify-between gap-4"><div><h2 className="font-bold">Impor siswa dari Excel</h2><p className="mt-1 max-w-2xl text-sm text-slate-500">Unduh format terlebih dahulu, isi maksimal 500 siswa, lalu unggah file .xlsx. Nama kelas harus sama dengan kelas yang tersedia.</p></div><Link href="/api/students/template" className="rounded-xl border border-emerald-500 px-4 py-2 text-sm font-bold text-emerald-600 transition hover:bg-emerald-50 dark:hover:bg-emerald-950/30">Unduh format Excel</Link></div><form action={importStudents} className="mt-5 flex flex-wrap items-center gap-3"><input name="file" type="file" required accept=".xlsx,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" className="min-w-0 flex-1 rounded-xl border p-2 text-sm file:mr-3 file:rounded-lg file:border-0 file:bg-slate-100 file:px-3 file:py-2 file:font-semibold dark:file:bg-slate-800"/><button className="rounded-xl bg-slate-950 px-5 py-3 text-sm font-bold text-white dark:bg-white dark:text-slate-950">Impor Excel</button></form><p className="mt-3 text-xs text-slate-400">Kata sandi pada template bersifat opsional. Jika diisi minimal 12 karakter, akun login siswa akan dibuat otomatis.</p></section>
    <form className="mt-6 grid gap-3 rounded-2xl border bg-white p-4 sm:grid-cols-4 dark:bg-slate-900"><input name="q" defaultValue={q} placeholder="Cari nama, NIS, NISN, email" className="h-11 rounded-xl border px-3 sm:col-span-2 dark:bg-slate-950"/><select name="classId" defaultValue={query.classId ?? ""} className="h-11 rounded-xl border px-3 dark:bg-slate-950"><option value="">Semua kelas</option>{classes.map((item) => <option key={item.id} value={item.id}>{item.name}</option>)}</select><select name="status" defaultValue={status ?? ""} className="h-11 rounded-xl border px-3 dark:bg-slate-950"><option value="">Semua status</option><option value="ACTIVE">Aktif</option><option value="GRADUATED">Lulus</option><option value="INACTIVE">Tidak aktif</option></select><button className="w-fit rounded-xl bg-slate-950 px-5 py-2 font-bold text-white dark:bg-white dark:text-slate-950">Terapkan filter</button></form>
    <div className="mt-6 overflow-hidden rounded-2xl border bg-white dark:bg-slate-900">{rows.map((item) => <div key={item.id} className="flex flex-wrap items-center gap-4 border-b p-4"><div><b>{item.name}</b><p className="text-xs text-slate-500">{item.nis} · {item.class.name} · {item.status}</p></div><div className="ml-auto flex gap-3"><Link href={`/dashboard/siswa/${item.id}/edit`} className="text-sm font-bold text-emerald-600">Edit</Link><form action={deleteStudent}><input type="hidden" name="id" value={item.id}/><button className="text-sm font-bold text-rose-500">Hapus</button></form></div></div>)}{!rows.length && <p className="p-8 text-center text-slate-500">Belum ada siswa yang cocok.</p>}</div>
    <nav aria-label="Paginasi siswa" className="mt-8 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>
  </div>;
}