diff --git a/react-project/public/zelda.json b/react-project/public/zelda.json index 91a61b4..1e9c6a8 100644 --- a/react-project/public/zelda.json +++ b/react-project/public/zelda.json @@ -2,7 +2,7 @@ { "id": "1", "titre": "Oracle of ages", - "console": "Game Boy Color", + "plateforme": "Game Boy Color", "annee": "2001", "Type": "2d", "like": 0 @@ -10,7 +10,7 @@ { "id": "2", "titre": "Breath of the Wild", - "console": "Switch", + "plateforme": "Switch", "annee": "2017", "Type": "3d", "like": 0 @@ -18,7 +18,7 @@ { "id": "3", "titre": "Majora's Mask", - "console": "N64", + "plateforme": "N64", "annee": "2000", "Type": "3d", "like": 0 @@ -26,7 +26,7 @@ { "id": "4", "titre": "Tears of the kingdom", - "console": "Switch", + "plateforme": "Switch", "annee": "2023", "Type": "3d", "like": 0 @@ -34,7 +34,7 @@ { "id": "5", "titre": "Echoes of Wisdom", - "console": "Switch", + "plateforme": "Switch", "annee": "2024", "Type": "3d", "like": 0 diff --git a/react-project/src/App.jsx b/react-project/src/App.jsx index b81b466..224f60c 100644 --- a/react-project/src/App.jsx +++ b/react-project/src/App.jsx @@ -7,17 +7,28 @@ import Detail from "./pages/Detail"; import "./App.css"; function App() { - const [jeux, setJeux] = useState([]); + const [jeux, setJeux] = useState(() => { + const stocke = localStorage.getItem("jeux"); + return stocke ? JSON.parse(stocke) : null; + }); const [likes, setLikes] = useState(() => JSON.parse(localStorage.getItem("likes") || "{}"), ); useEffect(() => { - fetch("/zelda.json") - .then((r) => r.json()) - .then(setJeux); + if (jeux === null) { + fetch("/zelda.json") + .then((r) => r.json()) + .then(setJeux); + } }, []); + useEffect(() => { + if (jeux !== null) { + localStorage.setItem("jeux", JSON.stringify(jeux)); + } + }, [jeux]); + useEffect(() => { localStorage.setItem("likes", JSON.stringify(likes)); }, [likes]); @@ -25,6 +36,9 @@ function App() { function liker(id) { setLikes((prev) => ({ ...prev, [id]: (prev[id] || 0) + 1 })); } + + if (jeux === null) return
Chargement…
; + return ( <>
- {props.console} - {props.annee} -
+ +
>