RpgRoller/FRONTEND_PROGRESS.md

Frontend Rebuild Progress (Blazor)

Tracking against UX.md tasks and decisions.

Status Snapshot

• Branch: feature/blazor-frontend-rebuild-ux
• Runtime frontend stack: Blazor (RpgRoller/Components/*) + browser JS interop (wwwroot/js/rpgroller-api.js)
• Legacy TypeScript frontend/runtime artifacts: removed
• Home was simplified to a minimal gateway (Loading / Anonymous / Workspace) in a single Home.razor.cs class.
• The authenticated workspace shell/state/behavior was moved to Components/Pages/Workspace.razor.
• Workspace header user identity rendering is now null-safe during first render (Loading user... fallback until /api/me loads).
• Workspace header was compacted into a single horizontal row with hamburger menu screen switching and link-style logout.
• Header alignment was tightened so connection status occupies the growing middle cell and the hamburger menu remains pinned to the right edge.
• Workspace status/error feedback moved from inline messages to timed toast notifications.
• Concern controls now own their local form state and mutation workflows; the workspace host handles shared cross-control state refresh.
• Skill create/edit flow is now owned by CharacterPanel (where characters and their skills are presented together).
• Skill interactions are now row-local chip actions (edit/roll) with an inline dummy + row for create-skill.
• Character picker was reduced to a compact single-row horizontal scroller to minimize vertical footprint.
• The standalone "Last Roll" panel was removed; campaign log entries are the roll history surface.
• Card layout now uses condensed flex stacking (instead of stretching grid tracks), with remaining character-panel height absorbed by a post-skills spacer.
• Campaign log now auto-scrolls to the newest entry when new entries arrive.

UX Checklist

UX area	Status	Notes
9.1 App load + session restore	Implemented	Health check on load, rulesets/session load, unauthorized session reset, API unhealthy retry banner.
9.2 Authentication view	Implemented	Register/login cards, required validation, register password length check, server-error display.
9.3 Shared authenticated header	Implemented	Compact single-row header with user/campaign context, growing connection-status cell, right-aligned hamburger screen switch, and link-style logout.
9.4 Play screen character column	Implemented	Compact character picker, merged character+skills header row, modal edit/create flows, inline per-skill edit/roll chips, d6 skill options (wild/fumble), remembered roll-visibility preference, and no separate last-roll panel.
9.5 Play screen log column	Implemented	Chronological feed, private/public badges, private perspective styles (roller vs GM), per-entry dice visualization with die-state flags, local time + ISO tooltip.
9.6 Campaign management screen	Implemented	Campaign selector and details are merged into one card, campaign create moved behind an inline Add campaign row opening a modal, and character management sits beneath with chip-style edit actions plus an inline Add character row.
9.7 Tablet/mobile bottom bar	Implemented	Character / Log panel switch in play screen and per-tab session persistence.
10 Validation and error UX	Partially implemented	Required-field and common API errors are mapped; message/code-specific mapping is limited by current API exposing only text messages.
11 Empty/loading/disabled states	Implemented	Empty states, skeleton placeholders, mutation button disabling.
12 Real-time and sync rules	Implemented	Campaign-scoped SSE subscribe/unsubscribe, reconnect with exponential backoff, manual refresh fallback.
13 Accessibility requirements	Partially implemented	Keyboard-friendly controls, labels, focus styling, aria-live announcements; screen-reader validation for all flows still needs dedicated accessibility QA.
14 Content and copy guidance	Implemented	Direct action labels and corrective error copy used throughout.
15 Visual direction	Implemented	Tabletop utility styling, tokenized colors, responsive layout, private/public visual differentiation.
17 Next iteration targets: wireframes	Not yet implemented	No separate low-fidelity wireframe artifact added in repo.
17 Next iteration targets: component contracts doc	Not yet implemented	Component contract document not yet extracted from implementation.
17 Next iteration targets: visual token doc	Not yet implemented	Tokens are implemented in CSS but not yet documented in a dedicated spec file.

Follow-up Candidates

1. Add explicit machine-readable API error codes to HTTP responses for richer field-level mapping.
2. Add automated accessibility checks (focus order, contrast, and screen-reader behavior assertions).
3. Document component contracts and visual token references as separate markdown artifacts.