feat(frontend): do not transit to finished page

4 files changed, 18 insertions, 18 deletions

diff --git a/frontend/app/components/GolfPlayApp.tsx b/frontend/app/components/GolfPlayApp.tsx
index 7953bac..9ba3818 100644
--- a/frontend/app/components/GolfPlayApp.tsx
+++ b/frontend/app/components/GolfPlayApp.tsx
@@ -14,7 +14,6 @@ import {
 	setGameStartedAtAtom,
 	setLatestGameStateAtom,
 } from "../states/play";
-import GolfPlayAppFinished from "./GolfPlayApps/GolfPlayAppFinished";
 import GolfPlayAppGaming from "./GolfPlayApps/GolfPlayAppGaming";
 import GolfPlayAppLoading from "./GolfPlayApps/GolfPlayAppLoading";
 import GolfPlayAppStarting from "./GolfPlayApps/GolfPlayAppStarting";
@@ -130,7 +129,7 @@ export default function GolfPlayApp({ game, player, initialGameState }: Props) {
 		);
 	} else if (gameStateKind === "starting") {
 		return <GolfPlayAppStarting gameDisplayName={game.display_name} />;
-	} else if (gameStateKind === "gaming") {
+	} else if (gameStateKind === "gaming" || gameStateKind === "finished") {
 		return (
 			<GolfPlayAppGaming
 				gameDisplayName={game.display_name}
@@ -141,9 +140,8 @@ export default function GolfPlayApp({ game, player, initialGameState }: Props) {
 				initialCode={initialGameState.code}
 				onCodeChange={onCodeChange}
 				onCodeSubmit={onCodeSubmit}
+				isFinished={gameStateKind === "finished"}
 			/>
 		);
-	} else if (gameStateKind === "finished") {
-		return <GolfPlayAppFinished />;
 	}
 }
diff --git a/frontend/app/components/GolfPlayApps/GolfPlayAppFinished.tsx b/frontend/app/components/GolfPlayApps/GolfPlayAppFinished.tsx
deleted file mode 100644
index c218414..0000000
--- a/frontend/app/components/GolfPlayApps/GolfPlayAppFinished.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-export default function GolfPlayAppFinished() {
-	return (
-		<div className="min-h-screen bg-gray-100 flex items-center justify-center">
-			<div className="text-center">
-				<div className="text-6xl font-bold text-black">終了</div>
-			</div>
-		</div>
-	);
-}
diff --git a/frontend/app/components/GolfPlayApps/GolfPlayAppGaming.tsx b/frontend/app/components/GolfPlayApps/GolfPlayAppGaming.tsx
index b40f3c3..86b2379 100644
--- a/frontend/app/components/GolfPlayApps/GolfPlayAppGaming.tsx
+++ b/frontend/app/components/GolfPlayApps/GolfPlayAppGaming.tsx
@@ -26,6 +26,7 @@ type Props = {
 	initialCode: string;
 	onCodeChange: (code: string) => void;
 	onCodeSubmit: (code: string) => void;
+	isFinished: boolean;
 };
 
 export default function GolfPlayAppGaming({
@@ -37,6 +38,7 @@ export default function GolfPlayAppGaming({
 	initialCode,
 	onCodeChange,
 	onCodeSubmit,
+	isFinished,
 }: Props) {
 	const leftTimeSeconds = useAtomValue(gamingLeftTimeSecondsAtom)!;
 	const score = useAtomValue(scoreAtom);
@@ -47,11 +49,13 @@ export default function GolfPlayAppGaming({
 
 	const handleTextChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
 		setCodeSize(calcCodeSize(e.target.value));
-		onCodeChange(e.target.value);
+		if (!isFinished) {
+			onCodeChange(e.target.value);
+		}
 	};
 
 	const handleSubmitButtonClick = () => {
-		if (textareaRef.current) {
+		if (textareaRef.current && !isFinished) {
 			onCodeSubmit(textareaRef.current.value);
 		}
 	};
@@ -61,7 +65,11 @@ export default function GolfPlayAppGaming({
 			<div className="text-white bg-sky-600 flex flex-row justify-between px-4 py-2">
 				<div className="font-bold">
 					<div className="text-gray-100">{gameDisplayName}</div>
-					<LeftTime sec={leftTimeSeconds} />
+					{isFinished ? (
+						<div className="text-2xl md:text-3xl">終了</div>
+					) : (
+						<LeftTime sec={leftTimeSeconds} />
+					)}
 				</div>
 				<Link to={"/dashboard"}>
 					<div className="flex gap-6 items-center font-bold">
@@ -91,7 +99,10 @@ export default function GolfPlayAppGaming({
 							<div className="grow font-semibold text-lg">
 								コードサイズ: {codeSize}
 							</div>
-							<SubmitButton onClick={handleSubmitButtonClick}>
+							<SubmitButton
+								onClick={handleSubmitButtonClick}
+								disabled={isFinished}
+							>
 								提出
 							</SubmitButton>
 						</div>
diff --git a/frontend/app/components/SubmitButton.tsx b/frontend/app/components/SubmitButton.tsx
index 3c0d67c..2d5c9d1 100644
--- a/frontend/app/components/SubmitButton.tsx
+++ b/frontend/app/components/SubmitButton.tsx
@@ -6,7 +6,7 @@ export default function SubmitButton(props: ButtonProps) {
 	return (
 		<button
 			{...props}
-			className="text-lg text-white bg-sky-600 px-4 py-2 rounded-sm transition duration-300 hover:bg-sky-500 focus:ring-3 focus:ring-sky-400 focus:outline-hidden"
+			className="text-lg text-white px-4 py-2 bg-sky-600 disabled:bg-gray-400 disabled:cursor-not-allowed rounded-sm transition duration-300 hover:bg-sky-500 focus:ring-3 focus:ring-sky-400 focus:outline-hidden"
 		/>
 	);
 }