31 lines
1.0 KiB
TypeScript
31 lines
1.0 KiB
TypeScript
import { Badge } from "../common/Badge";
|
|
import { Card } from "../common/Card";
|
|
import { formatValue } from "../../lib/format";
|
|
import type { MetricValue } from "../../types";
|
|
|
|
interface LiveStatusBoardProps {
|
|
status: MetricValue[];
|
|
}
|
|
|
|
export function LiveStatusBoard({ status }: LiveStatusBoardProps) {
|
|
if (!status.length) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<Card title="Stan systemu" subtitle="Temperatura falownika i kontrola swiezosci odczytu">
|
|
<div className="grid gap-3 sm:grid-cols-2">
|
|
{status.map((metric) => (
|
|
<div key={metric.metric_id} className="rounded-2xl border border-white/10 bg-slate-950/30 p-4">
|
|
<div className="mb-3 flex items-center justify-between gap-3">
|
|
<div className="text-sm font-medium text-white">{metric.label}</div>
|
|
<Badge tone={metric.status}>{metric.status}</Badge>
|
|
</div>
|
|
<div className="text-sm text-slate-300">{formatValue(metric.value, metric.unit, metric.precision)}</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</Card>
|
|
);
|
|
}
|