Merge pull request #231 from HandTris/bishoe-iconfix

[🐛 FIX] 빌드 타입에러 수정
HandTris · Jul 19, 2024 · 0519df8 · 0519df8
2 parents bb8e1cc + 812a3e0
commit 0519df8
Showing 1 changed file with 22 additions and 16 deletions.
diff --git a/handtris/src/components/TetrisPlay.tsx b/handtris/src/components/TetrisPlay.tsx
@@ -922,25 +922,31 @@ const Home: React.FC = () => {
   });
 
   useEffect(() => {
-    let timeoutId;
-    if (
-      !tetrisGameRef.current?.isDonutAttackToggleOn &&
-      tetrisGameRef.current?.linesCleared > 0
-    ) {
-      setAnimationState({ opacity: 0, y: -500 });
-
-      // Change the image after 1 second if `isDonutAttackToggleOn` is false
-      timeoutId = setTimeout(() => {
+    let timeoutId: NodeJS.Timeout | undefined;
+
+    if (tetrisGameRef.current) {
+      const { isDonutAttackToggleOn, linesCleared } = tetrisGameRef.current;
+
+      if (!isDonutAttackToggleOn && linesCleared > 0) {
+        setAnimationState({ opacity: 0, y: -500 });
+
+        timeoutId = setTimeout(() => {
+          setAnimationState({ opacity: 1, y: 0 });
+          setDonutAttackToggle("/image/DropDefault.png");
+        }, 1000);
+      } else if (linesCleared > 0) {
         setAnimationState({ opacity: 1, y: 0 });
-        setDonutAttackToggle("/image/DropDefault.png");
-      }, 1000);
-    } else if (tetrisGameRef.current?.linesCleared > 0) {
-      setAnimationState({ opacity: 1, y: 0 });
-      setDonutAttackToggle("/image/DropPressed.png");
+        setDonutAttackToggle("/image/DropPressed.png");
+      }
     }
 
-    return () => clearTimeout(timeoutId);
-  }, [tetrisGameRef.current?.isDonutAttackToggleOn]);
+    return () => {
+      if (timeoutId) clearTimeout(timeoutId);
+    };
+  }, [
+    tetrisGameRef.current?.isDonutAttackToggleOn,
+    tetrisGameRef.current?.linesCleared,
+  ]);
 
   const toggleShowFirstAttack = useCallback(() => {
     setShowFirstAttack(true);