React Device Fleet Table

Copy Page

Is the fleet healthy, how far has the update reached, and which devices fell behind? Four summary figures across the top, then a sortable, filterable table with per-device OTA progress — the whole answer on one screen.

Installation

Props

Sorted so the problems float up

The default sort is by health ascending, which puts offline first, then degraded, then online. That is deliberate: a fleet screen sorted alphabetically buries the three broken devices among the four hundred working ones. Every column is still sortable, and the health filter narrows to one class in a click.

targetFirmware turns the firmware column into a drift indicator — anything not on the target is marked behind in amber, so a stalled rollout is visible without doing version maths in your head. otaProgress renders as a bar per device (green at 100%, primary while in flight, an em dash when the device isn't targeted at all), and the header rolls it into an "OTA complete" count.

lastSeenMin is minutes since contact, formatted relatively — pass minutes rather than a timestamp so the display stays deterministic between server and client render, which matters in a statically exported app.