/** بررسی و تأیید نظرات کاربران */
import Link from "next/link";
import { z } from "zod";
import { AdminHeader, Card, Empty, Pill } from "@/components/admin/ui";
import { SubmitButton } from "@/components/admin/SubmitButton";
import { Stars } from "@/components/ui/Stars";
import { db } from "@/lib/db";
import { faDigits, faNumber, formatJalali } from "@/lib/format";
import { moderateReviewAction } from "@/server/admin/moderation";
import { requireStaffPage } from "@/server/admin/guard";

export const metadata = { title: "نظرات" };
export const dynamic = "force-dynamic";

const tabs = { PENDING: "در انتظار تأیید", APPROVED: "تأییدشده", REJECTED: "ردشده" } as const;

export default async function AdminReviews({ searchParams }: { searchParams: Promise<{ status?: string }> }) {
  await requireStaffPage("/admin/reviews", "reviews");
  const status = z.enum(["PENDING", "APPROVED", "REJECTED"]).catch("PENDING").parse((await searchParams).status);
  const [reviews, counts] = await Promise.all([
    db.review.findMany({ where: { status }, orderBy: { createdAt: "desc" }, take: 50, include: { product: { select: { id: true, name: true } }, user: { select: { phone: true } } } }),
    db.review.groupBy({ by: ["status"], _count: { _all: true } }),
  ]);
  const action = (id: string, decision: string, label: string, cls = "chip") => (
    <form action={moderateReviewAction}>
      <input type="hidden" name="id" value={id} />
      <input type="hidden" name="decision" value={decision} />
      <SubmitButton className={cls} pendingText="…" confirm={decision === "DELETE" ? "این نظر برای همیشه حذف شود؟" : undefined}>{label}</SubmitButton>
    </form>
  );

  return (
    <>
      <AdminHeader title="نظرات" description="نظرات پس از تأیید در صفحه محصول نمایش داده می‌شوند و در امتیاز محصول اثر دارند" />
      <div className="mb-4 flex gap-2">
        {Object.entries(tabs).map(([s, label]) => (
          <Link key={s} href={`/admin/reviews?status=${s}`} className={`chip ${status === s ? "chip-active" : "bg-paper"}`}>
            {label} <span className="opacity-60">{faNumber(counts.find((c) => c.status === s)?._count._all ?? 0)}</span>
          </Link>
        ))}
      </div>
      <div className="space-y-3">
        {reviews.length === 0 && <Card><Empty>نظری در این بخش نیست</Empty></Card>}
        {reviews.map((r) => (
          <Card key={r.id}>
            <div className="flex flex-wrap items-center justify-between gap-2">
              <Link href={`/admin/products/${r.product.id}`} className="text-xs font-bold hover:underline">{r.product.name}</Link>
              <span className="text-xs text-muted">{formatJalali(r.createdAt)}</span>
            </div>
            <div className="mt-2 flex items-center gap-2"><Stars rating={r.rating} size={13} /> <span className="text-sm font-bold">{r.title}</span></div>
            <p className="mt-1 text-sm leading-7 text-ink-soft">{r.body}</p>
            <p className="mt-2 flex flex-wrap gap-2 text-[11px] text-muted">
              {r.authorName}{r.user && <bdi>{faDigits(r.user.phone)}</bdi>}{r.verifiedPurchase && <Pill>خریدار</Pill>}
            </p>
            <div className="mt-3 flex flex-wrap gap-2">
              {status !== "APPROVED" && action(r.id, "APPROVED", "تأیید", "chip chip-active")}
              {status !== "REJECTED" && action(r.id, "REJECTED", "رد")}
              {action(r.id, "DELETE", "حذف", "chip text-muted")}
            </div>
          </Card>
        ))}
      </div>
    </>
  );
}