import React from "react";

import Menu from "../components/ui/Menu";
import AnimatedPage from "../components/AnimatedPage";
import { useUser } from "../hooks/useUser";
import { useLocation } from "react-router-dom";
import ResultsModals from "../components/results/ResultsModals";

export default function Results() {
	const { language, screenTranslations } = useUser();
	// if (!screenTranslations) return <p>loading</p>;

	let location = useLocation();
	const { contextGameDatas } = location.state;

	return (
		<AnimatedPage className='page-container page-container--results'>
			<div
				className='screen '
				style={{ backgroundImage: `url("${contextGameDatas.gameBlockDatas.attrs.coverUrl}")` }}>
				<Menu />
				<ResultsModals resultsDatas={location.state} />
				{/* <div id='screen-container'></div> */}
			</div>
		</AnimatedPage>
	);
}
