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

Update multichain Icon imports (#18536)

Browse Source 
* Update multichain Icon imports

* replace ButtonIcon with updated version

* Buttons with Icon TODO added

* update header to use TS version Icon
This commit is contained in:
Garrett Bear 2023-04-13 15:24:47 -07:00 committed by GitHub
parent 8becb57d9e
commit e09028b4e5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 42 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
ui/components/multichain/account-list-item-menu/account-list-item-menu.js
View File

@ -12,8 +12,7 @@ import {
} from '../../../selectors';
import { NETWORKS_ROUTE } from '../../../helpers/constants/routes';
import { Menu, MenuItem } from '../../ui/menu';
import { Text } from '../../component-library';
import { ICON_NAMES } from '../../component-library/icon/deprecated';
import { Text, IconName } from '../../component-library';
import {
MetaMetricsEventCategory,
MetaMetricsEventLinkType,
@ -74,7 +73,7 @@ export const AccountListItemMenu = ({
: openBlockExplorer
}
subtitle={blockExplorerUrlSubTitle || null}
iconName={ICON_NAMES.EXPORT}
iconName={IconName.Export}
data-testid="account-list-menu-open-explorer"
>
<Text variant={TextVariant.bodySm}>{t('viewOnExplorer')}</Text>
@ -92,7 +91,7 @@ export const AccountListItemMenu = ({
onClose();
closeMenu?.();
}}
iconName={ICON_NAMES.SCAN_BARCODE}
iconName={IconName.ScanBarcode}
>
<Text variant={TextVariant.bodySm}>{t('accountDetails')}</Text>
</MenuItem>
@ -108,7 +107,7 @@ export const AccountListItemMenu = ({
);
onClose();
}}
iconName={ICON_NAMES.TRASH}
iconName={IconName.Trash}
>
<Text variant={TextVariant.bodySm}>{t('removeAccount')}</Text>
</MenuItem>

12
ui/components/multichain/account-list-item/account-list-item.js
View File

@ -15,12 +15,10 @@ import {
AvatarFavicon,
Tag,
ButtonLink,
ButtonIcon,
IconName,
IconSize,
} from '../../component-library';
import { ButtonIcon } from '../../component-library/button-icon/deprecated';
import {
ICON_NAMES,
ICON_SIZES,
} from '../../component-library/icon/deprecated';
import {
Color,
TEXT_ALIGN,
@ -197,8 +195,8 @@ export const AccountListItem = ({
<div ref={ref}>
<ButtonIcon
ariaLabel={`${identity.name} ${t('options')}`}
iconName={ICON_NAMES.MORE_VERTICAL}
size={ICON_SIZES.SM}
iconName={IconName.MoreVertical}
size={IconSize.Sm}
onClick={(e) => {
e.stopPropagation();
setAccountOptionsMenuOpen(true);

1
ui/components/multichain/account-list-menu/account-list-menu.js
View File

@ -5,6 +5,7 @@ import Fuse from 'fuse.js';
import { useDispatch, useSelector } from 'react-redux';
import Box from '../../ui/box/box';
import { ButtonLink, TextFieldSearch, Text } from '../../component-library';
// TODO: Replace ICON_NAMES with IconName when ButtonBase/Buttons have been updated
import { ICON_NAMES } from '../../component-library/icon/deprecated';
import { AccountListItem } from '..';
import {

5
ui/components/multichain/account-picker/account-picker.js
View File

@ -5,9 +5,10 @@ import {
Button,
AvatarAccount,
AvatarAccountVariant,
Icon,
IconName,
Text,
} from '../../component-library';
import { ICON_NAMES, Icon } from '../../component-library/icon/deprecated';
import {
AlignItems,
BackgroundColor,
@ -47,7 +48,7 @@ export const AccountPicker = ({ address, name, onClick }) => {
{name}
</Text>
<Icon
name={ICON_NAMES.ARROW_DOWN}
name={IconName.ArrowDown}
color={IconColor.iconDefault}
size={Size.SM}
/>

1
ui/components/multichain/address-copy-button/address-copy-button.js
View File

@ -2,6 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { ButtonBase } from '../../component-library';
// TODO: Replace ICON_NAMES with IconName when ButtonBase/Buttons have been updated
import { ICON_NAMES } from '../../component-library/icon/deprecated';
import {
BackgroundColor,

13
ui/components/multichain/app-header/app-header.js
View File

@ -21,9 +21,14 @@ import {
JustifyContent,
Size,
} from '../../../helpers/constants/design-system';
import { AvatarNetwork, Button, PickerNetwork } from '../../component-library';
import { ButtonIcon } from '../../component-library/button-icon/deprecated';
import { ICON_NAMES } from '../../component-library/icon/deprecated';
import {
AvatarNetwork,
Button,
ButtonIcon,
IconName,
PickerNetwork,
} from '../../component-library';
import {
getCurrentNetwork,
getOriginOfCurrentTab,
@ -149,7 +154,7 @@ export const AppHeader = ({ onClick }) => {
width={BLOCK_SIZES.FULL}
>
<ButtonIcon
iconName={ICON_NAMES.MORE_VERTICAL}
iconName={IconName.MoreVertical}
data-testid="account-options-menu-button"
ariaLabel="NEEDS NEW TRANSLATED LABEL" // TODO: Update the label
onClick={() => {

14
ui/components/multichain/global-menu/global-menu.js
View File

@ -9,7 +9,7 @@ import {
} from '../../../helpers/constants/routes';
import { lockMetamask } from '../../../store/actions';
import { useI18nContext } from '../../../hooks/useI18nContext';
import { ICON_NAMES } from '../../component-library/icon/deprecated';
import { IconName } from '../../component-library';
import { Menu, MenuItem } from '../../ui/menu';
import { getEnvironmentType } from '../../../../app/scripts/lib/util';
import { ENVIRONMENT_TYPE_FULLSCREEN } from '../../../../shared/constants/app';
@ -31,7 +31,7 @@ export const GlobalMenu = ({ closeMenu, anchorElement }) => {
return (
<Menu anchorElement={anchorElement} onHide={closeMenu}>
<MenuItem
iconName={ICON_NAMES.CONNECT}
iconName={IconName.Connect}
onClick={() => {
history.push(CONNECTED_ROUTE);
trackEvent({
@ -47,7 +47,7 @@ export const GlobalMenu = ({ closeMenu, anchorElement }) => {
{t('connectedSites')}
</MenuItem>
<MenuItem
iconName={ICON_NAMES.DIAGRAM}
iconName={IconName.Diagram}
onClick={() => {
const portfolioUrl = process.env.PORTFOLIO_URL;
global.platform.openTab({
@ -75,7 +75,7 @@ export const GlobalMenu = ({ closeMenu, anchorElement }) => {
</MenuItem>
{getEnvironmentType() === ENVIRONMENT_TYPE_FULLSCREEN ? null : (
<MenuItem
iconName={ICON_NAMES.EXPAND}
iconName={IconName.Expand}
onClick={() => {
global.platform.openExtensionInBrowser();
trackEvent({
@ -93,7 +93,7 @@ export const GlobalMenu = ({ closeMenu, anchorElement }) => {
</MenuItem>
)}
<MenuItem
iconName={ICON_NAMES.MESSAGE_QUESTION}
iconName={IconName.MessageQuestion}
onClick={() => {
global.platform.openTab({ url: SUPPORT_LINK });
trackEvent(
@ -117,7 +117,7 @@ export const GlobalMenu = ({ closeMenu, anchorElement }) => {
{t('support')}
</MenuItem>
<MenuItem
iconName={ICON_NAMES.SETTING}
iconName={IconName.Setting}
onClick={() => {
history.push(SETTINGS_ROUTE);
trackEvent({
@ -133,7 +133,7 @@ export const GlobalMenu = ({ closeMenu, anchorElement }) => {
{t('settings')}
</MenuItem>
<MenuItem
iconName={ICON_NAMES.LOCK}
iconName={IconName.Lock}
onClick={() => {
dispatch(lockMetamask());
history.push(DEFAULT_ROUTE);

5
ui/components/multichain/multichain-connected-site-menu/multichain-connected-site-menu.js
View File

@ -13,8 +13,7 @@ import {
IconColor,
Size,
} from '../../../helpers/constants/design-system';
import { BadgeWrapper } from '../../component-library';
import { Icon, ICON_NAMES } from '../../component-library/icon/deprecated';
import { BadgeWrapper, Icon, IconName } from '../../component-library';
import Box from '../../ui/box';
import { getSelectedIdentity } from '../../../selectors';
import Tooltip from '../../ui/tooltip';
@ -69,7 +68,7 @@ export const MultichainConnectedSiteMenu = ({
}
>
<Icon
name={ICON_NAMES.GLOBAL}
name={IconName.Global}
size={Size.LG}
color={IconColor.iconDefault}
/>

1
ui/components/multichain/multichain-import-token-link/multichain-import-token-link.js
View File

@ -5,6 +5,7 @@ import PropTypes from 'prop-types';
import classnames from 'classnames';
import Box from '../../ui/box/box';
import { ButtonLink } from '../../component-library';
// TODO: Replace ICON_NAMES with IconName when ButtonBase/Buttons have been updated
import { ICON_NAMES } from '../../component-library/icon/deprecated';
import {
AlignItems,

11
ui/components/multichain/network-list-item/network-list-item.js
View File

@ -12,9 +12,12 @@ import {
TextColor,
BLOCK_SIZES,
} from '../../../helpers/constants/design-system';
import { AvatarNetwork, ButtonLink } from '../../component-library';
import { ButtonIcon } from '../../component-library/button-icon/deprecated';
import { ICON_NAMES } from '../../component-library/icon/deprecated';
import {
AvatarNetwork,
ButtonIcon,
ButtonLink,
IconName,
} from '../../component-library';
import { useI18nContext } from '../../../hooks/useI18nContext';
import Tooltip from '../../ui/tooltip/tooltip';
@ -68,7 +71,7 @@ export const NetworkListItem = ({
<ButtonIcon
className="multichain-network-list-item__delete"
color={IconColor.errorDefault}
iconName={ICON_NAMES.TRASH}
iconName={IconName.Trash}
ariaLabel={t('deleteNetwork')}
size={Size.SM}
onClick={(e) => {

5
ui/components/ui/menu/menu-item.js
View File

@ -2,8 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Text } from '../../component-library';
import { Icon, ICON_SIZES } from '../../component-library/icon/deprecated';
import { Text, Icon, IconSize } from '../../component-library';
import { TextVariant } from '../../../helpers/constants/design-system';
const MenuItem = ({
@ -20,7 +19,7 @@ const MenuItem = ({
onClick={onClick}
>
{iconName ? (
<Icon name={iconName} size={ICON_SIZES.SM} marginRight={2} />
<Icon name={iconName} size={IconSize.Sm} marginRight={2} />
) : null}
<div>
<div>{children}</div>