import type { Metadata } from 'next';
import Link from 'next/link';
import { Bars, StackedBars } from '@/components/charts/charts';
import { ChartBlock, Chips, Disclaimer, Note, StatGrid } from '@/components/stats/shared';
import { TypeBadge } from '@/components/ui/badges';
import { Pagination } from '@/components/ui/pagination';
import { Container, PageHeader, Section, Stat } from '@/components/ui/section';
import { Unavailable } from '@/components/ui/unavailable';
import { api, safe } from '@/lib/api';
import { fmt2, fmtAgo, fmtDate, fmtInt, fmtKm, num } from '@/lib/format';
import { OBJECT_TYPE_LABELS, routes, SITE_NAME, SITE_URL } from '@/lib/site';

export const revalidate = 300;

type Search = Promise<{ page?: string | string[]; object_type?: string | string[]; days?: string | string[] }>;
const PAGE_SIZE = 50;
const DAYS = [30, 90, 365, 3650] as const;
const TYPES = ['PAYLOAD', 'DEBRIS', 'ROCKET_BODY', 'UNKNOWN'] as const;
const pick = (v: string | string[] | undefined) => (Array.isArray(v) ? v[0] : v);

const TITLE = 'Reentries — recently decayed objects and low-perigee watch';
const DESC = 'Objects that have reentered the atmosphere according to published SATCAT decay dates: last 7/30/365 days, monthly history, filterable table by object type, and a low-perigee watch list of objects under 250 km. No reentry predictions.';

export async function generateMetadata(): Promise<Metadata> {
  const url = `${SITE_URL}${routes.reentries()}`;
  return {
    title: TITLE,
    description: DESC,
    alternates: { canonical: url },
    openGraph: { title: `${TITLE} | ${SITE_NAME}`, description: DESC, url, type: 'website', siteName: SITE_NAME },
    twitter: { card: 'summary_large_image', title: `${TITLE} | ${SITE_NAME}`, description: DESC },
  };
}

function href(params: { page?: number; object_type?: string; days?: number }): string {
  const p = new URLSearchParams();
  if (params.object_type) p.set('object_type', params.object_type);
  if (params.days && params.days !== 90) p.set('days', String(params.days));
  if (params.page && params.page > 1) p.set('page', String(params.page));
  const s = p.toString();
  return s ? `${routes.reentries()}?${s}` : routes.reentries();
}
const daysLabel = (d: number) => (d === 30 ? 'Last 30 d' : d === 90 ? 'Last 90 d' : d === 365 ? 'Last year' : 'Last 10 years');

