vega-frontend-monorepo/libs/accounts/src/lib/accounts-actions-dropdown.tsx
Bartłomiej Głownia a070504d2e
feat(trading): i18n (#5126)
Co-authored-by: Matthew Russell <mattrussell36@gmail.com>
2023-11-14 21:10:06 -08:00

92 lines
2.6 KiB
TypeScript

import { ETHERSCAN_ADDRESS, useEtherscanLink } from '@vegaprotocol/environment';
import { useT } from './use-t';
import {
ActionsDropdown,
TradingDropdownCopyItem,
TradingDropdownItem,
Link,
VegaIcon,
VegaIconNames,
} from '@vegaprotocol/ui-toolkit';
import { useAssetDetailsDialogStore } from '@vegaprotocol/assets';
export const AccountsActionsDropdown = ({
assetId,
assetContractAddress,
onClickDeposit,
onClickWithdraw,
onClickBreakdown,
onClickTransfer,
}: {
assetId: string;
assetContractAddress?: string;
onClickDeposit: () => void;
onClickWithdraw: () => void;
onClickBreakdown: () => void;
onClickTransfer: () => void;
}) => {
const etherscanLink = useEtherscanLink();
const openAssetDialog = useAssetDetailsDialogStore((store) => store.open);
const t = useT();
return (
<ActionsDropdown>
<TradingDropdownItem
key={'deposit'}
data-testid="deposit"
onClick={onClickDeposit}
>
<VegaIcon name={VegaIconNames.DEPOSIT} size={16} />
{t('Deposit')}
</TradingDropdownItem>
<TradingDropdownItem
key={'withdraw'}
data-testid="withdraw"
onClick={onClickWithdraw}
>
<VegaIcon name={VegaIconNames.WITHDRAW} size={16} />
{t('Withdraw')}
</TradingDropdownItem>
<TradingDropdownItem
key={'transfer'}
data-testid="transfer"
onClick={onClickTransfer}
>
<VegaIcon name={VegaIconNames.TRANSFER} size={16} />
{t('Transfer')}
</TradingDropdownItem>
<TradingDropdownItem
key={'breakdown'}
data-testid="breakdown"
onClick={onClickBreakdown}
>
<VegaIcon name={VegaIconNames.BREAKDOWN} size={16} />
{t('View usage breakdown')}
</TradingDropdownItem>
<TradingDropdownItem
onClick={(e) => {
openAssetDialog(assetId, e.target as HTMLElement);
}}
>
<VegaIcon name={VegaIconNames.INFO} size={16} />
{t('View asset details')}
</TradingDropdownItem>
<TradingDropdownCopyItem value={assetId} text={t('Copy asset ID')} />
{assetContractAddress && (
<TradingDropdownItem>
<Link
href={etherscanLink(
ETHERSCAN_ADDRESS.replace(':hash', assetContractAddress)
)}
target="_blank"
>
<span className="flex gap-2">
<VegaIcon name={VegaIconNames.OPEN_EXTERNAL} size={16} />
{t('View on Etherscan')}
</span>
</Link>
</TradingDropdownItem>
)}
</ActionsDropdown>
);
};