From 0d8cc54c9939f86bb7e8a7f2eac8a5120cdfbbee Mon Sep 17 00:00:00 2001
From: catloversg <152669316+catloversg@users.noreply.github.com>
Date: Tue, 25 Jun 2024 10:37:57 +0700
Subject: [PATCH] INFILTRATION: Fix React warnings (#1423)

---
 src/Infiltration/ui/Countdown.tsx | 18 +++++++++++++-----
 src/Infiltration/ui/GameTimer.tsx | 11 ++++++++---
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/src/Infiltration/ui/Countdown.tsx b/src/Infiltration/ui/Countdown.tsx
index 00d068ba6..cb344b819 100644
--- a/src/Infiltration/ui/Countdown.tsx
+++ b/src/Infiltration/ui/Countdown.tsx
@@ -5,15 +5,23 @@ interface IProps {
   onFinish: () => void;
 }
 
-export function Countdown(props: IProps): React.ReactElement {
+export function Countdown({ onFinish }: IProps): React.ReactElement {
   const [x, setX] = useState(3);
+
   useEffect(() => {
     if (x === 0) {
-      props.onFinish();
-      return;
+      onFinish();
     }
-    setTimeout(() => setX(x - 1), 300);
-  });
+  }, [x, onFinish]);
+
+  useEffect(() => {
+    const id = setInterval(() => {
+      setX((previousValue) => previousValue - 1);
+    }, 300);
+    return () => {
+      clearInterval(id);
+    };
+  }, []);
 
   return (
     <Paper sx={{ p: 1, textAlign: "center" }}>
diff --git a/src/Infiltration/ui/GameTimer.tsx b/src/Infiltration/ui/GameTimer.tsx
index 5821cdddc..98e081894 100644
--- a/src/Infiltration/ui/GameTimer.tsx
+++ b/src/Infiltration/ui/GameTimer.tsx
@@ -23,10 +23,15 @@ export function GameTimer({
   const totalMillis =
     (!ignoreAugment_WKSharmonizer && Player.hasAugmentation(AugmentationName.WKSharmonizer, true) ? 1.3 : 1) * millis;
 
+  useEffect(() => {
+    if (v <= 0) {
+      onExpire();
+    }
+  }, [v, onExpire]);
+
   useEffect(() => {
     const intervalId = setInterval(() => {
       setV((old) => {
-        if (old <= 0) onExpire();
         return old - (tick / totalMillis) * 100;
       });
     }, tick);
@@ -40,10 +45,10 @@ export function GameTimer({
   // TODO(hydroflame): there's like a bug where it triggers the end before the
   // bar physically reaches the end
   return noPaper ? (
-    <ProgressBar variant="determinate" value={v} color="primary" />
+    <ProgressBar variant="determinate" value={Math.max(v, 0)} color="primary" />
   ) : (
     <Paper sx={{ p: 1, mb: 1 }}>
-      <ProgressBar variant="determinate" value={v} color="primary" />
+      <ProgressBar variant="determinate" value={Math.max(v, 0)} color="primary" />
     </Paper>
   );
 }