feat: disable button if not paired

This commit is contained in:
RadoslavDimchev 2023-08-16 13:31:47 +03:00
parent 37e01f1031
commit ea4c6c60a5
2 changed files with 8 additions and 2 deletions

View File

@ -8,6 +8,8 @@ import CreateIcon from '../../components/Icons/CreateIcon'
import NodeIcon from '../../components/Icons/NodeIcon' import NodeIcon from '../../components/Icons/NodeIcon'
const PairDevice = () => { const PairDevice = () => {
const isPaired = false
return ( return (
<PageWrapperShadow rightImageSrc="/background-images/day-night-bg.png"> <PageWrapperShadow rightImageSrc="/background-images/day-night-bg.png">
<YStack <YStack
@ -27,7 +29,9 @@ const PairDevice = () => {
<SyncStatus isPairing={true} timer={'00:12'} isAwaitingPairing={true} /> <SyncStatus isPairing={true} timer={'00:12'} isAwaitingPairing={true} />
<Separator borderColor={'#e3e3e3'} /> <Separator borderColor={'#e3e3e3'} />
<XStack> <XStack>
<Button icon={<NodeIcon />}>Continue</Button> <Button icon={<NodeIcon />} disabled={!isPaired}>
Continue
</Button>
</XStack> </XStack>
</YStack> </YStack>
</PageWrapperShadow> </PageWrapperShadow>

View File

@ -1,15 +1,17 @@
import { Stack, XStack, YStack } from 'tamagui' import { XStack, YStack } from 'tamagui'
import { Button, InformationBox, Text } from '@status-im/components' import { Button, InformationBox, Text } from '@status-im/components'
import Icon from '../../components/General/Icon' import Icon from '../../components/General/Icon'
import RefreshBlackIcon from '/icons/refresh-black.svg' import RefreshBlackIcon from '/icons/refresh-black.svg'
import RefreshIcon from '/icons/refresh.svg' import RefreshIcon from '/icons/refresh.svg'
import BlockIcon from '/icons/block.svg' import BlockIcon from '/icons/block.svg'
import ConnectionIcon from '/icons/connection.svg' import ConnectionIcon from '/icons/connection.svg'
type SyncStatusProps = { type SyncStatusProps = {
isPairing: boolean isPairing: boolean
timer: string timer: string
isAwaitingPairing?: boolean isAwaitingPairing?: boolean
} }
const SyncStatus = ({ isPairing, timer, isAwaitingPairing }: SyncStatusProps) => { const SyncStatus = ({ isPairing, timer, isAwaitingPairing }: SyncStatusProps) => {
return ( return (
<YStack space={'$2'}> <YStack space={'$2'}>