Skip to content

Add CSV/JSON export and date-range scoping to the transaction history page #520

Description

@Baskarayelu

📋 Description

The transaction history experience (app/transactions/page.tsx and the dashboard variant app/dashboard/transaction-history/page.tsx with its search input in app/dashboard/transaction-history/components/transaction-history-search-input.tsx) supports filtering and search but has no way to export records. Users managing remittances for tax or budgeting cannot get their data out.

This issue adds a date-range scope and CSV/JSON export of the currently filtered transactions.

Why this matters: people sending money across borders need records — for remittance receipts, taxes, and household budgets. Export is a small feature with outsized real-world utility, and the filtered list already exists to export from.

🎯 Requirements & Context

Functional requirements

  • Add a date-range control that scopes the transaction query on app/transactions/page.tsx.
  • Add an Export action producing CSV and JSON of the currently filtered rows.
  • Format amounts/currency with the shared formatter and include status from status-semantics.
  • Build a pure toCsv/toJson exporter utility in lib/utils/ (no DOM dependency) so it is unit-testable.
  • Disabled/empty state when there are no rows to export.

Context & constraints

  • Do not block the page during export; generate client-side from already-fetched data.
  • Reuse the existing search/filter state — export must reflect active filters exactly.

🛠️ Suggested Execution

1. Fork & branch

git checkout -b feature/transactions-export

2. Implement changes

  • Add the exporter utility + an Export menu (CSV/JSON) and date-range control.
  • Add TSDoc and a doc note on the export format.
  • Edge cases: empty filtered set, special characters/commas in CSV escaping, large lists, a11y of the export menu, responsive, i18n (en/es) of labels.

3. Test & commit

npm run lint
npx tsc --noEmit
npm run test:coverage
npm run build

Example commit message

feat(transactions): add date-range scope and CSV/JSON export

Adds a pure exporter utility and an accessible Export menu that serializes the
currently filtered transactions to CSV and JSON.

✅ Acceptance Criteria & Guidelines

Requirement Target
Export reflects active filters Required
Exporter utility unit-tested (CSV escaping) ≥ 95% branches
Date-range control scopes query Required
a11y export menu + responsive Required
i18n en + es Required
lint + tsc --noEmit + build clean Required
Timeframe 96 hours from assignment

💬 Community & Support

Questions and design discussion — join the RemitWise contributor community on Discord: https://discord.gg/CtQuPZFMA

Comment to claim it. 🚀

Metadata

Metadata

Assignees

No fields configured for Feature.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions