User Interface medium complexity mobile
2
Dependencies
0
Dependents
3
Entities
0
Integrations

Description

Coordinator-facing screen displaying all expense claims that exceed the auto-approval threshold and require manual review. Lists pending claims with claimant details, distance, amount, and receipt thumbnails. Provides approve and reject actions with optional comment.

Feature: Travel & Expense Registration

attestation-queue-screen

Summaries

The Attestation Queue Screen is the primary governance interface that enables coordinators to exercise human oversight over high-value expense claims, ensuring that organisational spending policies are enforced consistently and transparently. By centralising pending approvals in a single, real-time view with claim details and receipt evidence, it reduces the administrative burden of manual review and shortens the approval cycle for employees awaiting reimbursement. Faster approval cycles improve staff satisfaction and reduce the operational cost of chasing outstanding claims. The ability to attach comments to approvals and rejections creates a documented audit trail, which is essential for financial reporting, dispute resolution, and demonstrating compliance to stakeholders or external auditors.

The Attestation Queue Screen depends on both expense-attestation-service and expense-repository being available and stable, making it a mid-to-late pipeline deliverable. Development scope includes list rendering with claim metadata, receipt thumbnail display, approve/reject actions with optional comment input, real-time queue refresh (likely via Supabase Realtime or polling), and status filtering. Testing must cover concurrent approvals by multiple coordinators, empty queue states, large claim lists with pagination or lazy loading, and network interruption during an approval action. The screen is coordinator-only, so role-based access control integration must be verified end-to-end before release.

Coordinate with the expense-attestation-service team on the comment field contract and the exact status transitions to ensure UI state reflects backend state accurately and avoids race conditions.

The Attestation Queue Screen consumes expense-repository to load pending claims and expense-attestation-service to submit approve or reject decisions, keeping read and write concerns separated across two service boundaries. The show(coordinatorId, organizationId) entry point scopes the query to the correct organisational context, and refreshQueue() should be wired to Supabase Realtime subscription events or a polling interval to keep the list current as other coordinators act on claims. onApprove and onReject carry an optional comment string passed directly to the attestation service — validate locally that comments meet any minimum length requirements before dispatch to avoid unnecessary round-trips. onClaimSelected navigates to the detail view, sharing claim data via route arguments or a lightweight state management solution to avoid redundant fetches.

filterByStatus(status) should update the active query parameter and re-render the list without a full screen reload. Receipt thumbnails are pre-signed URLs from Supabase Storage; cache aggressively to avoid repeated fetches during scroll. Handle optimistic UI updates on approve/reject to give coordinators immediate feedback, with rollback on service error.

Responsibilities

  • List all pending expense claims requiring manual attestation
  • Display claim details including distance, expense types, amounts, and receipt
  • Provide approve and reject actions with optional coordinator comment
  • Refresh queue in real time as new claims arrive

Interfaces

show(coordinatorId, organizationId)
onApprove(expenseId, comment)
onReject(expenseId, comment)
onClaimSelected(expenseId)
refreshQueue()
filterByStatus(status)

Relationships

Dependencies (2)

Components this component depends on

Related Data Entities (3)

Data entities managed by this component