diff --git a/src/Stake.jsx b/src/Stake.jsx index b247ca0..23c0812 100644 --- a/src/Stake.jsx +++ b/src/Stake.jsx @@ -179,15 +179,6 @@ const NEARInputContainer = styled.div` justify-content: space-between; `; -const NEARIcon = () => ( - NEAR Icon -); - const NEARTexture = styled.div` font-size: 24px; font-weight: bold; @@ -199,29 +190,6 @@ const LogoWithText = styled.div` align-items: center; `; -const NEARInputComp = ({ value, onChange, error }) => ( - -); - const MaxTexture = styled.div` font-size: 24px; color: #4451FD; @@ -244,44 +212,23 @@ const YouWillReceive = styled.div` margin-top: 16px; `; -const NEARInput = ({ value, onChange, onClickMax }) => { - return ( - - - - NEAR - - - MAX - - ); -}; - -const BrandImage = () => ( - - Brand Logo - -); - return (
- + + Brand Logo + Stake Your NEAR Stake NEAR and receive LiNEAR while earning staking rewards @@ -291,75 +238,106 @@ return ( - { - // Has user signed in? - if (!isSignedIn) { + + + NEAR Icon + NEAR + + { + // Has user signed in? + if (!isSignedIn) { + State.update({ + inputError: "Sign in please", + }); + return; + } + const targetValue = e.target.value; + if (targetValue !== "" && !targetValue.match(/^\d*(\.\d*)?$/)) { + return; + } + let stakeAmount = targetValue.replace(/^0+/, "0"); // remove prefix 0 + // limit 24 decimals + const most24DecimalsPattern = /^-?\d+(\.\d{0,24})?/; + let values = stakeAmount.match(most24DecimalsPattern); + if (values) { + stakeAmount = values[0]; + } + if ( + nearBalance && + (isNaN(Number(stakeAmount)) || + stakeAmount === "" || + Big(stakeAmount).lt(1) || + Big(stakeAmount).gt(Big(nearBalance))) + ) { + if ( + isNaN(Number(stakeAmount)) || + stakeAmount === "" || + Big(stakeAmount).lt(1) + ) { + State.update({ + inputValue: stakeAmount, + inputError: "Stake at least 1 NEAR", + }); + } else { + State.update({ + inputValue: stakeAmount, + inputError: `Max is ${nearBalance} NEAR`, + }); + } + return; + } State.update({ - inputError: "Sign in please", + inputValue: stakeAmount, + inputError: "", }); - return; - } - const targetValue = e.target.value; - if (targetValue !== "" && !targetValue.match(/^\d*(\.\d*)?$/)) { - return; - } - let stakeAmount = targetValue.replace(/^0+/, "0"); // remove prefix 0 - // limit 24 decimals - const most24DecimalsPattern = /^-?\d+(\.\d{0,24})?/; - let values = stakeAmount.match(most24DecimalsPattern); - if (values) { - stakeAmount = values[0]; - } - if ( - nearBalance && - (isNaN(Number(stakeAmount)) || - stakeAmount === "" || - Big(stakeAmount).lt(1) || - Big(stakeAmount).gt(Big(nearBalance))) - ) { + }} + /> + { if ( - isNaN(Number(stakeAmount)) || - stakeAmount === "" || - Big(stakeAmount).lt(1) + isNaN(Number(nearBalance)) || + nearBalance === "" || + Big(nearBalance).lt(1) ) { State.update({ - inputValue: stakeAmount, + inputValue: nearBalance, inputError: "Stake at least 1 NEAR", }); + return; } else { State.update({ - inputValue: stakeAmount, - inputError: `Max is ${nearBalance} NEAR`, + inputValue: nearBalance, + inputError: "", }); } - return; - } - State.update({ - inputValue: stakeAmount, - inputError: "", - }); - }} - onClickMax={() => { - if ( - isNaN(Number(nearBalance)) || - nearBalance === "" || - Big(nearBalance).lt(1) - ) { - State.update({ - inputValue: nearBalance, - inputError: "Stake at least 1 NEAR", - }); - return; - } else { - State.update({ - inputValue: nearBalance, - inputError: "", - }); - } - }} - /> + }} + > + MAX + +

Balance: {nearBalance} NEAR