Expense Queue Page
Component Detail
Description
Paginated admin portal page listing all pending and historical expense claims submitted by peer mentors. Supports filtering by status, date range, expense type, and submitter, with sortable columns and quick-action buttons per row.
expense-queue-page
Responsibilities
- Render paginated expense claim list with metadata (submitter, amount, type, date, status)
- Provide filter controls for status, date range, expense type, and submitter
- Trigger approve, reject, or request-clarification actions per claim
- Display receipt thumbnail previews inline with signed URL loading
Interfaces
fetchExpenseQueue(filters, pagination)
onApprove(expenseId)
onReject(expenseId, reason)
onRequestClarification(expenseId, message)
onFilterChange(filters)
Relationships
Dependencies (2)
Components this component depends on
Sub-Components (2)
Inline widget that fetches and renders receipt images via signed URLs with short TTLs. Handles loading states, expired URL refresh, and fallback placeholder when no receipt is attached.
- Request signed receipt URL from backend
- Display receipt image with zoom/expand capability
- Handle URL expiry and re-fetch transparently
Modal or side-panel component presenting full claim detail with approve, reject (with required reason text field), and request-clarification (with optional message) action controls. Enforces role-based visibility so coordinators only see claims within their local association.
- Display complete expense claim detail including receipt, expense type, and submitter history
- Enforce coordinator/org-admin role scope before rendering actions
- Collect rejection reason or clarification message before submitting action
- +1 more
Related Data Entities (3)
Data entities managed by this component