Claim Status Audit Timeline
Component Detail
Description
Read-only timeline widget embedded in the claim detail screen, showing every state transition with actor, timestamp, and optional comment. Derived from the claim_events table and renders chronologically to provide a complete audit trail for both peer mentors and coordinators.
claim-status-timeline
Summaries
The Claim Status Audit Timeline delivers full transparency into every action taken on an expense claim, showing who approved, rejected, or submitted each claim and exactly when. This level of accountability directly reduces disputes between peer mentors and coordinators, cutting resolution time and administrative overhead. For compliance and audit purposes, having a complete, tamper-evident record of all state transitions protects the organisation during internal reviews or regulatory inquiries. The timeline also builds trust with users by confirming their actions were recorded and acted upon, improving satisfaction and adoption of the expense management platform.
This component is low complexity and primarily read-only, meaning development risk is minimal. It depends on the claim-events-repository being available and correctly structured, so that data layer must be delivered first. Testing should cover correct ordering of events, timezone formatting for Norwegian locale, and visual differentiation of all four event types (submitted, approved, rejected, exported). The component runs on both mobile and frontend contexts, so cross-platform rendering must be validated on both targets.
No write operations reduce regression surface significantly. Estimated delivery is straightforward once the repository dependency is in place.
This UI component consumes the claim-events-repository via loadEvents(claimId) and renders a chronologically ordered list using renderTimeline(events). Each event entry is formatted with formatEventLabel(eventType) for human-readable type labels and formatTimestamp(isoString) converting ISO 8601 strings to local Norwegian timezone display. The component is read-only with no mutation paths. It must handle all four event types — submitted, approved, rejected, exported — with distinct visual treatment.
Runs in both mobile and frontend contexts, so any rendering logic must avoid platform-specific APIs. The data_models dependency is claim_event, so the event schema must be stable before finalising the rendering contract.
Responsibilities
- Render ordered list of claim_events for a given claim
- Display actor name, role, timestamp, and comment per event
- Differentiate event types visually (submitted, approved, rejected, exported)
- Format timestamps in local Norwegian timezone
Interfaces
loadEvents(claimId)
renderTimeline(events)
formatEventLabel(eventType)
formatTimestamp(isoString)