mrhid6andClaude Opus 5
cefbac625c
The screen that answers "why did this stop working on the 14th". Read top to bottom it is one instance's whole history: what was issued, why, by whom, and what replaced it. Superseded entries stay visible and overprinted rather than disappearing, because licences are append-only and hiding them would destroy the only record that answers the question. Each links to its successor. Injection state is shown live for cloud instances and omitted for self-hosted, where the customer holds the blob and there is nothing for us to have written. Staff relinks carry no cap, with the reason stated inline: the customer cap exists to put a human in the loop, and this is that human. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
83 lines
3.7 KiB
TypeScript
83 lines
3.7 KiB
TypeScript
import clsx from "clsx";
|
|
import type { License } from "@/lib/api";
|
|
import { formatDate, formatStamp, limitLabel } from "@/lib/format";
|
|
|
|
const REASON: Record<License["reason"], string> = {
|
|
new: "New",
|
|
renewal: "Renewal",
|
|
tier_change: "Tier change",
|
|
relink: "Relink",
|
|
manual: "Manual",
|
|
};
|
|
|
|
/*
|
|
* Licences are append-only: a renewal supersedes its predecessor rather than
|
|
* replacing it. So this is a ledger, not a table. Superseded rows stay visible
|
|
* and are overprinted the way a cancelled instrument is — hiding them would
|
|
* destroy the only record of why an instance stopped working on a given date.
|
|
*/
|
|
export function Ledger({ licenses }: { licenses: License[] }) {
|
|
if (licenses.length === 0) {
|
|
return (
|
|
<p className="text-ink-2">
|
|
No licence has ever been issued for this instance, so it is read-only.
|
|
</p>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<ul className="grid">
|
|
{licenses.map((l) => {
|
|
const dead = Boolean(l.superseded_by);
|
|
return (
|
|
<li
|
|
key={l.license_id}
|
|
className={clsx(
|
|
"grid gap-4 border-b border-rule-soft py-4 last:border-0 sm:grid-cols-[9.5rem_1fr]",
|
|
dead && "text-ink-3",
|
|
)}
|
|
>
|
|
<div className="font-mono text-[0.72rem] tabular-nums text-ink-3">
|
|
<b
|
|
className={clsx(
|
|
"block text-[0.82rem] font-semibold",
|
|
dead ? "text-ink-3" : "text-ink",
|
|
)}
|
|
>
|
|
{formatDate(l.issued_at)}
|
|
</b>
|
|
{formatStamp(l.issued_at)}
|
|
</div>
|
|
<div className="grid justify-items-start gap-1.5">
|
|
{dead && (
|
|
<span className="-rotate-2 rounded-sm border-2 border-archival px-1.5 py-0.5 font-mono text-[0.72rem] uppercase tracking-[0.18em] text-archival opacity-75">
|
|
Superseded
|
|
</span>
|
|
)}
|
|
<p className="flex flex-wrap items-center gap-2 font-semibold">
|
|
{l.tier.replace("_", " ")}
|
|
<span className="rounded-sm border border-rule px-1.5 py-0.5 font-mono text-[0.72rem] font-normal uppercase tracking-[0.09em] text-accent">
|
|
{REASON[l.reason]}
|
|
</span>
|
|
</p>
|
|
<p className="font-mono text-[0.72rem] tabular-nums text-ink-3">
|
|
{l.license_id.slice(0, 8)} · expires {formatDate(l.expires_at)} ·{" "}
|
|
{limitLabel(l.limits.max_servers)} servers · issued by {l.issued_by}
|
|
{l.superseded_by && (
|
|
<>
|
|
{" "}
|
|
· replaced by{" "}
|
|
<span className="text-accent underline">
|
|
{l.superseded_by.slice(0, 8)}
|
|
</span>
|
|
</>
|
|
)}
|
|
</p>
|
|
</div>
|
|
</li>
|
|
);
|
|
})}
|
|
</ul>
|
|
);
|
|
}
|