fix: init target status

src/components/Gallery/index.tsx

@@ -1,16 +1,12 @@
 import { useNavigate } from "react-router-dom";
-import { useRoomIdStore, useTargetStatusStore } from "../../store";
+import { useRoomIdStore } from "../../store";
 import styles from "./index.module.css";
 
 function Gallery() {
 	const navigate = useNavigate();
 	const updateUUID = useRoomIdStore((state) => state.updateUUID);
-	const resetTargetStatus = useTargetStatusStore(
-		(state) => state.resetTargetStatus,
-	);
 
 	const handleClick = () => {
-		resetTargetStatus();
 		updateUUID();
 		navigate("/");
 	};

src/pages/yatai/index.tsx

@@ -1,9 +1,20 @@
+import { useEffect } from "react";
 import Gallery from "../../components/Gallery";
 import { TargetOverlay } from "../../components/Yatai/TargetOverlay";
 import { YataiStage } from "../../components/Yatai/YataiStage";
+import { useTargetStatusStore } from "../../store";
 import styles from "./index.module.css";
 
 function Yatai() {
+	const resetTargetStatus = useTargetStatusStore(
+		(state) => state.resetTargetStatus,
+	);
+
+	// init target status
+	useEffect(() => {
+		resetTargetStatus();
+	}, [resetTargetStatus]);
+
 	return (
 		<div className={styles.container}>
 			<YataiStage />