1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-04 23:14:56 +01:00
metamask-extension/ui/pages/asset/components/asset-options.js
Alex Donesky f19207ca87
use etherscan-link customBlockExplorer methods with customNetwork usage tracking (#11017)
* use etherscan-link customBlockExplorer methods with customNetwork usage tracking

* consolidate blockexplorer events, add domain to metametrics event

* lint fix
2021-05-19 09:51:47 -05:00

83 lines
2.3 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('viewinExplorer')}
</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;