Every viewer page (Timer, Countdown, Backstage, Studio, Timeline,
ProjectInfo, Operator) re-implemented the same data-loader flow by hand,
each with a hard-coded, unlocalized error string and drifting empty-state
styling. This centralizes that flow and elevates the shared presentation.
- Add ViewDataBoundary: a single component that renders the shared
loading, error and optional no-data states from a QueryStatus, so every
view handles them the same obvious way. Refactor all seven view loaders
through it.
- Localize the error state via new common.fetch_error /
common.fetch_error_hint keys (en + de/es/fr/it/pt), replacing the
duplicated English literal with a two-line "Something went wrong /
Please refresh the page" message.
- Elevate the shared Empty component: legible viewer-secondary color
(was 10% white), responsive title sizing, softened illustration,
optional supporting subtitle line, and a reduced-motion-safe fade-in.
- Unify loading: Cuesheet and the rundown table now use the animated
Loader like every other view instead of an untranslated "Loading..."
page.
- Tidy up: EmptyTableBody uses Empty's text prop, drop Countdown's
now-redundant size override, and remove a stray semicolon rendered in
the ProjectInfo empty state.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Vq5XLTSQhU9ckZmCSW2SEr
* feat: create the first event from the cuesheet
* chore: cleanup css
* test: cuesheet beckground edit from empty state
* feat: only show +event button when user is in edit mode and have full write perms
Claude
Alex Christoffer Rasmussen
Carlos Valente