From 4615ca9b8b1989d315ae2322556697b97161b97b Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Wed, 17 Sep 2025 19:08:58 +0900
Subject: feat(frontend): apply effect for high score

---
 frontend/app/components/Gaming/Score.tsx | 38 ++++++++++++++++++++++++++++++++
 1 file changed, 38 insertions(+)
 create mode 100644 frontend/app/components/Gaming/Score.tsx

(limited to 'frontend/app/components/Gaming/Score.tsx')

diff --git a/frontend/app/components/Gaming/Score.tsx b/frontend/app/components/Gaming/Score.tsx
new file mode 100644
index 0000000..9b6283f
--- /dev/null
+++ b/frontend/app/components/Gaming/Score.tsx
@@ -0,0 +1,38 @@
+import { useEffect, useState } from "react";
+
+type Props = {
+	status: string | null;
+	score: number | null;
+};
+
+export default function Score({ status, score }: Props) {
+	const [displayScore, setDisplayScore] = useState(score);
+
+	useEffect(() => {
+		let intervalId = null;
+
+		if (status === "running") {
+			intervalId = setInterval(() => {
+				const maxValue = Math.pow(10, String(score).length) - 1;
+				const minValue = Math.pow(10, String(score).length - 1);
+				const randomValue =
+					Math.floor(Math.random() * (maxValue - minValue + 1)) + minValue;
+				setDisplayScore(randomValue);
+			}, 50);
+		} else {
+			setDisplayScore(score);
+		}
+
+		return () => {
+			if (intervalId) {
+				clearInterval(intervalId);
+			}
+		};
+	}, [status, score]);
+
+	return (
+		<span className={status === "running" ? "animate-pulse" : ""}>
+			{displayScore}
+		</span>
+	);
+}
-- 
cgit v1.2.3-70-g09d2