import Link from "next/link";
import { ShieldAlert, ShieldCheck } from "lucide-react";
import { requireAdmin } from "@/lib/session";
import { getSuspiciousActivity, listAbuseEvents, str } from "@/lib/queries/admin";
import { formatNumber, formatPercent } from "@/lib/format";
import { PageHeader } from "@/components/ui/page-header";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { EmptyState } from "@/components/ui/empty-state";
import { Table, TableBody, TableCell, TableEmpty, TableHead, TableHeader, TableRow } from "@/components/ui/table";
import { DateCell, Mono, Panel, PlanBadge, numCell } from "@/components/admin/primitives";
import { RecordAbuseDialog, ResolveAbuseButton } from "@/components/admin/abuse-actions";
import { cn } from "@/lib/utils";

export const dynamic = "force-dynamic";

function SeverityBadge({ s }: { s: string }) {
  const v = s === "critical" ? "danger" : s === "high" ? "danger" : s === "medium" ? "warning" : "default";
  return <Badge variant={v}>{s}</Badge>;
}

export default async function AdminAbusePage({ searchParams }: { searchParams: Promise<Record<string, string | string[] | undefined>> }) {
  await requireAdmin();
  const sp = await searchParams;
  const view = (["all", "open", "resolved"] as const).find((v) => v === str(sp.view)) ?? "open";
  const [events, sus] = await Promise.all([listAbuseEvents({ resolved: view }), getSuspiciousActivity()]);
  const signals = sus.ssrf.length + sus.limited.length + sus.unverified.length;

  return (
    <>
      <PageHeader eyebrow="Trust & safety" title="Abuse" description="Recorded abuse events plus live heuristics computed from the last 24 hours of traffic." actions={<RecordAbuseDialog />} />

      <Panel
        title={
          <span className="flex items-center gap-2">
            Suspicious activity (24h)
            {signals ? <Badge variant="warning" dot>{signals} signals</Badge> : <Badge variant="success" dot>clear</Badge>}
          </span>
        }
        description="Heuristics, not verdicts. Investigate from the organization page before acting."
        bodyClassName="p-0"
      >
        <div className="grid divide-y divide-border xl:grid-cols-3 xl:divide-x xl:divide-y-0">
          <div>
            <h3 className="px-4 pt-3 text-[12px] font-semibold uppercase tracking-wide text-fg-subtle">SSRF / disallowed URLs</h3>
            <p className="px-4 pb-2 text-[12px] text-fg-muted">Orgs with &gt; 30 % `URL_NOT_ALLOWED` (min. 5 requests).</p>
            <Table>
              <TableHeader>
                <TableRow>
                  <TableHead>Organization</TableHead>
                  <TableHead className="text-right">Blocked</TableHead>
                  <TableHead className="text-right">Ratio</TableHead>
                </TableRow>
              </TableHeader>
              <TableBody>
                {sus.ssrf.length === 0 ? (
                  <TableEmpty colSpan={3}>None.</TableEmpty>
                ) : (
                  sus.ssrf.map((r) => (
                    <TableRow key={r.organizationId}>
                      <TableCell>
                        <Link href={`/admin/organizations/${r.organizationId}`} className="hover:underline">
                          {r.orgName}
                        </Link>{" "}
                        <PlanBadge plan={r.plan} />
                      </TableCell>
                      <TableCell className={numCell}>
                        {r.notAllowed} / {r.total}
                      </TableCell>
                      <TableCell className={cn(numCell, "text-danger")}>{formatPercent(r.ratio)}</TableCell>
                    </TableRow>
                  ))
                )}
              </TableBody>
            </Table>
          </div>
          <div>
            <h3 className="px-4 pt-3 text-[12px] font-semibold uppercase tracking-wide text-fg-subtle">Rate / concurrency limits</h3>
            <p className="px-4 pb-2 text-[12px] text-fg-muted">Orgs hitting `RATE_LIMITED` or `CONCURRENCY_LIMIT` most.</p>
            <Table>
              <TableHeader>
                <TableRow>
                  <TableHead>Organization</TableHead>
                  <TableHead className="text-right">Rate</TableHead>
                  <TableHead className="text-right">Concurrency</TableHead>
                </TableRow>
              </TableHeader>
              <TableBody>
                {sus.limited.length === 0 ? (
                  <TableEmpty colSpan={3}>None.</TableEmpty>
                ) : (
                  sus.limited.map((r) => (
                    <TableRow key={r.organizationId}>
                      <TableCell>
                        <Link href={`/admin/organizations/${r.organizationId}`} className="hover:underline">
                          {r.orgName}
                        </Link>{" "}
                        <PlanBadge plan={r.plan} />
                      </TableCell>
                      <TableCell className={numCell}>{formatNumber(r.rateLimited)}</TableCell>
                      <TableCell className={numCell}>{formatNumber(r.concurrency)}</TableCell>
                    </TableRow>
                  ))
                )}
              </TableBody>
            </Table>
          </div>
          <div>
            <h3 className="px-4 pt-3 text-[12px] font-semibold uppercase tracking-wide text-fg-subtle">Unverified heavy playground use</h3>
            <p className="px-4 pb-2 text-[12px] text-fg-muted">Unverified owners with ≥ 20 playground requests.</p>
            <Table>
              <TableHeader>
                <TableRow>
                  <TableHead>User</TableHead>
                  <TableHead className="text-right">Requests</TableHead>
                  <TableHead className="text-right">Signed up</TableHead>
                </TableRow>
              </TableHeader>
              <TableBody>
                {sus.unverified.length === 0 ? (
                  <TableEmpty colSpan={3}>None.</TableEmpty>
                ) : (
                  sus.unverified.map((r) => (
                    <TableRow key={r.userId}>
                      <TableCell>
                        <Link href={`/admin/users/${r.userId}`} className="hover:underline">
                          {r.email}
                        </Link>
                      </TableCell>
                      <TableCell className={numCell}>{formatNumber(r.playground)}</TableCell>
                      <TableCell className="text-right">
                        <DateCell value={r.createdAt} />
                      </TableCell>
                    </TableRow>
                  ))
                )}
              </TableBody>
            </Table>
          </div>
        </div>
      </Panel>

      <Panel
        title="Abuse events"
        right={
          <div className="inline-flex h-7 items-center gap-0.5 rounded-md bg-bg-muted p-0.5 text-[12px]">
            {(["open", "resolved", "all"] as const).map((v) => (
              <Button key={v} asChild variant={view === v ? "outline" : "ghost"} size="xs" className={cn("h-6 capitalize", view === v && "bg-bg")}>
                <Link href={`/admin/abuse?view=${v}`}>{v}</Link>
              </Button>
            ))}
          </div>
        }
        flush
        className="mt-6"
      >
        {events.length === 0 ? (
          <div className="p-4">
            <EmptyState icon={view === "open" ? ShieldCheck : ShieldAlert} title={view === "open" ? "No open abuse events" : "No abuse events"} description="Automatic detections (SSRF attempts, prohibited targets, rate abuse) and manual records appear here." compact />
          </div>
        ) : (
          <Table>
            <TableHeader>
              <TableRow>
                <TableHead>When</TableHead>
                <TableHead>Kind</TableHead>
                <TableHead>Severity</TableHead>
                <TableHead>Organization</TableHead>
                <TableHead>Project / request</TableHead>
                <TableHead>Detail</TableHead>
                <TableHead>Status</TableHead>
                <TableHead></TableHead>
              </TableRow>
            </TableHeader>
            <TableBody>
              {events.map((e) => (
                <TableRow key={e.id} className={e.resolved ? "opacity-70" : undefined}>
                  <TableCell>
                    <DateCell value={e.createdAt} />
                  </TableCell>
                  <TableCell>
                    <Mono>{e.kind}</Mono>
                  </TableCell>
                  <TableCell>
                    <SeverityBadge s={e.severity} />
                  </TableCell>
                  <TableCell>{e.organizationId ? <Link href={`/admin/organizations/${e.organizationId}`} className="hover:underline">{e.orgName ?? e.organizationId}</Link> : <span className="text-fg-subtle">—</span>}</TableCell>
                  <TableCell>
                    <div className="font-mono text-[11.5px] text-fg-muted">{e.projectId ?? "—"}</div>
                    {e.requestId ? (
                      <Link href={`/admin/requests/${e.requestId}`} className="font-mono text-[11.5px] hover:underline">
                        {e.requestId}
                      </Link>
                    ) : null}
                  </TableCell>
                  <TableCell className="max-w-[360px] truncate text-[12.5px]" title={e.detail ?? undefined}>
                    {e.detail ?? "—"}
                  </TableCell>
                  <TableCell>{e.resolved ? <Badge variant="success" dot>resolved</Badge> : <Badge variant="warning" dot>open</Badge>}</TableCell>
                  <TableCell className="text-right">
                    <ResolveAbuseButton id={e.id} resolved={e.resolved} />
                  </TableCell>
                </TableRow>
              ))}
            </TableBody>
          </Table>
        )}
      </Panel>
    </>
  );
}