import Link from 'next/link';
import { Evidence } from '@/components/evidence';
import { Chip, OpennessBadge, StatusBadge, TierBadge } from '@/components/ui/badges';
import { DataTable, EmptyRow, Td, Th } from '@/components/ui/data-table';
import { EntityLink } from '@/components/ui/entity';
import { Note } from '@/components/ui/section';
import { fmtDate, fmtInt, fmtParams, fmtScore, fmtTokens, fmtUsdPerM, num } from '@/lib/format';
import { routes } from '@/lib/site';
import type { EntitySummary, Price, TimeMachineLeader, TimeMachineModelRow } from '@/lib/types';

/* Time-machine tables (server). Every as-of value is an evidence trigger (claim validity in the drawer); the "today"
   column comes from the same payload (`model.attributes` is the current record), so nothing extra is fetched. */

function AsOf({ e, property, value, display }: { e: EntitySummary; property: string; value: unknown; display: string }) {
  if (value === null || value === undefined || value === '') return <span className="text-ink-3">—</span>;
  return (
    <Evidence slug={e.slug} property={property} value={value} display={display} entity={{ name: e.name, entity_type: e.entity_type }}>
      <span className="tnum">{display}</span>
    </Evidence>
  );
}
function Today({ asof, now, format }: { asof: unknown; now: unknown; format: (v: unknown) => string }) {
  const a = asof === null || asof === undefined || asof === '' ? null : format(asof);
  const b = now === null || now === undefined || now === '' ? null : format(now);
  if (b === null) return <span className="text-ink-3">—</span>;
  if (a === b) return <span className="tnum text-ink-3">same</span>;
  return <span className="tnum text-accent-2">{b}</span>;
}

