From a6e799297954abd7eb6335068aa3254e60933b70 Mon Sep 17 00:00:00 2001
From: Hayden Shively <17186559+haydenshively@users.noreply.github.com>
Date: Wed, 7 Feb 2024 13:45:24 -0600
Subject: [PATCH] Add explanation for partial withdrawals on Markets Page

---
 .../components/lend/modal/WithdrawModal.tsx   | 22 ++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/earn/src/components/lend/modal/WithdrawModal.tsx b/earn/src/components/lend/modal/WithdrawModal.tsx
index a345495fb..3dceb68fe 100644
--- a/earn/src/components/lend/modal/WithdrawModal.tsx
+++ b/earn/src/components/lend/modal/WithdrawModal.tsx
@@ -95,10 +95,15 @@ export default function WithdrawModal(props: WithdrawModalProps) {
     action,
     txn,
     resetTxn,
-    maxAmount: maxAmountBN,
+    maxAmount,
   } = useRedeem(activeChain.id, selectedRow.kitty.address, inputValue[1] ? GN.Q(112) : withdrawAmount, userAddress);
 
-  const maxAmount = GN.fromBigNumber(maxAmountBN, selectedRow.asset.decimals);
+  const maxAmountGN = GN.fromBigNumber(maxAmount, selectedRow.asset.decimals);
+  const isConstrainedByUtilization =
+    inputValue[1] &&
+    userBalance.isGtZero() &&
+    maxAmountGN.isGtZero() &&
+    maxAmountGN.recklessMul(100).div(userBalance).toNumber() < 99;
 
   useEffect(() => {
     if (txn === undefined) return;
@@ -137,9 +142,9 @@ export default function WithdrawModal(props: WithdrawModalProps) {
           token={selectedRow.asset}
           value={inputValue[0]}
           max={userBalance.toString(GNFormat.DECIMAL)}
-          maxed={withdrawAmount.eq(maxAmount)}
+          maxed={withdrawAmount.eq(maxAmountGN)}
           onMax={() => {
-            setInputValue([maxAmount.toString(GNFormat.DECIMAL), true]);
+            setInputValue([maxAmountGN.toString(GNFormat.DECIMAL), true]);
           }}
           onChange={(value) => {
             const output = formatNumberInput(value);
@@ -161,7 +166,14 @@ export default function WithdrawModal(props: WithdrawModalProps) {
             Summary
           </Text>
           <Text size='XS' color={SECONDARY_COLOR} className='overflow-hidden text-ellipsis'>
-            You're withdrawing {inputValue[0] || '0'} {selectedRow.asset.symbol}. Your new balance will be{' '}
+            You're withdrawing{' '}
+            <strong>
+              {inputValue[0] || '0'} {selectedRow.asset.symbol}.
+            </strong>{' '}
+            {isConstrainedByUtilization
+              ? // eslint-disable-next-line max-len
+                `This will cause the interest rate to spike, encouraging borrowers to repay. Once they do, you'll be able to withdraw your remaining `
+              : `Your remaining balance will be `}
             {newBalanceStr} {selectedRow.asset.symbol}.
           </Text>
         </div>