Issue #61
[UI] Create Multi-Step Listing Wizard Flow (Desktop & Mobile)
馃煛 Priority: High
Difficulty: Hard
Estimated Effort: 4 days
Relevant Files: src/app/list-device/page.tsx, src/components/listing/
Labels: ui, forms, priority:high
Requirements
- Implementation Details
- Build the multi-step flow for users to list devices for sale based on the Figma prototypes.\n - Implement complex form state management using React Hook Form and Zod validation.\n - Design the drag-and-drop image upload interface, handling file size limits and progress bars.\n - Ensure the wizard is highly accessible, trapping focus within modals and reading step changes via screen readers.\n
- Testing Requirements
- Write comprehensive unit tests achieving >90% coverage for the UI components.
- Perform visual regression tests across Desktop and Mobile viewports to ensure exact pixel-perfect match with Figma constraints.
Issue #61
[UI] Create Multi-Step Listing Wizard Flow (Desktop & Mobile)
馃煛 Priority: High
Difficulty: Hard
Estimated Effort: 4 days
Relevant Files:
src/app/list-device/page.tsx, src/components/listing/Labels:
ui, forms, priority:highRequirements