import Link from "next/link";
import { Logo } from "@/components/brand/logo";
import { routes } from "@/lib/routes";

export const ATTRIBUTION = "Data: PeeringDB, © OpenStreetMap contributors (ODbL), Wikidata, World Bank, operator, utility, planning and government sources";

// `plain` = served by the API (not a Next route) → plain <a>, no router prefetch.
const COLS: Array<{ title: string; links: Array<{ label: string; href: string; plain?: boolean }> }> = [
  {
    title: "Index",
    links: [
      { label: "Map", href: routes.map() },
      { label: "Facilities", href: routes.datacenters() },
      { label: "Markets", href: routes.markets() },
      { label: "Operators", href: routes.operators() },
      { label: "Countries", href: routes.countries() },
      { label: "Cloud regions", href: routes.cloudRegions() },
      { label: "Internet exchanges", href: routes.ixps() },
      { label: "Power & grid", href: routes.power() },
      { label: "Connectivity", href: routes.connectivity() },
    ],
  },
  {
    title: "Intelligence",
    links: [
      { label: "Live changes", href: routes.live() },
      { label: "Pulse", href: routes.pulse() },
      { label: "Projects & pipeline", href: routes.projects() },
      { label: "AI infrastructure", href: routes.ai() },
      { label: "Rankings", href: routes.rankings() },
      { label: "Explore", href: routes.explore() },
      { label: "Compare operators", href: routes.compareOperators() },
      { label: "Time machine", href: routes.timeMachine() },
      { label: "Watchlist", href: routes.watchlist() },
    ],
  },
  {
    title: "Reference",
    links: [
      { label: "Methodology", href: routes.methodology() },
      { label: "Coverage", href: routes.coverage() },
      { label: "Sources", href: routes.sources() },
      { label: "Downloads", href: routes.download() },
      { label: "API & developers", href: routes.apiDocsPage() },
      { label: "API reference", href: routes.apiDocs(), plain: true },
      { label: "Crawler policy", href: routes.bot() },
      { label: "About", href: routes.about() },
    ],
  },
];

export function Footer({ compact }: { compact?: boolean }) {
  if (compact) return null;
  return (
    <footer className="mt-12 border-t border-hair bg-surface pb-20 md:pb-8">
      <div className="mx-auto w-full max-w-[1280px] px-3 sm:px-5 lg:px-8">
        <div className="grid grid-cols-2 gap-x-6 gap-y-8 py-8 sm:grid-cols-[1.4fr_1fr_1fr_1fr] sm:gap-8 [&>*:first-child]:col-span-2 sm:[&>*:first-child]:col-span-1">
          <div className="max-w-xs">
            <Logo size={20} />
            <p className="mt-3 text-[12.5px] leading-relaxed text-ink-3">The global index of data center infrastructure: facilities, campuses, operators, cloud regions, markets, projects, power and connectivity — provenance on every field, an evidence drawer behind every figure and a live change feed.</p>
            <p className="mt-3 text-[11.5px] text-ink-4">Published figures only. Estimates are marked ≈. Coverage gaps are shown, never filled.</p>
          </div>
          {COLS.map((c) => (
            <div key={c.title}>
              <div className="label-caps mb-2">{c.title}</div>
              <ul className="flex flex-col gap-1">
                {c.links.map((l) => (
                  <li key={l.href}>
                    {l.plain ? (
                      <a href={l.href} className="inline-flex min-h-10 items-center text-[13px] text-ink-2 hover:text-ink sm:min-h-7">
                        {l.label}
                      </a>
                    ) : (
                      <Link href={l.href} className="inline-flex min-h-10 items-center text-[13px] text-ink-2 hover:text-ink sm:min-h-7">
                        {l.label}
                      </Link>
                    )}
                  </li>
                ))}
              </ul>
            </div>
          ))}
        </div>
        <div className="flex flex-col gap-2 border-t border-hair py-4 text-[11.5px] leading-relaxed text-ink-3">
          <p>
            Built by <span className="text-ink-2">Simon-Pierre Boucher</span> · <a href="mailto:contact@spboucher.ai" className="text-ink-2 hover:text-accent">contact@spboucher.ai</a> · Hosted on{" "}
            <a href="https://www.maclustr.io" target="_blank" rel="noopener noreferrer" className="text-ink-2 hover:text-accent">
              MacLustr (www.maclustr.io)
            </a>
          </p>
          <p>{ATTRIBUTION}. Figures marked ≈ are estimates or planned values; every value carries a source. © {new Date().getUTCFullYear()} DataCenterIndex.io.</p>
        </div>
      </div>
    </footer>
  );
}