1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-12 20:57:12 +01:00
metamask-extension/ui/pages/asset/components/asset-options.js
Akintayo A. Olusegun 08dff86be0
Add target object word to "View on Etherscan" links (#12100)
* Add target object word to "View on Etherscan" links
Fix for: #9476

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Fix Swap tests checking for View $1 at or View $1 on

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Linter Fixes

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Fix  ui/hooks/useTransactionDisplayData.test.js expected result should
be May 13, 2020

Update Jest snapshot for view on etherscan test

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Add description of the variables in messages.

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* 1. localize all of the blockExplorerViewAction values
2. Apply this nit. https://github.com/MetaMask/metamask-extension/pull/12100#discussion_r708343532

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Lint fixes.

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Fix locale value not used on GUI error lint error.

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Reverted this commit, on circle ci, the date is May 12.

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Add description to link block explore actions to where it's used.

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>

* Fix missing messages.

Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>
2021-09-24 21:14:07 +04:00

85 lines
2.4 KiB
JavaScript

import React, { useContext, useState } from 'react';
import PropTypes from 'prop-types';
import { I18nContext } from '../../../contexts/i18n';
import { Menu, MenuItem } from '../../../components/ui/menu';
const AssetOptions = ({
onRemove,
onClickBlockExplorer,
onViewAccountDetails,
tokenSymbol,
isNativeAsset,
isEthNetwork,
}) => {
const t = useContext(I18nContext);
const [assetOptionsButtonElement, setAssetOptionsButtonElement] = useState(
null,
);
const [assetOptionsOpen, setAssetOptionsOpen] = useState(false);
return (
<>
<button
className="fas fa-ellipsis-v asset-options__button"
data-testid="asset-options__button"
onClick={() => setAssetOptionsOpen(true)}
ref={setAssetOptionsButtonElement}
title={t('assetOptions')}
/>
{assetOptionsOpen ? (
<Menu
anchorElement={assetOptionsButtonElement}
onHide={() => setAssetOptionsOpen(false)}
>
<MenuItem
iconClassName="fas fa-qrcode"
data-testid="asset-options__account-details"
onClick={() => {
setAssetOptionsOpen(false);
onViewAccountDetails();
}}
>
{t('accountDetails')}
</MenuItem>
<MenuItem
iconClassName="fas fa-external-link-alt asset-options__icon"
data-testid="asset-options__etherscan"
onClick={() => {
setAssetOptionsOpen(false);
onClickBlockExplorer();
}}
>
{isEthNetwork
? t('viewOnEtherscan', [t('blockExplorerAssetAction')])
: t('viewinExplorer', [t('blockExplorerAssetAction')])}
</MenuItem>
{isNativeAsset ? null : (
<MenuItem
iconClassName="fas fa-trash-alt asset-options__icon"
data-testid="asset-options__hide"
onClick={() => {
setAssetOptionsOpen(false);
onRemove();
}}
>
{t('hideTokenSymbol', [tokenSymbol])}
</MenuItem>
)}
</Menu>
) : null}
</>
);
};
AssetOptions.propTypes = {
isEthNetwork: PropTypes.bool,
isNativeAsset: PropTypes.bool,
onRemove: PropTypes.func.isRequired,
onClickBlockExplorer: PropTypes.func.isRequired,
onViewAccountDetails: PropTypes.func.isRequired,
tokenSymbol: PropTypes.string,
};
export default AssetOptions;