diff --git a/packages/synapse-interface/components/StateManagedSwap/SwapInputContainer.tsx b/packages/synapse-interface/components/StateManagedSwap/SwapInputContainer.tsx index 9d6450607e..eb156d4053 100644 --- a/packages/synapse-interface/components/StateManagedSwap/SwapInputContainer.tsx +++ b/packages/synapse-interface/components/StateManagedSwap/SwapInputContainer.tsx @@ -13,7 +13,7 @@ import { import { SwapChainSelector } from './SwapChainSelector' import { SwapFromTokenSelector } from './SwapFromTokenSelector' import { usePortfolioState } from '@/slices/portfolio/hooks' -import { updateSwapFromValue } from '@/slices/swap/reducer' +import { initialState, updateSwapFromValue } from '@/slices/swap/reducer' import { useSwapState } from '@/slices/swap/hooks' export const SwapInputContainer = () => { @@ -51,6 +51,10 @@ export const SwapInputContainer = () => { ) { setShowValue(swapFromValue) } + + if (swapFromValue === initialState.swapFromValue) { + setShowValue(initialState.swapFromValue) + } }, [swapFromValue, swapChainId, swapFromToken]) const handleFromValueChange = ( diff --git a/packages/synapse-interface/components/buttons/TransactionButton.tsx b/packages/synapse-interface/components/buttons/TransactionButton.tsx index 3c5c139b5f..ee3a9d29c0 100644 --- a/packages/synapse-interface/components/buttons/TransactionButton.tsx +++ b/packages/synapse-interface/components/buttons/TransactionButton.tsx @@ -56,7 +56,7 @@ export const TransactionButton = ({ > {isPending ? (
- + {pendingLabel}{' '}
) : ( diff --git a/packages/synapse-interface/components/ui/tailwind/LoadingDots.tsx b/packages/synapse-interface/components/ui/tailwind/LoadingDots.tsx index 09616027b5..b110e89c2d 100644 --- a/packages/synapse-interface/components/ui/tailwind/LoadingDots.tsx +++ b/packages/synapse-interface/components/ui/tailwind/LoadingDots.tsx @@ -6,7 +6,10 @@ export default function LoadingDots({ shift?: boolean }) { return ( -
+
) diff --git a/packages/synapse-interface/pages/swap/index.tsx b/packages/synapse-interface/pages/swap/index.tsx index 448bcf9977..3cbdedae52 100644 --- a/packages/synapse-interface/pages/swap/index.tsx +++ b/packages/synapse-interface/pages/swap/index.tsx @@ -15,7 +15,7 @@ import { formatBigIntToString } from '@/utils/bigint/format' import { calculateExchangeRate } from '@/utils/calculateExchangeRate' import { useEffect, useRef, useState } from 'react' import { Token } from '@/utils/types' -import { getWalletClient } from '@wagmi/core' +import { getWalletClient, waitForTransaction } from '@wagmi/core' import { txErrorHandler } from '@/utils/txErrorHandler' import { CHAINS_BY_ID } from '@/constants/chains' import { approveToken } from '@/utils/approveToken' @@ -30,7 +30,10 @@ import ExplorerToastLink from '@/components/ExplorerToastLink' import { Address, zeroAddress } from 'viem' import { stringToBigInt } from '@/utils/bigint/format' import { useAppDispatch } from '@/store/hooks' -import { useFetchPortfolioBalances } from '@/slices/portfolio/hooks' +import { + useFetchPortfolioBalances, + fetchAndStoreSingleNetworkPortfolioBalances, +} from '@/slices/portfolio/hooks' import { SwapTransactionButton } from '@/components/StateManagedSwap/SwapTransactionButton' import SwapExchangeRateInfo from '@/components/StateManagedSwap/SwapExchangeRateInfo' import { useSwapState } from '@/slices/swap/hooks' @@ -43,6 +46,7 @@ import { DEFAULT_FROM_CHAIN, EMPTY_SWAP_QUOTE_ZERO } from '@/constants/swap' import { SwapToTokenListOverlay } from '@/components/StateManagedSwap/SwapToTokenListOverlay' import { LandingPageWrapper } from '@/components/layouts/LandingPageWrapper' import useSyncQueryParamsWithSwapState from '@/utils/hooks/useSyncQueryParamsWithSwapState' +import { isTransactionReceiptError } from '@/utils/isTransactionReceiptError' const StateManagedSwap = () => { const { address } = useAccount() @@ -237,6 +241,16 @@ const StateManagedSwap = () => { } } + const onSuccessSwap = () => { + dispatch( + fetchAndStoreSingleNetworkPortfolioBalances({ + address, + chainId: swapChainId, + }) + ) + dispatch(setSwapQuote(EMPTY_SWAP_QUOTE_ZERO)) + dispatch(updateSwapFromValue('')) + } const executeSwap = async () => { const currentChainName = CHAINS_BY_ID[swapChainId]?.name @@ -293,46 +307,51 @@ const StateManagedSwap = () => { { id: 'swap-in-progress-popup', duration: Infinity } ) - try { - const successTx = await tx + const transactionReceipt = await waitForTransaction({ + hash: tx as Address, + timeout: 60_000, + }) + console.log('Transaction Receipt: ', transactionReceipt) + + onSuccessSwap() - segmentAnalyticsEvent(`[Swap] swaps successfully`, { - address, - originChainId: swapChainId, - inputAmount: swapFromValue, - expectedReceivedAmount: swapQuote.outputAmountString, - exchangeRate: swapQuote.exchangeRate, - }) + segmentAnalyticsEvent(`[Swap] swaps successfully`, { + address, + originChainId: swapChainId, + inputAmount: swapFromValue, + expectedReceivedAmount: swapQuote.outputAmountString, + exchangeRate: swapQuote.exchangeRate, + }) - toast.dismiss(pendingPopup) + toast.dismiss(pendingPopup) - const successToastContent = ( + const successToastContent = ( +
-
- Successfully swapped from {swapFromToken.symbol} to{' '} - {swapToToken.symbol} on {currentChainName} -
- + Successfully swapped from {swapFromToken.symbol} to{' '} + {swapToToken.symbol} on {currentChainName}
- ) + +
+ ) - toast.success(successToastContent, { - id: 'swap-successful-popup', - duration: 10000, - }) + toast.success(successToastContent, { + id: 'swap-successful-popup', + duration: 10000, + }) - dispatch(setSwapQuote(EMPTY_SWAP_QUOTE_ZERO)) - dispatch(updateSwapFromValue()) - return tx - } catch (error) { - toast.dismiss(pendingPopup) - console.log(`Transaction failed with error: ${error}`) - } + return tx } catch (error) { console.log(`Swap Execution failed with error: ${error}`) + + /** Assume successful swap tx if await transaction receipt times out */ + if (isTransactionReceiptError(error)) { + onSuccessSwap() + } + toast.dismiss(pendingPopup) txErrorHandler(error) }