Keyboard shortcuts

Press or to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

07 — Component Library (Notifications Module)

Authoritative shared components in 00-shared/03; this file lists the module's component set and which shared primitives each is composed of. All items are derived from the API contract in 12_API_Mapping.


1. Component Inventory

#ComponentPurposeComposed of (from 00-shared/03)State
C1NotificationListTileOne inbox rowCard/ListTile, Avatar(icon), Text (title/body), relative-time Text, UnreadDot
C2UnreadDot8 dp accent dot, unread onlycustom Paint (no shared dep)
C3NotificationBadgeShell bell badge w/ count (0/n/99+)Badge widget, IconButton(bell)
C4InboxEmptyStateEmpty/zero-unread illustration + copyEmptyState (shared)
C5MarkAllReadActionAppBar text button, conditional visibilityTextButton
C6PaginationFooterSpinner / retry row at list endCircularProgress, TextButton
C7InboxErrorPanelFirst-load error + RetryErrorPanel (shared)
C8TypeIconPer-type leading icon mappingIcon (mapped in 11 §3)
C9FilterChip (unread)unreadOnly toggleFilterChip (shared) (proposed)
C10SwipeToMarkReadDismissible wrapper on C1Dismissible (proposed)

2. NotificationListTile Contract

NotificationListTile({
  required Notification n,      // model from `15_Flutter_Implementation_Guide`
  required VoidCallback onTap,  // marks read (if unread) + optional nav
})
  • Displays: n.title, n.body (2-line), relative n.createdAt, C8 icon, C2 dot iff n.readAt == null.
  • Unread style: titleMedium bold + tinted surface; read: titleMedium regular.
  • Semantics: unread suffix (see 06 §1.7).

3. NotificationBadge Contract

  • Input: int count (0 hides).
  • Behavior: 99+ ceiling; m-fast scale on change; semantics label.
  • Data source: UnreadCountCubit (13_State_Management), refreshed on foreground + inbox mutations.

4. Reuse Notes

  • Do not invent new buttons/inputs — reuse shared AppButton, AppTextField etc. from 00-shared/03.
  • No new stateful primitive widgets: C1/C3 hold state via Cubits, not local widget state (00-shared/06).