Grid of uptime cells that light up green in reading order with a couple of amber and red blips at fixed spots, then holds, fades, and fills again.
The import and the props worth knowing about, in one place.
import { Monitoring22 } from "@/components/beste/piece/monitoring22";
<Monitoring22
title="API"
uptime="99.98% uptime"
range="Last 90 days"
incidents={[
{
"index": 23,
"level": "warn"
},
{
"index": 61,
"level": "down"
}
]}
/>Thirty-tick history strip in the style of a status page, with pass, slow, and fail segments and a rolling availability number.
Compact service health row with operational state, pulsing dot, and uptime percentage on the right.
Seven-row activity grid that bins each cell into one of five tonal steps for at-a-glance density.
Streaming bar chart that pushes a fresh sample every few hundred milliseconds, flags spikes in amber, and keeps a rolling p95 in the corner.