From db931f2562b5bbdda2a69b45457dff29ed0aa8b7 Mon Sep 17 00:00:00 2001
From: Hristo Nedelkov <hristo.nedelkow@gmail.com>
Date: Wed, 16 Aug 2023 14:01:33 +0300
Subject: [PATCH] Fix

---
 src/pages/PairDevice/SyncStatus.tsx | 23 +++++++++++++----------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/src/pages/PairDevice/SyncStatus.tsx b/src/pages/PairDevice/SyncStatus.tsx
index 9f6c453b..dccda146 100644
--- a/src/pages/PairDevice/SyncStatus.tsx
+++ b/src/pages/PairDevice/SyncStatus.tsx
@@ -5,6 +5,7 @@ import RefreshBlackIcon from '/icons/refresh-black.svg'
 import RefreshIcon from '/icons/refresh.svg'
 import BlockIcon from '/icons/block.svg'
 import ConnectionIcon from '/icons/connection.svg'
+import { useState } from 'react'
 
 type SyncStatusProps = {
   isPairing: boolean
@@ -40,17 +41,19 @@ const SyncStatus = ({ isPairing, timer, isAwaitingPairing }: SyncStatusProps) =>
         </Text>
       )}
       {isAwaitingPairing && (
-        <InformationBox
-          message="No connection has been created to a Nimbus service for over 3 minutes. Please ensure that the generated pairing ID was input into the CLI. If you are unable to pair device, consider connect via IP.   "
-          variant="error"
-          icon={<Icon src={BlockIcon} />}
-        />
+        <>
+          <InformationBox
+            message="No connection has been created to a Nimbus service for over 3 minutes. Please ensure that the generated pairing ID was input into the CLI. If you are unable to pair device, consider connect via IP.   "
+            variant="error"
+            icon={<Icon src={BlockIcon} />}
+          />
+          <XStack>
+            <Button icon={<Icon src={ConnectionIcon} />} size={40}>
+              Connect via IP
+            </Button>
+          </XStack>
+        </>
       )}
-      <XStack>
-        <Button icon={<Icon src={ConnectionIcon} />} size={40}>
-          Connect via IP
-        </Button>
-      </XStack>
     </YStack>
   )
 }