Skip to content

feat(market): add sortable columns to banner detail list with persistent preferences#10358

Open
limichange wants to merge 5 commits intoxfrom
feat/banner-list-sorting
Open

feat(market): add sortable columns to banner detail list with persistent preferences#10358
limichange wants to merge 5 commits intoxfrom
feat/banner-list-sorting

Conversation

@limichange
Copy link
Contributor

@limichange limichange commented Feb 26, 2026

Summary

  • Add sorting support for all numeric columns (Price, Change%, Market cap, Liquidity, Turnover, Txns, Traders, Holders) in banner detail pages
  • Persist sort preferences globally via Jotai globalAtom so all banner detail pages share the same sort state
  • Restore sort indicator arrows correctly when navigating between banner detail pages

Changes

  • atomNames.ts / market.ts — New marketBannerListSortAtom with persist: true
  • MarketBannerDetail.tsx — Client-side sorting with ref-based state sync, wired to global atom
  • MarketTokenListBase.tsx — New sortable prop, expanded SORTABLE_COLUMNS, pass initialSortOrder to Table header
  • Table/types.ts / HeaderColumn.tsx / Table/index.tsx — Support initialSortOrder in onHeaderRow to restore header arrow state on mount

Test plan

  • Open a banner detail page (e.g. US Stocks), click column headers to sort
  • Verify arrow indicator toggles correctly (desc → asc → default)
  • Navigate back and open a different banner detail page — verify data is sorted and arrow shows correctly
  • Kill and reopen the app — verify sort preference is restored
  • Verify watchlist sorting still works as before (no regression)
  • Test on both desktop and mobile layouts

Open with Devin

…ent preferences

- Add sorting support for all numeric columns (Price, Change%, Market cap, Liquidity, Turnover, Txns, Traders, Holders) in banner detail pages
- Persist sort preferences globally via Jotai globalAtom with AsyncStorage
- Sync sort state across all banner detail pages
- Support initial sort order restoration in Table HeaderColumn on remount
@revan-zhang
Copy link
Contributor

revan-zhang commented Feb 26, 2026

Snyk checks have passed. No issues have been found so far.

Status Scanner Critical High Medium Low Total (0)
Open Source Security 0 0 0 0 0 issues
Licenses 0 0 0 0 0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

@limichange limichange marked this pull request as draft February 26, 2026 09:24
auto-merge was automatically disabled February 26, 2026 09:24

Pull request was converted to draft

Keep original SORTABLE_COLUMNS (3 columns) for watchlist mode,
use ALL_SORTABLE_COLUMNS (8 columns) only for sortable (banner) mode.
devin-ai-integration[bot]

This comment was marked as resolved.

…etTokenListBase

- MarketTokenListBase handles client-side sorting internally when clientSort is enabled
- MarketBannerDetail only provides raw data and persistence callbacks
- Clear separation: watchlist uses server-side sort (3 columns), clientSort uses client-side sort (8 columns)
@limichange limichange marked this pull request as ready for review February 26, 2026 09:38
- Move ETableSortType to type-only import
- Use toSorted() instead of [...arr].sort()
devin-ai-integration[bot]

This comment was marked as resolved.

Prevents watchlist toggle from overwriting banner detail sort preferences.
@limichange
Copy link
Contributor Author

Review feedback addressed

1. SORTABLE_COLUMNS expanding to watchlist (Devin comment #1)
Fixed in e1da74c: split into SORTABLE_COLUMNS (3 cols, watchlist server-side sort) and CLIENT_SORTABLE_COLUMNS (8 cols, banner client-side sort). handleHeaderRow picks the correct map based on clientSort flag.

2. MarketWatchlistOnlyChanged event overwriting banner sort (Devin comment #2)
Fixed in 92f11f1: added early return if (clientSort) return in the event listener, so banner detail pages no longer respond to watchlist toggle events.

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.

2 participants