Logan CusanoandClaude Opus 5.5
268470b6c0
Checkin now carries disk_free_bytes/disk_total_bytes. Stored on the node doc (not overwritten by older nodes that don't send them). Node page shows a Disk row; node cards warn amber under 15% free, red under 5% or 2 GB. A full disk stopped node-002 recording for 17 days while it showed Online. Frontend unverified locally (no Node, #207); CI build typechecks. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
80 lines
3.0 KiB
TypeScript
80 lines
3.0 KiB
TypeScript
import Link from "next/link";
|
|
import { StatusBadge } from "@/components/StatusBadge";
|
|
import type { NodeRecord, SystemRecord } from "@/lib/types";
|
|
import { diskState } from "@/lib/nodeDisk";
|
|
|
|
interface Props {
|
|
node: NodeRecord;
|
|
system?: SystemRecord;
|
|
/**
|
|
* When false, the card renders without its `/nodes/[id]` Link wrapper so a
|
|
* parent click handler can take the interaction (pending nodes open the
|
|
* config modal instead of navigating). Defaults to true.
|
|
*/
|
|
linkToDetail?: boolean;
|
|
}
|
|
|
|
export function NodeCard({ node, system, linkToDetail = true }: Props) {
|
|
const lastSeen = node.last_seen
|
|
? new Date(node.last_seen).toLocaleTimeString()
|
|
: "never";
|
|
|
|
const body = (
|
|
<div className="bg-surface border border-line rounded-lg p-4 hover:border-line-strong transition-colors cursor-pointer">
|
|
<div className="flex items-start justify-between mb-3">
|
|
<div>
|
|
<p className="font-mono font-semibold text-white">{node.name}</p>
|
|
<p className="text-xs text-ink-muted font-mono">{node.node_id}</p>
|
|
</div>
|
|
<StatusBadge status={node.status} />
|
|
</div>
|
|
<div className="space-y-1 text-xs font-mono text-ink-2">
|
|
<div className="flex justify-between">
|
|
<span>System</span>
|
|
<span className="text-ink-2">{system?.name ?? "Unassigned"}</span>
|
|
</div>
|
|
<div className="flex justify-between">
|
|
<span>Location</span>
|
|
<span className="text-ink-2">
|
|
{node.lat != null && node.lon != null
|
|
? `${node.lat.toFixed(4)}, ${node.lon.toFixed(4)}`
|
|
: "Unknown"}
|
|
</span>
|
|
</div>
|
|
<div className="flex justify-between">
|
|
<span>Last seen</span>
|
|
<span className="text-ink-2">{lastSeen}</span>
|
|
</div>
|
|
</div>
|
|
{(() => {
|
|
const disk = diskState(node);
|
|
if (!disk || disk.level === "ok") return null;
|
|
return (
|
|
<div className={`mt-3 text-xs font-mono border-t border-line pt-2 ${disk.level === "critical" ? "text-sev-major" : "text-sev-moderate"}`}>
|
|
⚠ Disk {disk.level === "critical" ? "nearly full" : "low"}: {disk.label}
|
|
</div>
|
|
);
|
|
})()}
|
|
{!node.configured && (
|
|
<div className="mt-3 text-xs text-indigo-400 font-mono border-t border-line pt-2">
|
|
⚠ Needs configuration
|
|
</div>
|
|
)}
|
|
{node.is_overridden && (
|
|
<div className="mt-3 text-xs text-yellow-500 font-mono border-t border-line pt-2 flex justify-between">
|
|
<span>⚠ Local Override</span>
|
|
{node.override_timeout_at ? (
|
|
<span className="text-ink-muted">
|
|
Resets: {new Date(node.override_timeout_at).toLocaleTimeString()}
|
|
</span>
|
|
) : (
|
|
<span className="text-ink-muted">Permanent</span>
|
|
)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
|
|
return linkToDetail ? <Link href={`/nodes/${node.node_id}`}>{body}</Link> : body;
|
|
}
|