React Monitoring Dashboard

The ops screen, assembled from the instrument set. A gauge dial row carries the headline process values — chamber pressure, RF forward power, susceptor temperature — each with ok/warn/crit bands. Below, a TelemetryCluster grids out the process channels with per-channel warn/crit limits (note the reflected-power channel flagging over its soft limit), a StatusBoard on the rail tracks subsystem health, and a LogViewer streams the event log with severity chips and a clear action. This is how the scientific-instrument components come together into a fab / NOC monitoring page.

Fab 2 · Etch module

Etch Bay 3 — Live telemetry

1 active alarmChamber B · reflected power
Updated 12:04:41
020406080100
42mTorrChamber pressure
06001200180024003000
2450WRF forward power
0140280420560700
585°CSusceptor temp

Process channels

Ar flow
119.7sccm
CF₄ flowCRIT
38.2sccm
He backside
8.1Torr
Reflected pwrWARN
96W
DC bias
-420V
Endpoint
41.3%
Throughput
62wfr/h
Chamber temp
65.4°C
Event log
12:04:41inforecipeStep 4/7 ‘Main Etch’ started — 2450 W, 42 mTorr
12:04:38debugmfcAr setpoint 120.0 sccm, actual 119.7 sccm
12:04:30warnchamber-bReflected power 96 W exceeds 80 W soft limit
12:04:12infoendpointInterferometer trace nominal, slope −0.8 %/s
12:03:55errorgas-panelMFC-3 (CF4) failed to reach setpoint within 2.0 s
12:03:50inforobotWafer W-24188 loaded into Chamber A from LP2
12:03:41debugvacTurbo pump at 26,880 rpm, 100 % speed
12:03:30inforecipeRecipe ETCH-POLY-7 loaded, 7 steps, est. 96 s

Installation

npx shadcn@latest add monitoring-dashboard.json

Composition

PieceSourceRole
GaugegaugeDial row with ok/warn/crit bands
TelemetryClustertelemetry-clusterProcess-channel grid with warn/crit states
StatusBoardstatus-indicatorSubsystem health rail
StatusIndicatorstatus-indicatorHeader alarm summary
LogViewerlog-viewerEvent log with severity chips + clear

The snapshot is static so the demo is deterministic; in production, feed each piece from your telemetry stream and let the warn/crit thresholds drive the coloring. The event log holds local state so the Clear action works.

Usage

Loading...