feat: disable btn for not valid address or port

This commit is contained in:
RadoslavDimchev 2024-01-24 14:37:47 +02:00
parent bc3903b5b0
commit 5ae15e8d7b
1 changed files with 24 additions and 1 deletions

View File

@ -1,6 +1,7 @@
import { NodeIcon, CompleteIdIcon, ConnectionIcon } from '@status-im/icons'
import { Label, Separator, XStack, YStack } from 'tamagui'
import { useState } from 'react'
import { useSelector } from 'react-redux'
import { Button, Checkbox, Text } from '@status-im/components'
import PageWrapperShadow from '../../components/PageWrappers/PageWrapperShadow'
@ -11,11 +12,16 @@ import CreateAvatar from '../../components/General/CreateAvatar/CreateAvatar'
import GenerateId from './GenerateId'
import Header from '../../components/General/Header'
import ConnectViaIP from './ConnectViaIP/ConnectViaIP'
import { RootState } from '../../redux/store'
import { isAddressValid, isPortValid } from '../../utilities'
const PairDevice = () => {
const [isAwaitingPairing, setIsAwaitingPairing] = useState(false)
const [isConnectingViaIp, setIsConnectingViaIp] = useState(false)
const [isAutoConnectChecked, setIsAutoConnectChecked] = useState(false)
const { isAdvanced, nodeAddress, beaconAddress, beaconPort, vcAddress, vcPort } = useSelector(
(state: RootState) => state.pairDevice,
)
const isPaired = false
const isPairing = false
@ -29,6 +35,23 @@ const PairDevice = () => {
const continueHandler = () => {}
const isDisabledButton = () => {
if (isConnectingViaIp) {
if (isAdvanced) {
return (
!isAddressValid(beaconAddress) ||
!isPortValid(beaconPort) ||
!isAddressValid(vcAddress) ||
!isPortValid(vcPort)
)
} else {
return !isAddressValid(nodeAddress) || !isPortValid(beaconPort) || !isPortValid(vcPort)
}
} else {
return !isPaired
}
}
return (
<PageWrapperShadow rightImageSrc="./background-images/day-night-bg.png" rightImageLogo={true}>
<YStack space={'$3'}>
@ -99,7 +122,7 @@ const PairDevice = () => {
<div>
<Button
icon={<NodeIcon size={20} />}
disabled={isConnectingViaIp ? false : !isPaired}
disabled={isDisabledButton()}
onPress={continueHandler}
>
{isConnectingViaIp ? 'Connect Device' : 'Continue'}