import { redirect } from "next/navigation";
import { inArray } from "drizzle-orm";
import { db } from "@db/client";
import { users } from "@db/schema";
import { getCurrentRole } from "@/lib/auth";
import { formatPrice } from "@/lib/format";
import { format } from "date-fns";
import { getOpenFinancingRequests, getFinancingHistory } from "@db/queries/financing";
import { HandCoins, Users as UsersIcon, Coins } from "lucide-react";
import type { FinancingStatus } from "@/lib/types";
import FinancingActions from "./financing-actions";
import { PageHeader, StatCard, TableShell, StatusPill, EmptyState, type Tone } from "@/components/ui";

export const metadata = { title: "Financing · Admin" };

const STATUS_TONE: Record<FinancingStatus, Tone> = {
  pending: "warn",
  approved: "info",
  disbursed: "ok",
  repaid: "ok",
  rejected: "danger",
};

export default async function AdminFinancingPage() {
  const { isAdmin } = await getCurrentRole();
  if (!isAdmin) redirect("/dashboard");

  const [open, history] = await Promise.all([getOpenFinancingRequests(), getFinancingHistory(25)]);

  const orgIds = [...new Set([...open, ...history].map((r) => r.organizer_id))];
  const userRows = orgIds.length
    ? await db.select({ id: users.id, name: users.name, email: users.email }).from(users).where(inArray(users.id, orgIds))
    : [];
  const nameByOrg = new Map(userRows.map((u) => [u.id, u.name?.trim() || u.email]));

  const pending = open.filter((r) => r.status === "pending");
  const totalOutstanding = open
    .filter((r) => r.status === "disbursed")
    .reduce((sum, r) => sum + r.outstanding_cents, 0);
  const currency = open[0]?.currency ?? "kes";

  return (
    <div className="space-y-8">
      <PageHeader
        icon={HandCoins}
        title="Financing"
        description="Approve, disburse, and track cash advances against organizers' future ticket sales."
      />

      <section className="grid grid-cols-2 sm:grid-cols-3 gap-3">
        <StatCard icon={UsersIcon} label="Active advances" value={open.length.toString()} />
        <StatCard
          icon={Coins}
          label="Total outstanding"
          value={formatPrice(totalOutstanding, currency)}
          accent="gold"
        />
        <StatCard icon={HandCoins} label="Pending requests" value={pending.length.toString()} />
      </section>

      <section className="space-y-3">
        <h2 className="text-lg font-medium text-be-text">Pending requests</h2>
        {pending.length === 0 ? (
          <EmptyState icon={HandCoins} title="No pending requests" body="Financing requests from organizers land here." />
        ) : (
          <TableShell>
            <thead>
              <tr>
                <th>Requested</th>
                <th>Organizer</th>
                <th>Note</th>
                <th className="text-right">Amount</th>
                <th className="text-right">Action</th>
              </tr>
            </thead>
            <tbody>
              {pending.map((r) => (
                <tr key={r.id}>
                  <td className="whitespace-nowrap text-be-muted">
                    {format(new Date(r.created_at), "PP")}
                  </td>
                  <td className="font-medium text-be-text">
                    {nameByOrg.get(r.organizer_id) || <span className="text-be-muted opacity-70">Unnamed</span>}
                  </td>
                  <td className="text-be-muted">{r.note || "—"}</td>
                  <td className="text-right font-medium tabular-nums text-be-text">
                    {formatPrice(r.amount_cents, r.currency)}
                  </td>
                  <td className="text-right">
                    <FinancingActions
                      requestId={r.id}
                      status={r.status}
                      amountCents={r.amount_cents}
                      currency={r.currency}
                    />
                  </td>
                </tr>
              ))}
            </tbody>
          </TableShell>
        )}
      </section>

      <section className="space-y-3">
        <h2 className="text-lg font-medium text-be-text">Active / history</h2>
        {open.length + history.length === 0 ? (
          <EmptyState icon={HandCoins} title="Nothing here yet" body="Approved and resolved advances will appear here." />
        ) : (
          <TableShell>
            <thead>
              <tr>
                <th>Organizer</th>
                <th className="text-right">Amount</th>
                <th className="text-right">Outstanding</th>
                <th>Status</th>
                <th className="text-right">Action</th>
              </tr>
            </thead>
            <tbody>
              {[...open.filter((r) => r.status !== "pending"), ...history].map((r) => (
                <tr key={r.id}>
                  <td className="text-be-text">
                    {nameByOrg.get(r.organizer_id) || <span className="text-be-muted opacity-70">Unnamed</span>}
                  </td>
                  <td className="text-right tabular-nums text-be-text">
                    {formatPrice(r.amount_cents, r.currency)}
                  </td>
                  <td className="text-right tabular-nums text-be-text">
                    {formatPrice(r.outstanding_cents, r.currency)}
                  </td>
                  <td>
                    <StatusPill tone={STATUS_TONE[r.status] ?? "muted"}>{r.status}</StatusPill>
                  </td>
                  <td className="text-right">
                    <FinancingActions
                      requestId={r.id}
                      status={r.status}
                      amountCents={r.amount_cents}
                      currency={r.currency}
                    />
                  </td>
                </tr>
              ))}
            </tbody>
          </TableShell>
        )}
      </section>
    </div>
  );
}