diff --git a/app/components/ScreenRouter.tsx b/app/components/ScreenRouter.tsx new file mode 100644 index 0000000..8f17b29 --- /dev/null +++ b/app/components/ScreenRouter.tsx @@ -0,0 +1,104 @@ +"use client"; + +import { Dispatch, SetStateAction } from "react"; +import { Session } from "next-auth"; +import type { Screen } from "../../lib/types"; +import type { useSoloGame } from "../../lib/useSoloGame"; +import type { useMultiGame } from "../../lib/useMultiGame"; +import type { useGameHandlers } from "../../lib/useGameHandlers"; +import { fmt } from "../../lib/utils"; +import { HomeScreen } from "./HomeScreen"; +import { LobbyScreen } from "./LobbyScreen"; +import { SoloScreen } from "./SoloScreen"; +import { GameScreen } from "./GameScreen"; +import { AuthModal } from "./AuthModal"; +import { ProfileScreen } from "./ProfileScreen"; + +type Props = { + screen: Screen; + setScreen: Dispatch>; + session: Session | null; + solo: ReturnType; + multi: ReturnType; + handlers: ReturnType; + playerName: string; + setPlayerName: Dispatch>; + joinCode: string; + setJoinCode: Dispatch>; + error: string | null; + setError: Dispatch>; + loading: boolean; + showAuth: boolean; + setShowAuth: Dispatch>; +}; + +export function ScreenRouter({ + screen, setScreen, session, solo, multi, handlers, + playerName, setPlayerName, joinCode, setJoinCode, + error, setError, loading, showAuth, setShowAuth, +}: Props) { + if (screen === "profile") return ( + setScreen("home")} /> + ); + + if (screen === "home") return ( + <> + setShowAuth(true)} + onShowProfile={() => setScreen("profile")} + /> + {showAuth && setShowAuth(false)} onSuccess={() => setShowAuth(false)} />} + + ); + + if (screen === "solo") return ( + { solo.reset(); setScreen("home"); }} + onNewGame={solo.start} + onRetry={solo.retryLoad} + /> + ); + + if (screen === "lobby" && multi.room && multi.playerId) return ( + + ); + + if (screen === "game" && multi.room && multi.playerId) return ( + + ); + + return null; +} diff --git a/app/page.tsx b/app/page.tsx index 7c8047e..dbddbfe 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -5,14 +5,8 @@ import { useSoloGame } from "../lib/useSoloGame"; import { useMultiGame } from "../lib/useMultiGame"; import { useGameEffects } from "../lib/useGameEffects"; import { useGameHandlers } from "../lib/useGameHandlers"; -import { fmt } from "../lib/utils"; +import { ScreenRouter } from "./components/ScreenRouter"; import type { Screen } from "../lib/types"; -import { HomeScreen } from "./components/HomeScreen"; -import { LobbyScreen } from "./components/LobbyScreen"; -import { SoloScreen } from "./components/SoloScreen"; -import { GameScreen } from "./components/GameScreen"; -import { AuthModal } from "./components/AuthModal"; -import { ProfileScreen } from "./components/ProfileScreen"; export default function WikiRush() { const [screen, setScreen] = useState("home"); @@ -28,68 +22,14 @@ export default function WikiRush() { const { session } = useGameEffects({ solo, multi, screen, setScreen, setPlayerName }); const handlers = useGameHandlers({ solo, multi, playerName, joinCode, setScreen, setError, setLoading }); - if (screen === "profile") return ( - setScreen("home")} /> - ); - - if (screen === "home") return ( - <> - setShowAuth(true)} - onShowProfile={() => setScreen("profile")} - /> - {showAuth && setShowAuth(false)} onSuccess={() => setShowAuth(false)} />} - - ); - - if (screen === "solo") return ( - { solo.reset(); setScreen("home"); }} - onNewGame={solo.start} - onRetry={solo.retryLoad} - /> - ); - - if (screen === "lobby" && multi.room && multi.playerId) return ( - ); - - if (screen === "game" && multi.room && multi.playerId) return ( - - ); - - return null; }