import type { SourceKind } from "@dci/core";
import { SOURCE_KINDS } from "@dci/core";
import type { Metadata } from "next";
import { Breadcrumbs } from "@/components/entity/breadcrumbs";
import { ExtLink } from "@/components/entity/kv";
import { SectionNav } from "@/components/entity/section-nav";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Page, PageHeader, Section } from "@/components/ui/card";
import { FilterChips, type Chip } from "@/components/ui/filter-chips";
import { Metric, MetricCell, MetricRow } from "@/components/ui/metric";
import { EmptyState, OfflineNotice } from "@/components/ui/states";
import { RowLink, TBody, THead, Table, Td, Th, Tr } from "@/components/ui/table";
import { api } from "@/lib/api";
import type { SourceWithCounts } from "@/lib/dto";
import { fmtDate, fmtInt } from "@/lib/format";
import { SOURCE_KIND_LABEL } from "@/lib/labels";
import { routes } from "@/lib/routes";
import { pageMetadata } from "@/lib/seo";
import { compareBy, hrefWith, parseSort, sortTh, spGet, type SearchParams } from "@/lib/sort";

export const revalidate = 120;

export const metadata: Metadata = pageMetadata({
  title: "Sources",
  description: "Every source the index reads, with its licence, attribution and how much of the graph it backs. Facts only — each value links back to the page it was observed on.",
  path: routes.sources(),
});

const SORT_KEYS = ["name", "kind", "documents", "provenance", "facilities", "updated"] as const;
type SortKey = (typeof SORT_KEYS)[number];
const KIND_SET = new Set<string>(SOURCE_KINDS);

function getter(key: SortKey): (s: SourceWithCounts) => number | string | null {
  switch (key) {
    case "name":
      return (s) => s.name;
    case "kind":
      return (s) => SOURCE_KIND_LABEL[s.kind];
    case "documents":
      return (s) => s.documents;
    case "provenance":
      return (s) => s.provenanceRows;
    case "facilities":
      return (s) => s.facilities;
    case "updated":
      return (s) => s.lastDocumentAt ?? s.updatedAt;
  }
}

const REDIST_TONE: Record<string, "ok" | "info" | "warn" | "neutral"> = { allowed: "ok", attribution: "info", restricted: "warn", unknown: "neutral" };
const REDIST_LABEL: Record<string, string> = { allowed: "Redistribution allowed", attribution: "Attribution required", restricted: "Restricted", unknown: "Re-use terms unknown" };

/** Redistribution / licence badge from the source registry (drives /download gating). */
function ReuseBadge({ s }: { s: SourceWithCounts }) {
  const r = s.redistribution ?? "unknown";
  return (
    <span className="inline-flex flex-wrap gap-1">
      <Badge tone={REDIST_TONE[r] ?? "neutral"} size="xs" title={`${REDIST_LABEL[r] ?? r}${s.license ? ` — ${s.license}` : ""}`}>
        {r === "attribution" ? "Attribution" : r === "allowed" ? "Allowed" : r === "restricted" ? "Restricted" : "Unknown"}
      </Badge>
      {s.attributionRequired && r !== "attribution" && (
        <Badge tone="outline" size="xs" title="Attribution line must accompany every re-use">
          Attribution
        </Badge>
      )}
    </span>
  );
}

function truncate(s: string | null | undefined, n: number): string {
  if (!s) return "—";
  return s.length > n ? `${s.slice(0, n - 1)}…` : s;
}

