skill-level: medior
status: done
Task: Create Notification Consent Banner and Bottom Sheet Widgets
End Goal
Reusable widgets for the notification consent flow: a home screen CTA banner and a consent bottom sheet.
Currently
- No consent UI components exist
- Permission is never requested proactively
Should
NotificationConsentBanner widget:
- Attractive promotional banner
- Copy: "Enable notifications to know when your roomies go shopping"
- Tappable to open consent sheet
NotificationConsentSheet widget:
- Artwork/illustration at top
- Explanatory text
- Cancel button (outline style, above)
- Accept button (primary style, below)
- Stacked vertically
Constraints
- [ ] Widgets must be stateless with primitive parameters
- [ ] Use existing theme system (context.colors, context.texts)
- [ ] Use ShadButton for buttons (not GestureDetector/InkWell)
- [ ] Banner should fit visually with other home screen cards
Acceptance Criteria
- [ ] Banner displays promotional copy with icon
- [ ] Banner is tappable with onTap callback
- [ ] Sheet displays artwork area, text, and two buttons
- [ ] Cancel button uses outline style
- [ ] Accept button uses primary style
- [ ] Buttons are stacked vertically (Cancel above, Accept below)
Implementation Checklist
- [x] 5.1 Create
NotificationConsentBanner in lib/notifications/widgets/
- [x] 5.2 Add icon (bell or notification icon)
- [x] 5.3 Add promotional copy text
- [x] 5.4 Add
onTap callback parameter
- [x] 5.5 Style banner to match home screen cards (TCard-like)
- [x] 5.6 Create
NotificationConsentSheet in lib/notifications/widgets/
- [x] 5.7 Add artwork placeholder (SizedBox or Image)
- [x] 5.8 Add explanatory text
- [x] 5.9 Add Cancel button with
onCancel callback
- [x] 5.10 Add Accept button with
onAccept callback
- [x] 5.11 Add localized strings to ARB files (intl_en.arb, intl_nl.arb)
- [x] 5.12 Run
flutter analyze to verify no issues
Notes
- The artwork can be a placeholder initially and replaced with actual illustration later
- Keep the design compact and clean following ShadCN aesthetics
Reacties