4a20b93fae
- Split Plan 05 (5 tasks → 2 tasks): password reset request interface - Split Plan 06 (5 tasks → 2 tasks): created Plans 06-09 for focused scope - Fixed Plan 06 wave assignment: Wave 4 → Wave 3 (depends only on Wave 2) - Created Plan 07: password reset navigation and deep linking - Created Plan 08: authentication pages error handling - Created Plan 09: auth components error display and loading feedback - Updated Plan 07 → Plan 10: logout and verification - Updated ROADMAP.md with 10 plans in 4 waves - All plans now have 2-3 tasks as recommended
112 lines
4.2 KiB
Markdown
112 lines
4.2 KiB
Markdown
---
|
|
phase: 01-authentication
|
|
plan: 09
|
|
type: execute
|
|
wave: 3
|
|
depends_on: ["01-08"]
|
|
files_modified: ["lib/features/authentication/presentation/widgets/auth_form.dart", "lib/features/authentication/presentation/widgets/auth_button.dart"]
|
|
autonomous: true
|
|
user_setup: []
|
|
|
|
must_haves:
|
|
truths:
|
|
- "Loading states show during all auth operations"
|
|
- "Success messages provide clear confirmation"
|
|
artifacts:
|
|
- path: "lib/features/authentication/presentation/widgets/auth_form.dart"
|
|
provides: "Enhanced form with error display"
|
|
min_lines: 40
|
|
- path: "lib/features/authentication/presentation/widgets/auth_button.dart"
|
|
provides: "Enhanced button with state feedback"
|
|
min_lines: 35
|
|
key_links:
|
|
- from: "lib/features/authentication/presentation/widgets/auth_form.dart"
|
|
to: "lib/features/authentication/presentation/pages/login_page.dart"
|
|
via: "error state communication"
|
|
pattern: "error.*text|displayError"
|
|
- from: "lib/features/authentication/presentation/widgets/auth_button.dart"
|
|
to: "all auth pages"
|
|
via: "loading state indication"
|
|
pattern: "loading|isLoading"
|
|
---
|
|
|
|
<objective>
|
|
Enhance auth components with error display and loading feedback.
|
|
|
|
Purpose: Complete user experience improvements for authentication flows with proper visual feedback.
|
|
Output: Enhanced auth components supporting comprehensive error handling and state management.
|
|
</objective>
|
|
|
|
<execution_context>
|
|
@~/.opencode/get-shit-done/workflows/execute-plan.md
|
|
@~/.opencode/get-shit-done/templates/summary.md
|
|
</execution_context>
|
|
|
|
<context>
|
|
@.planning/PROJECT.md
|
|
@.planning/ROADMAP.md
|
|
@.planning/STATE.md
|
|
@.planning/phases/01-authentication/01-RESEARCH.md
|
|
</context>
|
|
|
|
<tasks>
|
|
|
|
<task type="auto">
|
|
<name>Enhance auth components with error display</name>
|
|
<files>lib/features/authentication/presentation/widgets/auth_form.dart</files>
|
|
<action>
|
|
Update AuthForm to:
|
|
1. Accept optional error message prop
|
|
2. Display error messages below relevant fields
|
|
3. Style errors appropriately (red text, icons if needed)
|
|
4. Include accessibility announcements for errors
|
|
5. Auto-clear errors when user starts typing
|
|
6. Handle field-specific vs form-wide errors
|
|
7. Provide clear error positioning and styling
|
|
8. Include proper error boundaries
|
|
9. Support error recovery guidance
|
|
10. Maintain consistency across all auth forms
|
|
</action>
|
|
<verify>Auth form components display errors clearly and handle error state transitions properly</verify>
|
|
<done>Enhanced auth form components with integrated error display functionality</done>
|
|
</task>
|
|
|
|
<task type="auto">
|
|
<name>Add success feedback and loading indicators</name>
|
|
<files>lib/features/authentication/presentation/widgets/auth_button.dart</files>
|
|
<action>
|
|
Update AuthButton to:
|
|
1. Show loading spinner when in loading state
|
|
2. Disable button during loading
|
|
3. Change button text during loading (e.g., "Signing In...")
|
|
4. Add success state feedback (brief color change or checkmark)
|
|
5. Include haptic feedback on mobile (if available)
|
|
6. Add accessibility labels for loading state
|
|
7. Prevent double-tap during submission
|
|
8. Add proper visual transitions between states
|
|
9. Maintain consistent loading behavior across all auth buttons
|
|
10. Include error state styling if needed
|
|
</action>
|
|
<verify>Auth button provides clear loading feedback and prevents user confusion during submission</verify>
|
|
<done>Enhanced auth button with comprehensive state feedback</done>
|
|
</task>
|
|
|
|
</tasks>
|
|
|
|
<verification>
|
|
1. Auth form components display errors clearly and handle error state transitions properly
|
|
2. Auth button provides clear loading feedback and prevents user confusion during submission
|
|
3. Loading states appear consistently during all authentication operations
|
|
4. Success feedback is clear and appropriate
|
|
5. Error messages disappear when user takes corrective action
|
|
6. Accessibility features announce errors and state changes properly
|
|
7. Visual transitions between states are smooth and intuitive
|
|
</verification>
|
|
|
|
<success_criteria>
|
|
Complete auth component enhancements with error display, loading states, and user feedback.
|
|
</success_criteria>
|
|
|
|
<output>
|
|
After completion, create `.planning/phases/01-authentication/01-09-SUMMARY.md`
|
|
</output> |