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

Replacing deprecated constants (#19858)

Browse Source
This commit is contained in:
Dhruv 2023-07-12 22:12:24 +05:30 committed by GitHub
parent 23c3e8f32d
commit c86cbf5df2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 16 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
ui/components/app/detected-token/detected-token-aggregators/detected-token-aggregators.js
View File

@ -3,14 +3,12 @@ import PropTypes from 'prop-types';
import { useI18nContext } from '../../../../hooks/useI18nContext'; import { useI18nContext } from '../../../../hooks/useI18nContext';
import Box from '../../../ui/box';
import Button from '../../../ui/button';
import { import {
DISPLAY, Display,
FontWeight, FontWeight,
TextVariant, TextVariant,
} from '../../../../helpers/constants/design-system'; } from '../../../../helpers/constants/design-system';
import { Text } from '../../../component-library'; import { Text, Box, ButtonLink } from '../../../component-library';
const NUMBER_OF_AGGREGATORS_TO_DISPLAY = 2; const NUMBER_OF_AGGREGATORS_TO_DISPLAY = 2;
@ -21,7 +19,7 @@ const DetectedTokenAggregators = ({ aggregators }) => {
const [displayMore, setDisplayMore] = useState(false); const [displayMore, setDisplayMore] = useState(false);
return ( return (
<Box display={DISPLAY.INLINE_FLEX} className="detected-token-aggregators"> <Box display={Display.InlineFlex} className="detected-token-aggregators">
<Text variant={TextVariant.bodySm} as="h6" fontWeight={FontWeight.Normal}> <Text variant={TextVariant.bodySm} as="h6" fontWeight={FontWeight.Normal}>
{t('fromTokenLists', [ {t('fromTokenLists', [
numOfHiddenAggregators > 0 && !displayMore ? ( numOfHiddenAggregators > 0 && !displayMore ? (
@ -34,14 +32,13 @@ const DetectedTokenAggregators = ({ aggregators }) => {
{`${aggregators {`${aggregators
.slice(0, NUMBER_OF_AGGREGATORS_TO_DISPLAY) .slice(0, NUMBER_OF_AGGREGATORS_TO_DISPLAY)
.join(', ')}`} .join(', ')}`}
<Button <ButtonLink
type="link"
className="detected-token-aggregators__link" className="detected-token-aggregators__link"
onClick={() => setDisplayMore(true)} onClick={() => setDisplayMore(true)}
key="detected-token-aggrgators-link" key="detected-token-aggrgators-link"
> >
{t('plusXMore', [numOfHiddenAggregators])} {t('plusXMore', [numOfHiddenAggregators])}
</Button> </ButtonLink>
</Text> </Text>
) : ( ) : (
<Text <Text

6
ui/components/app/detected-token/detected-token-aggregators/detected-token-aggregators.stories.js
View File

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { DISPLAY } from '../../../../helpers/constants/design-system'; import { Display } from '../../../../helpers/constants/design-system';
import Box from '../../../ui/box'; import { Box } from '../../../component-library';
import DetectedTokenAggregators from './detected-token-aggregators'; import DetectedTokenAggregators from './detected-token-aggregators';
export default { export default {
@ -31,7 +31,7 @@ export default {
const Template = (args) => { const Template = (args) => {
return ( return (
<Box display={DISPLAY.GRID}> <Box display={Display.Grid}>
<DetectedTokenAggregators aggregators={args.aggregators1} /> <DetectedTokenAggregators aggregators={args.aggregators1} />
<DetectedTokenAggregators aggregators={args.aggregators2} /> <DetectedTokenAggregators aggregators={args.aggregators2} />
</Box> </Box>

8
ui/components/app/detected-token/detected-token-details/detected-token-details.js
View File

@ -2,12 +2,12 @@ import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
import Box from '../../../ui/box'; import { Box } from '../../../component-library';
import Identicon from '../../../ui/identicon'; import Identicon from '../../../ui/identicon';
import DetectedTokenValues from '../detected-token-values/detected-token-values'; import DetectedTokenValues from '../detected-token-values/detected-token-values';
import DetectedTokenAddress from '../detected-token-address/detected-token-address'; import DetectedTokenAddress from '../detected-token-address/detected-token-address';
import DetectedTokenAggregators from '../detected-token-aggregators/detected-token-aggregators'; import DetectedTokenAggregators from '../detected-token-aggregators/detected-token-aggregators';
import { DISPLAY } from '../../../../helpers/constants/design-system'; import { Display } from '../../../../helpers/constants/design-system';
import { getTokenList } from '../../../../selectors'; import { getTokenList } from '../../../../selectors';
const DetectedTokenDetails = ({ const DetectedTokenDetails = ({
@ -20,7 +20,7 @@ const DetectedTokenDetails = ({
return ( return (
<Box <Box
display={DISPLAY.FLEX} display={Display.Flex}
className="detected-token-details" className="detected-token-details"
marginBottom={4} marginBottom={4}
> >
@ -30,7 +30,7 @@ const DetectedTokenDetails = ({
diameter={40} diameter={40}
/> />
<Box <Box
display={DISPLAY.GRID} display={Display.Grid}
marginLeft={2} marginLeft={2}
className="detected-token-details__data" className="detected-token-details__data"
> >

2
ui/components/app/detected-token/detected-token-details/detected-token-details.stories.js
View File

@ -7,7 +7,7 @@ export default {
argTypes: { argTypes: {
token: { control: 'object' }, token: { control: 'object' },
handleTokenSelection: { control: 'func' }, handleTokenSelection: { action: 'handleTokenSelection' },
tokensListDetected: { control: 'array' }, tokensListDetected: { control: 'array' },
}, },
args: { args: {

7
ui/components/app/detected-token/detected-token-values/detected-token-values.js
View File

@ -2,18 +2,17 @@ import React, { useEffect, useState } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
import Box from '../../../ui/box';
import CheckBox from '../../../ui/check-box'; import CheckBox from '../../../ui/check-box';
import { import {
DISPLAY, Display,
TextColor, TextColor,
TextVariant, TextVariant,
} from '../../../../helpers/constants/design-system'; } from '../../../../helpers/constants/design-system';
import { useTokenTracker } from '../../../../hooks/useTokenTracker'; import { useTokenTracker } from '../../../../hooks/useTokenTracker';
import { useTokenFiatAmount } from '../../../../hooks/useTokenFiatAmount'; import { useTokenFiatAmount } from '../../../../hooks/useTokenFiatAmount';
import { getUseCurrencyRateCheck } from '../../../../selectors'; import { getUseCurrencyRateCheck } from '../../../../selectors';
import { Text } from '../../../component-library'; import { Text, Box } from '../../../component-library';
const DetectedTokenValues = ({ const DetectedTokenValues = ({
token, token,
@ -44,7 +43,7 @@ const DetectedTokenValues = ({
}; };
return ( return (
<Box display={DISPLAY.INLINE_FLEX} className="detected-token-values"> <Box display={Display.InlineFlex} className="detected-token-values">
<Box marginBottom={1}> <Box marginBottom={1}>
<Text variant={TextVariant.bodyLgMedium} as="h4"> <Text variant={TextVariant.bodyLgMedium} as="h4">
{`${balanceString || '0'} ${token.symbol}`} {`${balanceString || '0'} ${token.symbol}`}