import Link from "next/link";
import { redirect } from "next/navigation";
import { StatCard } from "@/components/StatCard";
import { DataTable } from "@/components/admin/DataTable";
import { AdminPageHeader, AdminStatusBadge } from "@/components/admin/AdminPresentation";
import { getAdminReportingData } from "@/lib/admin-reporting";
import { currentAdmin } from "@/lib/auth";
import { prisma } from "@/lib/prisma";
import { currency, priceFreshness } from "@/lib/utils";

export default async function AdminDashboardPage() {
  const admin = await currentAdmin();
  if (!admin) redirect("/admin/login");

  let servicePayments;
  let ira = 0;
  let sellBack = 0;
  let products;
  let reporting;
  try {
    [reporting, servicePayments, ira, sellBack, products] = await Promise.all([
      getAdminReportingData(),
      prisma.servicePayment.findMany(),
      prisma.iraTrustApplication.count({ where: { status: "NEW" } }),
      prisma.sellBackRequest.count({ where: { status: "NEW" } }),
      prisma.product.findMany()
    ]);
  } catch {
    return (
      <section>
        <AdminPageHeader title="Operations Overview" subtitle="Admin metrics are loading from the local database." />
        <div className="panel mt-5 p-5">
          <h2 className="font-heading text-xl font-black">Dashboard Preparing</h2>
          <p className="mt-2 text-sm text-[#666]">Admin dashboard data could not be loaded yet. Product, order, and service records will appear here when available.</p>
        </div>
      </section>
    );
  }
  const serviceRevenue = servicePayments.reduce((sum, payment) => sum + (payment.paymentStatus === "PAID" ? Number(payment.amount) : 0), 0);
  const stale = products.filter((product) => priceFreshness(product.priceLastUpdatedAt) !== "fresh").length;
  const lowStock = products.filter((product) => product.stockStatus === "LOW_STOCK" || product.stockQuantity <= 5).length;
  const { today, last7Days, last30Days, allTime } = reporting.periods;

  return (
    <section>
      <AdminPageHeader title="Operations Overview" subtitle="Snapshot of orders, revenue, product freshness, stock, and service activity." action={<Link href="/admin/products/new" className="btn btn-primary">New Product</Link>} />
      {stale ? <div className="panel mt-5 border-gold/50 p-4 font-bold text-gold">Price update required for {stale} product(s).</div> : null}
      <div className="mt-6 grid gap-4 md:grid-cols-2 xl:grid-cols-4">
        <StatCard label="Paid revenue today" value={currency(today.paidSales)} />
        <StatCard label="Paid revenue last 7 days" value={currency(last7Days.paidSales)} />
        <StatCard label="Paid revenue last 30 days" value={currency(last30Days.paidSales)} />
        <StatCard label="Pending order value" value={currency(allTime.pendingSales)} tone="silver" />
        <StatCard label="Supplier share paid" value={currency(allTime.supplierSharePaid)} tone="silver" />
        <StatCard label="Platform markup paid" value={currency(allTime.markupSharePaid)} />
        <StatCard label="Pending orders" value={String(allTime.pendingOrderCount)} tone="silver" />
        <StatCard label="Paid order average" value={currency(allTime.averagePaidOrderValue)} />
        <StatCard label="Products needing price update" value={String(stale)} tone="silver" />
        <StatCard label="Low stock products" value={String(lowStock)} />
        <StatCard label="Paid service revenue" value={currency(serviceRevenue)} />
        <StatCard label="New form requests" value={String(ira + sellBack)} tone="silver" />
      </div>
      <div className="mt-8 grid gap-6 xl:grid-cols-[1.8fr_1fr]">
        <div>
          <h2 className="font-heading text-xl font-black">Recent Orders</h2>
          <p className="mt-1 text-sm text-[#666]">Latest submitted orders with payment and fulfillment status.</p>
          <div className="mt-3">
            <DataTable
              headers={["Order", "Customer", "Total", "Payment", "Fulfillment", "Created"]}
              rows={reporting.recentOrders.map((order) => [
                <Link key="order" href={`/admin/orders/${order.id}`} className="font-bold hover:text-gold">{order.orderNumber}</Link>,
                <span key="customer" className="block max-w-[180px] truncate" title={order.customerName}>{order.customerName}</span>,
                currency(order.grandTotal),
                <AdminStatusBadge key="payment" value={order.paymentStatus} />,
                <AdminStatusBadge key="fulfillment" value={order.fulfillmentStatus} />,
                order.createdAt.toLocaleDateString()
              ])}
            />
          </div>
        </div>
        <div className="grid gap-4 self-start">
          <div className="panel p-5">
            <h2 className="font-heading text-xl font-black">Payment Snapshot</h2>
            <div className="mt-4 grid gap-3">
              {reporting.paymentStatusCounts.map((status) => (
                <div key={status.label} className="flex items-center justify-between gap-3">
                  <AdminStatusBadge value={status.label} />
                  <div className="text-right text-sm">
                    <div className="font-black">{status.count}</div>
                    <div className="text-[#666]">{currency(status.value)}</div>
                  </div>
                </div>
              ))}
            </div>
          </div>
          <div className="panel p-5">
            <h2 className="font-heading text-xl font-black">Fulfillment Snapshot</h2>
            <div className="mt-4 grid gap-3">
              {reporting.fulfillmentStatusCounts.map((status) => (
                <div key={status.label} className="flex items-center justify-between gap-3">
                  <AdminStatusBadge value={status.label} />
                  <div className="text-right text-sm">
                    <div className="font-black">{status.count}</div>
                    <div className="text-[#666]">{currency(status.value)}</div>
                  </div>
                </div>
              ))}
            </div>
          </div>
        </div>
      </div>
    </section>
  );
}
