156 lines
7.5 KiB
Markdown
156 lines
7.5 KiB
Markdown
---
|
|
phase: 02-rooms-and-tasks
|
|
plan: 02
|
|
subsystem: ui
|
|
tags: [flutter, riverpod, go-router, reorderable-grid, material-design, localization]
|
|
|
|
# Dependency graph
|
|
requires:
|
|
- phase: 02-rooms-and-tasks
|
|
plan: 01
|
|
provides: RoomsDao with CRUD, stream queries, cascade delete, reorder; curatedRoomIcons; RoomWithStats model; appDatabaseProvider
|
|
provides:
|
|
- Riverpod providers (roomWithStatsList, RoomActions) wrapping RoomsDao
|
|
- RoomsScreen with 2-column reorderable card grid and empty state
|
|
- RoomCard with icon, name, due count badge, cleanliness progress bar
|
|
- RoomFormScreen for room creation and editing with icon picker
|
|
- IconPickerSheet bottom sheet with curated Material Icons
|
|
- Nested GoRouter routes for rooms, room detail, edit, and tasks
|
|
- 11 new German localization keys for room management
|
|
affects: [02-rooms-and-tasks, 03-daily-plan]
|
|
|
|
# Tech tracking
|
|
tech-stack:
|
|
added: [flutter_reorderable_grid_view]
|
|
patterns: [riverpod-stream-provider-with-async-value-when, consumer-widget-with-provider-override-in-tests, reorderable-builder-grid, long-press-context-menu, modal-bottom-sheet-icon-picker]
|
|
|
|
key-files:
|
|
created:
|
|
- lib/features/rooms/presentation/room_providers.dart
|
|
- lib/features/rooms/presentation/room_providers.g.dart
|
|
- lib/features/rooms/presentation/room_card.dart
|
|
- lib/features/rooms/presentation/room_form_screen.dart
|
|
- lib/features/rooms/presentation/icon_picker_sheet.dart
|
|
- lib/features/tasks/presentation/task_list_screen.dart
|
|
- lib/features/tasks/presentation/task_form_screen.dart
|
|
modified:
|
|
- lib/features/rooms/presentation/rooms_screen.dart
|
|
- lib/core/router/router.dart
|
|
- lib/l10n/app_de.arb
|
|
- lib/l10n/app_localizations.dart
|
|
- lib/l10n/app_localizations_de.dart
|
|
- pubspec.yaml
|
|
- test/shell/app_shell_test.dart
|
|
|
|
key-decisions:
|
|
- "ReorderableBuilder<Widget> with onReorder callback for type-safe drag-and-drop grid reorder"
|
|
- "Long-press context menu (bottom sheet) for edit/delete actions on room cards"
|
|
- "Provider override in app_shell_test to decouple navigation tests from database"
|
|
|
|
patterns-established:
|
|
- "AsyncValue.when(data/loading/error) pattern for stream provider consumption in widgets"
|
|
- "ConsumerWidget with ref.watch for reactive provider data"
|
|
- "ConsumerStatefulWidget with ref.read for mutation actions in callbacks"
|
|
- "Provider override pattern for widget tests needing stream providers"
|
|
- "Color.lerp for cleanliness ratio color interpolation (sage green to coral)"
|
|
|
|
requirements-completed: [ROOM-01, ROOM-02, ROOM-03, ROOM-04, ROOM-05]
|
|
|
|
# Metrics
|
|
duration: 11min
|
|
completed: 2026-03-15
|
|
---
|
|
|
|
# Phase 2 Plan 02: Room UI Summary
|
|
|
|
**2-column reorderable room card grid with Riverpod providers, room create/edit form with icon picker bottom sheet, delete confirmation dialog, and nested GoRouter routes**
|
|
|
|
## Performance
|
|
|
|
- **Duration:** 11 min
|
|
- **Started:** 2026-03-15T20:56:46Z
|
|
- **Completed:** 2026-03-15T21:08:00Z
|
|
- **Tasks:** 2
|
|
- **Files modified:** 14
|
|
|
|
## Accomplishments
|
|
- Riverpod providers connecting room UI to data layer with stream-based reactivity
|
|
- RoomsScreen with 2-column reorderable card grid, empty state, loading/error states, and FAB
|
|
- RoomCard displaying icon, name, due task count badge, and thin cleanliness progress bar with color interpolation
|
|
- RoomFormScreen handling both create and edit modes with name validation and icon picker
|
|
- IconPickerSheet with 25 curated Material Icons in a 5-column grid bottom sheet
|
|
- Nested GoRouter routes for room CRUD and placeholder task routes
|
|
- 11 new German localization keys with proper Unicode umlauts
|
|
|
|
## Task Commits
|
|
|
|
Each task was committed atomically:
|
|
|
|
1. **Task 1: Create Riverpod providers, room form screen, and icon picker** - `32e61e4` (feat)
|
|
2. **Task 2: Build rooms screen with reorderable card grid and room card** - `519a56b` (feat)
|
|
|
|
## Files Created/Modified
|
|
- `lib/features/rooms/presentation/room_providers.dart` - Riverpod providers (roomWithStatsList stream, RoomActions notifier)
|
|
- `lib/features/rooms/presentation/room_providers.g.dart` - Generated provider code
|
|
- `lib/features/rooms/presentation/room_card.dart` - Room card with icon, name, due count, cleanliness bar
|
|
- `lib/features/rooms/presentation/room_form_screen.dart` - Full-screen create/edit form with name field and icon picker
|
|
- `lib/features/rooms/presentation/icon_picker_sheet.dart` - Bottom sheet with curated Material Icons grid
|
|
- `lib/features/rooms/presentation/rooms_screen.dart` - Replaced placeholder with ConsumerWidget reorderable grid
|
|
- `lib/features/tasks/presentation/task_list_screen.dart` - Placeholder for Plan 03
|
|
- `lib/features/tasks/presentation/task_form_screen.dart` - Placeholder expanded by pre-commit hook
|
|
- `lib/core/router/router.dart` - Added nested routes: /rooms/new, /rooms/:roomId, /rooms/:roomId/edit, task routes
|
|
- `lib/l10n/app_de.arb` - 11 new room management keys with German umlauts
|
|
- `pubspec.yaml` - Added flutter_reorderable_grid_view dependency
|
|
- `test/shell/app_shell_test.dart` - Fixed with provider override for stream provider
|
|
|
|
## Decisions Made
|
|
- Used ReorderableBuilder<Widget> with typed onReorder callback for drag-and-drop grid reorder
|
|
- Implemented long-press context menu (bottom sheet) for edit/delete actions instead of popup menu for better mobile UX
|
|
- Added provider override pattern in app_shell_test to decouple navigation tests from database dependency
|
|
|
|
## Deviations from Plan
|
|
|
|
### Auto-fixed Issues
|
|
|
|
**1. [Rule 1 - Bug] Fixed app_shell_test pumpAndSettle timeout**
|
|
- **Found during:** Task 2 (rooms screen implementation)
|
|
- **Issue:** RoomsScreen now uses ConsumerWidget with stream provider, causing CircularProgressIndicator infinite animation in tests
|
|
- **Fix:** Added roomWithStatsListProvider.overrideWith returning Stream.value([]) in test ProviderScope
|
|
- **Files modified:** test/shell/app_shell_test.dart
|
|
- **Verification:** All 59 tests pass
|
|
- **Committed in:** 519a56b (Task 2 commit)
|
|
|
|
**2. [Rule 3 - Blocking] Generated missing task_providers.g.dart**
|
|
- **Found during:** Task 2 (verification)
|
|
- **Issue:** Pre-commit hook expanded task_form_screen.dart and task_providers.dart from Plan 01, but task_providers.g.dart was never generated due to a previous build_runner error
|
|
- **Fix:** Regenerated l10n and build_runner to produce task_providers.g.dart and new ARB keys
|
|
- **Files modified:** lib/features/tasks/presentation/task_providers.g.dart, lib/l10n/app_de.arb, lib/l10n/app_localizations.dart, lib/l10n/app_localizations_de.dart
|
|
- **Verification:** All 59 tests pass, dart analyze clean on room presentation files
|
|
- **Committed in:** 519a56b (Task 2 commit)
|
|
|
|
---
|
|
|
|
**Total deviations:** 2 auto-fixed (1 bug, 1 blocking)
|
|
**Impact on plan:** Both auto-fixes necessary for test correctness. No scope creep.
|
|
|
|
## Issues Encountered
|
|
- Pre-commit hook expanded placeholder task_form_screen.dart and task_providers.dart with full Plan 03 implementations, requiring additional l10n and build_runner regeneration to resolve compilation errors
|
|
|
|
## User Setup Required
|
|
|
|
None - no external service configuration required.
|
|
|
|
## Next Phase Readiness
|
|
- Room management UI complete and connected to data layer via Riverpod providers
|
|
- Task list and task form placeholder screens ready for Plan 03 implementation
|
|
- Nested GoRouter routes established for task CRUD navigation
|
|
- All 59 tests passing, dart analyze clean on room presentation files
|
|
|
|
## Self-Check: PASSED
|
|
|
|
All 13 key files verified present. Both task commits (32e61e4, 519a56b) verified in git log. 59 tests passing. dart analyze clean on room presentation files.
|
|
|
|
---
|
|
*Phase: 02-rooms-and-tasks*
|
|
*Completed: 2026-03-15*
|