diff --git a/apps/trading/lib/i18n/index.ts b/apps/trading/lib/i18n/index.ts index bc783c1d4..eda2060e2 100644 --- a/apps/trading/lib/i18n/index.ts +++ b/apps/trading/lib/i18n/index.ts @@ -25,6 +25,7 @@ i18n 'candles-chart', 'datagrid', 'deal-ticket', + 'deposits', 'fills', 'funding-payments', 'trading', diff --git a/libs/deposits/src/lib/approve-notification.tsx b/libs/deposits/src/lib/approve-notification.tsx index c1bac5c84..e11f576ac 100644 --- a/libs/deposits/src/lib/approve-notification.tsx +++ b/libs/deposits/src/lib/approve-notification.tsx @@ -1,6 +1,5 @@ import type { Asset } from '@vegaprotocol/assets'; import { EtherscanLink } from '@vegaprotocol/environment'; -import { t } from '@vegaprotocol/i18n'; import { Intent, Notification } from '@vegaprotocol/ui-toolkit'; import { formatNumber, @@ -11,6 +10,7 @@ import type { EthStoredTxState } from '@vegaprotocol/web3'; import { EthTxStatus, useEthTransactionStore } from '@vegaprotocol/web3'; import BigNumber from 'bignumber.js'; import type { DepositBalances } from './use-deposit-balances'; +import { useT } from './use-t'; interface ApproveNotificationProps { isActive: boolean; @@ -33,6 +33,7 @@ export const ApproveNotification = ({ approveTxId, intent = Intent.Warning, }: ApproveNotificationProps) => { + const t = useT(); const tx = useEthTransactionStore((state) => { return state.transactions.find((t) => t?.id === approveTxId); }); diff --git a/libs/deposits/src/lib/deposit-form.tsx b/libs/deposits/src/lib/deposit-form.tsx index 0bee8999f..bef8e7acd 100644 --- a/libs/deposits/src/lib/deposit-form.tsx +++ b/libs/deposits/src/lib/deposit-form.tsx @@ -10,7 +10,6 @@ import { isAssetTypeERC20, formatNumber, } from '@vegaprotocol/utils'; -import { t } from '@vegaprotocol/i18n'; import { useLocalStorage } from '@vegaprotocol/react-helpers'; import { TradingFormGroup, @@ -43,6 +42,7 @@ import { FaucetNotification } from './faucet-notification'; import { ApproveNotification } from './approve-notification'; import { usePersistentDeposit } from './use-persistent-deposit'; import { AssetBalance } from './asset-balance'; +import { useT } from './use-t'; interface FormFields { asset: string; @@ -84,6 +84,7 @@ export const DepositForm = ({ approveTxId, isFaucetable, }: DepositFormProps) => { + const t = useT(); const { open: openAssetDetailsDialog } = useAssetDetailsDialogStore(); const openDialog = useWeb3ConnectStore((store) => store.open); const { isActive, account } = useWeb3React(); @@ -419,6 +420,7 @@ interface FormButtonProps { } const FormButton = ({ approved, selectedAsset }: FormButtonProps) => { + const t = useT(); const { isActive, chainId } = useWeb3React(); const desiredChainId = useWeb3ConnectStore((store) => store.desiredChainId); const invalidChain = isActive && chainId !== desiredChainId; @@ -464,6 +466,7 @@ const DisconnectEthereumButton = ({ }: { onDisconnect: () => void; }) => { + const t = useT(); const { connector } = useWeb3React(); const [, , removeEagerConnector] = useLocalStorage(ETHEREUM_EAGER_CONNECT); const disconnect = useWeb3Disconnect(connector); @@ -495,6 +498,7 @@ export const AddressField = ({ input, onChange, }: AddressInputProps) => { + const t = useT(); const [isInput, setIsInput] = useState(() => { if (pubKeys && pubKeys.length <= 1) { return true; diff --git a/libs/deposits/src/lib/deposit-limits.tsx b/libs/deposits/src/lib/deposit-limits.tsx index e4054f23d..f7525ca1b 100644 --- a/libs/deposits/src/lib/deposit-limits.tsx +++ b/libs/deposits/src/lib/deposit-limits.tsx @@ -1,5 +1,4 @@ import type { Asset } from '@vegaprotocol/assets'; -import { t } from '@vegaprotocol/i18n'; import { CompactNumber } from '@vegaprotocol/react-helpers'; import { KeyValueTable, @@ -8,6 +7,7 @@ import { } from '@vegaprotocol/ui-toolkit'; import type BigNumber from 'bignumber.js'; import { formatNumber, quantumDecimalPlaces } from '@vegaprotocol/utils'; +import { useT } from './use-t'; // Note: all of the values here are with correct asset's decimals // See `libs/deposits/src/lib/use-deposit-balances.ts` @@ -29,6 +29,7 @@ export const DepositLimits = ({ allowance, exempt, }: DepositLimitsProps) => { + const t = useT(); const limits = [ { key: 'BALANCE_AVAILABLE', diff --git a/libs/deposits/src/lib/faucet-notification.tsx b/libs/deposits/src/lib/faucet-notification.tsx index 24dad8f9e..0914ef946 100644 --- a/libs/deposits/src/lib/faucet-notification.tsx +++ b/libs/deposits/src/lib/faucet-notification.tsx @@ -1,11 +1,10 @@ import type { Asset } from '@vegaprotocol/assets'; import { EtherscanLink } from '@vegaprotocol/environment'; -import { t } from '@vegaprotocol/i18n'; import { Intent, Notification } from '@vegaprotocol/ui-toolkit'; import { EthTxStatus, useEthTransactionStore } from '@vegaprotocol/web3'; -import { getFaucetError } from './get-faucet-error'; - -interface FaucetNotificationProps { +import { useGetFaucetError } from './get-faucet-error'; +import { useT } from './use-t'; +export interface FaucetNotificationProps { isActive: boolean; selectedAsset?: Asset; faucetTxId: number | null; @@ -14,14 +13,20 @@ interface FaucetNotificationProps { /** * Render a notification for the faucet transaction */ + export const FaucetNotification = ({ isActive, selectedAsset, faucetTxId, }: FaucetNotificationProps) => { + const t = useT(); const tx = useEthTransactionStore((state) => { return state.transactions.find((t) => t?.id === faucetTxId); }); + const errorMessage = useGetFaucetError( + tx?.status === EthTxStatus.Error ? tx.error : null, + selectedAsset?.symbol + ); if (!isActive) { return null; @@ -34,9 +39,7 @@ export const FaucetNotification = ({ if (!tx) { return null; } - - if (tx.status === EthTxStatus.Error) { - const errorMessage = getFaucetError(tx.error, selectedAsset.symbol); + if (errorMessage) { return (