diff --git a/web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx b/web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx index da9f89b5f..45818bba7 100644 --- a/web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx +++ b/web/src/pages/Courts/CourtDetails/StakePanel/InputDisplay.tsx @@ -69,6 +69,7 @@ interface IInputDisplay { const InputDisplay: React.FC = ({ action, amount, setAmount }) => { const [debouncedAmount, setDebouncedAmount] = useState(""); const [errorMsg, setErrorMsg] = useState(); + const [isPopupOpen, setIsPopupOpen] = useState(false); useDebounce(() => setDebouncedAmount(amount), 500, [amount]); const parsedAmount = useParsedAmount(uncommify(debouncedAmount) as `${number}`); @@ -113,8 +114,8 @@ const InputDisplay: React.FC = ({ action, amount, setAmount }) => setAmount(e); }} placeholder={isStaking ? "Amount to stake" : "Amount to withdraw"} - message={errorMsg ?? undefined} - variant={!isUndefined(errorMsg) ? "error" : "info"} + message={isPopupOpen ? undefined : (errorMsg ?? undefined)} + variant={!isUndefined(errorMsg) && !isPopupOpen ? "error" : "info"} formatter={(number: string) => (number !== "" ? commify(roundNumberDown(Number(number))) : "")} /> @@ -125,6 +126,8 @@ const InputDisplay: React.FC = ({ action, amount, setAmount }) => action, setAmount, setErrorMsg, + isPopupOpen, + setIsPopupOpen, }} /> diff --git a/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx b/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx index d8269fa4f..5d0717a72 100644 --- a/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx +++ b/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx @@ -46,13 +46,22 @@ interface IActionButton { parsedAmount: bigint; action: ActionType; setAmount: (arg0: string) => void; - setErrorMsg: (msg: string) => void; + setErrorMsg: (msg?: string) => void; + isPopupOpen: boolean; + setIsPopupOpen: (arg0: boolean) => void; } -const StakeWithdrawButton: React.FC = ({ amount, parsedAmount, action, setErrorMsg, setAmount }) => { +const StakeWithdrawButton: React.FC = ({ + amount, + parsedAmount, + action, + setErrorMsg, + setAmount, + isPopupOpen, + setIsPopupOpen, +}) => { const { id } = useParams(); const theme = useTheme(); - const [isPopupOpen, setIsPopupOpen] = useState(false); const [isSuccess, setIsSuccess] = useState(false); const [popupStepsState, setPopupStepsState] = useState(); const controllerRef = useRef(null); @@ -234,6 +243,7 @@ const StakeWithdrawButton: React.FC = ({ amount, parsedAmount, ac amount, refetchAllowance, refetchSetStake, + setIsPopupOpen, ]); useEffect(() => { @@ -268,6 +278,7 @@ const StakeWithdrawButton: React.FC = ({ amount, parsedAmount, ac ]); const closePopup = () => { + setErrorMsg(undefined); setIsPopupOpen(false); setIsSuccess(false); setAmount(""); diff --git a/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/index.tsx b/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/index.tsx index e226edf30..e68ace128 100644 --- a/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/index.tsx +++ b/web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/index.tsx @@ -111,7 +111,7 @@ interface IStakeWithdrawPopup { } const StakeWithdrawPopup: React.FC = ({ amount, closePopup, steps, isSuccess, action }) => { - const { data: phase } = useSortitionModulePhase(); + const { data: phase, isLoading } = useSortitionModulePhase(); return ( @@ -121,7 +121,7 @@ const StakeWithdrawPopup: React.FC = ({ amount, closePopup,
{steps && } - {phase !== Phases.staking ? ( + {phase !== Phases.staking && !isLoading ? (