Skip to content

feat(tokenselector): 10 - implement SelectTokenWidget with enhanced chain … #6535

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
fairlighteth wants to merge 35 commits into
base: feat/token-selector-9
Choose a base branch
from
Open

feat(tokenselector): 10 - implement SelectTokenWidget with enhanced chain … #6535

fairlighteth wants to merge 35 commits into from

Conversation

@fairlighteth
Copy link
Contributor

@fairlighteth fairlighteth commented Nov 17, 2025 •
edited
Loading

Summary

This PR layers the UX pieces on top of the controller refactor from PR‑9:

  • Adds MobileChainPanelPortal plus the overlay/WidgetCard tweaks so the selector can cover the screen on narrow viewports while keeping the widget locked underneath.
  • Introduces the mobile chain selector chips (MobileChainSelector.tsx + mobileChainSelector.styled.ts) and wires them through SelectTokenModal, exposing the “View all (N)” CTA and the new helper props.
  • Updates SelectTokenModal/TokensContent to remove the legacy inline chain selector, reuse the controller-provided sidebar state, and keep Cosmos fixtures in sync.
  • Refines the desktop ChainPanel/ChainsSelector styles to match the new accent variables, ensuring both desktop and mobile panels share the same look.
  • Fixes token ordering so favorites still appear in the ‘All tokens’ list and participate in balance‑based sorting, while only recent tokens are de‑duplicated.
  • Adjusts the Manage token list header in the selector so only the back arrow is shown (the X close button is reserved for standalone contexts), avoiding accidental closure of the whole selector.

All state wiring/tests were already covered by the controller extraction; this branch is UI-only.

Screenshot 2025-11-17 at 11 04 45 Screenshot 2025-11-17 at 11 04 25 Screenshot 2025-11-17 at 11 05 25Screenshot 2025-11-17 at 11 05 11

Testing

  • Manual: Open selector in swap/limit/TWAP modes, verify desktop sidebar + chain chips
  • Manual: Switch to mobile width → selector becomes fullscreen w/ “View all” panel and overlay dismiss behavior
  • Manual: Toggle bridging flag to confirm legacy modal layout when sidebar disabled
  • Manual: Verify favorite tokens appear both in the Favorites row and in the All tokens list, sorted by balance, and that manage token list shows only a back arrow inside the selector.

@vercel
Copy link

vercel bot commented Nov 17, 2025 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
cowfi Ready Ready Preview Dec 15, 2025 10:12am
explorer-dev Ready Ready Preview Dec 15, 2025 10:12am
swap-dev Ready Ready Preview Dec 15, 2025 10:12am
widget-configurator Ready Ready Preview Dec 15, 2025 10:12am
2 Skipped Deployments
Project Deployment Review Updated (UTC)
cosmos Ignored Ignored Dec 15, 2025 10:12am
sdk-tools Ignored Ignored Preview Dec 15, 2025 10:12am

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Nov 17, 2025 •
edited
Loading

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

✨ Finishing touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch feat/token-selector-10

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@fairlighteth fairlighteth changed the title feat(tokenselector): implement SelectTokenWidget with enhanced chain … feat(tokenselector): 10 - implement SelectTokenWidget with enhanced chain … Nov 17, 2025
@fairlighteth fairlighteth force-pushed the feat/token-selector-10 branch from 93c129c to dd238e8 Compare November 17, 2025 15:05
@fairlighteth fairlighteth requested review from a team November 18, 2025 11:53
@fairlighteth fairlighteth self-assigned this Nov 18, 2025
@fairlighteth fairlighteth marked this pull request as ready for review November 18, 2025 11:54
@fairlighteth
Copy link
Contributor Author

fairlighteth commented Dec 11, 2025

Note: this branch has still props drilling and some of the feedback mentioned in earlier branches. Consider this an intermediate step branch. All of the feedback around this has been addressed in #6663

alfetopito
alfetopito reviewed Dec 12, 2025
View reviewed changes
Copy link
Collaborator

@alfetopito alfetopito left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's all fixed here \o/

image

alfetopito
alfetopito approved these changes Dec 12, 2025
View reviewed changes
Copy link
Collaborator

@alfetopito alfetopito left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👏

apps/cowswap-frontend/src/common/updaters/BridgingEnabledUpdater.ts Outdated
const tradeTypeInfo = useTradeTypeInfo()
const accountType = useAccountType()
const setIsBridgingEnabled = useSetIsBridgingEnabled()
const { isBridgingEnabled: isBridgingEnabledFlag } = useFeatureFlags()
Copy link
Collaborator

@alfetopito alfetopito Dec 12, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Due to sync with develop, this is effectively adding the feature flag back to the code, no?

Copy link
Contributor Author

@fairlighteth fairlighteth Dec 15, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, not sure what happened but thought I had removed it. Addressed in c3be32a

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@alfetopito alfetopito alfetopito approved these changes

@limitofzero limitofzero limitofzero approved these changes

@elena-zh elena-zh elena-zh approved these changes

Assignees

@fairlighteth fairlighteth

Labels

Token selector

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

5 participants

@fairlighteth @elena-zh @alfetopito @limitofzero