Description
Users who transact repeatedly with the same counterparties or hold specific assets have no way to pin them for quick reference on components/dashboard/dashboard-page.tsx; every check requires filtering the full transaction or asset list. A watchlist panel lets users pin a small set of addresses or assets and see their latest balance/activity at a glance.
Requirements and context
- Add a watchlist widget letting users pin/unpin a counterparty address or asset from transaction rows
- Persist the pinned list per-account via the existing wallet-context storage pattern
- Show the latest known balance or last-activity timestamp for each pinned item
- Must be accessible (WCAG 2.1 AA), responsive, and consistent with existing design tokens
- Should be tested and easy to review
Suggested execution
Fork the repo and create a branch
git checkout -b feature/dashboard-watchlist-panel
Implement changes
- Update/Write:
components/dashboard/dashboard-page.tsx
- Add/Update tests:
components/dashboard/dashboard-page.test.tsx
- Add documentation:
design/dashboard-redesign.md
- Annotate accessibility (contrast, keyboard nav, ARIA)
- Validate responsive behavior across breakpoints (sm 640, md 768, lg 1024, xl 1280)
Test and commit
- Run tests:
pnpm test (or repo's test command)
- Cover edge cases (empty/error/loading, long text, dark mode)
- Include before/after screenshots and accessibility notes
Example commit message
feat: add a watchlist panel for pinned counterparties and assets
Guidelines
- WCAG 2.1 AA compliance
- Clear documentation and spec hand-off
- Timeframe: 96 hours
Description
Users who transact repeatedly with the same counterparties or hold specific assets have no way to pin them for quick reference on components/dashboard/dashboard-page.tsx; every check requires filtering the full transaction or asset list. A watchlist panel lets users pin a small set of addresses or assets and see their latest balance/activity at a glance.
Requirements and context
Suggested execution
Fork the repo and create a branch
Implement changes
components/dashboard/dashboard-page.tsxcomponents/dashboard/dashboard-page.test.tsxdesign/dashboard-redesign.mdTest and commit
pnpm test(or repo's test command)Example commit message
Guidelines