From 27eed45c2abd24b45a28c20b150155323388584b Mon Sep 17 00:00:00 2001
From: Hristo Nedelkov <hristo.nedelkow@gmail.com>
Date: Wed, 16 Aug 2023 14:55:37 +0300
Subject: [PATCH] Fix story

---
 src/pages/PairDevice/PairDevice.tsx         |  8 +++-----
 src/pages/PairDevice/SyncStatus.stories.tsx |  1 -
 src/pages/PairDevice/SyncStatus.tsx         | 11 ++++++-----
 3 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/src/pages/PairDevice/PairDevice.tsx b/src/pages/PairDevice/PairDevice.tsx
index 9dd2b83d..3fe619a1 100644
--- a/src/pages/PairDevice/PairDevice.tsx
+++ b/src/pages/PairDevice/PairDevice.tsx
@@ -15,11 +15,9 @@ import CompleteId from '../../components/Icons/CompleteId'
 const PairDevice = () => {
   const [autoChecked, setAutoChecked] = useState(false)
   const isPaired = true
-  const [isPairing, setIsPairing] = useState(true)
+  const isPairing = true
   console.log(uuidv4())
-  const resetTimer = () => {
-    setIsPairing(false)
-  }
+
   return (
     <PageWrapperShadow rightImageSrc="/background-images/day-night-bg.png">
       <YStack
@@ -45,7 +43,7 @@ const PairDevice = () => {
           </Button>
         </XStack>
         <Separator borderColor={'#e3e3e3'} />
-        <SyncStatus isPairing={isPairing} onResetTimer={resetTimer} />
+        <SyncStatus isPairing={isPairing} />
         <Separator borderColor={'#e3e3e3'} />
         <Text size={19} weight={'semibold'} color="#09101C">
           Settings
diff --git a/src/pages/PairDevice/SyncStatus.stories.tsx b/src/pages/PairDevice/SyncStatus.stories.tsx
index 62df55fa..b655831b 100644
--- a/src/pages/PairDevice/SyncStatus.stories.tsx
+++ b/src/pages/PairDevice/SyncStatus.stories.tsx
@@ -18,6 +18,5 @@ type Story = StoryObj<typeof meta>
 export const Page: Story = {
   args: {
     isPairing: true,
-    onResetTimer: () => {},
   },
 }
diff --git a/src/pages/PairDevice/SyncStatus.tsx b/src/pages/PairDevice/SyncStatus.tsx
index fcf00634..d1e82f00 100644
--- a/src/pages/PairDevice/SyncStatus.tsx
+++ b/src/pages/PairDevice/SyncStatus.tsx
@@ -7,16 +7,17 @@ import BlockIcon from '/icons/block.svg'
 import ConnectionIcon from '/icons/connection.svg'
 import { convertSecondsToTimerFormat } from '../../utilities'
 import { useEffect, useState } from 'react'
-
 type SyncStatusProps = {
   isPairing: boolean
-  onResetTimer: () => void
 }
-
-const SyncStatus = ({ isPairing, onResetTimer }: SyncStatusProps) => {
+const SyncStatus = ({ isPairing }: SyncStatusProps) => {
   const [elapsedTime, setElapsedTime] = useState(0)
   const [isAwaitingPairing, setIsAwaitingPairing] = useState(false)
 
+  const resetTimer = () => {
+    setElapsedTime(0)
+    setIsAwaitingPairing(false)
+  }
   useEffect(() => {
     let timer: ReturnType<typeof setTimeout>
 
@@ -53,7 +54,7 @@ const SyncStatus = ({ isPairing, onResetTimer }: SyncStatusProps) => {
         )}
         <IconButton
           icon={<Icon src={isPairing ? RefreshBlackIcon : RefreshIcon} />}
-          onPress={onResetTimer}
+          onPress={resetTimer}
           variant="ghost"
         />
       </XStack>