diff --git a/package-lock.json b/package-lock.json index d492faf6e..4d61b4518 100644 --- a/package-lock.json +++ b/package-lock.json @@ -22,7 +22,7 @@ "@material-ui/icons": "^4.11.2", "@material-ui/lab": "^4.0.0-alpha.60", "@material-ui/styles": "^4.11.5", - "@orbs-network/liquidity-hub-sdk": "^1.0.45", + "@orbs-network/liquidity-hub-sdk": "^1.0.47", "@orbs-network/swap-ui": "^0.0.14", "@orbs-network/twap-sdk": "^2.0.33", "@orderly.network/hooks": "^1.4.3", @@ -10760,9 +10760,9 @@ } }, "node_modules/@orbs-network/liquidity-hub-sdk": { - "version": "1.0.45", - "resolved": "https://registry.npmjs.org/@orbs-network/liquidity-hub-sdk/-/liquidity-hub-sdk-1.0.45.tgz", - "integrity": "sha512-xgb0xmiY04Iv4YcEuW14Bxi7bRaCGYQkjRIAKNUS079CL0hkG5jJUmf8Ekwqn7OrDqpkX64S2bj8HBR0PH+ZTw==" + "version": "1.0.47", + "resolved": "https://registry.npmjs.org/@orbs-network/liquidity-hub-sdk/-/liquidity-hub-sdk-1.0.47.tgz", + "integrity": "sha512-EPdH2O9KpJA/ZwSL9W/0b90nFr8xg184PllIkXtVcHZ6E0F85cLDCkrkBeoyEzEKsWNVBzCK2PLBWZ3ZWa3e+g==" }, "node_modules/@orbs-network/swap-ui": { "version": "0.0.14", diff --git a/package.json b/package.json index 2aff7af84..783308544 100755 --- a/package.json +++ b/package.json @@ -98,7 +98,7 @@ "@material-ui/icons": "^4.11.2", "@material-ui/lab": "^4.0.0-alpha.60", "@material-ui/styles": "^4.11.5", - "@orbs-network/liquidity-hub-sdk": "^1.0.45", + "@orbs-network/liquidity-hub-sdk": "^1.0.47", "@orbs-network/swap-ui": "^0.0.14", "@orbs-network/twap-sdk": "^2.0.33", "@orderly.network/hooks": "^1.4.3", diff --git a/public/locales/en.json b/public/locales/en.json index 00287917e..ec4ccb4c8 100755 --- a/public/locales/en.json +++ b/public/locales/en.json @@ -1038,5 +1038,7 @@ "networkFeeHelper": "Network fees are paid for transaction", "dragonEggAlert": "Screenshot this and DM @QuickswapDEX on X (Twitter) for a chance to win prizes! First come, first serve.", "cancelOrder": "Cancel Order", - "seekingBetterPrice": "Seeking better price" + "seekingBetterPrice": "Seeking better price", + "wrapError": "Your {{ native }} has been wrapped to {{ wrapped }}", + "txFailed": "Transaction failed" } diff --git a/src/components/Swap/orbs/ConfirmationModal.tsx b/src/components/Swap/orbs/ConfirmationModal.tsx index b727047da..8e146fc95 100644 --- a/src/components/Swap/orbs/ConfirmationModal.tsx +++ b/src/components/Swap/orbs/ConfirmationModal.tsx @@ -51,7 +51,6 @@ export type ConfirmationState = { txHash?: string; steps?: Steps[]; error?: string; - stapStatus?: SwapStatus; }; interface ConfirmationModalProps extends SharedProps { @@ -117,14 +116,14 @@ const ConfirmationProvider = (props: ContextProps) => { ); const onDismiss = useCallback(() => { + if (store.swapStatus) { + dispatch(updateUserBalance()); + } setTimeout(() => { resetStore(); }, 5_00); props.onDismiss(); - if (store.stapStatus === SwapStatus.SUCCESS) { - dispatch(updateUserBalance()); - } - }, [props, resetStore, store.stapStatus, dispatch]); + }, [props, resetStore, store.swapStatus, dispatch]); return ( { const { onDismiss, inAmount, - state: { shouldUnwrap, error }, + state: { shouldUnwrap }, } = useConfirmationContext(); const { t } = useTranslation(); const { chainId } = useActiveWeb3React(); const nativeSymbol = ETHER[chainId].symbol; + const wSymbol = WETH[chainId].symbol; const { execute, wrapType } = useWrapCallback( WETH[chainId], @@ -300,9 +300,19 @@ export const Error = () => { return ( - + Transaction Failed - {error &&

Transaction Failed

} + {shouldUnwrap && ( +

+ {t('wrapError', { native: nativeSymbol, wrapped: wSymbol })} +

+ )}
{shouldUnwrap ? ( diff --git a/src/components/Swap/orbs/LiquidityHub/LiquidityHubSwapConfirmation.tsx b/src/components/Swap/orbs/LiquidityHub/LiquidityHubSwapConfirmation.tsx index 12bc0b69a..312edab79 100644 --- a/src/components/Swap/orbs/LiquidityHub/LiquidityHubSwapConfirmation.tsx +++ b/src/components/Swap/orbs/LiquidityHub/LiquidityHubSwapConfirmation.tsx @@ -9,13 +9,7 @@ import { useMutation } from '@tanstack/react-query'; import { useCallback } from 'react'; import { Currency, WETH } from '@uniswap/sdk'; import { useActiveWeb3React } from 'hooks'; -import { - fromRawAmount, - subtractSlippage, - isRejectedError, - isTimeoutError, - promiseWithTimeout, -} from '../utils'; +import { fromRawAmount, isRejectedError, isTimeoutError } from '../utils'; import { OptimalRate } from '@paraswap/sdk'; import { useParaswap } from 'hooks/useParaswap'; import { wrappedCurrency } from 'utils/wrappedCurrency'; @@ -156,6 +150,7 @@ const useAmounts = () => { const useParseSteps = () => { const { inCurrency, signature } = useLiquidityHubConfirmationContext(); + const { chainId } = useActiveWeb3React(); const getLogo = useGetLogoCallback(); return useCallback( @@ -171,7 +166,9 @@ const useParseSteps = () => { } if (step === Steps.APPROVE) { return { - title: `Approve ${inCurrency?.symbol} spending`, + title: `Approve ${ + wrappedCurrency(inCurrency, chainId)?.symbol + } spending`, icon: , id: Steps.APPROVE, }; @@ -185,7 +182,7 @@ const useParseSteps = () => { }; }); }, - [inCurrency, signature, getLogo], + [inCurrency, signature, getLogo, chainId], ); }; @@ -403,7 +400,7 @@ const useLiquidityHubSwapCallback = () => { const { mutateAsync: approvalCallback } = useApproveCallback(); const onTradeSuccess = useOnTradeSuccessCallback(); const { onUserInput } = useSwapActionHandlers(); - const dispatch = useAppDispatch(); + const liquidityHubSdk = useLiquidityHubSDK(); return useMutation({ mutationFn: async ( @@ -452,13 +449,15 @@ const useLiquidityHubSwapCallback = () => { signature, }); - const transaction = await library.getTransaction(txHash); - const receipt = await transaction.wait(); + const details = await liquidityHubSdk.getTransactionDetails( + txHash, + acceptedQuote, + ); + console.log('lh swap success', details); + onUserInput(Field.INPUT, ''); - dispatch(updateUserBalance()); updateStore({ swapStatus: SwapStatus.SUCCESS }); onTradeSuccess(acceptedQuote); - return receipt; } catch (error) { const isRejectedOrTimeout = isRejectedError(error) || isTimeoutError(error); @@ -502,29 +501,24 @@ const useOnTradeSuccessCallback = () => { ); } catch (error) {} }, - [liquidityHubSDK, outTokenUsdPrice, outToken, outCurrency], + [liquidityHubSDK, outTokenUsdPrice, outCurrency], ); }; const useParaswapTxParamsCallback = () => { const paraswap = useParaswap(); - const { account, chainId } = useActiveWeb3React(); - const { - allowedSlippage, - optimalRate, - inCurrency, - } = useLiquidityHubConfirmationContext(); + const { account } = useActiveWeb3React(); + const { allowedSlippage, optimalRate } = useLiquidityHubConfirmationContext(); return useMutation({ mutationFn: async () => { - const inToken = wrappedCurrency(inCurrency, chainId); - if (!optimalRate || !allowedSlippage || !inToken || !account) { + if (!optimalRate || !allowedSlippage || !account) { throw new Error('useParaswapTxParamsCallback missing args'); } try { const result = await paraswap.buildTx( { - srcToken: inToken.address, + srcToken: optimalRate.srcToken, destToken: optimalRate.destToken, srcAmount: optimalRate.srcAmount, destAmount: optimalRate.destAmount, diff --git a/src/components/Swap/orbs/LiquidityHub/hooks.ts b/src/components/Swap/orbs/LiquidityHub/hooks.ts index 45c3099f6..ad93d23a2 100644 --- a/src/components/Swap/orbs/LiquidityHub/hooks.ts +++ b/src/components/Swap/orbs/LiquidityHub/hooks.ts @@ -147,7 +147,7 @@ export const useGetBetterPrice = ( try { if (skip) return false; setSeekingBestPrice(true); - const quote = await promiseWithTimeout(fetchLiquidityHubQuote(), 5_000); + const quote = await promiseWithTimeout(fetchLiquidityHubQuote(), 8_000); const dexMinAmountOut = subtractSlippage(allowedSlippage, dexOutAmount) || 0; return BN(quote?.userMinOutAmountWithGas || 0).gt(dexMinAmountOut); diff --git a/src/components/Swap/orbs/utils.ts b/src/components/Swap/orbs/utils.ts index b6804525e..da66649cb 100644 --- a/src/components/Swap/orbs/utils.ts +++ b/src/components/Swap/orbs/utils.ts @@ -52,7 +52,7 @@ export const isRejectedError = (error: any) => { export const isTimeoutError = (error: any) => { const message = error.message?.toLowerCase(); - return message?.includes('timeout'); + return message === 'timeout'; }; export const makeElipsisAddress = (address?: string, padding = 6): string => {