diff --git a/src/transaction/components/TransactionButton.tsx b/src/transaction/components/TransactionButton.tsx index 0f1bac1576..49f5edf959 100644 --- a/src/transaction/components/TransactionButton.tsx +++ b/src/transaction/components/TransactionButton.tsx @@ -52,6 +52,7 @@ export function TransactionButton({ }); const buttonContent = useMemo(() => { + // txn successful if (receipt) { return 'View transaction'; } @@ -62,8 +63,10 @@ export function TransactionButton({ }, [buttonText, errorMessage, receipt]); const handleSubmit = useCallback(() => { + // SW will have txn id so open in wallet if (receipt && transactionId) { showCallsStatus({ id: transactionId }); + // EOA will not have txn id so open in explorer } else if (receipt) { const chainExplorer = getChainExplorer(accountChainId); window.open( @@ -72,6 +75,7 @@ export function TransactionButton({ 'noopener,noreferrer', ); } else { + // if no receipt, submit txn onSubmit(); } }, [ diff --git a/src/transaction/components/TransactionToastIcon.tsx b/src/transaction/components/TransactionToastIcon.tsx index 82459e3b81..19915e01e8 100644 --- a/src/transaction/components/TransactionToastIcon.tsx +++ b/src/transaction/components/TransactionToastIcon.tsx @@ -12,6 +12,7 @@ export function TransactionToastIcon({ className }: TransactionToastIconReact) { const isInProgress = isLoading || !!transactionId || !!transactionHash; const icon = useMemo(() => { + // txn successful if (receipt) { return successSvg; } diff --git a/src/transaction/hooks/useGetTransactionStatusLabel.tsx b/src/transaction/hooks/useGetTransactionStatusLabel.tsx index 1c1ce855bb..f3b31536ea 100644 --- a/src/transaction/hooks/useGetTransactionStatusLabel.tsx +++ b/src/transaction/hooks/useGetTransactionStatusLabel.tsx @@ -12,7 +12,10 @@ export function useGetTransactionStatusLabel() { transactionHash, transactionId, } = useTransactionContext(); + // user confirmed in wallet, txn in progress const isInProgress = isLoading || !!transactionId || !!transactionHash; + + // user started txn and needs to confirm in wallet const isPending = statusWriteContract === 'pending' || statusWriteContracts === 'pending'; diff --git a/src/transaction/hooks/useGetTransactionToastLabel.tsx b/src/transaction/hooks/useGetTransactionToastLabel.tsx index b9b61e6e1a..1d16c00326 100644 --- a/src/transaction/hooks/useGetTransactionToastLabel.tsx +++ b/src/transaction/hooks/useGetTransactionToastLabel.tsx @@ -5,6 +5,8 @@ import { useTransactionContext } from '../components/TransactionProvider'; export function useGetTransactionToastLabel() { const { errorMessage, isLoading, receipt, transactionHash, transactionId } = useTransactionContext(); + + // user confirmed in wallet, txn in progress const isInProgress = isLoading || !!transactionId || !!transactionHash; return useMemo(() => {