HTML 77.2%
TypeScript 10.5%
Python 9.6%
JavaScript 2.5%
1import Link from 'next/link';2import { Evidence } from '@/components/evidence';3import { Chip, OpennessBadge, StatusBadge, TierBadge } from '@/components/ui/badges';4import { DataTable, EmptyRow, Td, Th } from '@/components/ui/data-table';5import { EntityLink } from '@/components/ui/entity';6import { Note } from '@/components/ui/section';7import { fmtDate, fmtInt, fmtParams, fmtScore, fmtTokens, fmtUsdPerM, num } from '@/lib/format';8import { routes } from '@/lib/site';9import type { EntitySummary, Price, TimeMachineLeader, TimeMachineModelRow } from '@/lib/types';1011/* Time-machine tables (server). Every as-of value is an evidence trigger (claim validity in the drawer); the "today"12 column comes from the same payload (`model.attributes` is the current record), so nothing extra is fetched. */1314function AsOf({ e, property, value, display }: { e: EntitySummary; property: string; value: unknown; display: string }) {15 if (value === null || value === undefined || value === '') return <span className="text-ink-3">—</span>;16 return (17 <Evidence slug={e.slug} property={property} value={value} display={display} entity={{ name: e.name, entity_type: e.entity_type }}>18 <span className="tnum">{display}</span>19 </Evidence>20 );21}22function Today({ asof, now, format }: { asof: unknown; now: unknown; format: (v: unknown) => string }) {23 const a = asof === null || asof === undefined || asof === '' ? null : format(asof);24 const b = now === null || now === undefined || now === '' ? null : format(now);25 if (b === null) return <span className="text-ink-3">—</span>;26 if (a === b) return <span className="tnum text-ink-3">same</span>;27 return <span className="tnum text-accent-2">{b}</span>;28}2930export function ModelsAsOf({ rows, total, date, limit }: { rows: TimeMachineModelRow[]; total: number | null; date: string; limit: number }) {31 return (32 <>33 <DataTable caption={`Models as of ${date}`} scroll compact>34 <thead>35 <tr>36 <Th>Model</Th>37 <Th>Organization</Th>38 <Th num>Params</Th>39 <Th num>Context (as of)</Th>40 <Th num>Context (today)</Th>41 <Th>Openness</Th>42 <Th>Status (as of)</Th>43 <Th>Status (today)</Th>44 <Th>Released</Th>45 <Th>Basis</Th>46 <Th>History</Th>47 </tr>48 </thead>49 <tbody>50 {rows.length === 0 && <EmptyRow cols={11}>No canonical model existed at this date according to release dates and dated claims.</EmptyRow>}51 {rows.map(({ model: m, attributes_as_of: a, observed_then, reconstructed }) => (52 <tr key={m.id}>53 <Td primary>54 <EntityLink e={m} />55 </Td>56 <Td label="Organization" className="text-ink-2">57 {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>}58 </Td>59 <Td num label="Params">60 <AsOf e={m} property="parameter_count" value={a.parameter_count ?? null} display={fmtParams(a.parameter_count)} />61 </Td>62 <Td num label="Context (as of)">63 <AsOf e={m} property="context_length" value={a.context_length ?? null} display={fmtTokens(a.context_length)} />64 </Td>65 <Td num label="Context (today)">66 <Today asof={a.context_length} now={m.attributes?.context_length} format={(v) => fmtTokens(v)} />67 </Td>68 <Td label="Openness">{typeof a.openness === 'string' ? <OpennessBadge openness={a.openness} /> : <span className="text-ink-3">—</span>}</Td>69 <Td label="Status (as of)">{typeof a.status === 'string' ? <StatusBadge status={a.status} /> : <span className="text-ink-3">—</span>}</Td>70 <Td label="Status (today)">71 <Today asof={a.status} now={m.attributes?.status ?? m.status} format={(v) => String(v)} />72 </Td>73 <Td label="Released" className="tnum text-ink-2">74 {typeof a.release_date === 'string' ? fmtDate(a.release_date) : typeof m.attributes?.release_date === 'string' ? fmtDate(m.attributes.release_date as string) : '—'}75 </Td>76 <Td label="Basis">{observed_then ? <Chip tone="accent">observed</Chip> : reconstructed ? <Chip tone="estimated">reconstructed</Chip> : <Chip>—</Chip>}</Td>77 <Td label="History">78 <Link href={routes.entityAsOf(m, date)} className="link text-xs whitespace-nowrap">79 as of {date} →80 </Link>81 </Td>82 </tr>83 ))}84 </tbody>85 </DataTable>86 {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>}87 <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>88 </>89 );90}9192export function PricesAsOf({ rows, total, date }: { rows: Price[]; total: number | null; date: string }) {93 return (94 <>95 <DataTable caption={`Provider prices valid on ${date}`} scroll compact>96 <thead>97 <tr>98 <Th>Model</Th>99 <Th>Provider</Th>100 <Th num>Input / 1M</Th>101 <Th num>Output / 1M</Th>102 <Th num>Context</Th>103 <Th>Valid from</Th>104 <Th>Valid to</Th>105 <Th>Source</Th>106 </tr>107 </thead>108 <tbody>109 {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>}110 {rows.map((p) => (111 <tr key={p.id}>112 <Td primary>113 <EntityLink e={p.model} />114 </Td>115 <Td label="Provider">116 <EntityLink e={p.provider} className="text-ink-2" />117 </Td>118 <Td num label="Input" className="tnum text-accent-2">{fmtUsdPerM(p.input_per_mtok)}</Td>119 <Td num label="Output" className="tnum text-accent-2">{fmtUsdPerM(p.output_per_mtok)}</Td>120 <Td num label="Context" className="tnum">{num(p.context_length) === null ? '—' : fmtTokens(p.context_length)}</Td>121 <Td label="Valid from" className="tnum text-ink-2">{fmtDate(p.valid_from)}</Td>122 <Td label="Valid to" className="tnum text-ink-2">{p.valid_to ? fmtDate(p.valid_to) : <span className="text-positive">current</span>}</Td>123 <Td label="Source">124 <span className="inline-flex items-center gap-1.5">125 <TierBadge tier={p.tier} />126 {p.source_url && (127 <a href={p.source_url} target="_blank" rel="noopener noreferrer" className="link text-xs">128 source129 </a>130 )}131 </span>132 </Td>133 </tr>134 ))}135 </tbody>136 </DataTable>137 {total !== null && total > rows.length && <Note className="mt-2">Showing {fmtInt(rows.length)} of {fmtInt(total)} offers valid on this date.</Note>}138 </>139 );140}141142export function LeadersAsOf({ rows, date }: { rows: TimeMachineLeader[]; date: string }) {143 return (144 <>145 <DataTable caption={`Benchmark leaders as of ${date}`} scroll compact>146 <thead>147 <tr>148 <Th>Benchmark</Th>149 <Th>Leader</Th>150 <Th>Organization</Th>151 <Th num>Score</Th>152 <Th>Metric · group</Th>153 <Th>Trust</Th>154 <Th num>Models ranked</Th>155 </tr>156 </thead>157 <tbody>158 {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>}159 {rows.map((r) => (160 <tr key={r.benchmark.id}>161 <Td primary>162 <Link href={routes.benchmark(r.benchmark.slug)} className="text-ink hover:text-accent hover:underline">163 {r.benchmark.name}164 </Link>165 {r.benchmark.category && <span className="block text-[11px] text-ink-3">{r.benchmark.category}</span>}166 </Td>167 <Td label="Leader">{r.leader ? <EntityLink e={r.leader.model} /> : <span className="text-ink-3">—</span>}</Td>168 <Td label="Organization" className="text-ink-2">{r.leader?.model.organization?.name ?? '—'}</Td>169 <Td num label="Score" className="tnum font-medium">{r.leader ? fmtScore(r.leader.score) : '—'}</Td>170 <Td label="Metric" className="text-xs text-ink-2">171 {r.leader?.metric ?? '—'}172 {r.leader?.group_label && r.leader.group_label !== r.leader.metric && <span className="block text-ink-3">{r.leader.group_label}</span>}173 </Td>174 <Td label="Trust" className="text-xs text-ink-2">{r.leader?.trust_level ?? '—'}</Td>175 <Td num label="Models ranked" className="tnum">{r.leader?.n_models === undefined ? '—' : fmtInt(r.leader.n_models)}</Td>176 </tr>177 ))}178 </tbody>179 </DataTable>180 <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>181 </>182 );183}184185export function HardwareAsOf({ rows, date }: { rows: { hardware: EntitySummary; reconstructed?: boolean }[]; date: string }) {186 return (187 <DataTable caption={`Hardware as of ${date}`} scroll compact>188 <thead>189 <tr>190 <Th>Hardware</Th>191 <Th>Manufacturer</Th>192 <Th>Kind</Th>193 <Th num>Memory</Th>194 <Th num>Bandwidth</Th>195 <Th>Released</Th>196 <Th>Basis</Th>197 </tr>198 </thead>199 <tbody>200 {rows.length === 0 && <EmptyRow cols={7}>No hardware with a release date on or before this date.</EmptyRow>}201 {rows.map(({ hardware: h, reconstructed }) => {202 const a = h.attributes ?? {};203 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);204 return (205 <tr key={h.id}>206 <Td primary>207 <EntityLink e={h} />208 </Td>209 <Td label="Manufacturer" className="text-ink-2">{typeof a.manufacturer === 'string' ? a.manufacturer : h.organization?.name ?? '—'}</Td>210 <Td label="Kind" className="text-ink-2">{typeof a.kind === 'string' ? a.kind : '—'}</Td>211 <Td num label="Memory" className="tnum">{mem === '—' ? mem : `${mem} GB`}</Td>212 <Td num label="Bandwidth" className="tnum">{num(a.memory_bandwidth_gbs) === null ? '—' : `${fmtInt(a.memory_bandwidth_gbs)} GB/s`}</Td>213 <Td label="Released" className="tnum text-ink-2">{typeof a.release_date === 'string' ? fmtDate(a.release_date) : '—'}</Td>214 <Td label="Basis">{reconstructed ? <Chip tone="estimated">reconstructed</Chip> : <Chip tone="accent">observed</Chip>}</Td>215 </tr>216 );217 })}218 </tbody>219 </DataTable>220 );221}222