Skip to content

v0.5.0 — UI Redesign

Choose a tag to compare

@Pappet Pappet released this 08 May 20:37
· 39 commits to main since this release
8124bd1

v0.5.0 — UI Redesign

Visual + IA refactor of the entire frontend (CLAUDE_CODE_HANDOFF.md, items 1–14, plus the chrome-cleanup follow-up). Six numbered phases shipped between #87 and #103 plus a chrome-cleanup pass in #105. Two perf wins (#102 parser allocations, #100 frontend search filter) round out the release. No protocol, API, or storage changes.

Highlights

UI Redesign (Phases 1–6)

  • Phase 1 — Typography + colors (#87) — Inter (sans) and JetBrains Mono (mono) via Google Fonts; refreshed dark palette with deeper backgrounds and a cooler accent.
  • Phase 2 — Top-bar health pills (#93) — replaced the dot-and-counter .stats-bar with listening :PORT, conns N/MAX, rate N/min + 60-second sparkline, last Ns ago, errors N.
  • Phase 3 — Two-line message rows + time grouping + ACK chips (#95) — dropped the dense 9-column grid; rows now scan as [type] [patient] [validation] [tags] [ACK] over [facility · source · N segs · time]. Sticky time buckets (Live, Last few minutes, Earlier today, Yesterday, MMM D). Colored ACK chips (AA green, AE red, AR amber, none muted). 1-second tick refreshes relative time labels in place.
  • Phase 4 — Source rail + throughput band (#97) — always-visible source chip rail with per-source counts; 60-bar histogram band with total / per min / warnings / errors counters. (The throughput band is removed in #105 — see below — its sparkline lives inside the rate health pill instead.)
  • Phase 5 — Detail panel restructure (#99) — type chip + human title; description + monospace metadata row; type+icon Bookmark / Pin diff actions; larger tabs with segment count badge + right-aligned Diff vs pinned; typical-segments checklist with ✓ ⚠ ✕ symbols; collapsible validation summary banner; field rows with inline description + tr.warn rows tinted amber with required chip.
  • Phase 6 — Empty state + polish pass (#103) — .empty-card with listening port + copy-able CLI snippet; Cmd/Ctrl+K focuses the filter; tag chips become pills; emoji glyphs replaced with lucide-style outline SVGs.

Chrome cleanup (#105)

  • List-scoped controls (Pause, Auto, Bookmarks, validation filter) move into a new .inbox-controls row beneath the search bar.
  • Topbar gains total, validation, parse errors pills (the previous errors pill is renamed parse errors to disambiguate from validation errors).
  • The standalone throughput band is removed — the sparkline lives in the rate health pill.

Accessibility

  • Row keyboard navigation with Tab / Enter / Space (#88).
  • ARIA labels + native <button> for bookmark/pin (#91).
  • Global :focus-visible outline.
  • Cmd/Ctrl+K shortcut for the filter input.

Performance

  • HL7 parser (#102) — eliminated multiple redundant Vec allocations in parse_message and parse_segment.
  • Frontend search filter (#100/#104) — memoized parsed query (getParsedQuery) with bounded cache; per-message field checks short-circuit and skip lowercasing on empty fields.

Upgrade notes

  • Drop-in replacement for v0.4.0. Same MLLP protocol, same HTTP API, same WebSocket events, same on-disk format (none).
  • Session keys (harux_session, _state) are preserved with the same semantics.
  • The frontend is still vanilla JS — no build step, no npm.

Binaries

The Build & Release workflow will attach Windows harux.exe, macOS Apple Silicon harux-macos-apple-silicon, and Linux harux-linux binaries to this release once it builds on each runner.


Full diff: v0.4.0...v0.5.0