View Real-Time Approval Status of a Specific Reimbursement Submission
The Approval Status Widget provides a compact, reusable status indicator that can be embedded wherever a reimbursement submission is referenced — in queue list items, linked views, or summary dashboards. It subscribes to a Riverpod stream provider and reflects the current status in real time with distinct visual styling per state: auto_approved (teal), pending_attestation (amber), approved (green), rejected (red). Coordinators encounter this widget in the queue list view; organisation administrators may see it in overview contexts. The widget updates live when the underlying status changes without requiring a screen reload.
User Story
Acceptance Criteria
- Given a reimbursement submission has status 'auto_approved', when the Approval Status Widget renders, then it displays an 'Auto-Approved' label with teal styling
- Given a submission has status 'pending_attestation', when the widget renders, then it displays a 'Pending Review' label with amber styling to indicate action is required
- Given a coordinator approves a submission, when the status transitions to 'approved', then the widget updates to 'Approved' with green styling within 3 seconds on all connected screens displaying that submission
- Given a submission is rejected, when the status changes, then the widget updates to 'Rejected' with red styling and the change is reflected in real time on all connected screens
- Given the widget is embedded in a list view, when any submission's status changes, then only that item's widget re-renders — the rest of the list is unaffected
Business Value
Status visibility reduces the number of coordinator interruptions caused by peer mentors enquiring about their reimbursement status, since submitters can self-serve their status information. For coordinators and administrators, at-a-glance status indicators in list views speed up triage and monitoring without requiring full detail-screen navigation.