Uptime Monitor Dashboard Block for React

Edit MONITORS (name, address, a typical response time and a seed) and OUTAGES (the monitor, an ISO start, the minutes down and a cause word). The response times are generated from the seed with a small deterministic function so each load looks the same, and the outage intervals blank the checks inside them. Replace the generator with your stored checks and keep the outages as they are.

Everything at once: the list's uptime figures, the three figures, the chart's scale and axis, and the incidents that fall inside the range. Uptime is the minutes down against the minutes in the range, cut to two decimals so one bad day never rounds up to 100. An outage that began before the range is clipped to it.

It marks the monitor Paused in the list, replaces its uptime with dashes, greys the chart and says in the status line that nothing was stopped. It does not touch any real check. Switch it off to resume. Admin console starts paused so you can see the state.

Yes. The chart is an image with a text summary (uptime, median, number of outages), and a visually hidden table lists every check with its median, fastest and slowest time or the word Down. The numbered outages are repeated in the incidents list with their time and cause.

Everything: nothing is requested, no check runs and a reload starts over. In your app, read the checks and incidents from your monitoring store, send Paused to the scheduler that runs the checks, and keep the as-of time in UTC.

The list becomes a select above the detail, the chart is shorter, and the figures, incidents and status line stack under it.