export default async function ReentriesPage({ searchParams }: { searchParams: Search }) {
  const sp = await searchParams;
  const page = Math.max(1, Number(pick(sp.page) ?? 1) || 1);
  const object_type = TYPES.find((t) => t === pick(sp.object_type)) ?? undefined;
  const daysRaw = Number(pick(sp.days) ?? 90);
  const days = (DAYS as readonly number[]).includes(daysRaw) ? daysRaw : 90;

  const res = await safe(api.reentries({ page, page_size: PAGE_SIZE, object_type, days }));
  const monthly = res ? [...res.monthly].sort((a, b) => a.month.localeCompare(b.month)).slice(-24) : [];
  const monthlyBars = monthly.map((m) => ({ x: m.month.slice(0, 7), y: num(m.decayed) ?? 0 }));
  const monthlyStack = monthly.map((m) => ({ x: m.month.slice(0, 7), payloads: num(m.payloads) ?? 0, debris: num(m.debris) ?? 0, rocket_bodies: num(m.rocket_bodies) ?? 0 }));

  const typeChips = [{ href: href({ days }), label: 'All types', active: !object_type }, ...TYPES.map((t) => ({ href: href({ object_type: t, days }), label: OBJECT_TYPE_LABELS[t] ?? t, active: object_type === t }))];
  const dayChips = DAYS.map((d) => ({ href: href({ object_type, days: d }), label: daysLabel(d), active: days === d }));

  return (
    <Container>
      <PageHeader eyebrow="Reentries" title="Recent reentries" lede="Objects whose decay date has been published in the CelesTrak SATCAT, i.e. confirmed atmospheric reentries. SatelliteIndex reports what the catalogue says — it does not forecast when or where anything will come down.">
        {res && <p className="mono mt-4 text-xs text-ink-3">Generated {fmtAgo(res.meta.generated_at)}</p>}
      </PageHeader>

      {!res ? (
        <div className="py-6">
          <Unavailable what="Reentry statistics" />
        </div>
      ) : (
        <>
          <Section eyebrow="Summary" title="Confirmed decays" className="pt-0 md:pt-0">
            <StatGrid cols={3}>
              <Stat label="Last 7 days" value={fmtInt(res.summary.last_7d)} accent hint="Objects with a published decay date" />
              <Stat label="Last 30 days" value={fmtInt(res.summary.last_30d)} />
              <Stat label="Last 365 days" value={fmtInt(res.summary.last_365d)} />
            </StatGrid>
          </Section>

          <Section eyebrow="Monthly" title="Decays by month" action={{ href: routes.debris(), label: 'Debris history' }}>
            <div className="grid gap-10 lg:grid-cols-2 lg:gap-12">
              <ChartBlock title="Objects decayed per month" hint={monthly.length ? `${monthly[0]?.month.slice(0, 7)} → ${monthly[monthly.length - 1]?.month.slice(0, 7)}` : undefined}>
                <Bars data={monthlyBars} title="Objects decayed per month, last 24 months" height={190} xTicks={6} color="var(--series-4)" highlightLast />
                <Note className="mt-2">The last bar is the current, incomplete month.</Note>
              </ChartBlock>
              <ChartBlock title="By object type" hint="Payloads · debris · rocket bodies">
                <StackedBars data={monthlyStack} keys={['payloads', 'debris', 'rocket_bodies']} labels={{ payloads: 'Payloads', debris: 'Debris', rocket_bodies: 'Rocket bodies' }} title="Objects decayed per month by object type" height={190} xTicks={6} />
              </ChartBlock>
            </div>
          </Section>

          <Section eyebrow="Table" title={`Reentries — ${daysLabel(days).toLowerCase()}${object_type ? ` · ${OBJECT_TYPE_LABELS[object_type] ?? object_type}` : ''}`}>
            <div className="space-y-3 pb-5">
              <Chips items={typeChips} ariaLabel="Object type" />
              <Chips items={dayChips} ariaLabel="Time window" />
            </div>
            {res.data.length === 0 ? (
              <Unavailable what="Reentries matching these filters" />
            ) : (
              <table className="data-table stack text-sm">
                <thead>
                  <tr>
                    <th>Decay date</th>
                    <th>Object</th>
                    <th>NORAD</th>
                    <th>Type</th>
                    <th>Country</th>
                    <th className="num">RCS (m²)</th>
                    <th>Constellation</th>
                  </tr>
                </thead>
                <tbody>
                  {res.data.map((r) => (
                    <tr key={r.id}>
                      <td data-label="Decay date" className="mono text-xs">{fmtDate(r.decay_date)}</td>
                      <td data-label="Object" className="primary">
                        <Link href={routes.satellite(r.slug)} className="link font-medium">{r.name}</Link>
                        {r.cospar_id && <span className="mono ml-2 text-xs text-ink-3">{r.cospar_id}</span>}
                      </td>
                      <td data-label="NORAD" className="mono text-xs">{r.norad_id ?? '—'}</td>
                      <td data-label="Type"><TypeBadge type={r.object_type} /></td>
                      <td data-label="Country">{r.country_name ?? r.country_code ?? '—'}</td>
                      <td data-label="RCS (m²)" className="num tnum">{fmt2(r.rcs_m2)}</td>
                      <td data-label="Constellation">{r.constellation_slug ? <Link href={routes.constellation(r.constellation_slug)} className="link">{r.constellation_name}</Link> : r.constellation_name ?? '—'}</td>
                    </tr>
                  ))}
                </tbody>
              </table>
            )}
            <Pagination className="mt-6" page={res.pagination.page} pages={res.pagination.pages} total={res.pagination.total} pageSize={res.pagination.page_size} makeHref={(p) => href({ page: p, object_type, days })} />
          </Section>

          <Section eyebrow="Low-perigee watch" title="Objects currently under 250 km perigee">
            <div className="mb-5 space-y-3">
              <Disclaimer text={res.disclaimer} label="Not a prediction" />
            </div>
            {res.low_perigee_watch.length === 0 ? (
              <Unavailable what="Low-perigee watch" />
            ) : (
              <table className="data-table stack text-sm">
                <thead>
                  <tr>
                    <th>Object</th>
                    <th className="num">Perigee</th>
                    <th className="num">Apogee</th>
                    <th>Element epoch</th>
                    <th>Type</th>
                    <th>Country</th>
                    <th>Constellation</th>
                  </tr>
                </thead>
                <tbody>
                  {res.low_perigee_watch.map((o) => (
                    <tr key={o.id}>
                      <td data-label="Object" className="primary">
                        <Link href={routes.satellite(o.slug)} className="link font-medium">{o.name}</Link>
                        {o.norad_id && <span className="mono ml-2 text-xs text-ink-3">#{o.norad_id}</span>}
                      </td>
                      <td data-label="Perigee" className="num tnum">{fmtKm(o.perigee_km, 1)}</td>
                      <td data-label="Apogee" className="num tnum">{fmtKm(o.apogee_km, 1)}</td>
                      <td data-label="Element epoch" className="mono text-xs">{fmtAgo(o.epoch)}</td>
                      <td data-label="Type"><TypeBadge type={o.object_type} /></td>
                      <td data-label="Country" className="mono text-xs">{o.country_code ?? '—'}</td>
                      <td data-label="Constellation">{o.constellation_name ?? '—'}</td>
                    </tr>
                  ))}
                </tbody>
              </table>
            )}
            <Note className="mt-3">Perigee and apogee come from the latest element set (SGP4 mean elements, km). Actively manoeuvring satellites (e.g. during orbit raising) routinely sit under 250 km without decaying.</Note>
          </Section>

          <Section eyebrow="Predicted" title="Predicted / upcoming reentries">
            <Unavailable what="Predicted reentries — no reentry-prediction source connected yet;" />
            <Note className="mt-3">
              SatelliteIndex does not compute reentry windows or ground tracks itself and will only show predictions once an authoritative source is connected, with its own attribution. See{' '}
              <Link href={routes.methodology()} className="text-accent hover:underline">methodology</Link> and <Link href={routes.sources()} className="text-accent hover:underline">sources</Link>.
            </Note>
          </Section>
        </>
      )}
    </Container>
  );
}