import type { Metadata } from "next";
import Link from "next/link";
import { Breadcrumbs } from "@/components/entity/breadcrumbs";
import { SectionNav } from "@/components/entity/section-nav";
import { SourcesFooter } from "@/components/entity/sources-footer";
import { DatasetForm } from "@/components/intelligence/download/dataset-form";
import { ApiNote, HonestEmpty } from "@/components/intelligence/shared";
import { Badge } from "@/components/ui/badge";
import { Page, PageHeader, Section } from "@/components/ui/card";
import { EmptyState, OfflineNotice } from "@/components/ui/states";
import { api } from "@/lib/api";
import { fmtInt } from "@/lib/format";
import { routes } from "@/lib/routes";
import { pageMetadata } from "@/lib/seo";

export const revalidate = 120;

export const metadata: Metadata = pageMetadata({
  title: "Downloads",
  description: "Download the index as CSV, JSON or GeoJSON: facilities, projects, operators, events, cloud regions, internet exchanges, countries and markets — licence-gated, with attribution and excluded sources listed per dataset.",
  path: routes.download(),
});

export default async function DownloadPage() {
  const r = await api.downloadDatasets();
  const datasets = r.ok ? r.data : [];
  return (
    <Page>
      <Breadcrumbs items={[{ name: "Downloads", href: routes.download() }]} className="pt-3" />
      <PageHeader eyebrow="Downloads" title="Datasets" description="Every dataset streams straight from the API with the filters below. Rows whose only sources forbid redistribution are excluded and listed; each row keeps the names of the sources it was built from." className="pt-3" />
      {!r.ok && <OfflineNotice detail={r.error} className="mb-3" />}
      <ApiNote label="Limits" note="Large datasets are capped per request (50 000 rows) — narrow with filters to fetch a complete slice. JSON responses carry meta.excludedSources; CSV/GeoJSON carry the same list in the x-dci-excluded-sources header. Figures are published values only, with the coverage caveats of the API." className="mb-4">
        {" "}
        <Link href={routes.apiDocsPage()} className="underline decoration-hair-2 hover:text-ink">
          API documentation
        </Link>
      </ApiNote>

      {datasets.length === 0 ? (
        <EmptyState title="No dataset available" description="The API did not return the dataset registry." />
      ) : (
        <>
          <SectionNav items={datasets.map((d) => ({ id: d.key, label: d.label, count: d.rows }))} />
          <div className="mt-6 flex flex-col gap-10">
            {datasets.map((d) => (
              <Section
                key={d.key}
                id={d.key}
                title={d.label}
                description={d.description}
                className="scroll-mt-28"
                aside={
                  <div className="flex flex-col items-end gap-1">
                    <span className="figure text-[13px] text-ink">
                      {fmtInt(d.rows)} <span className="text-ink-3">rows</span>
                    </span>
                    <span className="inline-flex gap-1">
                      {d.formats.map((f) => (
                        <Badge key={f} tone="outline" size="xs" mono>
                          {f}
                        </Badge>
                      ))}
                    </span>
                  </div>
                }
              >
                <div className="grid gap-5 lg:grid-cols-[minmax(0,3fr)_minmax(0,2fr)]">
                  <div className="min-w-0">
                    <DatasetForm dataset={d} />
                  </div>
                  <div className="min-w-0 flex flex-col gap-3 text-[12.5px]">
                    <div>
                      <div className="label-caps mb-1">Licence</div>
                      <p className="leading-relaxed text-ink-2">{d.license}</p>
                    </div>
                    <div>
                      <div className="label-caps mb-1">Attribution ({fmtInt(d.attribution.length)})</div>
                      {d.attribution.length === 0 ? (
                        <p className="text-ink-3">No attribution line recorded for this dataset&rsquo;s sources — the source registry applies.</p>
                      ) : d.attribution.length <= 6 ? (
                        <ul className="flex flex-wrap gap-1">
                          {d.attribution.map((a) => (
                            <li key={a}>
                              <Badge tone="outline" size="xs" className="max-w-[260px]">
                                <span className="truncate">{a}</span>
                              </Badge>
                            </li>
                          ))}
                        </ul>
                      ) : (
                        <details>
                          <summary className="inline-flex min-h-10 cursor-pointer items-center text-ink-2 hover:text-ink sm:min-h-0">Show all {fmtInt(d.attribution.length)} attribution lines</summary>
                          <ul className="mt-1.5 flex flex-wrap gap-1">
                            {d.attribution.map((a) => (
                              <li key={a}>
                                <Badge tone="outline" size="xs" className="max-w-[260px]">
                                  <span className="truncate">{a}</span>
                                </Badge>
                              </li>
                            ))}
                          </ul>
                        </details>
                      )}
                    </div>
                    <div>
                      <div className="label-caps mb-1">Excluded sources</div>
                      {d.excludedSources.length === 0 ? (
                        <p className="text-ink-3">None — every source behind this dataset allows redistribution with attribution.</p>
                      ) : (
                        <ul className="divide-y divide-hair">
                          {d.excludedSources.map((s) => (
                            <li key={s.id} className="py-1.5">
                              <Link href={routes.source(s.id)} className="font-medium text-ink hover:text-accent hover:underline">
                                {s.name}
                              </Link>
                              <span className="text-ink-3"> — {s.reason}</span>
                            </li>
                          ))}
                        </ul>
                      )}
                    </div>
                    {d.filters.length === 0 && <HonestEmpty title="Whole-table dataset" detail="no filter is defined for this key" />}
                  </div>
                </div>
              </Section>
            ))}
          </div>
        </>
      )}

      <SourcesFooter sources={r.ok ? r.sources : undefined} note="Re-users must keep the per-row source attribution and respect each source's licence (see /sources). Nothing is imputed; rows without a published figure carry an empty cell, not zero." />
    </Page>
  );
}