import { Section, Note } from '@/components/ui/section';
import { EmptyState } from '@/components/ui/empty-state';
import { Freshness } from '@/components/ui/freshness';
import { Badge, ClaimBadge } from '@/components/ui/badge';
import { SourceBadge, TableProvenance } from '@/components/ui/source-badge';
import { LineChart, type Series } from '@/components/charts/line-chart';
import { epidemiologyFor, EPI_METRIC_LABEL } from '@/lib/queries/epidemiology';
import { loadProvenance, toInfo } from '@/lib/queries/provenance';
import { fmtValue, humanize, unitLabel } from '@/lib/format';
import type { CancerBundle } from '../load';

const ROWS_PER_TABLE = 12;

export async function StatisticsTab({ b }: { b: CancerBundle }) {
  const obs = await epidemiologyFor(b.cancer.id);
  if (obs.length === 0) {
    return (
      <Section id="statistics" kicker="Epidemiology" title="Incidence, mortality and prevalence">
        <EmptyState
          title="Data not yet available"
          knows={[
            { label: 'Taxonomy and codes', href: `/cancer/${b.cancer.slug}` },
            ...(b.counters?.trial_count ? [{ label: `${b.counters.trial_count} trials`, href: `/cancer/${b.cancer.slug}/trials` }] : []),
            { label: 'Source registry and license status', href: '/sources' },
          ]}
        >
          No epidemiology observation is attached to this entity. Population statistics come from registries (SEER, CDC WONDER) and the IARC Global Cancer Observatory; IARC data stays under license review and SEER awaits credentials, so no burden figure is displayed. Statistics are attached per geography, year and sex — never invented or extrapolated.
        </EmptyState>
      </Section>
    );
  }

  const prov = await loadProvenance(obs.map((o) => o.provenance_id));
  // Group: geography → metric → (sex, age) → series by year
  type Key = string;
  const groups = new Map<Key, { geography: string; metric: string; unit: string; rows: typeof obs }>();
  for (const o of obs) {
    const k = `${o.geography_id}|${o.metric}`;
    if (!groups.has(k)) groups.set(k, { geography: o.geography_name, metric: o.metric, unit: o.unit, rows: [] });
    groups.get(k)!.rows.push(o);
  }
  const latest = obs.reduce<Date | string | null>((m, o) => (m == null || String(o.updated_at) > String(m) ? o.updated_at : m), null);

  return (
    <div className="space-y-8">
      <Note tone="warn">Population statistics describe groups defined by geography, period and sex. They do not predict any individual outcome. Values labelled "estimated" or "projected" are model outputs from the source, not registry counts.</Note>
      {[...groups.values()].map((g) => {
        const seriesMap = new Map<string, Series>();
        for (const r of g.rows) {
          const name = `${humanize(r.sex)}${r.age_group !== 'all' ? ` · ${r.age_group}` : ''}${r.estimate_type !== 'observed' ? ` (${r.estimate_type})` : ''} · ${r.source_slug}`;
          if (!seriesMap.has(name)) seriesMap.set(name, { name, points: [], dashed: r.estimate_type !== 'observed' });
          seriesMap.get(name)!.points.push({ x: r.year, y: r.value, lo: r.lower_ci, hi: r.upper_ci });
        }
        const series = [...seriesMap.values()];
        const multiYear = series.some((s) => s.points.length > 1);
        const sources = new Set(g.rows.map((r) => r.source_slug));
        const firstProv = toInfo(prov.get(g.rows[0]!.provenance_id)) ?? { sourceSlug: g.rows[0]!.source_slug, sourceName: g.rows[0]!.source_name };
        const shown = [...g.rows].sort((a, c) => c.year - a.year || a.sex.localeCompare(c.sex)).slice(0, ROWS_PER_TABLE);
        return (
          <Section key={`${g.geography}-${g.metric}`} id={`${g.metric}-${g.geography}`} kicker={g.geography} title={EPI_METRIC_LABEL[g.metric] ?? humanize(g.metric)} description={`Unit: ${unitLabel(g.unit)}${g.rows[0]?.standard_population ? ` · standard population: ${g.rows[0].standard_population}` : ''}`}>
            {multiYear ? <LineChart series={series} unit={g.unit} ariaLabel={`${EPI_METRIC_LABEL[g.metric] ?? g.metric} in ${g.geography} by year`} /> : null}
            <TableProvenance className={multiYear ? 'mt-4' : ''} p={firstProv} claim={<ClaimBadge kind="observed" />}>
              {g.rows.length} observation{g.rows.length === 1 ? '' : 's'}
              {sources.size > 1 ? ` from ${sources.size} sources` : ''} · observations differ by dataset and year: hover a row badge for its dataset and version.
            </TableProvenance>
            <div className="ci-table-wrap">
              <table className="ci-table">
                <thead>
                  <tr>
                    <th scope="col">Year</th>
                    <th scope="col">Sex</th>
                    <th scope="col">Age group</th>
                    <th scope="col" className="num">
                      Value ({unitLabel(g.unit)})
                    </th>
                    <th scope="col" className="num">
                      95% CI
                    </th>
                    <th scope="col">Type</th>
                    <th scope="col">Site definition</th>
                    <th scope="col">Source</th>
                  </tr>
                </thead>
                <tbody>
                  {shown.map((r) => (
                    <tr key={r.id}>
                      <td className="ci-num">{r.year_end && r.year_end !== r.year ? `${r.year}–${r.year_end}` : r.year}</td>
                      <td>{humanize(r.sex)}</td>
                      <td>{r.age_group === 'all' ? 'All ages' : r.age_group}</td>
                      <td className="num font-medium">{fmtValue(r.value, r.unit)}</td>
                      <td className="num text-ink-3">{r.lower_ci != null && r.upper_ci != null ? `${fmtValue(r.lower_ci, r.unit)}–${fmtValue(r.upper_ci, r.unit)}` : '—'}</td>
                      <td>
                        <Badge tone={r.estimate_type === 'observed' ? 'ok' : 'warn'}>{r.estimate_type}</Badge>
                      </td>
                      <td className="max-w-[240px] text-[12px] text-ink-3">{r.site_definition ?? '—'}</td>
                      <td>
                        <SourceBadge compact p={toInfo(prov.get(r.provenance_id)) ?? { sourceSlug: r.source_slug, sourceName: r.source_name }} />
                      </td>
                    </tr>
                  ))}
                </tbody>
              </table>
            </div>
            {g.rows.length > ROWS_PER_TABLE ? (
              <p className="mt-1 text-[12px] text-ink-3">
                Showing the {ROWS_PER_TABLE} most recent rows of {g.rows.length}; every year is plotted above and available via{' '}
                <a className="ci-link" href={`/api/v1/cancers/${b.cancer.id}/statistics`}>
                  the API
                </a>
                .
              </p>
            ) : null}
            <Freshness dataUpdatedAt={g.rows.reduce<Date | string | null>((m, r) => (m == null || String(r.updated_at) > String(m) ? r.updated_at : m), null)} sourceVersion={prov.get(g.rows[0]!.provenance_id)?.dataset_version ?? null} />
          </Section>
        );
      })}
      <Freshness dataUpdatedAt={latest} extra={`${obs.length} observations`} />
    </div>
  );
}