function SourceTable({ items, sp, grouped, sort }: { items: SourceWithCounts[]; sp: SearchParams; grouped: boolean; sort: ReturnType<typeof parseSort<SortKey>> }) {
  const base = routes.sources();
  const th = (k: SortKey) => sortTh(base, sp, sort, k);
  return (
    <Table dense mobileCollapse={{ total: items.length, label: "sources" }}>
      <THead>
        <tr>
          <Th {...th("name")}>Source</Th>
          {!grouped && <Th {...th("kind")}>Kind</Th>}
          <Th className="hidden md:table-cell">Re-use</Th>
          <Th className="hidden lg:table-cell">License</Th>
          <Th className="hidden xl:table-cell">Attribution</Th>
          <Th numeric {...th("documents")}>
            Documents
          </Th>
          <Th numeric {...th("provenance")}>
            Provenance rows
          </Th>
          <Th numeric {...th("facilities")}>
            Facilities
          </Th>
          <Th className="hidden md:table-cell" {...th("updated")}>
            Last document
          </Th>
          <Th className="hidden sm:table-cell">Link</Th>
        </tr>
      </THead>
      <TBody>
        {items.map((s) => (
          <Tr key={s.id}>
            <Td primary>
              <RowLink href={routes.source(s.id)}>{s.name}</RowLink>
              <div className="figure text-[11.5px] text-ink-3">{s.domain}</div>
            </Td>
            {!grouped && (
              <Td label="Kind">
                <Badge tone="outline" size="xs">
                  {SOURCE_KIND_LABEL[s.kind]}
                </Badge>
              </Td>
            )}
            <Td label="Re-use" className="hidden md:table-cell">
              <ReuseBadge s={s} />
            </Td>
            <Td label="License" className="hidden max-w-[240px] text-[12px] text-ink-2 lg:table-cell" title={s.license ?? undefined}>
              {truncate(s.license, 60)}
            </Td>
            <Td label="Attribution" className="hidden max-w-[200px] text-[12px] text-ink-3 xl:table-cell" title={s.attribution ?? undefined}>
              {truncate(s.attribution, 48)}
            </Td>
            <Td label="Documents" numeric lead>
              {fmtInt(s.documents)}
            </Td>
            <Td label="Provenance rows" numeric>
              {fmtInt(s.provenanceRows)}
            </Td>
            <Td label="Facilities" numeric>
              {fmtInt(s.facilities)}
            </Td>
            <Td label="Last document" className="figure hidden text-[12px] text-ink-3 md:table-cell">
              {fmtDate(s.lastDocumentAt)}
            </Td>
            <Td label="Link" className="hidden text-[12px] sm:table-cell">
              {s.url ? <ExtLink href={s.url}>{s.domain}</ExtLink> : <span className="text-ink-4">—</span>}
            </Td>
          </Tr>
        ))}
      </TBody>
    </Table>
  );
}

