diff --git a/components/molecules/StakeDisplay.tsx b/components/molecules/StakeDisplay.tsx index bfd05f8..1d318ff 100644 --- a/components/molecules/StakeDisplay.tsx +++ b/components/molecules/StakeDisplay.tsx @@ -10,6 +10,7 @@ import { ConfirmUnstakeModal } from "./ConfirmUnstakeModal"; import { ClipboardIcon } from "../atoms/ClipboardIcon"; import { MobileModalWrapper } from "../layouts/MobileModalWrapper"; import { useAccountStakeInfo } from "../../hooks/useAccountStakeInfo"; +import { useSettings } from "../../hooks/useSettings"; export const StakeDisplay = () => { const addressRef = useRef(null); @@ -17,6 +18,7 @@ export const StakeDisplay = () => { const { stakeInfo } = useAccountStakeInfo(address); const { chain } = useNetwork(); const { nodeStatus } = useNodeStatus(); + const { settings } = useSettings(); const { setShowModal, setContent, resetModal } = useModalStore( (state: any) => ({ setShowModal: state.setShowModal, @@ -42,6 +44,20 @@ export const StakeDisplay = () => { } }, [nodeStatus?.state]); + const { isStoppedForLongerThan15Minutes, remainingWaitTime } = useMemo(() => { + if (!settings?.lastStopped) return { isStoppedForLongerThan15Minutes: false, remainingWaitTime: 0 }; + const timeDifference = Date.now() - settings.lastStopped; + const isStoppedForLongerThan15Minutes = timeDifference > 15 * 60 * 1000; + const remainingWaitTime = Math.max(15 * 60 * 1000 - timeDifference, 0); + return { isStoppedForLongerThan15Minutes, remainingWaitTime }; + }, [settings?.lastStopped]); + + const formatRemainingTime = (ms: number) => { + const minutes = Math.floor(ms / 60000); + const seconds = Math.floor((ms % 60000) / 1000); + return `${minutes}m ${seconds}s`; + }; + return (
@@ -84,22 +100,25 @@ export const StakeDisplay = () => { {isConnected && chain?.id === CHAIN_ID ? (
); -}; +}; \ No newline at end of file