#2 Story 1.2: Workspace Shell & Ant Design Foundation

Closed
opened 3 days ago by nano · 0 comments
nano commented 3 days ago

Imported from _bmad-output/implementation-artifacts/1-2-workspace-shell-ant-design-foundation.md.

# Story 1.2: Workspace Shell & Ant Design Foundation

Status: ready-for-dev

Story

As a any authenticated user, I want a consistent tri-pane application layout with the Ant Design visual system applied, so that I have a predictable, accessible, and keyboard-navigable operational environment from day one.

Acceptance Criteria

  1. Given the app loads after authentication When an authenticated user enters the application Then the tri-pane layout renders with a left navigation pane, center content area, and collapsible right panel
  2. Given the Ant Design token configuration is applied When the UI renders Then colorPrimary is #1F4E79, teal secondary is #0F766E, semantic status colors (success/warning/error/info/overdue) match the UX spec, and compact density profile is active (UX-DR1)
  3. Given a user interacts with any focusable element When tabbing through the interface Then visible 2px focus indicators are present on all interactive elements with logical tab order (UX-DR9)
  4. Given the viewport is 1280–1599px When the layout renders Then the right panel is collapsible and the tri-pane adapts to compact mode (UX-DR15)
  5. Given the viewport is below 1280px When the layout renders Then a reduced read mode with a support notice is displayed and full editing is not available
  6. Given any status indicator renders When viewed Then status is conveyed with both color and a text label or icon — never color alone (UX-DR12)

Tasks / Subtasks

  • Implement story behavior in aligned backend/frontend modules (AC: #1)
    • Add or update API/service/UI components required by the story scope
    • Keep legacy Access entities read-only and route writes to extension-layer structures
  • Cover acceptance criteria #2 in implementation and tests (AC: #2)
    • Add validation/error handling and UX state updates as needed
  • Cover acceptance criteria #3 in implementation and tests (AC: #3)
    • Add validation/error handling and UX state updates as needed
  • Cover acceptance criteria #4 in implementation and tests (AC: #4)
    • Add validation/error handling and UX state updates as needed
  • Validate and document completion evidence
    • Verify build/tests for touched modules
    • Capture changed files and any migration/config implications

Dev Notes

  • Follow Epic 1 architecture constraints: ASP.NET Core + React separation, RBAC-aware patterns, and immutable legacy tables.
  • Reuse shared component and workflow patterns defined in UX and architecture docs; avoid parallel custom implementations.
  • Keep changes scoped to this story; do not pull forward Epic 2+ features.

Project Structure Notes

  • Backend: BriansClientRouteReports.Server/
  • Frontend: brians-client-route-reports-client/
  • Story artifacts: _bmad-output/implementation-artifacts/

References

  • Story source: _bmad-output/planning-artifacts/epics.md (Epic 1 / Story 1.2)
  • Architecture constraints: _bmad-output/planning-artifacts/architecture.md
  • UX patterns: _bmad-output/planning-artifacts/ux-design-specification.md

Dev Agent Record

Agent Model Used

GPT-5 Codex

Debug Log References

  • Story generated from epic source and architecture/UX planning artifacts.

Completion Notes List

  • Story context created and marked ready-for-dev.

File List

  • _bmad-output/implementation-artifacts/1-2-workspace-shell-ant-design-foundation.md
Imported from [_bmad-output/implementation-artifacts/1-2-workspace-shell-ant-design-foundation.md](https://onefortheroadgit.sytes.net/dcovington/Campaign_Tracker/src/branch/main/_bmad-output/implementation-artifacts/1-2-workspace-shell-ant-design-foundation.md). # Story 1.2: Workspace Shell & Ant Design Foundation Status: ready-for-dev ## Story As a any authenticated user, I want a consistent tri-pane application layout with the Ant Design visual system applied, so that I have a predictable, accessible, and keyboard-navigable operational environment from day one. ## Acceptance Criteria 1. **Given** the app loads after authentication **When** an authenticated user enters the application **Then** the tri-pane layout renders with a left navigation pane, center content area, and collapsible right panel 2. **Given** the Ant Design token configuration is applied **When** the UI renders **Then** colorPrimary is #1F4E79, teal secondary is #0F766E, semantic status colors (success/warning/error/info/overdue) match the UX spec, and compact density profile is active (UX-DR1) 3. **Given** a user interacts with any focusable element **When** tabbing through the interface **Then** visible 2px focus indicators are present on all interactive elements with logical tab order (UX-DR9) 4. **Given** the viewport is 1280–1599px **When** the layout renders **Then** the right panel is collapsible and the tri-pane adapts to compact mode (UX-DR15) 5. **Given** the viewport is below 1280px **When** the layout renders **Then** a reduced read mode with a support notice is displayed and full editing is not available 6. **Given** any status indicator renders **When** viewed **Then** status is conveyed with both color and a text label or icon — never color alone (UX-DR12) ## Tasks / Subtasks - [ ] Implement story behavior in aligned backend/frontend modules (AC: #1) - [ ] Add or update API/service/UI components required by the story scope - [ ] Keep legacy Access entities read-only and route writes to extension-layer structures - [ ] Cover acceptance criteria #2 in implementation and tests (AC: #2) - [ ] Add validation/error handling and UX state updates as needed - [ ] Cover acceptance criteria #3 in implementation and tests (AC: #3) - [ ] Add validation/error handling and UX state updates as needed - [ ] Cover acceptance criteria #4 in implementation and tests (AC: #4) - [ ] Add validation/error handling and UX state updates as needed - [ ] Validate and document completion evidence - [ ] Verify build/tests for touched modules - [ ] Capture changed files and any migration/config implications ## Dev Notes - Follow Epic 1 architecture constraints: ASP.NET Core + React separation, RBAC-aware patterns, and immutable legacy tables. - Reuse shared component and workflow patterns defined in UX and architecture docs; avoid parallel custom implementations. - Keep changes scoped to this story; do not pull forward Epic 2+ features. ### Project Structure Notes - Backend: `BriansClientRouteReports.Server/` - Frontend: `brians-client-route-reports-client/` - Story artifacts: `_bmad-output/implementation-artifacts/` ### References - Story source: `_bmad-output/planning-artifacts/epics.md` (Epic 1 / Story 1.2) - Architecture constraints: `_bmad-output/planning-artifacts/architecture.md` - UX patterns: `_bmad-output/planning-artifacts/ux-design-specification.md` ## Dev Agent Record ### Agent Model Used GPT-5 Codex ### Debug Log References - Story generated from epic source and architecture/UX planning artifacts. ### Completion Notes List - Story context created and marked ready-for-dev. ### File List - `_bmad-output/implementation-artifacts/1-2-workspace-shell-ant-design-foundation.md`
nano added the
Sprint 1
label 3 days ago
nano added this to the Sprint 1 milestone 3 days ago
Sign in to join this conversation.
No Label
No Milestone
No Assignees
1 Participants
Due Date

No due date set.

Dependencies

This issue currently doesn't have any dependencies.

Loading…
Cancel
Save
There is no content yet.

Powered by TurnKey Linux.