spb/datacenterindex

1import type { EnergyContext } from "@dci/core";2import { ExternalLink } from "lucide-react";3import { ApiNote } from "@/components/intelligence/shared";4import { fmtInt, fmtPct } from "@/lib/format";56function Cell({ label, value, note }: { label: string; value: string; note?: string }) {7  return (8    <div className="min-w-0 border-b border-hair py-2 pr-3 sm:border-b-0 sm:border-r sm:last:border-r-0">9      <div className="figure text-[18px] font-medium leading-none text-ink">{value}</div>10      <div className="label-caps mt-1 truncate">{label}</div>11      {note && <div className="text-[11px] text-ink-4">{note}</div>}12    </div>13  );14}1516/**17 * POWER / ENERGY CONTEXT for a country — national grid indicators as published (World Bank), the year they18 * describe, and the API note reminding that a national mix is not a facility's contracted electricity.19 * `gridCarbonIntensity` reads "not available" when the API has no reliable public source.20 */21export function EnergyContextPanel({ e, knownMw }: { e: EnergyContext; knownMw: number | null }) {22  const year = e.statsYear ? String(e.statsYear) : null;23  const load = knownMw && e.electricityTwh ? (knownMw * 8.76) / 1000 / e.electricityTwh : null;24  return (25    <div className="flex flex-col gap-3">26      <div className="grid grid-cols-2 gap-x-3 sm:grid-cols-4">27        <Cell label="Renewable share" value={e.renewableShare === null ? "—" : fmtPct(e.renewableShare / 100, 1)} note={e.renewableShare === null ? "not published" : `of electricity output${year ? ` · ${year}` : ""}`} />28        <Cell label="Electricity output" value={e.electricityTwh === null ? "—" : `${fmtInt(e.electricityTwh)} TWh`} note={e.electricityTwh === null ? "not published" : `per year${year ? ` · ${year}` : ""}`} />29        <Cell label="Grid carbon intensity" value={e.gridCarbonIntensity === null ? "not available" : `${fmtInt(e.gridCarbonIntensity)} gCO₂/kWh`} note={e.gridCarbonIntensity === null ? "no reliable public source connected" : year ?? undefined} />30        <Cell label="Known DC load, upper bound" value={load === null ? "—" : `≤ ${fmtPct(load, 2)}`} note={load === null ? "needs known MW and output" : "known MW × 8 760 h ÷ output, at full utilisation"} />31      </div>32      <ApiNote note={e.note} label="Reading" />33      <p className="text-[11.5px] text-ink-4">34        Source: {e.sourceName ?? "not recorded"}35        {e.sourceUrl && (36          <>37            {" "}38            <a href={e.sourceUrl} target="_blank" rel="noopener noreferrer" className="inline-flex items-center gap-1 underline decoration-hair-2 hover:text-ink">39              dataset <ExternalLink className="size-3" />40            </a>41          </>42        )}43        {year && <> · statistics year {year}</>} · World Bank indicators are CC BY 4.0.44      </p>45    </div>46  );47}48