Athena — roomy-mobile/archive/changes/2026-01-05-fix-notification-permissions/tasks/005-create-consent-widgets.md


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

Nog geen reacties