Fix hot reload and upgrade to coherent UI layout #2

New issue

Closed

opened 2026-01-01 00:40:08 +01:00 by myrmidex · 0 comments

myrmidex commented

2026-01-01 00:40:08 +01:00

(Migrated from codeberg.org)

Part 1: Fix hot reload

Hot reload seems broken in the dev container setup. Vite HMR is not picking up changes, requiring manual page refreshes.

Investigate and fix:

Vite HMR websocket connection (port 5174)
Volume mount configuration for file watching
Podman/container-specific HMR quirks

Part 2: Coherent UI layout

With hot reload working, upgrade the scenario page from the current bare layout to a polished, cohesive design using the existing shadcn/ui (new-york style) component library.

Scope:

Proper page layout shell (header, content area)
Consistent use of shadcn/ui components throughout (replace raw HTML inputs, buttons, selects, modals)
Clean visual hierarchy: buckets section → distribution preview → streams section
Responsive design that works on desktop and tablet
Consistent spacing, typography, and color usage

This is a UI-only pass — no backend changes, no new features.

## Part 1: Fix hot reload Hot reload seems broken in the dev container setup. Vite HMR is not picking up changes, requiring manual page refreshes. Investigate and fix: - Vite HMR websocket connection (port 5174) - Volume mount configuration for file watching - Podman/container-specific HMR quirks ## Part 2: Coherent UI layout With hot reload working, upgrade the scenario page from the current bare layout to a polished, cohesive design using the existing shadcn/ui (new-york style) component library. Scope: - Proper page layout shell (header, content area) - Consistent use of shadcn/ui components throughout (replace raw HTML inputs, buttons, selects, modals) - Clean visual hierarchy: buckets section → distribution preview → streams section - Responsive design that works on desktop and tablet - Consistent spacing, typography, and color usage This is a UI-only pass — no backend changes, no new features.