IOTA Watch: a monochrome monitoring UI with shadcn dialogs and account menus

[molimao]

I maintain IOTA Watch, an MIT-licensed browser dashboard for public training and mining records. It uses shadcn/ui with React and TanStack Start, with public pages in English, Simplified Chinese, Traditional Chinese, Korean and Japanese.

The interface is mostly monochrome, with color reserved for activity and data-health states. Text labels remain next to those states so a miner does not have to interpret a color alone. The layout puts the reward record, source and fetch time together; missing upstream values remain visibly unavailable.

The shadcn components are used where interaction needs structure:

• Dialog holds both the add-device form and the device-detail panel, with a title and description for each state.
• The account dropdown uses DropdownMenuItem asChild for localized route links and keeps sign-out as an action. The account is optional for the basic public-ID workflow.
• CSS variables provide the neutral surface, border and focus styles; the dashboard cards and network graphics are custom components around those primitives.

Live app · dashboard dialogs · account menu · MIT source

This is a maintainer showcase. I would welcome feedback on information hierarchy for a monitoring UI that needs to communicate uncertainty as clearly as the numbers.