1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-04 23:14:56 +01:00
metamask-extension/ui/components/app/detected-token/detected-token-details/detected-token-details.js
Niranjana Binoy 32aa47ddb2
Displaying the aggregators from tokenList in Detected token popover (#15835)
* using the aggregators from tokenList instead of detectedToken to avoid conflicts between static and dynamic list

* removing aggregator from the detectTokens object List
2022-09-15 12:53:18 -02:30

64 lines
1.9 KiB
JavaScript

import React from 'react';
import PropTypes from 'prop-types';
import { useSelector } from 'react-redux';
import Box from '../../../ui/box';
import Identicon from '../../../ui/identicon';
import DetectedTokenValues from '../detected-token-values/detected-token-values';
import DetectedTokenAddress from '../detected-token-address/detected-token-address';
import DetectedTokenAggregators from '../detected-token-aggregators/detected-token-aggregators';
import { DISPLAY } from '../../../../helpers/constants/design-system';
import { getTokenList } from '../../../../selectors';
const DetectedTokenDetails = ({
token,
handleTokenSelection,
tokensListDetected,
}) => {
const tokenList = useSelector(getTokenList);
const tokenData = tokenList[token.address?.toLowerCase()];
return (
<Box
display={DISPLAY.FLEX}
className="detected-token-details"
marginBottom={4}
>
<Identicon
className="detected-token-details__identicon"
address={token.address}
diameter={40}
/>
<Box
display={DISPLAY.GRID}
marginLeft={2}
className="detected-token-details__data"
>
<DetectedTokenValues
token={token}
handleTokenSelection={handleTokenSelection}
tokensListDetected={tokensListDetected}
/>
<DetectedTokenAddress tokenAddress={token.address} />
{tokenData?.aggregators.length > 0 && (
<DetectedTokenAggregators aggregators={tokenData?.aggregators} />
)}
</Box>
</Box>
);
};
DetectedTokenDetails.propTypes = {
token: PropTypes.shape({
address: PropTypes.string.isRequired,
decimals: PropTypes.number,
symbol: PropTypes.string,
iconUrl: PropTypes.string,
aggregators: PropTypes.array,
}),
handleTokenSelection: PropTypes.func.isRequired,
tokensListDetected: PropTypes.object,
};
export default DetectedTokenDetails;