I would like to show a Favorite Art Pieces list using hooks, the array is actually created in favs, but I don't know how to connect to favorites using setFavorites . Here is my code simplified:
import artData from "../data/data.json";
function App() {
const [favorites, setFavorites] = useState([""]);
let favs = [];
const updateFav = (ev) => {
const selectedArt = parseInt(ev.currentTarget.id);
const objectClicked = artData.find((art) => {
return art.id === selectedArt;
});
const favFounded = favs.findIndex((fav) => {
return fav.id === selectedArt;
});
if (favFounded === -1) {
favs.push(objectClicked);
} else {
favs.splice(favFounded, 1);
}
console.log(favs);
//setFavorites(favs);
};
return (
<>
<button className="fav" id={art.id} onClick={updateFav}>
<h2 className="fav__title"> here are your favorites list..</h2>
<ul className="fav__list">
<li className="fav__list--element">
//the idea here is to map my favorites list once I can fix the problem
</li>
</ul>
</>
);
Thanks,