diff --git a/src/components/create-position/AddLiquidityButton/index.tsx b/src/components/create-position/AddLiquidityButton/index.tsx index 1ccfba5..c48f050 100644 --- a/src/components/create-position/AddLiquidityButton/index.tsx +++ b/src/components/create-position/AddLiquidityButton/index.tsx @@ -11,18 +11,19 @@ import { ApprovalState } from "@/types/approve-state"; import { Percent, Currency, NonfungiblePositionManager, Field } from "@cryptoalgebra/integral-sdk"; import { useWeb3Modal, useWeb3ModalState } from "@web3modal/wagmi/react"; import { useMemo } from "react"; -import { useAccount, useContractWrite } from "wagmi"; +import { Address, useAccount, useContractWrite } from "wagmi"; interface AddLiquidityButtonProps { baseCurrency: Currency | undefined | null; quoteCurrency: Currency | undefined | null; mintInfo: IDerivedMintInfo; + poolAddress: Address | undefined } const ZERO_PERCENT = new Percent('0'); const DEFAULT_ADD_IN_RANGE_SLIPPAGE_TOLERANCE = new Percent(50, 10_000); -export const AddLiquidityButton = ({ baseCurrency, quoteCurrency, mintInfo }: AddLiquidityButtonProps) => { +export const AddLiquidityButton = ({ baseCurrency, quoteCurrency, mintInfo, poolAddress }: AddLiquidityButtonProps) => { const { address: account } = useAccount(); @@ -74,7 +75,7 @@ export const AddLiquidityButton = ({ baseCurrency, quoteCurrency, mintInfo }: Ad const { data: addLiquidityData, write: addLiquidity } = useContractWrite(addLiquidityConfig) - const { isLoading: isAddingLiquidityLoading } = useTransitionAwait(addLiquidityData?.hash, 'Add liquidity') + const { isLoading: isAddingLiquidityLoading } = useTransitionAwait(addLiquidityData?.hash, 'Add liquidity', '', `/pool/${poolAddress}`) const isWrongChain = selectedNetworkId !== DEFAULT_CHAIN_ID diff --git a/src/components/modals/RemoveLiquidityModal/index.tsx b/src/components/modals/RemoveLiquidityModal/index.tsx index b585065..2588f88 100644 --- a/src/components/modals/RemoveLiquidityModal/index.tsx +++ b/src/components/modals/RemoveLiquidityModal/index.tsx @@ -30,10 +30,6 @@ const RemoveLiquidityModal = ({ positionId }: RemoveLiquidityModalProps) => { const derivedInfo = useDerivedBurnInfo(position, false); - useEffect(() => { - console.log('derivedInfo 113', derivedInfo) - }, [derivedInfo]) - const { position: positionSDK, liquidityPercentage, @@ -53,18 +49,6 @@ const RemoveLiquidityModal = ({ positionId }: RemoveLiquidityModalProps) => { ) return { calldata: undefined, value: undefined }; - console.log({ - tokenId: String(positionId), - liquidityPercentage, - slippageTolerance: new Percent(1, 100), - deadline: Date.now() + txDeadline * 1000, - collectOptions: { - expectedCurrencyOwed0: feeValue0, - expectedCurrencyOwed1: feeValue1, - recipient: account, - } - }) - return NonfungiblePositionManager.removeCallParameters(positionSDK, { tokenId: String(positionId), liquidityPercentage, diff --git a/src/components/position/PositionCard/index.tsx b/src/components/position/PositionCard/index.tsx index 34f7246..2762afb 100644 --- a/src/components/position/PositionCard/index.tsx +++ b/src/components/position/PositionCard/index.tsx @@ -69,8 +69,20 @@ const PositionCard = ({ selectedPosition }: PositionCardProps) => { - + + + { + positionEntity && +
+
+ {`${positionEntity.amount0.toFixed(2)} ${positionEntity.amount0.currency.symbol}`} +
+
+ {`${positionEntity.amount1.toFixed(2)} ${positionEntity.amount1.currency.symbol}`} +
+
+ } { pool && positionEntity && diff --git a/src/components/position/PositionNFT/index.tsx b/src/components/position/PositionNFT/index.tsx index c470608..c34f2ad 100644 --- a/src/components/position/PositionNFT/index.tsx +++ b/src/components/position/PositionNFT/index.tsx @@ -28,13 +28,16 @@ const PositionNFT = ({ positionId }: PositionNFTProps) => { }, [imgRef, json]) return
- - + {json ? :
} + { + json && + + }
} diff --git a/src/hooks/common/useTransactionAwait.tsx b/src/hooks/common/useTransactionAwait.tsx index 1e5b401..3fbd77c 100644 --- a/src/hooks/common/useTransactionAwait.tsx +++ b/src/hooks/common/useTransactionAwait.tsx @@ -2,7 +2,7 @@ import { ToastAction } from "@/components/ui/toast"; import { useToast } from "@/components/ui/use-toast"; import { ExternalLinkIcon } from "lucide-react"; import { useEffect } from "react"; -import { Link } from "react-router-dom"; +import { Link, useNavigate } from "react-router-dom"; import { Address, useWaitForTransaction } from "wagmi"; const ViewTxOnExplorer = ({hash}: { hash: Address | undefined }) => hash ? @@ -12,12 +12,12 @@ const ViewTxOnExplorer = ({hash}: { hash: Address | undefined }) => hash ? : null -export function useTransitionAwait(hash: Address | undefined, title: string, description?: string) { - - // const { pendingTransactions, actions: { updatePendingTransaction } } = useUserState() +export function useTransitionAwait(hash: Address | undefined, title: string, description?: string, redirectPath?: string) { const { toast } = useToast() + const navigate = useNavigate() + const { data, isError, isLoading, isSuccess } = useWaitForTransaction({ hash }) @@ -49,6 +49,9 @@ export function useTransitionAwait(hash: Address | undefined, title: string, des description: description || 'Transaction confirmed', action: , }) + if (redirectPath) { + navigate(redirectPath) + } } }, [isSuccess]) diff --git a/src/hooks/swap/useBestTrade.ts b/src/hooks/swap/useBestTrade.ts index bb7e228..7cff14d 100644 --- a/src/hooks/swap/useBestTrade.ts +++ b/src/hooks/swap/useBestTrade.ts @@ -157,14 +157,14 @@ export function useBestTradeExactOut( if (currentBest.amountIn === null) { return { bestRoute: routes[i], - amountIn: result[0], + amountIn: result[1], fee: result[5], priceAfterSwap: result[2] } } else if (currentBest.amountIn > result[0]) { return { bestRoute: routes[i], - amountIn: result[0], + amountIn: result[1], fee: result[5], priceAfterSwap: result[2] } diff --git a/src/hooks/swap/useSwapPools.ts b/src/hooks/swap/useSwapPools.ts index 95f3699..03fcd0c 100644 --- a/src/hooks/swap/useSwapPools.ts +++ b/src/hooks/swap/useSwapPools.ts @@ -2,7 +2,8 @@ import { Currency, Token, computePoolAddress } from "@cryptoalgebra/integral-sdk import { useEffect, useMemo, useState } from "react" import { useAllCurrencyCombinations } from "./useAllCurrencyCombinations" import { Address } from "wagmi" -import { useMultiplePoolsLazyQuery } from "@/graphql/generated/graphql" +import { TokenFieldsFragment, useMultiplePoolsLazyQuery } from "@/graphql/generated/graphql" +import { DEFAULT_CHAIN_ID } from "@/constants/default-chain-id" /** * Returns all the existing pools that should be considered for swapping between an input currency and an output currency @@ -13,7 +14,7 @@ export function useSwapPools( currencyIn?: Currency, currencyOut?: Currency ): { - pools: { tokens: [Token, Token], pool: { address: Address, liquidity: string, price: string, tick: string } }[] + pools: { tokens: [Token, Token], pool: { address: Address, liquidity: string, price: string, tick: string, token0: TokenFieldsFragment, token1: TokenFieldsFragment } }[] loading: boolean } { @@ -46,7 +47,7 @@ export function useSwapPools( // address // }).read.globalState())) - const pools = poolsData.data && poolsData.data.pools.map(pool => ({ address: pool.id, liquidity: pool.liquidity, price: pool.sqrtPrice, tick: pool.tick })) + const pools = poolsData.data && poolsData.data.pools.map(pool => ({ address: pool.id, liquidity: pool.liquidity, price: pool.sqrtPrice, tick: pool.tick, token0: pool.token0, token1: pool.token1 })) setExistingPools(pools) @@ -64,14 +65,17 @@ export function useSwapPools( } return { - pools: allCurrencyCombinations.map((tokens, idx) => ({ - tokens, - pool: existingPools[idx] + pools: existingPools.map((pool) => ({ + tokens: [ + new Token(DEFAULT_CHAIN_ID, pool.token0.id, Number(pool.token0.decimals), pool.token0.symbol, pool.token0.name), + new Token(DEFAULT_CHAIN_ID, pool.token1.id, Number(pool.token1.decimals), pool.token1.symbol, pool.token1.name) + ] as [Token, Token], + pool: pool })) .filter(({ pool }) => { return pool }), loading: false } - }, [allCurrencyCombinations, existingPools]) + }, [existingPools]) } diff --git a/src/pages/NewPosition/index.tsx b/src/pages/NewPosition/index.tsx index 394c9c3..eb4515c 100644 --- a/src/pages/NewPosition/index.tsx +++ b/src/pages/NewPosition/index.tsx @@ -191,7 +191,7 @@ const NewPositionPage = () => { - + diff --git a/src/state/burnStore.ts b/src/state/burnStore.ts index 8f9edf6..d1e40fe 100644 --- a/src/state/burnStore.ts +++ b/src/state/burnStore.ts @@ -4,7 +4,7 @@ import { usePool } from "@/hooks/pools/usePool"; import { usePositionFees } from "@/hooks/positions/usePositionFees"; import { PositionFromTokenId } from "@/hooks/positions/usePositions"; import { Currency, CurrencyAmount, Percent, Position, computePoolAddress, unwrappedToken } from "@cryptoalgebra/integral-sdk"; -import { useCallback, useEffect, useMemo } from "react"; +import { useCallback, useMemo } from "react"; import { Address, useAccount } from "wagmi"; import { create } from "zustand"; @@ -110,10 +110,6 @@ export function useDerivedBurnInfo( asWETH, ); - useEffect(() => { - console.log('feeValue0, feeValue1', liquidityValue0) - }, [liquidityValue0]) - const outOfRange = pool && position ? pool.tickCurrent < position.tickLower ||