diff --git a/web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx b/web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx index c8bca450e..7062cf435 100644 --- a/web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx +++ b/web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx @@ -81,7 +81,12 @@ const InputDisplay: React.FC = ({ action, amount, setAmount }) => const parsedBalance = formatPNK(balance ?? 0n, 0, true); - const parsedStake = formatPNK(jurorBalance?.[2] ?? 0n, 0, true); + const maxWithdrawAmount = jurorBalance + ? jurorBalance[2] < jurorBalance[0] - jurorBalance[1] + ? jurorBalance[2] + : jurorBalance[0] - jurorBalance[1] + : 0n; + const parsedMaxWithdrawAmount = formatPNK(maxWithdrawAmount, 0, true); const isStaking = useMemo(() => action === ActionType.stake, [action]); useEffect(() => { @@ -89,8 +94,8 @@ const InputDisplay: React.FC = ({ action, amount, setAmount }) => setErrorMsg("You need a non-zero PNK balance to stake"); } else if (isStaking && balance && parsedAmount > balance) { setErrorMsg("Insufficient balance to stake this amount"); - } else if (!isStaking && jurorBalance && parsedAmount > jurorBalance[2]) { - setErrorMsg("Insufficient staked amount to withdraw this amount"); + } else if (!isStaking && jurorBalance && parsedAmount > maxWithdrawAmount) { + setErrorMsg("Insufficient available amount to withdraw this amount"); } else if ( action === ActionType.stake && courtDetails && @@ -102,15 +107,15 @@ const InputDisplay: React.FC = ({ action, amount, setAmount }) => } else { setErrorMsg(undefined); } - }, [parsedAmount, isStaking, balance, jurorBalance, action, courtDetails]); + }, [parsedAmount, isStaking, balance, jurorBalance, action, courtDetails, maxWithdrawAmount]); return ( <> - + { - const amount = isStaking ? parsedBalance : parsedStake; + const amount = isStaking ? parsedBalance : parsedMaxWithdrawAmount; setAmount(amount); }} >