import type { Metadata } from 'next';
import Link from 'next/link';
import { LaunchFilterForm, launchHref, launchTitle, parseLaunchQuery } from '@/components/launches/launch-filters';
import { LaunchTimelineCharts } from '@/components/launches/launch-timeline';
import { LaunchesTable } from '@/components/launches/launches-table';
import { Pagination } from '@/components/ui/pagination';
import { Container, PageHeader } from '@/components/ui/section';
import { Unavailable } from '@/components/ui/unavailable';
import { api, safe } from '@/lib/api';
import { fmtInt } from '@/lib/format';
import { routes, SITE_URL } from '@/lib/site';

const PAGE_SIZE = 50;
type Props = { searchParams: Promise<Record<string, string | string[] | undefined>> };

export async function generateMetadata({ searchParams }: Props): Promise<Metadata> {
  const q = parseLaunchQuery(await searchParams);
  const filtered = Object.keys(q).some((k) => k !== 'page' && k !== 'sort');
  // Same cached request as the page body → real site names in the title instead of slugs.
  const sites = q.site ? ((await safe(api.launchTimeline()))?.data.sites ?? null) : null;
  const title = filtered ? `${launchTitle(q, sites)} — Launches` : 'Launches — every orbital launch since 1957, derived from the catalogue';
  const description = 'Orbital launches reconstructed from SATCAT international designators: date, site, payload count, catalogued objects still on orbit, owners. Filter by year, site, country and owner.';
  const canonical = launchHref(q, {}, false);
  return { title, description, alternates: { canonical }, robots: q.page || q.q ? { index: false, follow: true } : undefined, openGraph: { title, description, url: `${SITE_URL}${canonical}` }, twitter: { card: 'summary_large_image', title, description } };
}

export default async function LaunchesPage({ searchParams }: Props) {
  const q = parseLaunchQuery(await searchParams);
  const page = Math.max(1, Number(q.page ?? '1') || 1);
  const [list, timelineRes] = await Promise.all([safe(api.launches({ ...q, page, page_size: PAGE_SIZE, sort: q.sort ?? 'date' })), safe(api.launchTimeline())]);
  const timeline = timelineRes?.data ?? null;
  const filtered = Object.keys(q).some((k) => k !== 'page' && k !== 'sort');
  const total = list?.pagination.total ?? null;

  return (
    <Container wide>
      <PageHeader
        eyebrow={<>Launch record · {total !== null ? <span className="tnum">{fmtInt(total)} launches{filtered ? ' match' : ''}</span> : 'count unavailable'}</>}
        title={filtered ? launchTitle(q, timeline?.sites ?? null) : 'Orbital launches'}
        lede={filtered ? undefined : 'Every launch that left at least one catalogued object in orbit, grouped by international designator. Counts of payloads, rocket bodies and debris are taken from the live catalogue, so "on orbit" changes as objects decay.'}
      />

      <section className="pb-8" aria-label="Launch timeline">
        {timeline ? <LaunchTimelineCharts timeline={timeline} /> : <Unavailable what="Launch timeline" />}
      </section>

      <div className="space-y-4 pb-4">
        <LaunchFilterForm q={q} timeline={timeline} />
        {filtered && (
          <ul className="flex flex-wrap gap-1.5">
            {(Object.keys(q) as (keyof typeof q)[]).filter((k) => k !== 'page' && k !== 'sort').map((k) => (
              <li key={k}>
                <Link href={launchHref(q, { [k]: undefined })} className="inline-flex min-h-9 items-center gap-1.5 rounded-md border border-accent/40 bg-accent-soft px-2.5 py-1 text-xs text-accent hover:bg-accent/20" title={`Remove ${k} filter`}>
                  <span className="text-accent/70">{k.replace(/_/g, ' ')}:</span> {q[k]} <span aria-hidden>×</span>
                </Link>
              </li>
            ))}
          </ul>
        )}
      </div>

      <section className="py-6" aria-label="Launches">
        {list === null ? (
          <Unavailable what={q.after || q.before ? 'Launch list (the after/before date filter is currently failing upstream)' : 'Launch list'} />
        ) : list.data.length === 0 ? (
          <div className="rounded-lg border border-dashed border-rule-strong px-5 py-10 text-center">
            <p className="text-sm text-ink-2">No launch matches these filters.</p>
            <Link href={routes.launches()} className="mt-4 inline-flex h-10 items-center rounded-md border border-rule px-4 text-sm text-ink hover:bg-plane-2">Clear filters</Link>
          </div>
        ) : (
          <>
            <Pagination page={list.pagination.page} pages={list.pagination.pages} total={list.pagination.total} pageSize={list.pagination.page_size} makeHref={(p) => launchHref(q, { page: String(p) }, false)} className="mb-3" />
            <LaunchesTable rows={list.data} ownerHref={(c) => launchHref(q, { owner: c })} />
            <Pagination page={list.pagination.page} pages={list.pagination.pages} total={list.pagination.total} pageSize={list.pagination.page_size} makeHref={(p) => launchHref(q, { page: String(p) }, false)} className="mt-4" />
          </>
        )}
      </section>

      <p className="pb-10 text-2xs leading-relaxed text-ink-3">
        Launches are <em>derived</em>: SatelliteIndex groups catalogued objects by the launch part of their COSPAR international designator (e.g. 1998-067) and takes the earliest launch date and the launch site from SATCAT. Launches that placed nothing in the catalogue (failures below orbit, suborbital flights) do not appear. Region split uses the launch-site country. See the <Link href={routes.methodology()} className="hover:text-accent">methodology</Link>.
      </p>
    </Container>
  );
}