1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-10-22 11:22:43 +02:00

Part of #17670: Replace Typography with Text component in: detected-token-values.js (#18977)

* Update detected-token-values.js

* Update ui/components/app/detected-token/detected-token-values/detected-token-values.js

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>

---------

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>
This commit is contained in:
Harsh Shukla 2023-05-03 18:47:49 +05:30 committed by GitHub
parent 910b9e713f
commit 98cb3381e6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -3,17 +3,17 @@ import PropTypes from 'prop-types';
import { useSelector } from 'react-redux';
import Box from '../../../ui/box';
import Typography from '../../../ui/typography';
import CheckBox from '../../../ui/check-box';
import {
DISPLAY,
TextColor,
TypographyVariant,
TextVariant,
} from '../../../../helpers/constants/design-system';
import { useTokenTracker } from '../../../../hooks/useTokenTracker';
import { useTokenFiatAmount } from '../../../../hooks/useTokenFiatAmount';
import { getUseCurrencyRateCheck } from '../../../../selectors';
import { Text } from '../../../component-library';
const DetectedTokenValues = ({
token,
@ -46,17 +46,18 @@ const DetectedTokenValues = ({
return (
<Box display={DISPLAY.INLINE_FLEX} className="detected-token-values">
<Box marginBottom={1}>
<Typography variant={TypographyVariant.H4}>
<Text variant={TextVariant.bodyLgMedium} as="h4">
{`${balanceString || '0'} ${token.symbol}`}
</Typography>
<Typography
variant={TypographyVariant.H7}
</Text>
<Text
variant={TextVariant.bodySm}
as="h6"
color={TextColor.textAlternative}
>
{useCurrencyRateCheck
? formattedFiatBalance || '$0' // since formattedFiatBalance will be when teh conversion rate is not obtained, should be replace the `$0` with `N/A`
: formattedFiatBalance}
</Typography>
</Text>
</Box>
<Box className="detected-token-values__checkbox">
<CheckBox checked={tokenSelection} onClick={handleCheckBoxSelection} />