View Notification Center
The Notifications Screen provides a chronological, date-grouped list of all push notifications delivered to the authenticated user. Each item displays an icon reflecting the notification category, a title, a body preview, and a relative timestamp. Unread notifications are visually highlighted with a bold style and an accent indicator. The screen shows an unread badge count in the bottom navigation bar that updates in real time via a Supabase subscription. Users can scroll through their full notification history. The screen is accessible from the bottom navigation bar's Notifications tab.
User Story
Acceptance Criteria
- Given an authenticated user has received at least one notification, when they navigate to the Notifications tab, then the notifications screen loads with all notifications grouped by date (Today, Yesterday, Earlier)
- Given a user has unread notifications, when the screen loads, then unread items are visually distinct from read items with bold text and an unread indicator dot
- Given notifications exist, when the screen loads, then each notification item displays category icon, title, body preview, and relative timestamp
- Given no notifications exist, when the screen loads, then an empty state is shown with an appropriate illustration and message
- Given a new notification arrives while the screen is open, when the Supabase real-time subscription fires, then the new notification appears at the top of the list without requiring a manual refresh
Business Value
A centralized notification center is the primary interface through which all system-triggered alerts surface to the user. Without it, push notifications delivered while the app is in the foreground or background have no persistent home, meaning users who miss a notification have no way to review it. For a volunteer peer mentor base that does not log in daily, a reliable notification history ensures that assignment dispatches, follow-up reminders, and activity milestones are never silently lost.