m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

UX: Show Checksum Addresses in Account Menu

Browse Source
This commit is contained in:
David Walsh 2023-07-21 18:57:59 -05:00 committed by Dan J Miller
parent f14a0ddb94
commit 41bab4a6e1
4 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/components/multichain/account-list-item/__snapshots__/account-list-item.test.js.snap
View File

@ -103,7 +103,7 @@ exports[`AccountListItem renders AccountListItem component and shows account nam
<p
class="box mm-text mm-text--body-sm box--flex-direction-row box--color-text-alternative"
>
0x0dc...e7bc
0x0DC...E7bc
</p>
</div>
<div

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

@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
import classnames from 'classnames';
import { useSelector } from 'react-redux';
import { toChecksumHexAddress } from '@metamask/controller-utils';
import { useI18nContext } from '../../../hooks/useI18nContext';
import { shortenAddress } from '../../../helpers/utils/util';
@ -197,7 +198,7 @@ export const AccountListItem = ({
/>
) : null}
<Text variant={TextVariant.bodySm} color={Color.textAlternative}>
{shortenAddress(identity.address)}
{shortenAddress(toChecksumHexAddress(identity.address))}
</Text>
</Box>
<Text

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

@ -1,6 +1,7 @@
/* eslint-disable jest/require-top-level-describe */
import React from 'react';
import { screen, fireEvent } from '@testing-library/react';
import { toChecksumHexAddress } from '@metamask/controller-utils';
import { renderWithProvider } from '../../../../test/jest';
import configureStore from '../../../store/store';
import mockState from '../../../../test/data/mock-state.json';
@ -34,7 +35,7 @@ describe('AccountListItem', () => {
const { container } = render();
expect(screen.getByText(identity.name)).toBeInTheDocument();
expect(
screen.getByText(shortenAddress(identity.address)),
screen.getByText(shortenAddress(toChecksumHexAddress(identity.address))),
).toBeInTheDocument();
expect(document.querySelector('[title="0.006 ETH"]')).toBeInTheDocument();

7
ui/components/multichain/menu-items/view-explorer-menu-item.js
View File

@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
import { useSelector } from 'react-redux';
import { useHistory } from 'react-router-dom';
import { toChecksumHexAddress } from '@metamask/controller-utils';
import { getAccountLink } from '@metamask/etherscan-link';
import { MenuItem } from '../../ui/menu';
@ -34,7 +35,11 @@ export const ViewExplorerMenuItem = ({
const chainId = useSelector(getCurrentChainId);
const rpcPrefs = useSelector(getRpcPrefsForCurrentProvider);
const addressLink = getAccountLink(address, chainId, rpcPrefs);
const addressLink = getAccountLink(
toChecksumHexAddress(address),
chainId,
rpcPrefs,
);
const { blockExplorerUrl } = rpcPrefs;
const blockExplorerUrlSubTitle = getURLHostName(blockExplorerUrl);