diff --git a/apps/trading/lib/hooks/use-ethereum-transaction-toasts.tsx b/apps/trading/lib/hooks/use-ethereum-transaction-toasts.tsx
index ef5b960de..6de4e5e77 100644
--- a/apps/trading/lib/hooks/use-ethereum-transaction-toasts.tsx
+++ b/apps/trading/lib/hooks/use-ethereum-transaction-toasts.tsx
@@ -1,3 +1,4 @@
+import type { ReactNode } from 'react';
import { useAssetsDataProvider } from '@vegaprotocol/assets';
import { ETHERSCAN_TX, useEtherscanLink } from '@vegaprotocol/environment';
import { formatNumber, t, toBigNum } from '@vegaprotocol/react-helpers';
@@ -18,60 +19,59 @@ const intentMap: { [s in EthTxStatus]: Intent } = {
Requested: Intent.Warning,
Pending: Intent.Warning,
Error: Intent.Danger,
- Complete: Intent.Success,
+ Complete: Intent.Warning,
Confirmed: Intent.Success,
};
+const isWithdrawTransaction = (tx: EthStoredTxState) =>
+ tx.methodName === 'withdraw_asset';
+
+const isDepositTransaction = (tx: EthStoredTxState) =>
+ tx.methodName === 'withdraw_asset';
+
const EthTransactionDetails = ({ tx }: { tx: EthStoredTxState }) => {
- const { data } = useAssetsDataProvider();
- if (!data) return null;
+ const { data: assets } = useAssetsDataProvider();
+ if (!assets) return null;
- const ETH_WITHDRAW =
- tx.methodName === 'withdraw_asset' && tx.args.length > 2 && tx.assetId;
- const ETH_DEPOSIT =
- tx.methodName === 'deposit_asset' && tx.args.length > 2 && tx.assetId;
-
- let label = '';
- if (ETH_WITHDRAW) label = t('Withdraw');
- if (ETH_DEPOSIT) label = t('Deposit');
-
- if (ETH_WITHDRAW || ETH_DEPOSIT) {
- const asset = data.find((a) => a.id === tx.assetId);
+ const isWithdraw = isWithdrawTransaction(tx);
+ const isDeposit = isDepositTransaction(tx);
+ let assetInfo: ReactNode;
+ if ((isWithdraw || isDeposit) && tx.args.length > 2 && tx.assetId) {
+ const asset = assets.find((a) => a.id === tx.assetId);
if (asset) {
- const num = formatNumber(
- toBigNum(tx.args[1], asset.decimals),
- asset.decimals
- );
- const details = (
+ let label = '';
+ if (isWithdraw) label = t('Withdraw');
+ if (isDeposit) label = t('Deposit');
+ assetInfo = (
- {label} {num} {asset.symbol}
+ {label}{' '}
+ {formatNumber(toBigNum(tx.args[1], asset.decimals), asset.decimals)}{' '}
+ {asset.symbol}
);
- return (
- <>
- {details}
- {tx.requiresConfirmation &&
- [EthTxStatus.Pending].includes(tx.status) && (
-
-
- {t('Awaiting confirmations')}{' '}
- {`(${tx.confirmations}/${tx.requiredConfirmations})`}
-
-
-
- )}
- >
- );
}
}
- return null;
+ return (
+ <>
+ {assetInfo}
+ {tx.status === EthTxStatus.Pending && (
+
+
+ {t('Awaiting confirmations')}{' '}
+ {`(${tx.confirmations}/${tx.requiredConfirmations})`}
+
+
+
+ )}
+ >
+ );
};
type EthTxToastContentProps = {
@@ -93,21 +93,11 @@ const EthTxRequestedToastContent = ({ tx }: EthTxToastContentProps) => {
};
const EthTxPendingToastContent = ({ tx }: EthTxToastContentProps) => {
- const etherscanLink = useEtherscanLink();
return (
{t('Awaiting confirmation')}
{t('Please wait for your transaction to be confirmed')}
- {tx.txHash && (
-
-
- {t('View on Etherscan')}
-
-
- )}
+
);
@@ -130,22 +120,43 @@ const EthTxErrorToastContent = ({ tx }: EthTxToastContentProps) => {
);
};
-const EthTxConfirmedToastContent = ({ tx }: EthTxToastContentProps) => {
+const EtherscanLink = ({ tx }: EthTxToastContentProps) => {
const etherscanLink = useEtherscanLink();
+ return tx.txHash ? (
+
+
+ {t('View on Etherscan')}
+
+
+ ) : null;
+};
+
+const EthTxConfirmedToastContent = ({ tx }: EthTxToastContentProps) => {
return (
-
{t('Transaction completed')}
-
{t('Your transaction has been completed')}
- {tx.txHash && (
-
-
- {t('View on Etherscan')}
-
-
- )}
+
{t('Transaction confirmed')}
+
{t('Your transaction has been confirmed')}
+
+
+
+ );
+};
+
+const EthTxCompletedToastContent = ({ tx }: EthTxToastContentProps) => {
+ const isDeposit = isDepositTransaction(tx);
+ return (
+
+
+ {t('Processing')} {isDeposit && 'deposit'}
+
+
+ {t('Your transaction has been completed.')}
+ {isDeposit && t('Waiting for deposit confirmation')}
+
+
);
@@ -167,10 +178,10 @@ export const useEthereumTransactionToasts = () => {
if (tx.status === EthTxStatus.Pending) {
content = ;
}
- if (
- tx.status === EthTxStatus.Confirmed ||
- tx.status === EthTxStatus.Complete
- ) {
+ if (tx.status === EthTxStatus.Complete) {
+ content = ;
+ }
+ if (tx.status === EthTxStatus.Confirmed) {
content = ;
}
if (tx.status === EthTxStatus.Error) {
@@ -181,7 +192,7 @@ export const useEthereumTransactionToasts = () => {
id: `eth-${tx.id}`,
intent: intentMap[tx.status],
onClose: () => dismissEthTransaction(tx.id),
- loader: tx.status === EthTxStatus.Pending,
+ loader: [EthTxStatus.Pending, EthTxStatus.Complete].includes(tx.status),
content,
};
},
diff --git a/libs/deposits/src/lib/use-deposits.ts b/libs/deposits/src/lib/use-deposits.ts
index 3ae7fbb4d..35bbeb883 100644
--- a/libs/deposits/src/lib/use-deposits.ts
+++ b/libs/deposits/src/lib/use-deposits.ts
@@ -70,6 +70,7 @@ const updateQuery: UpdateQueryFn<
subscriptionData.data.busEvents
);
+ console.log({ subscriptionData, time: new Date() });
const deposits = uniqBy([...incoming, ...curr], 'id');
if (!prev.party) {
diff --git a/libs/ui-toolkit/src/components/toast/toast.tsx b/libs/ui-toolkit/src/components/toast/toast.tsx
index 57e2455b1..cbf9b4727 100644
--- a/libs/ui-toolkit/src/components/toast/toast.tsx
+++ b/libs/ui-toolkit/src/components/toast/toast.tsx
@@ -115,6 +115,7 @@ export const Toast = ({
>