Merge pull request #17 from uniswapfoundation/feat/collecting-fees

Update collect fees example to match new sdk versions

v3-sdk/collecting-fees/package.json

@@ -6,8 +6,8 @@
     "@types/node": "^16.7.13",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
-    "@uniswap/sdk-core": "^3.1.0",
-    "@uniswap/v3-sdk": "^3.9.0",
+    "@uniswap/sdk-core": "npm:@koraykoska/uniswap-sdk-core@^6.0.9",
+    "@uniswap/v3-sdk": "npm:@florian-s-a-w/[email protected]",
     "ethers": "^5.7.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

v3-sdk/collecting-fees/src/config.ts

@@ -1,4 +1,4 @@
-import { Token } from '@uniswap/sdk-core'
+import { Fraction, Token } from '@uniswap/sdk-core'
 import { FeeAmount } from '@uniswap/v3-sdk'
 import { DAI_TOKEN, USDC_TOKEN } from './libs/constants'
 
@@ -26,8 +26,7 @@ export interface ExampleConfig {
     token1: Token
     token1Amount: number
     poolFee: FeeAmount
-    token0AmountToCollect: number
-    token1AmountToCollect: number
+    feePercentage: Fraction
   }
 }
 
@@ -50,7 +49,6 @@ export const CurrentConfig: ExampleConfig = {
     token1: DAI_TOKEN,
     token1Amount: 1000,
     poolFee: FeeAmount.LOW,
-    token0AmountToCollect: 10,
-    token1AmountToCollect: 10,
+    feePercentage: new Fraction(1),
   },
 }

v3-sdk/collecting-fees/src/example/Example.tsx

@@ -8,13 +8,9 @@ import {
   TransactionState,
   getWalletAddress,
 } from '../libs/providers'
-import {
-  collectFees,
-  getPositionIds,
-  getPositionInfo,
-  mintPosition,
-  PositionInfo,
-} from '../libs/liquidity'
+import { collectFees, getPositions, mintPosition } from '../libs/liquidity'
+import { Position } from '@uniswap/v3-sdk'
+import { BigintIsh } from '@uniswap/sdk-core'
 
 const useOnBlockUpdated = (callback: (blockNumber: number) => void) => {
   useEffect(() => {
@@ -28,8 +24,7 @@ const useOnBlockUpdated = (callback: (blockNumber: number) => void) => {
 const Example = () => {
   const [token0Balance, setToken0Balance] = useState<string>()
   const [token1Balance, setToken1Balance] = useState<string>()
-  const [positionIds, setPositionIds] = useState<number[]>([])
-  const [positionsInfo, setPositionsInfo] = useState<PositionInfo[]>([])
+  const [positions, setPositions] = useState<Position[]>([])
   const [txState, setTxState] = useState<TransactionState>(TransactionState.New)
   const [blockNumber, setBlockNumber] = useState<number>(0)
 
@@ -56,9 +51,7 @@ const Example = () => {
     )
 
     // Set Position Info
-    const ids = await getPositionIds()
-    setPositionIds(ids)
-    setPositionsInfo(await Promise.all(ids.map(getPositionInfo)))
+    setPositions(await getPositions())
   }, [])
 
   // Event Handlers
@@ -74,26 +67,28 @@ const Example = () => {
     setTxState(await mintPosition())
   }, [])
 
-  const onCollectFees = useCallback(async (position: number) => {
-    setTxState(TransactionState.Sending)
-    setTxState(await collectFees(position))
-  }, [])
+  const onCollectFees = useCallback(
+    async (positionId: BigintIsh | undefined) => {
+      if (positionId === undefined) {
+        throw new Error('Position not fetched correctly')
+      }
+      setTxState(TransactionState.Sending)
+      setTxState(await collectFees(positionId))
+    },
+    []
+  )
 
   // Formatted Data
 
-  const positionInfoStrings: string[] = useMemo(() => {
-    if (positionIds.length !== positionsInfo.length) {
-      return []
-    }
-
-    return positionIds
-      .map((id, index) => [id, positionsInfo[index]])
-      .map((info) => {
-        const id = info[0]
-        const posInfo = info[1] as PositionInfo
-        return `${id}: ${posInfo.liquidity.toString()} liquidity, owed ${posInfo.tokensOwed0.toString()} and ${posInfo.tokensOwed1.toString()}`
-      })
-  }, [positionIds, positionsInfo])
+  const positionStrings: string[] = useMemo(() => {
+    return positions.map((pos) => {
+      return `${
+        pos.positionId ? pos.positionId : 'No id'
+      }: ${pos.liquidity.toString()} liquidity, owed ${
+        pos.tokensOwed0 ? pos.tokensOwed0.toString() : '0'
+      } and ${pos.tokensOwed1 ? pos.tokensOwed1.toString() : '0'}`
+    })
+  }, [positions])
 
   return (
     <div className="App">
@@ -117,7 +112,7 @@ const Example = () => {
       <h3>{`${CurrentConfig.tokens.token1.symbol} Balance: ${token1Balance}`}</h3>
       <div>
         Positions:{' '}
-        {positionInfoStrings.map((s, i) => (
+        {positionStrings.map((s, i) => (
           <p key={i}>{s}</p>
         ))}
       </div>
@@ -134,13 +129,12 @@ const Example = () => {
       <button
         className="button"
         onClick={() => {
-          onCollectFees(positionIds[positionIds.length - 1])
+          onCollectFees(positions[positions.length - 1].positionId)
         }}
         disabled={
           txState === TransactionState.Sending ||
           getProvider() === null ||
-          CurrentConfig.rpc.mainnet === '' ||
-          positionIds.length < 1
+          positions.length < 1
         }>
         <p>Collect Fees</p>
       </button>

v3-sdk/collecting-fees/src/libs/constants.ts

@@ -1,6 +1,6 @@
 // This file stores web3 related constants such as addresses, token definitions, ETH currency references and ABI's
 
-import { SupportedChainId, Token } from '@uniswap/sdk-core'
+import { ChainId, Token } from '@uniswap/sdk-core'
 
 // Addresses
 
@@ -12,15 +12,15 @@ export const NONFUNGIBLE_POSITION_MANAGER_CONTRACT_ADDRESS =
 // Currencies and Tokens
 
 export const USDC_TOKEN = new Token(
-  SupportedChainId.MAINNET,
+  ChainId.MAINNET,
   '0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48',
   6,
   'USDC',
   'USD//C'
 )
 
 export const DAI_TOKEN = new Token(
-  SupportedChainId.MAINNET,
+  ChainId.MAINNET,
   '0x6B175474E89094C44Da98b954EedeAC495271d0F',
   18,
   'DAI',
@@ -48,12 +48,3 @@ export const ERC20_ABI = [
   // Events
   'event Transfer(address indexed from, address indexed to, uint amount)',
 ]
-
-export const NONFUNGIBLE_POSITION_MANAGER_ABI = [
-  // Read-Only Functions
-  'function balanceOf(address _owner) view returns (uint256)',
-  'function tokenOfOwnerByIndex(address _owner, uint256 _index) view returns (uint256)',
-  'function tokenURI(uint256 tokenId) view returns (string memory)',
-
-  'function positions(uint256 tokenId) external view returns (uint96 nonce, address operator, address token0, address token1, uint24 fee, int24 tickLower, int24 tickUpper, uint128 liquidity, uint256 feeGrowthInside0LastX128, uint256 feeGrowthInside1LastX128, uint128 tokensOwed0, uint128 tokensOwed1)',
-]