diff --git a/src/pages/ValidatorManagement/ManageValidator/RightManageSettings/Panels/DepositPanel.tsx b/src/pages/ValidatorManagement/ManageValidator/RightManageSettings/Panels/DepositPanel.tsx index 22b9c6ba..2eb5a6aa 100644 --- a/src/pages/ValidatorManagement/ManageValidator/RightManageSettings/Panels/DepositPanel.tsx +++ b/src/pages/ValidatorManagement/ManageValidator/RightManageSettings/Panels/DepositPanel.tsx @@ -1,6 +1,6 @@ -import { InformationBox, Text } from '@status-im/components' -import { PlaceholderIcon } from '@status-im/icons' -import { YStack } from 'tamagui' +import { InformationBox, Input, Text } from '@status-im/components' +import { ClearIcon, PlaceholderIcon } from '@status-im/icons' +import { Stack, YStack } from 'tamagui' import { useState } from 'react' import { useSelector } from 'react-redux' @@ -13,6 +13,7 @@ import ValidatorRequest from '../../../../ValidatorOnboarding/Deposit/ValidatorR const DepositPanel = () => { const [isInfoBoxVisible, setIsInfoBoxVisible] = useState(true) + const [depositAmount, setDepositAmount] = useState('') const { isWalletConnected, isTransactionConfirmation, isChainParity } = useSelector((state: RootState) => state.deposit) @@ -20,6 +21,17 @@ const DepositPanel = () => { setIsInfoBoxVisible(false) } + const changeDepositAmountHandler = (value: string) => { + const numberValue = Number(value) + if (isNaN(numberValue) === false) { + setDepositAmount(value) + } + } + + const removeDepositAmountHandler = () => { + setDepositAmount('') + } + return ( {isChainParity ? ( @@ -31,6 +43,23 @@ const DepositPanel = () => { width: '100%', }} > + + + Deposit validator + + + } + placeholder="Deposit Amount" + value={depositAmount} + onChangeText={changeDepositAmountHandler} + /> + { const isDefault = false - const isMigrate = true - const isDeposit = false + const isMigrate = false + const isDeposit = true return (