mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Fix: ETH 'token' now only appears once in the swaps to and from dropdowns. (#10650)
This commit is contained in:
parent
3e6b2e7f0a
commit
60514c12b0
@ -69,13 +69,7 @@ export function getRenderableTokenData(
|
||||
};
|
||||
}
|
||||
|
||||
export function useTokensToSearch({
|
||||
providedTokens,
|
||||
usersTokens = [],
|
||||
topTokens = {},
|
||||
onlyEth,
|
||||
singleToken,
|
||||
}) {
|
||||
export function useTokensToSearch({ usersTokens = [], topTokens = {} }) {
|
||||
const tokenConversionRates = useSelector(getTokenExchangeRates, isEqual);
|
||||
const conversionRate = useSelector(getConversionRate);
|
||||
const currentCurrency = useSelector(getCurrentCurrency);
|
||||
@ -93,18 +87,16 @@ export function useTokensToSearch({
|
||||
const memoizedEthToken = useEqualityCheck(ethToken);
|
||||
|
||||
const swapsTokens = useSelector(getSwapsTokens) || [];
|
||||
let tokensToSearch;
|
||||
if (onlyEth) {
|
||||
tokensToSearch = [memoizedEthToken];
|
||||
} else if (singleToken) {
|
||||
tokensToSearch = providedTokens;
|
||||
} else if (providedTokens) {
|
||||
tokensToSearch = [memoizedEthToken, ...providedTokens];
|
||||
} else if (swapsTokens.length) {
|
||||
tokensToSearch = [memoizedEthToken, ...swapsTokens];
|
||||
} else {
|
||||
tokensToSearch = [memoizedEthToken, ...tokenList];
|
||||
}
|
||||
|
||||
const tokensToSearch = swapsTokens.length
|
||||
? swapsTokens
|
||||
: [
|
||||
memoizedEthToken,
|
||||
...tokenList.filter(
|
||||
(token) => token.symbol !== memoizedEthToken.symbol,
|
||||
),
|
||||
];
|
||||
|
||||
const memoizedTokensToSearch = useEqualityCheck(tokensToSearch);
|
||||
return useMemo(() => {
|
||||
const usersTokensAddressMap = memoizedUsersToken.reduce(
|
||||
@ -113,7 +105,7 @@ export function useTokensToSearch({
|
||||
);
|
||||
|
||||
const tokensToSearchBuckets = {
|
||||
owned: singleToken ? [] : [memoizedEthToken],
|
||||
owned: [],
|
||||
top: [],
|
||||
others: [],
|
||||
};
|
||||
@ -126,8 +118,8 @@ export function useTokensToSearch({
|
||||
currentCurrency,
|
||||
);
|
||||
if (
|
||||
usersTokensAddressMap[token.address] &&
|
||||
(renderableDataToken.symbol === 'ETH' ||
|
||||
renderableDataToken.symbol === 'ETH' ||
|
||||
(usersTokensAddressMap[token.address] &&
|
||||
Number(renderableDataToken.balance ?? 0) !== 0)
|
||||
) {
|
||||
tokensToSearchBuckets.owned.push(renderableDataToken);
|
||||
@ -158,7 +150,5 @@ export function useTokensToSearch({
|
||||
conversionRate,
|
||||
currentCurrency,
|
||||
memoizedTopTokens,
|
||||
memoizedEthToken,
|
||||
singleToken,
|
||||
]);
|
||||
}
|
||||
|
@ -2,10 +2,13 @@ import React, { useContext, useEffect, useState, useCallback } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { useDispatch, useSelector } from 'react-redux';
|
||||
import classnames from 'classnames';
|
||||
import { uniqBy } from 'lodash';
|
||||
import { uniqBy, isEqual } from 'lodash';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import { MetaMetricsContext } from '../../../contexts/metametrics.new';
|
||||
import { useTokensToSearch } from '../../../hooks/useTokensToSearch';
|
||||
import {
|
||||
useTokensToSearch,
|
||||
getRenderableTokenData,
|
||||
} from '../../../hooks/useTokensToSearch';
|
||||
import { useEqualityCheck } from '../../../hooks/useEqualityCheck';
|
||||
import { I18nContext } from '../../../contexts/i18n';
|
||||
import DropdownInputPair from '../dropdown-input-pair';
|
||||
@ -25,7 +28,12 @@ import {
|
||||
getTopAssets,
|
||||
getFetchParams,
|
||||
} from '../../../ducks/swaps/swaps';
|
||||
import { getSwapsEthToken } from '../../../selectors';
|
||||
import {
|
||||
getSwapsEthToken,
|
||||
getTokenExchangeRates,
|
||||
getConversionRate,
|
||||
getCurrentCurrency,
|
||||
} from '../../../selectors';
|
||||
import {
|
||||
getValueFromWeiHex,
|
||||
hexToDecimal,
|
||||
@ -80,6 +88,10 @@ export default function BuildQuote({
|
||||
const fetchParamsFromToken =
|
||||
sourceTokenInfo?.symbol === 'ETH' ? swapsEthToken : sourceTokenInfo;
|
||||
|
||||
const tokenConversionRates = useSelector(getTokenExchangeRates, isEqual);
|
||||
const conversionRate = useSelector(getConversionRate);
|
||||
const currentCurrency = useSelector(getCurrentCurrency);
|
||||
|
||||
const { loading, tokensWithBalances } = useTokenTracker(tokens);
|
||||
|
||||
// If the fromToken was set in a call to `onFromSelect` (see below), and that from token has a balance
|
||||
@ -93,15 +105,12 @@ export default function BuildQuote({
|
||||
);
|
||||
const memoizedUsersTokens = useEqualityCheck(usersTokens);
|
||||
|
||||
const selectedFromToken = useTokensToSearch({
|
||||
providedTokens:
|
||||
fromToken || fetchParamsFromToken
|
||||
? [fromToken || fetchParamsFromToken]
|
||||
: [],
|
||||
usersTokens: memoizedUsersTokens,
|
||||
onlyEth: (fromToken || fetchParamsFromToken)?.symbol === 'ETH',
|
||||
singleToken: true,
|
||||
})[0];
|
||||
const selectedFromToken = getRenderableTokenData(
|
||||
fromToken || fetchParamsFromToken,
|
||||
tokenConversionRates,
|
||||
conversionRate,
|
||||
currentCurrency,
|
||||
);
|
||||
|
||||
const tokensToSearch = useTokensToSearch({
|
||||
usersTokens: memoizedUsersTokens,
|
||||
|
@ -9,7 +9,7 @@ export const AGGREGATOR_METADATA_BASE_PROD_URL =
|
||||
export const TOP_ASSET_BASE_PROD_URL =
|
||||
'https://api.metaswap.codefi.network/topAssets';
|
||||
|
||||
export const TOKENS = [
|
||||
const BASE_TOKENS = [
|
||||
{
|
||||
erc20: true,
|
||||
symbol: 'META',
|
||||
@ -82,9 +82,12 @@ export const TOKENS = [
|
||||
decimals: 8,
|
||||
address: '0x2260FAC5E5542a773Aa44fBCfeDf7C193bc2C599',
|
||||
},
|
||||
ETH_SWAPS_TOKEN_OBJECT,
|
||||
];
|
||||
|
||||
export const TOKENS = [...BASE_TOKENS, ETH_SWAPS_TOKEN_OBJECT];
|
||||
|
||||
export const EXPECTED_TOKENS_RESULT = [ETH_SWAPS_TOKEN_OBJECT, ...BASE_TOKENS];
|
||||
|
||||
export const MOCK_TRADE_RESPONSE_1 = [
|
||||
{
|
||||
trade: {
|
||||
|
@ -279,13 +279,18 @@ export async function fetchTokens() {
|
||||
{ method: 'GET' },
|
||||
{ cacheRefreshTime: CACHE_REFRESH_ONE_HOUR },
|
||||
);
|
||||
const filteredTokens = tokens.filter((token) => {
|
||||
return (
|
||||
validateData(TOKEN_VALIDATORS, token, tokenUrl) &&
|
||||
token.address !== ETH_SWAPS_TOKEN_OBJECT.address
|
||||
);
|
||||
});
|
||||
filteredTokens.push(ETH_SWAPS_TOKEN_OBJECT);
|
||||
const filteredTokens = [
|
||||
ETH_SWAPS_TOKEN_OBJECT,
|
||||
...tokens.filter((token) => {
|
||||
return (
|
||||
validateData(TOKEN_VALIDATORS, token, tokenUrl) &&
|
||||
!(
|
||||
token.symbol === ETH_SWAPS_TOKEN_OBJECT.symbol ||
|
||||
token.address === ETH_SWAPS_TOKEN_OBJECT.address
|
||||
)
|
||||
);
|
||||
}),
|
||||
];
|
||||
return filteredTokens;
|
||||
}
|
||||
|
||||
|
@ -6,6 +6,7 @@ import {
|
||||
AGGREGATOR_METADATA_BASE_PROD_URL,
|
||||
TOP_ASSET_BASE_PROD_URL,
|
||||
TOKENS,
|
||||
EXPECTED_TOKENS_RESULT,
|
||||
MOCK_TRADE_RESPONSE_2,
|
||||
AGGREGATOR_METADATA,
|
||||
TOP_ASSETS,
|
||||
@ -107,12 +108,12 @@ describe('Swaps Util', function () {
|
||||
describe('fetchTokens', function () {
|
||||
it('should fetch tokens', async function () {
|
||||
const result = await fetchTokens(true);
|
||||
assert.deepStrictEqual(result, TOKENS);
|
||||
assert.deepStrictEqual(result, EXPECTED_TOKENS_RESULT);
|
||||
});
|
||||
|
||||
it('should fetch tokens on prod', async function () {
|
||||
const result = await fetchTokens(false);
|
||||
assert.deepStrictEqual(result, TOKENS);
|
||||
assert.deepStrictEqual(result, EXPECTED_TOKENS_RESULT);
|
||||
});
|
||||
});
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user