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).
• 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).

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	User chip, campaign/active context, connection state, screen switch, refresh, logout.
9.4 Play screen character column	Implemented	Character icon tabs, sheet, modal edit/create flows, selected-tab-as-active behavior, skill list, d6 skill options (wild/fumble), roll controls, and die-state visualized last roll card.
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/summary, create form, details card, character management actions with modal edit pattern.
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.