import { useWordpressCustomData } from "../services/WordpressFetchData.js";
import { useState } from "react";

import { GameContextProvider } from "../context/GameContext.js";

import Menu from "../components/ui/Menu.jsx";
import GameContainer from "../components/game/GameContainer.jsx";

import Tutorial from "../components/game/Tutorial.jsx";
import Logo from "../components/ui/Logo.jsx";
import GameModal from "../components/game/GameModal.jsx";
import AnimatedPage from "../components/AnimatedPage.jsx";

export default function Game() {
	return (
		<>
			<AnimatedPage className='page-container page-container--play'>
				<GameContextProvider>
					<div className='screen'>
						<Logo />
						{/* <Menu /> */}
						<GameModal />
						<Tutorial />
						<GameContainer gameId={"latest"} />
					</div>
				</GameContextProvider>
			</AnimatedPage>
		</>
	);
}
