diff --git a/react-project/src/App.jsx b/react-project/src/App.jsx index fbc9043..31045bc 100644 --- a/react-project/src/App.jsx +++ b/react-project/src/App.jsx @@ -1,117 +1,18 @@ import Header from "./components/Header"; import Footer from "./components/Footer"; -import Carte from "./components/Carte"; -import BarreRecherche from "./components/BarreRecherche"; -import { useState, useEffect } from "react"; import { Routes, Route } from "react-router-dom"; -import { useParams } from "react-router-dom"; +import Accueil from "./pages/Accueil"; +import Detail from "./pages/Detail"; import "./App.css"; function App() { - const [recherche, setRecherche] = useState(""); - const [total, setTotal] = useState(0); - const [jeux, setJeux] = useState([]); - const [chargement, setChargement] = useState(true); - const [titre, setTitre] = useState(""); - const [annee, setAnnee] = useState(""); - const [plateforme, setPlateforme] = useState(""); - const [tri, setTri] = useState("titre"); - - function ajouter(e) { - e.preventDefault(); - if (titre.trim() === "") return; - const nouveau = { - id: Date.now(), - titre, - annee: Number(annee), - console, - Type: "3d", - }; - setJeux([...jeux, nouveau]); - setTitre(""); - setAnnee(""); - setPlateforme(""); - } - - const affiches = [...jeux] - .filter((j) => j.titre.toLowerCase().includes(recherche.toLowerCase())) - .sort((a, b) => { - if (tri === "titre") return a.titre.localeCompare(b.titre); - if (tri === "annee") return a.annee - b.annee; - return 0; - }); - - useEffect(() => { - fetch("/zelda.json") - .then((r) => r.json()) - .then((data) => { - setJeux(data); - document.title = `${data.length} jeux Zelda`; - setChargement(false); - }); - }, []); - - if (chargement) return

Chargement…

; - - function Detail() { - const { id } = useParams(); - return

Détails du jeu {id}

; - } - return ( <> +
} /> } /> - -
- - setRecherche(e.target.value)} - /> - - - {affiches.length === 0 &&

Aucun jeu trouvé 😕

} - - {affiches.map((jeu) => ( - setTotal((t) => t + 1)} - /> - ))} - -

Total de likes : {total}

- -
- setTitre(e.target.value)} - placeholder="Titre du jeu" - /> - setAnnee(e.target.value)} - placeholder="Année" - /> - setPlateforme(e.target.value)} - placeholder="Console" - /> - -
- -