From cc87054246636183ae9db8007313efea1076d8aa Mon Sep 17 00:00:00 2001
From: Reckless_Satoshi <reckless.satoshi@protonmail.com>
Date: Tue, 29 Nov 2022 02:00:56 -0800
Subject: [PATCH] Add initial time fraction left on time progress

---
 .../OrderDetails/LinearDeterminate.tsx          | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/OrderDetails/LinearDeterminate.tsx b/frontend/src/components/OrderDetails/LinearDeterminate.tsx
index 9bed73c4..a0a8a30e 100644
--- a/frontend/src/components/OrderDetails/LinearDeterminate.tsx
+++ b/frontend/src/components/OrderDetails/LinearDeterminate.tsx
@@ -8,16 +8,21 @@ interface Props {
 }
 
 const LinearDeterminate = ({ expiresAt, totalSecsExp }: Props): JSX.Element => {
-  const [progress, setProgress] = useState<number>(100);
+  const timePercentLeft = function(){
+    if (expiresAt && totalSecsExp){
+      const lapseTime = calcTimeDelta(new Date(expiresAt)).total / 1000;
+      return (lapseTime / totalSecsExp) * 100;
+    } else {
+      return 100;
+    }
+  }
 
+  const [progress, setProgress] = useState<number>(timePercentLeft);
+  
   useEffect(() => {
     const timer = setInterval(() => {
-      const left = calcTimeDelta(new Date(expiresAt)).total / 1000;
-      const newProgress = (left / totalSecsExp) * 100;
-
-      setProgress(newProgress);
+      setProgress(timePercentLeft);
     }, 1000);
-
     return () => {
       clearInterval(timer);
     };