Implement Notification Tab Badge reactive overlay
epic-in-app-notification-centre-ui-task-003 — Build the NotificationTabBadge as a Stack-based overlay widget that wraps the bottom-navigation Notifications icon. Subscribe to the unread count stream from NotificationBLoC using StreamBuilder or BlocBuilder. Display a circular badge with the count, capping at 99 and showing '99+' for counts above 99. Badge must be hidden when count is zero. Apply design token colors (red accent for badge background, white text). Add Semantics node announcing 'N unread notifications' for screen readers, updating via live region when count changes.
Acceptance Criteria
Technical Requirements
Implementation Notes
Use BlocBuilder
Cap logic: `count > 99 ? '99+' : '$count'`. The Stack should use `clipBehavior: Clip.none` so the badge can overflow the icon boundary naturally. Position the badge at top-right using `Positioned(top: 0, right: 0)`.
Testing Requirements
Unit test NotificationTabBadge widget in isolation using flutter_test. Use a mock NotificationBLoC to emit states with varying unread counts (0, 1, 50, 99, 100, 200). Assert: (1) badge widget is absent from tree when count=0, (2) Text widget shows correct string for all count ranges, (3) Semantics label matches expected string. Test on standard phone size (375×812) and tablet (768×1024) to ensure no overflow.
Aim for 100% branch coverage on the count display logic (0, 1–99, 100+).
If a referenced entity (contact, certification, activity) has been deleted or its RLS policy now excludes the current user, the deep link handler may navigate to a screen that renders in an error state or throws an unhandled exception.
Mitigation & Contingency
Mitigation: The deep link handler must perform a lightweight existence check (HEAD request or minimal SELECT) before pushing the route. Define a contract with each destination screen for how to handle a not-found entity ID passed as a route parameter.
Contingency: If the existence check itself fails (network error), navigate to the destination screen anyway and let it handle the error gracefully with its own error state; do not block navigation for network timeouts.
If the tab badge widget triggers a full rebuild of the bottom navigation bar on every unread count change, it will cause visible jank on devices with many active Realtime events (e.g., org admins receiving org-wide alerts).
Mitigation & Contingency
Mitigation: Scope the badge widget to a dedicated BlocSelector that rebuilds only when the unread count value changes, not on any BLoC state emission. Use RepaintBoundary to isolate the badge from the rest of the nav bar.
Contingency: If performance issues persist, debounce badge updates to a maximum of one rebuild per 500ms and display the last known count during the debounce window.
Complex swipe-to-mark-read gestures and dynamic list updates may conflict with VoiceOver/TalkBack navigation patterns, particularly for Blindeforbundet users who rely exclusively on screen readers.
Mitigation & Contingency
Mitigation: Provide a dedicated accessibility action (Semantics.onTap / CustomSemanticsAction) for mark-as-read on each list item so screen reader users do not need the swipe gesture. Test with VoiceOver on iOS and TalkBack on Android before each release.
Contingency: If the swipe gesture proves incompatible with assistive technologies, disable it when a screen reader is detected (via ScreenReaderDetectionService) and rely solely on the tap-to-read and accessible action pathways.