From ccd7a2c8dc8bc07bbc4c1ab36ce523ac3c5296c8 Mon Sep 17 00:00:00 2001
From: DinhTran <dinh.tran2@sotatek.com>
Date: Fri, 1 Mar 2024 10:54:43 +0700
Subject: [PATCH] fix: update logic display status epoch

---
 .../commons/Epoch/FirstEpoch/index.tsx        | 40 +++++++++++--------
 1 file changed, 24 insertions(+), 16 deletions(-)

diff --git a/src/components/commons/Epoch/FirstEpoch/index.tsx b/src/components/commons/Epoch/FirstEpoch/index.tsx
index bee1621e02..40764c460b 100644
--- a/src/components/commons/Epoch/FirstEpoch/index.tsx
+++ b/src/components/commons/Epoch/FirstEpoch/index.tsx
@@ -37,27 +37,35 @@ export default function FirstEpoch({ data: currentEpochData, onClick }: IProps)
       icon: ExchangeIcon,
       hideHeader: true,
       title: (
-        <EpochNumber>
+        <EpochNumber sx={{ mt: `${currentEpochData?.status === "SYNCING" ? "30px" : ""}` }}>
           <Box component={"span"}>{currentEpochData?.no}</Box>
         </EpochNumber>
       ),
       value: (
         <Box display={"flex"} alignItems="center" justifyContent={"center"}>
-          <ProgressCircle
-            size={100}
-            pathLineCap="butt"
-            pathWidth={6}
-            trailWidth={6}
-            percent={Number(progress)}
-            trailOpacity={1}
-          >
-            <EpochProgress
-              status={currentEpochData?.status as keyof typeof EPOCH_STATUS}
-            >{`${progress}%`}</EpochProgress>
-            <Status status={currentEpochData?.status as keyof typeof EPOCH_STATUS}>
-              {EPOCH_STATUS_MAPPING[EPOCH_STATUS[currentEpochData?.status]]}
-            </Status>
-          </ProgressCircle>
+          {currentEpochData?.status === "SYNCING" ? (
+            <Box>
+              <Status status={currentEpochData?.status as keyof typeof EPOCH_STATUS}>
+                {EPOCH_STATUS_MAPPING[EPOCH_STATUS[currentEpochData?.status]]}
+              </Status>
+            </Box>
+          ) : (
+            <ProgressCircle
+              size={100}
+              pathLineCap="butt"
+              pathWidth={6}
+              trailWidth={6}
+              percent={Number(progress)}
+              trailOpacity={1}
+            >
+              <EpochProgress
+                status={currentEpochData?.status as keyof typeof EPOCH_STATUS}
+              >{`${progress}%`}</EpochProgress>
+              <Status status={currentEpochData?.status as keyof typeof EPOCH_STATUS}>
+                {EPOCH_STATUS_MAPPING[EPOCH_STATUS[currentEpochData?.status]]}
+              </Status>
+            </ProgressCircle>
+          )}
         </Box>
       )
     },