fix: result_imageの判定の変更、zstandのuseScoreStoreの変更

src/pages/result/index.tsx

@@ -7,14 +7,10 @@ type ResultProps = {
 };
 
 const Result = ({ score }: ResultProps) => {
-	const images = [
-		"/drink/bottle0.webp",
-		"/drink/bottle1.webp",
-		"/drink/bottle2.webp",
-		"/drink/bottle3.webp",
-	];
-
-	const image = images[score] || images[0];
+	const image =
+		score >= 0 && score <= 3
+			? `/drink/bottle${score}.webp`
+			: "/drink/bottle0.webp";
 
 	return (
 		<div>

src/pages/shooter/index.tsx

@@ -20,7 +20,7 @@ const Shooter = () => {
 	const uuid = useUUIDStore((state) => state.uuid);
 	const navigate = useNavigate();
 	const score = useScoreStore((state) => state.score);
-	const setScore = useScoreStore((state) => state.setScore);
+	const addOneScore = useScoreStore((state) => state.addOneScore);
 
 	const initialImages = [
 		"/2D_material/cork.webp",
@@ -42,10 +42,10 @@ const Shooter = () => {
 	useEffect(() => {
 		onMessage((data) => {
 			if (data.message_type === MessageType.Hit && data.id === uuid) {
-				setScore((prevScore: number) => prevScore + 1);
+				addOneScore();
 			}
 		});
-	}, [onMessage, uuid, setScore]);
+	}, [onMessage, uuid, addOneScore]);
 
 	useEffect(() => {
 		if (images.length === 0) {

src/store/useScoreStore.ts

@@ -2,10 +2,15 @@ import create from "zustand";
 
 type Store = {
 	score: number;
-	setScore: (updater: (prevScore: number) => number) => void;
 };
 
-export const useScoreStore = create<Store>((set) => ({
+type Action = {
+	setScore: (score: number) => void;
+	addOneScore: () => void;
+};
+
+export const useScoreStore = create<Store & Action>((set) => ({
 	score: 0,
-	setScore: (updater) => set((state) => ({ score: updater(state.score) })),
+	setScore: (score) => set(() => ({ score: score })),
+	addOneScore: () => set((state) => ({ score: state.score + 1 })),
 }));