swap seach popular in rainbow #1696
Conversation
greg-schrammel
requested review from
walmat,
estebanmino,
derHowie and
benisgold
| isNativeAsset: [ | ||
| `${ETH_ADDRESS}_${ChainId.mainnet}`, | ||
| `${ETH_ADDRESS}_${ChainId.optimism}`, | ||
| `${ETH_ADDRESS}_${ChainId.arbitrum}`, | ||
| `${BNB_BSC_ADDRESS}_${ChainId.bsc}`, | ||
| `${MATIC_POLYGON_ADDRESS}_${ChainId.polygon}`, | ||
| `${ETH_ADDRESS}_${ChainId.base}`, | ||
| `${ETH_ADDRESS}_${ChainId.zora}`, | ||
| `${ETH_ADDRESS}_${ChainId.avalanche}`, | ||
| `${ETH_ADDRESS}_${ChainId.blast}`, | ||
| `${ETH_ADDRESS}_${ChainId.degen}`, | ||
| ].includes(`${a.uniqueId}_${chainId}`), |
There was a problem hiding this comment.
replaced this with isNativeAsset from ~/core/utils/chains, fixes some chains like degen that was not getting the right native
| if (popularAssets) { | ||
| sections.push({ id: 'popular', data: popularAssets }); | ||
| } | ||
|
|
There was a problem hiding this comment.
do we want to limit to 3 results like in the app?
| @@ -508,6 +512,10 @@ export function useSearchCurrencyLists({ | |||
| return sections; | |||
| } | |||
|
|
|||
| if (popularAssets) { | |||
There was a problem hiding this comment.
i think you need to make sure there is no overlap between assets in the popular section and assets in other sections. here's the app logic https://github.com/rainbow-me/rainbow/blob/develop/src/__swaps__/screens/Swap/hooks/useSearchCurrencyLists.ts
lmk if you want me to explain more
| OP_ADDRESS, | ||
| POL_POLYGON_ADDRESS, |
There was a problem hiding this comment.
eslint sort imports rule
| /** | ||
| * @returns a new array of `assets` that don't overlap with `others` | ||
| */ | ||
| function difference( | ||
| assets: SearchAsset[], | ||
| others: (SearchAsset | undefined | null)[], | ||
| ) { | ||
| const _others = others.filter(Boolean); | ||
| return assets.filter((asset) => { | ||
| return !_others.some((other) => | ||
| isLowerCaseMatch(other.uniqueId, asset.uniqueId), | ||
| ); | ||
| }); | ||
| } |
There was a problem hiding this comment.
made a more generic function to filter the sections, took the name from new Set().difference()
this changes for example
filterAssetsFromBridgeAndAssetToSell(sectionAssets)for
difference(sectionAssets, [bridgeAsset, assetToSell])I think its more extensible and easier to understand the intention
Fixes BX-####
Figma link (if any):
What changed (plus any additional context for devs)
Screen recordings / screenshots
Screen.Recording.2024-09-09.at.17.23.01.mov
What to test