fix: addliquidity multiple pos for farm

KyberNetwork · Aug 16, 2023 · bb7765a · bb7765a
1 parent 490bd27
commit bb7765a
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 21 deletions.
diff --git a/src/pages/AddLiquidityV2/index.tsx b/src/pages/AddLiquidityV2/index.tsx
@@ -224,21 +224,24 @@ export default function AddLiquidity() {
   const poolAddress = useProAmmPoolInfo(baseCurrency, currencyB, feeAmount)
 
   const { farms } = useElasticFarmsV2()
-  const farmV2 = farms?.find(
+
+  const farmV2S = farms?.filter(
     item =>
       !item.isSettled &&
       item.endTime > Date.now() / 1000 &&
       item.poolAddress.toLowerCase() === poolAddress.toLowerCase(),
   )
 
-  const activeRanges = farmV2?.ranges.filter(r => !r.isRemoved) || []
+  const activeRanges =
+    farmV2S?.map(farm => farm.ranges.filter(item => !item.isRemoved).map(item => ({ ...item, farm }))).flat() || []
 
-  const isFarmV2Available = !!farmV2
+  const isFarmV2Available = !!farmV2S?.length
 
   const [showFarmRangeSelect, setShowFarmRangeSelect] = useState(() => isFarmV2Available)
   const [searchParams, setSearchParams] = useSearchParams()
   const activeRangeIndex = Number(searchParams.get('farmRange') || '0')
-  const range = activeRanges.find(i => i.index === activeRangeIndex)
+  const defaultFId = Number(searchParams.get('fId') || '0')
+  const range = activeRanges.find(i => i.index === activeRangeIndex && i.farm.fId === defaultFId)
 
   const canJoinFarm =
     isFarmV2Available &&
@@ -928,7 +931,7 @@ export default function AddLiquidity() {
   const [shownTooltip, setShownTooltip] = useState<RANGE | null>(null)
   const pairFactor = usePairFactor([tokenA, tokenB])
 
-  const isReverseWithFarm = baseCurrency?.wrapped.address !== farmV2?.token0.wrapped.address
+  const isReverseWithFarm = baseCurrency?.wrapped.address !== farmV2S?.[0]?.token0.wrapped.address
 
   const chart = (
     <ChartWrapper ref={chartRef}>
@@ -1001,34 +1004,35 @@ export default function AddLiquidity() {
                   </>
                 )}
               </Flex>
-              {showFarmRangeSelect && !!farmV2 && (
+              {showFarmRangeSelect && !!activeRanges.length && farmV2S?.[0] && (
                 <Flex sx={{ gap: '8px' }} flexWrap="wrap">
-                  {farmV2.ranges.map(range => {
+                  {activeRanges.map(range => {
                     if (range.isRemoved) return null
                     return (
                       <RangeBtn
                         style={{ width: 'fit-content' }}
-                        key={range.index}
+                        key={range.farm.fId + '_' + range.index}
                         onClick={() => {
                           searchParams.set('farmRange', range.index.toString())
+                          searchParams.set('fId', range.farm.fId.toString())
                           setSearchParams(searchParams)
                           onFarmRangeSelected(+range.tickLower, +range.tickUpper)
                         }}
-                        isSelected={activeRangeIndex === range.index}
+                        isSelected={activeRangeIndex === range.index && defaultFId === range.farm.fId}
                       >
                         <Flex alignItems="center" sx={{ gap: '2px' }}>
                           {convertTickToPrice(
-                            isReverseWithFarm ? farmV2.token1 : farmV2.token0,
-                            isReverseWithFarm ? farmV2.token0 : farmV2.token1,
+                            isReverseWithFarm ? farmV2S[0].token1 : farmV2S[0].token0,
+                            isReverseWithFarm ? farmV2S[0].token0 : farmV2S[0].token1,
                             isReverseWithFarm ? range.tickUpper : range.tickLower,
-                            farmV2.pool.fee,
+                            farmV2S[0].pool.fee,
                           )}
                           <TwoWayArrow />
                           {convertTickToPrice(
-                            isReverseWithFarm ? farmV2.token1 : farmV2.token0,
-                            isReverseWithFarm ? farmV2.token0 : farmV2.token1,
+                            isReverseWithFarm ? farmV2S[0].token1 : farmV2S[0].token0,
+                            isReverseWithFarm ? farmV2S[0].token0 : farmV2S[0].token1,
                             isReverseWithFarm ? range.tickLower : range.tickUpper,
-                            farmV2.pool.fee,
+                            farmV2S[0].pool.fee,
                           )}
                         </Flex>
                       </RangeBtn>
@@ -1314,11 +1318,22 @@ export default function AddLiquidity() {
   )
 
   useEffect(() => {
-    if (isFarmV2Available && range?.tickUpper && range?.tickUpper) {
+    if (isFarmV2Available) {
       setShowFarmRangeSelect(true)
-      onFarmRangeSelected(range.tickLower, range.tickUpper)
     } else setShowFarmRangeSelect(false)
-  }, [isFarmV2Available, range?.tickUpper, range?.tickLower, onFarmRangeSelected])
+  }, [isFarmV2Available])
+
+  useEffect(() => {
+    if (
+      isFarmV2Available &&
+      range?.tickUpper &&
+      range?.tickUpper &&
+      !positionsState[pIndex].leftRangeTypedValue &&
+      !positionsState[pIndex].rightRangeTypedValue
+    ) {
+      onFarmRangeSelected(range.tickLower, range.tickUpper)
+    }
+  }, [isFarmV2Available, range?.tickUpper, range?.tickLower, onFarmRangeSelected, positionsState, pIndex])
 
   if (!isEVM) return <Navigate to="/" />
 

diff --git a/src/pages/Farm/ElasticFarmv2/components/FarmCard.tsx b/src/pages/Farm/ElasticFarmv2/components/FarmCard.tsx
@@ -369,7 +369,7 @@ function FarmCard({
                         {range?.isRemoved ? (
                           <Trans>Idle Range</Trans>
                         ) : (
-                          <Link to={`${addliquidityElasticPool}?farmRange=${activeRangeIndex}`}>
+                          <Link to={`${addliquidityElasticPool}?farmRange=${activeRangeIndex}&fId=${farm.fId}`}>
                             <Trans>Add Liquidity ↗</Trans>
                           </Link>
                         )}

diff --git a/src/pages/Farm/ElasticFarmv2/components/NewRangesNotiModal.tsx b/src/pages/Farm/ElasticFarmv2/components/NewRangesNotiModal.tsx
@@ -160,7 +160,7 @@ export default function NewRangesNotiModal({ updatedFarms }: { updatedFarms: Ela
                     {range.isRemoved ? (
                       <Trans>Idle Range</Trans>
                     ) : (
-                      <Link to={`${addliquidityElasticPool}?farmRange=${range.index}`}>
+                      <Link to={`${addliquidityElasticPool}?farmRange=${range.index}&fId=${range.farm.fId}`}>
                         <Trans>Add Liquidity ↗</Trans>
                       </Link>
                     )}

diff --git a/src/pages/Farm/ElasticFarmv2/components/StakeWithNFTsModal.tsx b/src/pages/Farm/ElasticFarmv2/components/StakeWithNFTsModal.tsx
@@ -301,7 +301,9 @@ const StakeWithNFTsModal = ({
 
   const addliquidityElasticPool = `/${networkInfo.route}${APP_PATHS.ELASTIC_CREATE_POOL}/${
     farm.token0.isNative ? farm.token0.symbol : farm.token0.address
-  }/${farm.token1.isNative ? farm.token1.symbol : farm.token1.address}/${farm.pool.fee}?farmRange=${activeRange.index}`
+  }/${farm.token1.isNative ? farm.token1.symbol : farm.token1.address}/${farm.pool.fee}?farmRange=${
+    activeRange.index
+  }&fId=${farm.fId}`
 
   const upToMedium = useMedia(`(max-width: ${MEDIA_WIDTHS.upToMedium}px)`)