You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
60 lines
1.7 KiB
60 lines
1.7 KiB
import React, { useContext, useState } from 'react'
|
|
import PropTypes from 'prop-types'
|
|
|
|
import { I18nContext } from '../../../contexts/i18n'
|
|
import { Menu, MenuItem } from '../../../components/ui/menu'
|
|
|
|
const TokenOptions = ({ onRemove, onViewEtherscan, tokenSymbol }) => {
|
|
const t = useContext(I18nContext)
|
|
const [tokenOptionsButtonElement, setTokenOptionsButtonElement] = useState(
|
|
null,
|
|
)
|
|
const [tokenOptionsOpen, setTokenOptionsOpen] = useState(false)
|
|
|
|
return (
|
|
<>
|
|
<button
|
|
className="fas fa-ellipsis-v token-options__button"
|
|
data-testid="token-options__button"
|
|
onClick={() => setTokenOptionsOpen(true)}
|
|
ref={setTokenOptionsButtonElement}
|
|
title={t('tokenOptions')}
|
|
/>
|
|
{tokenOptionsOpen ? (
|
|
<Menu
|
|
anchorElement={tokenOptionsButtonElement}
|
|
onHide={() => setTokenOptionsOpen(false)}
|
|
>
|
|
<MenuItem
|
|
iconClassName="fas fa-external-link-alt token-options__icon"
|
|
data-testid="token-options__etherscan"
|
|
onClick={() => {
|
|
setTokenOptionsOpen(false)
|
|
onViewEtherscan()
|
|
}}
|
|
>
|
|
{t('viewOnEtherscan')}
|
|
</MenuItem>
|
|
<MenuItem
|
|
iconClassName="fas fa-trash-alt token-options__icon"
|
|
data-testid="token-options__hide"
|
|
onClick={() => {
|
|
setTokenOptionsOpen(false)
|
|
onRemove()
|
|
}}
|
|
>
|
|
{t('hideTokenSymbol', [tokenSymbol])}
|
|
</MenuItem>
|
|
</Menu>
|
|
) : null}
|
|
</>
|
|
)
|
|
}
|
|
|
|
TokenOptions.propTypes = {
|
|
onRemove: PropTypes.func.isRequired,
|
|
onViewEtherscan: PropTypes.func.isRequired,
|
|
tokenSymbol: PropTypes.string.isRequired,
|
|
}
|
|
|
|
export default TokenOptions
|
|
|