From c4a7019f73373343b74106506c67fbbd1c66cf6a Mon Sep 17 00:00:00 2001
From: David Uhlmann <dib542@gmail.com>
Date: Thu, 14 Sep 2023 16:07:31 +1000
Subject: [PATCH] feat: add staked position parts to be visible in Pool
 position table

---
 src/pages/Pool/MyPositionTableCard.tsx | 30 +++++++++++++++++++-------
 src/pages/Pool/PoolManagement.tsx      |  9 +++++++-
 2 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/src/pages/Pool/MyPositionTableCard.tsx b/src/pages/Pool/MyPositionTableCard.tsx
index 899f1581a..4acb69ad6 100644
--- a/src/pages/Pool/MyPositionTableCard.tsx
+++ b/src/pages/Pool/MyPositionTableCard.tsx
@@ -10,6 +10,7 @@ import { EditedPosition } from '../MyLiquidity/useEditLiquidity';
 import { guessInvertedOrder } from '../../lib/web3/utils/pairs';
 import { useSimplePrice } from '../../lib/tokenPrices';
 import { matchTokens } from '../../lib/web3/hooks/useTokens';
+import { useStake } from '../MyLiquidity/useStaking';
 
 import TableCard from '../../components/cards/TableCard';
 
@@ -291,12 +292,19 @@ export function MyEditedPositionTableCard({
     );
   }, [poolValues]);
 
+  const [, sendStakeRequest] = useStake();
+
   const data = editedUserPosition
-    ? sortedPosition.map(
-        (
-          { tickDiff0, tickDiff1, deposit, token0Context, token1Context },
-          index
-        ) => {
+    ? sortedPosition.map((userPosition, index) => {
+        if (userPosition) {
+          const {
+            tickDiff0,
+            tickDiff1,
+            deposit,
+            token0Context,
+            token1Context,
+            stakeContext,
+          } = userPosition;
           const reserveA = !invertedTokenOrder
             ? tickDiff0.plus(token0Context?.userReserves || 0)
             : tickDiff1.plus(token1Context?.userReserves || 0);
@@ -377,8 +385,13 @@ export function MyEditedPositionTableCard({
                   (reserveA.isZero() || reserveB.isZero()) && (
                     <button
                       type="button"
-                      className="button button-light ml-auto"
+                      className={`button ${
+                        stakeContext ? 'button-primary-outline' : 'button-light'
+                      } ml-auto`}
                       onClick={() => {
+                        if (stakeContext) {
+                          return sendStakeRequest([], [userPosition]);
+                        }
                         setEditedUserPosition((ticks) => {
                           return ticks.map((tick) => {
                             return tick.deposit.centerTickIndex1To0.toNumber() ===
@@ -399,7 +412,7 @@ export function MyEditedPositionTableCard({
                         });
                       }}
                     >
-                      Withdraw
+                      {stakeContext ? <>Unstake</> : <>Withdraw</>}
                     </button>
                   )}
                 {(!tickDiff0.isZero() || !tickDiff1.isZero()) && (
@@ -430,7 +443,8 @@ export function MyEditedPositionTableCard({
             </tr>
           ) : null;
         }
-      )
+        return null;
+      })
     : null;
 
   return (
diff --git a/src/pages/Pool/PoolManagement.tsx b/src/pages/Pool/PoolManagement.tsx
index ab9e06c6d..92e24602e 100644
--- a/src/pages/Pool/PoolManagement.tsx
+++ b/src/pages/Pool/PoolManagement.tsx
@@ -799,7 +799,14 @@ export default function PoolManagement({
   const pairPoolDepositFilter = usePoolDepositFilterForPair(
     tokenA && tokenB ? [tokenA, tokenB] : ['', '']
   );
-  const userPositionsContext = useUserPositionsContext(pairPoolDepositFilter);
+  const userUnstakedContext = useUserPositionsContext(pairPoolDepositFilter);
+  const userStakedContext = useUserPositionsContext(
+    pairPoolDepositFilter,
+    true
+  );
+  const userPositionsContext = useMemo(() => {
+    return [...userUnstakedContext, ...userStakedContext];
+  }, [userStakedContext, userUnstakedContext]);
 
   const [{ isValidating: isValidatingEdit }, sendEditRequest] =
     useEditLiquidity();