export function ModelsAsOf({ rows, total, date, limit }: { rows: TimeMachineModelRow[]; total: number | null; date: string; limit: number }) {
  return (
    <>
      <DataTable caption={`Models as of ${date}`} scroll compact>
        <thead>
          <tr>
            <Th>Model</Th>
            <Th>Organization</Th>
            <Th num>Params</Th>
            <Th num>Context (as of)</Th>
            <Th num>Context (today)</Th>
            <Th>Openness</Th>
            <Th>Status (as of)</Th>
            <Th>Status (today)</Th>
            <Th>Released</Th>
            <Th>Basis</Th>
            <Th>History</Th>
          </tr>
        </thead>
        <tbody>
          {rows.length === 0 && <EmptyRow cols={11}>No canonical model existed at this date according to release dates and dated claims.</EmptyRow>}
          {rows.map(({ model: m, attributes_as_of: a, observed_then, reconstructed }) => (
            <tr key={m.id}>
              <Td primary>
                <EntityLink e={m} />
              </Td>
              <Td label="Organization" className="text-ink-2">
                {m.organization ? <Link href={routes.entity({ entity_type: 'company', slug: m.organization.slug })} className="hover:text-accent">{m.organization.name}</Link> : <span className="text-ink-3">—</span>}
              </Td>
              <Td num label="Params">
                <AsOf e={m} property="parameter_count" value={a.parameter_count ?? null} display={fmtParams(a.parameter_count)} />
              </Td>
              <Td num label="Context (as of)">
                <AsOf e={m} property="context_length" value={a.context_length ?? null} display={fmtTokens(a.context_length)} />
              </Td>
              <Td num label="Context (today)">
                <Today asof={a.context_length} now={m.attributes?.context_length} format={(v) => fmtTokens(v)} />
              </Td>
              <Td label="Openness">{typeof a.openness === 'string' ? <OpennessBadge openness={a.openness} /> : <span className="text-ink-3">—</span>}</Td>
              <Td label="Status (as of)">{typeof a.status === 'string' ? <StatusBadge status={a.status} /> : <span className="text-ink-3">—</span>}</Td>
              <Td label="Status (today)">
                <Today asof={a.status} now={m.attributes?.status ?? m.status} format={(v) => String(v)} />
              </Td>
              <Td label="Released" className="tnum text-ink-2">
                {typeof a.release_date === 'string' ? fmtDate(a.release_date) : typeof m.attributes?.release_date === 'string' ? fmtDate(m.attributes.release_date as string) : '—'}
              </Td>
              <Td label="Basis">{observed_then ? <Chip tone="accent">observed</Chip> : reconstructed ? <Chip tone="estimated">reconstructed</Chip> : <Chip>—</Chip>}</Td>
              <Td label="History">
                <Link href={routes.entityAsOf(m, date)} className="link text-xs whitespace-nowrap">
                  as of {date} →
                </Link>
              </Td>
            </tr>
          ))}
        </tbody>
      </DataTable>
      {total !== null && total > rows.length && <Note className="mt-2">Showing {fmtInt(rows.length)} of {fmtInt(total)} models that existed on this date (API cap {fmtInt(limit)}). Open a model's History tab for its full as-of record.</Note>}
      <Note className="mt-1">“Today” columns compare the as-of value with the current record; “same” means no recorded change. Click any as-of value for the claim behind it (source, tier, valid from → to).</Note>
    </>
  );
}

export function PricesAsOf({ rows, total, date }: { rows: Price[]; total: number | null; date: string }) {
  return (
    <>
      <DataTable caption={`Provider prices valid on ${date}`} scroll compact>
        <thead>
          <tr>
            <Th>Model</Th>
            <Th>Provider</Th>
            <Th num>Input / 1M</Th>
            <Th num>Output / 1M</Th>
            <Th num>Context</Th>
            <Th>Valid from</Th>
            <Th>Valid to</Th>
            <Th>Source</Th>
          </tr>
        </thead>
        <tbody>
          {rows.length === 0 && <EmptyRow cols={8}>No price row's validity interval covers this date (price history starts when AI Atlas first observed the provider).</EmptyRow>}
          {rows.map((p) => (
            <tr key={p.id}>
              <Td primary>
                <EntityLink e={p.model} />
              </Td>
              <Td label="Provider">
                <EntityLink e={p.provider} className="text-ink-2" />
              </Td>
              <Td num label="Input" className="tnum text-accent-2">{fmtUsdPerM(p.input_per_mtok)}</Td>
              <Td num label="Output" className="tnum text-accent-2">{fmtUsdPerM(p.output_per_mtok)}</Td>
              <Td num label="Context" className="tnum">{num(p.context_length) === null ? '—' : fmtTokens(p.context_length)}</Td>
              <Td label="Valid from" className="tnum text-ink-2">{fmtDate(p.valid_from)}</Td>
              <Td label="Valid to" className="tnum text-ink-2">{p.valid_to ? fmtDate(p.valid_to) : <span className="text-positive">current</span>}</Td>
              <Td label="Source">
                <span className="inline-flex items-center gap-1.5">
                  <TierBadge tier={p.tier} />
                  {p.source_url && (
                    <a href={p.source_url} target="_blank" rel="noopener noreferrer" className="link text-xs">
                      source
                    </a>
                  )}
                </span>
              </Td>
            </tr>
          ))}
        </tbody>
      </DataTable>
      {total !== null && total > rows.length && <Note className="mt-2">Showing {fmtInt(rows.length)} of {fmtInt(total)} offers valid on this date.</Note>}
    </>
  );
}

export function LeadersAsOf({ rows, date }: { rows: TimeMachineLeader[]; date: string }) {
  return (
    <>
      <DataTable caption={`Benchmark leaders as of ${date}`} scroll compact>
        <thead>
          <tr>
            <Th>Benchmark</Th>
            <Th>Leader</Th>
            <Th>Organization</Th>
            <Th num>Score</Th>
            <Th>Metric · group</Th>
            <Th>Trust</Th>
            <Th num>Models ranked</Th>
          </tr>
        </thead>
        <tbody>
          {rows.length === 0 && <EmptyRow cols={7}>No benchmark result had been observed by this date — leaders are known only once a result is observed (evaluation dates are not used).</EmptyRow>}
          {rows.map((r) => (
            <tr key={r.benchmark.id}>
              <Td primary>
                <Link href={routes.benchmark(r.benchmark.slug)} className="text-ink hover:text-accent hover:underline">
                  {r.benchmark.name}
                </Link>
                {r.benchmark.category && <span className="block text-[11px] text-ink-3">{r.benchmark.category}</span>}
              </Td>
              <Td label="Leader">{r.leader ? <EntityLink e={r.leader.model} /> : <span className="text-ink-3">—</span>}</Td>
              <Td label="Organization" className="text-ink-2">{r.leader?.model.organization?.name ?? '—'}</Td>
              <Td num label="Score" className="tnum font-medium">{r.leader ? fmtScore(r.leader.score) : '—'}</Td>
              <Td label="Metric" className="text-xs text-ink-2">
                {r.leader?.metric ?? '—'}
                {r.leader?.group_label && r.leader.group_label !== r.leader.metric && <span className="block text-ink-3">{r.leader.group_label}</span>}
              </Td>
              <Td label="Trust" className="text-xs text-ink-2">{r.leader?.trust_level ?? '—'}</Td>
              <Td num label="Models ranked" className="tnum">{r.leader?.n_models === undefined ? '—' : fmtInt(r.leader.n_models)}</Td>
            </tr>
          ))}
        </tbody>
      </DataTable>
      <Note className="mt-2">One row per benchmark: the best current row of the primary comparability group among results observed by the date. See the benchmark's Frontier tab for the full leader history.</Note>
    </>
  );
}

export function HardwareAsOf({ rows, date }: { rows: { hardware: EntitySummary; reconstructed?: boolean }[]; date: string }) {
  return (
    <DataTable caption={`Hardware as of ${date}`} scroll compact>
      <thead>
        <tr>
          <Th>Hardware</Th>
          <Th>Manufacturer</Th>
          <Th>Kind</Th>
          <Th num>Memory</Th>
          <Th num>Bandwidth</Th>
          <Th>Released</Th>
          <Th>Basis</Th>
        </tr>
      </thead>
      <tbody>
        {rows.length === 0 && <EmptyRow cols={7}>No hardware with a release date on or before this date.</EmptyRow>}
        {rows.map(({ hardware: h, reconstructed }) => {
          const a = h.attributes ?? {};
          const mem = Array.isArray(a.memory_gb) ? (a.memory_gb as unknown[]).map((x) => fmtInt(x)).join(' / ') : num(a.memory_gb) === null ? '—' : fmtInt(a.memory_gb);
          return (
            <tr key={h.id}>
              <Td primary>
                <EntityLink e={h} />
              </Td>
              <Td label="Manufacturer" className="text-ink-2">{typeof a.manufacturer === 'string' ? a.manufacturer : h.organization?.name ?? '—'}</Td>
              <Td label="Kind" className="text-ink-2">{typeof a.kind === 'string' ? a.kind : '—'}</Td>
              <Td num label="Memory" className="tnum">{mem === '—' ? mem : `${mem} GB`}</Td>
              <Td num label="Bandwidth" className="tnum">{num(a.memory_bandwidth_gbs) === null ? '—' : `${fmtInt(a.memory_bandwidth_gbs)} GB/s`}</Td>
              <Td label="Released" className="tnum text-ink-2">{typeof a.release_date === 'string' ? fmtDate(a.release_date) : '—'}</Td>
              <Td label="Basis">{reconstructed ? <Chip tone="estimated">reconstructed</Chip> : <Chip tone="accent">observed</Chip>}</Td>
            </tr>
          );
        })}
      </tbody>
    </DataTable>
  );
}