search

status-im / status-desktop

Status Desktop client made in Nim & QML
https://status.app
Mozilla Public License 2.0
303 stars 79 forks source link

Adapt Token Selector #16702

Open Khushboo-dev-cpp opened 3 weeks ago

Khushboo-dev-cpp commented 3 weeks ago

This task is created to adapt the TokenSelector Component to be able to support the new Simple Send Modal

Design: https://www.figma.com/design/FkFClTCYKf83RJWoifWgoX/Wallet-v2?node-id=25229-108897&t=Ech2sOd4zCGhGFzC-4 https://www.figma.com/design/FkFClTCYKf83RJWoifWgoX/Wallet-v2?node-id=25232-114042&t=x7Ukt7ixxp7Ji84n-4

The difference in current implementation and new designs is that we only want to show the balances on the networks selected in the modal. Currently the TokenSelector shows all the balances in balances model

Changes expected TBD in this task -

  1. No collectibles state
  2. Only 5 items and 6th item half when shown
  3. Only balance on selected network is shown (a filter is already present in adaptor, no changes needed)
  4. 0 balance on selected chain is not shown (Logic already present in adaptor, no changes needed))
  5. Token list items are inset 4px with 4px padding between each list item.
  6. Top search result in typeahead adopts hover state so user can easily press Enter (or click) to select.
  7. Token icon in header increased in size slightly (21px -> 24px). Collectibles more visible at this size.
  8. Hovered and selected highlight colours
micieslak commented 2 weeks ago

Probably the whole chance may be limited to the adaptor where additional filtering is needed now to have only one network there.

Should we present tokens with 0 balance on a given network as well?

Khushboo-dev-cpp commented 2 weeks ago

Probably the whole chance may be limited to the adaptor where additional filtering is needed now to have only one network there.

Should we present tokens with 0 balance on a given network as well?

seems like there is provision to do it already. if thats the case, I'll simply close this task. As per design tokens with 0 balance on a selected network will not be shown in the token selector list. https://www.figma.com/design/FkFClTCYKf83RJWoifWgoX/Wallet-v2?node-id=25126-90209&t=aU54CRDOkx31jmCm-4