import Link from 'next/link';
import { Section } from '@/components/ui/section';
import { EmptyState } from '@/components/ui/empty-state';
import { Freshness } from '@/components/ui/freshness';
import { ClaimBadge, ConfidenceBadge } from '@/components/ui/badge';
import { ratioGapRankings } from '@/lib/queries/research-gap';
import { fmtDate, fmtInt, fmtPct, fmtValue, scopeLabel } from '@/lib/format';

/**
 * Home module "Largest trial and research gaps" (§105, §328, §265-266): the ratio-based gap indexes
 * (Trial Gap Ratio, Research Gap Ratio) from the current ranking snapshots of the latest burden scope
 * of a geography. Each row exposes the two shares that produced the log₂ ratio (lineage stored on the
 * ranking row). The percentile-based indexes remain available under /rankings; the full component
 * table, scatter plots and CSV live at /research-gap.
 */
export async function GapsModule({ geo = 'USA', limit = 8 }: { geo?: string; limit?: number }) {
  const gaps = await ratioGapRankings(geo, limit);
  return (
    <Section
      id="gaps"
      kicker="Unmet need"
      title="Largest trial and research gaps"
      description="log₂ of a cancer's share of deaths divided by its share of active interventional trials (trial gap) or of publications of the last five years (research gap), over the eligible top-level cancers of one burden scope. 0 = proportional; +1 = twice the share of deaths that activity would suggest; −1 = half. A quantitative signal, not an accusation."
      actions={
        <>
          <Link href="/research-gap" className="ci-link">
            Research Gap Index →
          </Link>
          <Link href="/rankings" className="ci-link">
            All rankings
          </Link>
        </>
      }
    >
      {gaps.length === 0 ? (
        <EmptyState title="Gap indexes not yet computed" knows={[{ label: 'Percentile-based Trial Gap Index', href: '/rankings/trial_gap' }, { label: 'Percentile-based Research Gap Index', href: '/rankings/research_gap' }]}>
          Gap ratios require a burden scope (deaths per top-level cancer for one geography, year and source) plus trial and literature counters. Nothing is shown until such a snapshot exists.
        </EmptyState>
      ) : (
        <div className="grid gap-6 lg:grid-cols-2">
          {gaps.map(({ metric, snapshot, rows }) => {
            const isTrial = metric.slug === 'trial_gap_ratio';
            return (
              <div key={metric.slug} className="min-w-0">
                <p className="mb-1 flex flex-wrap items-baseline justify-between gap-x-2">
                  <Link href={`/rankings/${metric.slug}?scope=${encodeURIComponent(snapshot.scope_key)}`} className="ci-link font-medium">
                    {metric.name}
                  </Link>
                  <span className="text-[11.5px] text-ink-3">{scopeLabel(snapshot.scope_key)}</span>
                </p>
                <div className="ci-table-wrap">
                  <table className="ci-table">
                    <thead>
                      <tr>
                        <th className="num">#</th>
                        <th>Cancer</th>
                        <th className="num">Ratio (log₂)</th>
                        <th className="num">Deaths</th>
                        <th className="num">Death share</th>
                        <th className="num">{isTrial ? 'Active trials' : 'Publications 5y'}</th>
                        <th className="num">{isTrial ? 'Trial share' : 'Pub. share'}</th>
                        <th>Confidence</th>
                      </tr>
                    </thead>
                    <tbody>
                      {rows.map((r) => (
                        <tr key={r.id}>
                          <td className="num">{r.rank}</td>
                          <td>
                            <Link className="ci-link" href={`/cancer/${r.slug}/rankings`}>
                              {r.canonical_name}
                            </Link>
                          </td>
                          <td className={`num font-medium ${r.value >= 1 ? 'text-danger' : ''}`}>{fmtValue(r.value, r.unit)}</td>
                          <td className="num">{fmtInt(r.inputs.deaths as number | undefined)}</td>
                          <td className="num text-ink-3">{fmtPct(r.inputs.deathShare as number | undefined, 1)}</td>
                          <td className="num">{fmtInt((isTrial ? r.inputs.activeTrials : r.inputs.publications5y) as number | undefined)}</td>
                          <td className="num text-ink-3">{fmtPct((isTrial ? r.inputs.trialShare : r.inputs.publicationShare) as number | undefined, 1)}</td>
                          <td>
                            <ConfidenceBadge level={r.confidence} />
                          </td>
                        </tr>
                      ))}
                    </tbody>
                  </table>
                </div>
                <p className="mt-1.5 flex flex-wrap items-center gap-1.5 text-[11.5px] text-ink-3">
                  <ClaimBadge kind="computed" />
                  <span>
                    formula <code className="ci-mono">{metric.formula}</code> · <span className="ci-mono">{snapshot.formula_version}</span>
                  </span>
                  <span>sources: {snapshot.source_ids.join(', ')}</span>
                  <span>{fmtInt(snapshot.eligible_entities)} eligible</span>
                </p>
                <p className="mt-1 text-[11.5px] text-ink-3">
                  {isTrial ? 'Caveat: trial counts aggregate a cancer and its NCIt descendants; trials registered at a broader level (e.g. "colorectal") are attributed to the broader entity and can overstate the gap of narrower sites.' : 'Caveat: literature counts are query-based per entity and not aggregated over descendants; a narrow query inflates the ratio.'}{' '}
                  Burden is US-only while global estimates are under license review.{' '}
                  <Link className="ci-link" href="/methodology#research-gap">
                    Read the caveats
                  </Link>
                </p>
                <Freshness dataUpdatedAt={snapshot.generated_at} extra={`snapshot generated ${fmtDate(snapshot.generated_at)}`} />
              </div>
            );
          })}
        </div>
      )}
    </Section>
  );
}