diff --git a/src/components/General/Icon.tsx b/src/components/General/Icon.tsx index 450e3d16..4313f7dc 100644 --- a/src/components/General/Icon.tsx +++ b/src/components/General/Icon.tsx @@ -1,5 +1,4 @@ import { Image } from '@status-im/components' -import { Stack } from 'tamagui' export type IconProps = { src: string @@ -10,7 +9,7 @@ export type IconProps = { const Icon = ({ src, width = 16, height = 16, onClick }: IconProps) => { return ( - +
{ height={height} style={{ backgroundColor: 'transparent' }} /> - +
) } diff --git a/src/pages/PairDevice/PairDevice.tsx b/src/pages/PairDevice/PairDevice.tsx index b986469c..41d36b4c 100644 --- a/src/pages/PairDevice/PairDevice.tsx +++ b/src/pages/PairDevice/PairDevice.tsx @@ -9,6 +9,7 @@ import NodeIcon from '../../components/Icons/NodeIcon' import Titles from '../../components/General/Titles' import { useState, useEffect } from 'react' import { v4 as uuidv4 } from 'uuid' +import { convertSecondsToTimerFormat } from '../../utilities' const PairDevice = () => { const [autoChecked, setAutoChecked] = useState(false) @@ -19,6 +20,7 @@ const PairDevice = () => { const [isPairing] = useState(true) // assuming starting as true for demo const [isAwaitingPairing, setIsAwaitingPairing] = useState(false) const [elapsedTime, setElapsedTime] = useState(0) + const resetTimer = () => { setElapsedTime(0) setIsAwaitingPairing(false) @@ -31,7 +33,6 @@ const PairDevice = () => { timer = setInterval(() => { setElapsedTime(prevTime => prevTime + 1) if (elapsedTime >= 180) { - // 180 seconds = 3 minutes setIsAwaitingPairing(true) } }, 1000) @@ -39,11 +40,8 @@ const PairDevice = () => { return () => clearInterval(timer) }, [isPairing, elapsedTime]) - const convertSecondsToTimerFormat = (seconds: number) => { - const minutes = Math.floor(seconds / 60) - const remainingSeconds = seconds % 60 - return `${String(minutes).padStart(2, '0')}:${String(remainingSeconds).padStart(2, '0')}` - } + + return ( )} {isAwaitingPairing && ( - <> - } - /> - - - - + } + /> + )} + {isAwaitingPairing && ( + + + )} ) diff --git a/src/utilities.ts b/src/utilities.ts index 5ab5221e..6803b6fa 100644 --- a/src/utilities.ts +++ b/src/utilities.ts @@ -16,3 +16,9 @@ export function assertUnreachable(value: never): never { throw new Error(`Unreachable case: ${value}`); } + +export const convertSecondsToTimerFormat = (seconds: number) => { + const minutes = Math.floor(seconds / 60) + const remainingSeconds = seconds % 60 + return `${String(minutes).padStart(2, '0')}:${String(remainingSeconds).padStart(2, '0')}` + } \ No newline at end of file