m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 01:47:00 +01:00
Code

Swaps: Sort "token_from" dropdown tokens by their fiat value first and "token_to" by top tokens (#14436)

Browse Source
This commit is contained in:
Daniel 2022-04-15 14:57:58 +02:00 committed by GitHub
parent 0c52723885
commit eed6ae2b8c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 43 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
shared/constants/swaps.js
View File

@ -201,3 +201,8 @@ export const RINKEBY = 'rinkeby';
export const AVALANCHE = 'avalanche';
export const SWAPS_CLIENT_ID = 'extension';
export const TOKEN_BUCKET_PRIORITY = {
OWNED: 'owned',
TOP: 'top',
};

25
ui/hooks/useTokensToSearch.js
View File

@ -17,6 +17,7 @@ import { getConversionRate } from '../ducks/metamask/metamask';
import { getSwapsTokens } from '../ducks/swaps/swaps';
import { isSwapsDefaultTokenSymbol } from '../../shared/modules/swaps.utils';
import { toChecksumHexAddress } from '../../shared/modules/hexstring-utils';
import { TOKEN_BUCKET_PRIORITY } from '../../shared/constants/swaps';
import { useEqualityCheck } from './useEqualityCheck';
/** TODO: Remove during TOKEN_DETECTION_V2 feature flag clean up */
@ -96,6 +97,7 @@ export function useTokensToSearch({
usersTokens = [],
topTokens = {},
shuffledTokensList,
tokenBucketPriority = TOKEN_BUCKET_PRIORITY.OWNED,
}) {
const chainId = useSelector(getCurrentChainId);
const tokenConversionRates = useSelector(getTokenExchangeRates, isEqual);
@ -164,7 +166,20 @@ export function useTokensToSearch({
tokenList,
useTokenDetection,
);
if (memoizedTopTokens[token.address.toLowerCase()]) {
if (tokenBucketPriority === TOKEN_BUCKET_PRIORITY.OWNED) {
if (
isSwapsDefaultTokenSymbol(renderableDataToken.symbol, chainId) ||
usersTokensAddressMap[token.address.toLowerCase()]
) {
tokensToSearchBuckets.owned.push(renderableDataToken);
} else if (memoizedTopTokens[token.address.toLowerCase()]) {
tokensToSearchBuckets.top[
memoizedTopTokens[token.address.toLowerCase()].index
] = renderableDataToken;
} else {
tokensToSearchBuckets.others.push(renderableDataToken);
}
} else if (memoizedTopTokens[token.address.toLowerCase()]) {
tokensToSearchBuckets.top[
memoizedTopTokens[token.address.toLowerCase()].index
] = renderableDataToken;
@ -184,6 +199,13 @@ export function useTokensToSearch({
},
);
tokensToSearchBuckets.top = tokensToSearchBuckets.top.filter(Boolean);
if (tokenBucketPriority === TOKEN_BUCKET_PRIORITY.OWNED) {
return [
...tokensToSearchBuckets.owned,
...tokensToSearchBuckets.top,
...tokensToSearchBuckets.others,
];
}
return [
...tokensToSearchBuckets.top,
...tokensToSearchBuckets.owned,
@ -200,5 +222,6 @@ export function useTokensToSearch({
chainId,
tokenList,
useTokenDetection,
tokenBucketPriority,
]);
}

20
ui/pages/swaps/build-quote/build-quote.js
View File

@ -89,6 +89,7 @@ import {
import {
SWAPS_CHAINID_DEFAULT_BLOCK_EXPLORER_URL_MAP,
SWAPS_CHAINID_DEFAULT_TOKEN_MAP,
TOKEN_BUCKET_PRIORITY,
} from '../../../../shared/constants/swaps';
import {
@ -214,13 +215,20 @@ export default function BuildQuote({
useTokenDetection,
);
const tokensToSearch = useTokensToSearch({
const tokensToSearchSwapFrom = useTokensToSearch({
usersTokens: memoizedUsersTokens,
topTokens: topAssets,
shuffledTokensList,
tokenBucketPriority: TOKEN_BUCKET_PRIORITY.OWNED,
});
const tokensToSearchSwapTo = useTokensToSearch({
usersTokens: memoizedUsersTokens,
topTokens: topAssets,
shuffledTokensList,
tokenBucketPriority: TOKEN_BUCKET_PRIORITY.TOP,
});
const selectedToToken =
tokensToSearch.find(({ address }) =>
tokensToSearchSwapFrom.find(({ address }) =>
isEqualCaseInsensitive(address, toToken?.address),
) || toToken;
const toTokenIsNotDefault =
@ -658,7 +666,7 @@ export default function BuildQuote({
</div>
<DropdownInputPair
onSelect={onFromSelect}
itemsToSearch={tokensToSearch}
itemsToSearch={tokensToSearchSwapFrom}
onInputChange={(value) => {
onInputChange(value, fromTokenBalance);
}}
@ -668,7 +676,7 @@ export default function BuildQuote({
maxListItems={30}
loading={
loading &&
(!tokensToSearch?.length ||
(!tokensToSearchSwapFrom?.length ||
!topAssets ||
!Object.keys(topAssets).length)
}
@ -729,7 +737,7 @@ export default function BuildQuote({
<div className="dropdown-input-pair dropdown-input-pair__to">
<DropdownSearchList
startingItem={selectedToToken}
itemsToSearch={tokensToSearch}
itemsToSearch={tokensToSearchSwapTo}
searchPlaceholderText={t('swapSearchForAToken')}
fuseSearchKeys={fuseSearchKeys}
selectPlaceHolderText={t('swapSelectAToken')}
@ -737,7 +745,7 @@ export default function BuildQuote({
onSelect={onToSelect}
loading={
loading &&
(!tokensToSearch?.length ||
(!tokensToSearchSwapTo?.length ||
!topAssets ||
!Object.keys(topAssets).length)
}