Three server rows whose CPU and memory bars breathe with fresh readings every second, turning amber and red past their thresholds beside a live status dot.
The import and the props worth knowing about, in one place.
import { Monitoring23 } from "@/components/beste/piece/monitoring23";
<Monitoring23
servers={[
{
"name": "web-01",
"region": "fra1",
"cpu": 42,
"memory": 61
},
{
"name": "web-02",
"region": "iad1",
"cpu": 67,
"memory": 58
},
{
"name": "worker-01",
"region": "sfo1",
"cpu": 23,
"memory": 74
}
]}
warnAt={70}
criticalAt={90}
tone="sky"
/>Thirty-tick history strip in the style of a status page, with pass, slow, and fail segments and a rolling availability number.
Streaming bar chart that pushes a fresh sample every few hundred milliseconds, flags spikes in amber, and keeps a rolling p95 in the corner.
Compact service health row with operational state, pulsing dot, and uptime percentage on the right.
Bare ECG-style heartbeat trace with a pulsing live dot at the leading edge and no other chrome.