export default async function SourcesPage({ searchParams }: { searchParams: Promise<SearchParams> }) {
  const sp = await searchParams;
  const res = await api.sources();
  const all = res.items;
  const q = spGet(sp, "q")?.trim().toLowerCase();
  const kindParam = spGet(sp, "kind");
  const kind = kindParam && KIND_SET.has(kindParam) ? (kindParam as SourceKind) : undefined;
  const sortGiven = Boolean(spGet(sp, "sort"));
  const sort = parseSort<SortKey>(sp, SORT_KEYS, { key: "provenance", order: "desc" });

  let items = all;
  if (q) items = items.filter((s) => s.name.toLowerCase().includes(q) || s.domain.toLowerCase().includes(q));
  if (kind) items = items.filter((s) => s.kind === kind);
  const cmp = compareBy(getter(sort.key), sort.order);
  items = [...items].sort((a, b) => cmp(a, b) || a.name.localeCompare(b.name));

  const totals = {
    sources: all.length,
    documents: all.reduce((a, s) => a + s.documents, 0),
    provenance: all.reduce((a, s) => a + s.provenanceRows, 0),
    withData: all.filter((s) => s.provenanceRows > 0).length,
  };

  const grouped = !sortGiven && !kind;
  const kindsPresent = SOURCE_KINDS.filter((k) => all.some((s) => s.kind === k));
  const groups = grouped
    ? kindsPresent
        .map((k) => ({ kind: k, items: items.filter((s) => s.kind === k) }))
        .filter((g) => g.items.length)
        .sort((a, b) => b.items.reduce((x, s) => x + s.provenanceRows, 0) - a.items.reduce((x, s) => x + s.provenanceRows, 0))
    : [];

  const chips: Chip[] = [];
  if (q) chips.push({ key: "q", label: "Search", value: q, removeHref: hrefWith(routes.sources(), sp, { q: undefined }) });
  if (kind) chips.push({ key: "kind", label: "Kind", value: SOURCE_KIND_LABEL[kind], removeHref: hrefWith(routes.sources(), sp, { kind: undefined }) });
  if (sortGiven) chips.push({ key: "sort", label: "Sorted by", value: `${sort.key} ${sort.order}`, removeHref: hrefWith(routes.sources(), sp, { sort: undefined, order: undefined }) });

  return (
    <Page>
      <Breadcrumbs items={[{ name: "Sources", href: routes.sources() }]} className="pt-3" />
      <PageHeader
        eyebrow="Registry"
        title="Sources"
        description="Every source the index reads, with its licence, attribution, re-use terms and how much of the graph it backs. Facts only — each value links back to the page it was observed on."
        className="pt-3"
        aside={
          <Button size="sm" href={`${routes.coverage()}/sources`}>
            Coverage analytics →
          </Button>
        }
      />
      {!res.items.length && !res.total && <OfflineNotice detail="sources unavailable" className="mb-3" />}

      <MetricRow cols={4}>
        <MetricCell>
          <Metric value={fmtInt(totals.sources)} label="Sources" size="sm" />
        </MetricCell>
        <MetricCell>
          <Metric value={fmtInt(totals.documents)} label="Documents archived" size="sm" />
        </MetricCell>
        <MetricCell>
          <Metric value={fmtInt(totals.provenance)} label="Provenance rows" size="sm" />
        </MetricCell>
        <MetricCell>
          <Metric value={fmtInt(totals.withData)} label="Sources with data" size="sm" note="≥ 1 current provenance row" />
        </MetricCell>
      </MetricRow>

      <form method="get" action={routes.sources()} className="mt-4 flex flex-wrap items-end gap-2" role="search" aria-label="Filter sources">
        <label className="flex min-w-0 flex-1 flex-col gap-1 sm:max-w-[280px]">
          <span className="label-caps">Search</span>
          <input name="q" defaultValue={q ?? ""} placeholder="Name or domain" className="h-9 min-w-0 rounded-sm border border-hair bg-surface px-2.5 text-[13px] text-ink outline-none focus-visible:ring-2 focus-visible:ring-accent" />
        </label>
        <label className="flex flex-col gap-1">
          <span className="label-caps">Kind</span>
          <select name="kind" defaultValue={kind ?? ""} className="h-9 rounded-sm border border-hair bg-surface px-2 text-[13px] text-ink outline-none focus-visible:ring-2 focus-visible:ring-accent">
            <option value="">All kinds</option>
            {kindsPresent.map((k) => (
              <option key={k} value={k}>
                {SOURCE_KIND_LABEL[k]}
              </option>
            ))}
          </select>
        </label>
        {sortGiven && <input type="hidden" name="sort" value={sort.key} />}
        {sortGiven && <input type="hidden" name="order" value={sort.order} />}
        <Button type="submit" size="md" variant="secondary">
          Apply
        </Button>
      </form>
      <FilterChips chips={chips} resetHref={routes.sources()} className="mt-3" />

      {!items.length ? (
        <EmptyState className="mt-4" title="No source matches" description={all.length ? "Loosen the search or clear the filters." : "The source registry is not reachable right now."} compact />
      ) : grouped ? (
        <div className="mt-4 flex flex-col gap-6">
          <SectionNav items={groups.map((g) => ({ id: `kind-${g.kind}`, label: SOURCE_KIND_LABEL[g.kind], count: g.items.length }))} />
          {groups.map((g) => (
            <Section key={g.kind} id={`kind-${g.kind}`} className="scroll-mt-28" title={SOURCE_KIND_LABEL[g.kind]} description={`${fmtInt(g.items.length)} ${g.items.length === 1 ? "source" : "sources"} · ${fmtInt(g.items.reduce((a, s) => a + s.provenanceRows, 0))} provenance rows`}>
              <SourceTable items={g.items} sp={sp} grouped sort={sort} />
            </Section>
          ))}
        </div>
      ) : (
        <div className="mt-4">
          <SourceTable items={items} sp={sp} grouped={false} sort={sort} />
        </div>
      )}
      <p className="mt-6 text-[12px] text-ink-4">
        Kinds rank source authority when values conflict (operator, government and filings first; news last) — see the{" "}
        <a href={`${routes.methodology()}#reconciliation`} className="underline decoration-hair-2 hover:text-ink">
          reconciliation rules
        </a>
        . Crawling policy: <a href={routes.bot()} className="underline decoration-hair-2 hover:text-ink">/bot</a>.
      </p>
    </Page>
  );
}