From 98fd3bd28dc19abb65ddbd038dd7b603531bb28f Mon Sep 17 00:00:00 2001 From: ChefEric <173023571+chef-eric@users.noreply.github.com> Date: Fri, 28 Feb 2025 17:24:16 +0800 Subject: [PATCH] fix: update pTON to TON (#11276) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## PR-Codex overview This PR primarily focuses on enhancing the handling of tokens and liquidity in the application. It introduces functions for unwrapping tokens and generating liquidity links, while also refining the logic for displaying token balances and managing native tokens. ### Detailed summary - Added `unwrappedToken` function to handle token unwrapping. - Modified balance calculation to use `useMemo` for performance. - Implemented `getAddLiquidityLink` and `getRemoveLiquidityLink` functions. - Updated token order logic to use wrapped token addresses. - Adjusted liquidity removal logic to consistently use wrapped token addresses. - Enhanced `currencyKey` function to utilize unwrapped tokens. - Refined SwapRoute component to display unwrapped token symbols. - Improved LiquidityRow component to use unwrapped token symbols and updated liquidity link generation. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` --- .../TonSwap/SearchModal/CurrencyList.tsx | 5 ++++- .../TonSwap/SwapDetails/SwapRoute.tsx | 11 +++++++---- .../ton/logic/liquidity/useRemoveLiquidity.ts | 18 ++++++++++++++---- apps/ton/src/ton/utils/tokenOrder.ts | 5 +---- apps/ton/src/utils/getLink.ts | 14 ++++++++++++++ apps/ton/src/utils/tokens/currency.ts | 9 +++++---- apps/ton/src/utils/tokens/unwrappedToken.ts | 6 ++++++ .../LiquidityCard/LiquidityRow.tsx | 19 +++++++++++++------ .../RemoveLiquidityCard/CardContent.tsx | 12 +++--------- 9 files changed, 67 insertions(+), 32 deletions(-) create mode 100644 apps/ton/src/utils/getLink.ts create mode 100644 apps/ton/src/utils/tokens/unwrappedToken.ts diff --git a/apps/ton/src/components/TonSwap/SearchModal/CurrencyList.tsx b/apps/ton/src/components/TonSwap/SearchModal/CurrencyList.tsx index 435dd533656fe..f666a6e0ab38d 100644 --- a/apps/ton/src/components/TonSwap/SearchModal/CurrencyList.tsx +++ b/apps/ton/src/components/TonSwap/SearchModal/CurrencyList.tsx @@ -68,7 +68,10 @@ function CurrencyRow({ const { data: balanceRaw, isLoading: isBalanceLoading } = useAtomValue(balanceAtom(currency)) - const balance = formatBigInt(balanceRaw, currency.decimals, currency.decimals) + const balance = useMemo( + () => formatBigInt(balanceRaw, currency.decimals, currency.decimals), + [balanceRaw, currency.decimals], + ) // only show add or remove buttons if not on selected list return ( diff --git a/apps/ton/src/components/TonSwap/SwapDetails/SwapRoute.tsx b/apps/ton/src/components/TonSwap/SwapDetails/SwapRoute.tsx index 622aba6804421..a823a9c80b437 100644 --- a/apps/ton/src/components/TonSwap/SwapDetails/SwapRoute.tsx +++ b/apps/ton/src/components/TonSwap/SwapDetails/SwapRoute.tsx @@ -2,6 +2,7 @@ import { TradeType } from '@pancakeswap/swap-sdk-core' import { Currency, Trade } from '@pancakeswap/ton-v2-sdk' import { ChevronRightIcon, Flex, Text } from '@pancakeswap/uikit' import { Fragment } from 'react' +import { unwrappedToken } from 'utils/tokens/unwrappedToken' export interface AdvancedSwapDetailsProps { trade?: Trade | null @@ -13,12 +14,12 @@ export const SwapRoute = ({ trade }: AdvancedSwapDetailsProps) => { {trade.route.path.map((token, i, path) => { const isLastItem: boolean = i === path.length - 1 + const symbol = unwrappedToken(token)?.symbol ?? token.symbol return ( - // eslint-disable-next-line react/no-array-index-key - + - {token.symbol} + {symbol} {!isLastItem && } @@ -26,5 +27,7 @@ export const SwapRoute = ({ trade }: AdvancedSwapDetailsProps) => { ) })} - ) : null + ) : ( + '-' + ) } diff --git a/apps/ton/src/ton/logic/liquidity/useRemoveLiquidity.ts b/apps/ton/src/ton/logic/liquidity/useRemoveLiquidity.ts index f39ea71d1ace8..e648d7154384e 100644 --- a/apps/ton/src/ton/logic/liquidity/useRemoveLiquidity.ts +++ b/apps/ton/src/ton/logic/liquidity/useRemoveLiquidity.ts @@ -32,11 +32,10 @@ export const useRemoveLiquidity = ({ currency0, currency1, amount0ToBurn, amount const [slippage] = useUserSlippage() - // TODO: Check Native handling const poolAddress = useAtomValue( poolAddressAtom({ - token0Address: currency0?.isNative ? userAddress.toString() : currency0?.address.toString(), - token1Address: currency1?.isNative ? userAddress.toString() : currency1?.address.toString(), + token0Address: currency0?.wrapped.address.toString(), + token1Address: currency1?.wrapped.address.toString(), }), ) @@ -118,7 +117,18 @@ export const useRemoveLiquidity = ({ currency0, currency1, amount0ToBurn, amount resetAppModal() } }, - [tonUI, userAddress, poolContract, setTxnModal, currency0, currency1, amount0ToBurn, amount1ToBurn, resetAppModal], + [ + slippage, + tonUI, + userAddress, + poolContract, + setTxnModal, + currency0, + currency1, + amount0ToBurn, + amount1ToBurn, + resetAppModal, + ], ) return { removeLiquidity } diff --git a/apps/ton/src/ton/utils/tokenOrder.ts b/apps/ton/src/ton/utils/tokenOrder.ts index c9f9d03088ea4..88647c72f9109 100644 --- a/apps/ton/src/ton/utils/tokenOrder.ts +++ b/apps/ton/src/ton/utils/tokenOrder.ts @@ -20,10 +20,7 @@ export async function getTokenOrder(chainId: TonChainId, token0Address: string, export async function getCurrencyOrder(currency0: Currency, currency1: Currency) { if (!currency0 || !currency1) return { currency0, currency1, isFlipped: false } - if (currency0.isNative) return { currency0, currency1, isFlipped: false } - if (currency1.isNative) return { currency0: currency1, currency1: currency0, isFlipped: true } - - const result = await getTokenOrder(currency0.chainId, currency0.address, currency1.address) + const result = await getTokenOrder(currency0.chainId, currency0.wrapped.address, currency1.wrapped.address) return result.isFlipped ? { currency0: currency1, currency1: currency0, isFlipped: true } diff --git a/apps/ton/src/utils/getLink.ts b/apps/ton/src/utils/getLink.ts new file mode 100644 index 0000000000000..33202b116b4aa --- /dev/null +++ b/apps/ton/src/utils/getLink.ts @@ -0,0 +1,14 @@ +import { Currency } from '@pancakeswap/ton-v2-sdk' +import { currencyKey } from './tokens/currency' + +export const getAddLiquidityLink = (currency0?: Currency, currency1?: Currency) => { + const key0 = currencyKey(currency0) + const key1 = currencyKey(currency1) + return `/liquidity/add/${key0}/${key1}` +} + +export const getRemoveLiquidityLink = (currency0?: Currency, currency1?: Currency) => { + const key0 = currencyKey(currency0) + const key1 = currencyKey(currency1) + return `/liquidity/remove/${key0}/${key1}` +} diff --git a/apps/ton/src/utils/tokens/currency.ts b/apps/ton/src/utils/tokens/currency.ts index 175c770128c4a..44d7c8a2fd957 100644 --- a/apps/ton/src/utils/tokens/currency.ts +++ b/apps/ton/src/utils/tokens/currency.ts @@ -3,16 +3,17 @@ import { API_BASE_URL } from 'config/constants/endpoints' import mainnetList from 'public/lists/main.json' import testnetList from 'public/lists/testnet.json' import { ResultJettonData } from 'types/tonapi' +import { unwrappedToken } from './unwrappedToken' export function currencyKey(currency?: Currency): string { - if (!currency) return 'UNKNOWN' - return currency.isNative ? currency.symbol : currency.address + const unwrapped = unwrappedToken(currency) + if (!unwrapped) return 'UNKNOWN' + return unwrapped.isNative ? unwrapped.symbol : unwrapped.address } const tokenCache = new Map() export async function fetchTokenByAddress(address: string, chainId: TonChainId): Promise { - if (address === Native.onChain(TonChainId.Mainnet).symbol) return Native.onChain(TonChainId.Mainnet) - if (address === Native.onChain(TonChainId.Testnet).symbol) return Native.onChain(TonChainId.Testnet) + if (address === Native.onChain(chainId).symbol) return Native.onChain(chainId) if (tokenCache.has(address)) return tokenCache.get(address) diff --git a/apps/ton/src/utils/tokens/unwrappedToken.ts b/apps/ton/src/utils/tokens/unwrappedToken.ts new file mode 100644 index 0000000000000..d7a3f3438c33a --- /dev/null +++ b/apps/ton/src/utils/tokens/unwrappedToken.ts @@ -0,0 +1,6 @@ +import { Currency, Native, WNATIVE } from '@pancakeswap/ton-v2-sdk' + +export function unwrappedToken(token?: Currency): Currency | undefined { + if (token && token.equals(WNATIVE[token.chainId as keyof typeof WNATIVE])) return Native.onChain(token.chainId) + return token +} diff --git a/apps/ton/src/views/TONLiquidity/LiquidityCard/LiquidityRow.tsx b/apps/ton/src/views/TONLiquidity/LiquidityCard/LiquidityRow.tsx index 66134b5713333..b7e2ecabd2293 100644 --- a/apps/ton/src/views/TONLiquidity/LiquidityCard/LiquidityRow.tsx +++ b/apps/ton/src/views/TONLiquidity/LiquidityCard/LiquidityRow.tsx @@ -9,10 +9,12 @@ import { Collapse } from 'components/widgets/swap-v2/Collapse' import { ADDRESS_CONCAT_LENGTH, LP_TOKEN_DECIMALS } from 'config/constants/formatting' import { useAtomValue } from 'jotai' import Link from 'next/link' -import { useCallback, useState } from 'react' +import { useCallback, useMemo, useState } from 'react' import styled from 'styled-components' import { formatBigNumber } from 'ton/utils/formatting' import { truncateHash } from 'utils' +import { getAddLiquidityLink, getRemoveLiquidityLink } from 'utils/getLink' +import { unwrappedToken } from 'utils/tokens/unwrappedToken' const StyledButton = styled(Button).attrs({ variant: 'tertiary', scale: 'sm' })` width: 100%; @@ -48,13 +50,18 @@ export const LiquidityRow = ({ setIsOpen(!isOpen) }, [isOpen, setIsOpen]) + const [symbol0, symbol1] = useMemo( + () => [ + unwrappedToken(currency0)?.symbol ?? currency0?.symbol ?? truncateHash(token0, ADDRESS_CONCAT_LENGTH), + unwrappedToken(currency1)?.symbol ?? currency1?.symbol ?? truncateHash(token1, ADDRESS_CONCAT_LENGTH), + ], + [currency0, currency1, token0, token1], + ) + if (!token0 || !token1) { return null } - const symbol0 = currency0?.symbol ?? truncateHash(token0, ADDRESS_CONCAT_LENGTH) - const symbol1 = currency1?.symbol ?? truncateHash(token1, ADDRESS_CONCAT_LENGTH) - return ( <> @@ -113,10 +120,10 @@ export const LiquidityRow = ({ )} - + }>{t('Add')} - + }>{t('Remove')} diff --git a/apps/ton/src/views/TONRemoveLiquidity/RemoveLiquidityCard/CardContent.tsx b/apps/ton/src/views/TONRemoveLiquidity/RemoveLiquidityCard/CardContent.tsx index 1a1c16466a7bb..0cfee91f8833c 100644 --- a/apps/ton/src/views/TONRemoveLiquidity/RemoveLiquidityCard/CardContent.tsx +++ b/apps/ton/src/views/TONRemoveLiquidity/RemoveLiquidityCard/CardContent.tsx @@ -74,7 +74,7 @@ export const CardContent = (props: CardContentProps) => { const { data: currency1_ } = useAtomValue(tokenByAddressQueryAtom(address1)) const { - data: { currency0, currency1, isFlipped }, + data: { currency0, currency1 }, } = useQuery({ queryKey: ['removeLiquidity_currencyOrder', currency0_, currency1_], queryFn: async () => { @@ -93,12 +93,6 @@ export const CardContent = (props: CardContentProps) => { }, }) - console.log('RemoveLiquidity', { - currency0: currency0?.symbol, - currency1: currency1?.symbol, - isFlipped, - }) - const { data: lpBalance, isLoading: isLpBalanceLoading } = useAtomValue( lpBalanceQueryAtom({ token0Address: currency0?.wrapped.address, @@ -107,8 +101,8 @@ export const CardContent = (props: CardContentProps) => { ) const { data: poolData, isLoading: isPoolDataLoading } = useAtomValue( poolDataQueryAtom({ - token0Address: currency0?.isNative ? userAddress : currency0?.address, - token1Address: currency1?.isNative ? userAddress : currency1?.address, + token0Address: currency0?.wrapped.address, + token1Address: currency1?.wrapped.address, }), )