Skip to content

feat: add status timeline to settlement detail view - #545

Open
AlienScroll78 wants to merge 1 commit into
WHEELBACK:mainfrom
AlienScroll78:feature/settlement-detail-timeline
Open

feat: add status timeline to settlement detail view#545
AlienScroll78 wants to merge 1 commit into
WHEELBACK:mainfrom
AlienScroll78:feature/settlement-detail-timeline

Conversation

@AlienScroll78

Copy link
Copy Markdown

Add useSettlementHistory hook that fetches status-change events from /api/treasury/settlements/:id/history and returns them sorted oldest-first for chronological display.

Add StatusTimeline component inside SettlementDetail that renders each event as a labelled dot in a vertical timeline, including the actor address and any contextual note (e.g. hold reason, dispute reference). Colour-coded dots map to settlement lifecycle statuses; unknown future statuses fall back to a neutral grey dot.

Add CSS for the timeline in SettlementDetail.css including focus-accessible styles.

Tests (useSettlementHistory.test.ts):

  • loading/null-id states
  • correct API endpoint called
  • oldest-first sorting regardless of API order
  • Proposed → Approved → Executed multi-transition timeline
  • Pending → OnHold → Executed on-hold/resolved timeline
  • HTTP and network error surfaces
  • refresh re-fetches

Pull Request

Summary

  • Describe the purpose of this PR in one or two sentences.

Checklist

  • Closes #__
  • Tests added or updated
  • ABI snapshot updated if contract sources changed (abis/ and COMEBACKHERE-contracts/)
  • Screenshots attached if UI changed
  • Documentation updated if needed

Notes

Add useSettlementHistory hook that fetches status-change events from
/api/treasury/settlements/:id/history and returns them sorted
oldest-first for chronological display.

Add StatusTimeline component inside SettlementDetail that renders each
event as a labelled dot in a vertical timeline, including the actor
address and any contextual note (e.g. hold reason, dispute reference).
Colour-coded dots map to settlement lifecycle statuses; unknown future
statuses fall back to a neutral grey dot.

Add CSS for the timeline in SettlementDetail.css including
focus-accessible styles.

Tests (useSettlementHistory.test.ts):
- loading/null-id states
- correct API endpoint called
- oldest-first sorting regardless of API order
- Proposed → Approved → Executed multi-transition timeline
- Pending → OnHold → Executed on-hold/resolved timeline
- HTTP and network error surfaces
- refresh re-fetches

Closes #[issue_id]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: add sortable columns by Amount and Status to dashboard/app.js invoice table

1 participant