From cb8af70f7207983a9bc66185d205092d25a6f7a7 Mon Sep 17 00:00:00 2001 From: Skylar Barrera Date: Fri, 26 Jan 2024 14:08:18 -0500 Subject: [PATCH] @skylar/price impact followup (#5351) * is wrap and unwrap helpers * handle cross chain + wraps * Update src/handlers/swap.ts Co-authored-by: Matthew Wall * Update src/handlers/swap.ts Co-authored-by: Matthew Wall --------- Co-authored-by: Matthew Wall --- src/handlers/swap.ts | 36 +++++++++-- src/hooks/usePriceImpactDetails.ts | 95 +++++++++++++++++++----------- 2 files changed, 90 insertions(+), 41 deletions(-) diff --git a/src/handlers/swap.ts b/src/handlers/swap.ts index 241c53de035..2d750a2704c 100644 --- a/src/handlers/swap.ts +++ b/src/handlers/swap.ts @@ -240,6 +240,26 @@ export const getSwapGasLimitWithFakeApproval = async ( return getDefaultGasLimitForTrade(tradeDetails, chainId); }; +export const isUnwrapNative = ({ + buyTokenAddress, + chainId, + sellTokenAddress, +}: { + chainId: ChainId; + sellTokenAddress: string; + buyTokenAddress: string; +}) => { + +export const isWrapNative = ({ + buyTokenAddress, + chainId, + sellTokenAddress, +}: { + chainId: ChainId; + sellTokenAddress: string; + buyTokenAddress: string; +}) => { + export const estimateSwapGasLimit = async ({ chainId, requiresApprove, @@ -255,12 +275,16 @@ export const estimateSwapGasLimit = async ({ return ethereumUtils.getBasicSwapGasLimit(Number(chainId)); } const { sellTokenAddress, buyTokenAddress } = tradeDetails; - const isWrapNativeAsset = - sellTokenAddress === ETH_ADDRESS_AGGREGATORS && - buyTokenAddress === WRAPPED_ASSET[chainId]; - const isUnwrapNativeAsset = - sellTokenAddress === WRAPPED_ASSET[chainId] && - buyTokenAddress === ETH_ADDRESS_AGGREGATORS; + const isWrapNativeAsset = isWrapNative({ + buyTokenAddress, + sellTokenAddress, + chainId, + }); + const isUnwrapNativeAsset = isUnwrapNative({ + buyTokenAddress, + sellTokenAddress, + chainId, + }); // Wrap / Unwrap Eth if (isWrapNativeAsset || isUnwrapNativeAsset) { diff --git a/src/hooks/usePriceImpactDetails.ts b/src/hooks/usePriceImpactDetails.ts index 44712aaf9be..1bd4f947fe0 100644 --- a/src/hooks/usePriceImpactDetails.ts +++ b/src/hooks/usePriceImpactDetails.ts @@ -1,6 +1,6 @@ import { useMemo } from 'react'; import useAccountSettings from './useAccountSettings'; -import { SwappableAsset } from '@/entities'; +import { AssetType, SwappableAsset } from '@/entities'; import { Network } from '@/helpers'; import { useTheme } from '@/theme'; @@ -13,8 +13,9 @@ import { subtract, } from '@/helpers/utilities'; -import { CrosschainQuote, Quote, SwapType } from '@rainbow-me/swaps'; -import { useNativeAssetForNetwork } from '@/utils/ethereumUtils'; +import { CrosschainQuote, Quote } from '@rainbow-me/swaps'; +import ethereumUtils, { useNativeAssetForNetwork } from '@/utils/ethereumUtils'; +import { isUnwrapNative, isWrapNative } from '@/handlers/swap'; export enum SwapPriceImpactType { none = 'none', @@ -33,67 +34,91 @@ export default function usePriceImpactDetails( ) { const { nativeCurrency } = useAccountSettings(); const { colors } = useTheme(); - const nativeAsset = useNativeAssetForNetwork(currentNetwork); - useMemo; - - const isNormalQuote = useMemo( - () => tradeDetails?.swapType === SwapType.normal, - [tradeDetails?.swapType] + const sellNetwork = (tradeDetails as CrosschainQuote)?.fromChainId + ? ethereumUtils.getNetworkFromChainId( + (tradeDetails as CrosschainQuote)?.fromChainId + ) + : currentNetwork; + const buyNetwork = ethereumUtils.getNetworkFromType( + outputCurrency?.type || AssetType.token ); + const sellNativeAsset = useNativeAssetForNetwork(sellNetwork); + const buyNativeAsset = useNativeAssetForNetwork(buyNetwork); + + const isWrapOrUnwrap = useMemo(() => { + if (!tradeDetails) return false; + const chainId = ethereumUtils.getChainIdFromNetwork(buyNetwork); + return ( + isWrapNative({ + buyTokenAddress: tradeDetails?.buyTokenAddress, + sellTokenAddress: tradeDetails?.sellTokenAddress, + chainId, + }) || + isUnwrapNative({ + buyTokenAddress: tradeDetails?.buyTokenAddress, + sellTokenAddress: tradeDetails?.sellTokenAddress, + chainId, + }) + ); + }, [buyNetwork, tradeDetails]); const inputNativeAmount = useMemo(() => { - if (isNormalQuote) { + if (isWrapOrUnwrap) { + if (!tradeDetails?.sellAmount || !inputCurrency?.price?.value) + return null; + return convertRawAmountToNativeDisplay( - tradeDetails?.sellAmountInEth?.toString() || '', - nativeAsset?.decimals || 18, - nativeAsset?.price?.value || '0', + tradeDetails?.sellAmount?.toString(), + inputCurrency?.decimals || 18, + inputCurrency?.price?.value, nativeCurrency ).amount; } else { return convertRawAmountToNativeDisplay( - tradeDetails?.sellAmount?.toString() || '', - inputCurrency?.decimals || 18, - inputCurrency?.price?.value || '0', + tradeDetails?.sellAmountInEth?.toString() || '', + sellNativeAsset?.decimals || 18, + sellNativeAsset?.price?.value || '0', nativeCurrency ).amount; } }, [ - isNormalQuote, - tradeDetails?.sellAmountInEth, + isWrapOrUnwrap, tradeDetails?.sellAmount, - nativeAsset?.decimals, - nativeAsset?.price?.value, - nativeCurrency, - inputCurrency?.decimals, + tradeDetails?.sellAmountInEth, inputCurrency?.price?.value, + inputCurrency?.decimals, + nativeCurrency, + sellNativeAsset?.decimals, + sellNativeAsset?.price?.value, ]); const outputNativeAmount = useMemo(() => { - if (isNormalQuote) { + if (isWrapOrUnwrap) { + if (!tradeDetails?.buyAmount || !inputCurrency?.price?.value) return null; return convertRawAmountToNativeDisplay( - tradeDetails?.buyAmountInEth?.toString() || '', - nativeAsset?.decimals || 18, - nativeAsset?.price?.value || '0', + tradeDetails?.buyAmount?.toString(), + inputCurrency?.decimals || 18, + inputCurrency?.price?.value, nativeCurrency ).amount; } else { return convertRawAmountToNativeDisplay( - tradeDetails?.buyAmount?.toString() || '', - outputCurrency?.decimals || 18, - outputCurrency?.price?.value || '0', + tradeDetails?.buyAmountInEth?.toString() || '', + buyNativeAsset?.decimals || 18, + buyNativeAsset?.price?.value || '0', nativeCurrency ).amount; } }, [ - outputCurrency?.decimals, - outputCurrency?.price?.value, - nativeCurrency, - isNormalQuote, - nativeAsset?.decimals, - nativeAsset?.price?.value, + isWrapOrUnwrap, tradeDetails?.buyAmount, tradeDetails?.buyAmountInEth, + inputCurrency?.price?.value, + inputCurrency?.decimals, + nativeCurrency, + buyNativeAsset?.decimals, + buyNativeAsset?.price?.value, ]); const { impactDisplay, priceImpact, percentDisplay } = useMemo(() => {