From d40ce98b28ffeb6378ee167d2cd33478f9209fe8 Mon Sep 17 00:00:00 2001
From: Gilles Lucien <gpeltier2@gmail.com>
Date: Wed, 27 Dec 2023 13:53:53 +0100
Subject: [PATCH] Refactor dataset property in script.js

---
 FrontEnd/script.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/FrontEnd/script.js b/FrontEnd/script.js
index 871321c..f93b357 100644
--- a/FrontEnd/script.js
+++ b/FrontEnd/script.js
@@ -10,7 +10,7 @@ async function getWorks() {
 
     works.forEach((workCard) => {
       const workElement = document.createElement("figure");
-      workElement.dataset.id = workCard.id;
+      workElement.dataset.id = workCard.categoryId;
 
       const imageElement = document.createElement("img");
       imageElement.src = workCard.imageUrl;
@@ -28,7 +28,7 @@ async function getWorks() {
   }
 }
 
-// async function to get the categories from the API
+// async function to get the categories filters from the API
 async function getCategories() {
   try {
     const response = await fetch("http://localhost:5678/api/categories");
@@ -70,6 +70,14 @@ function handleFilterClick(event) {
   const categoryId = event.target.dataset.id;
   console.log("Filter button clicked:", categoryId);
 
+  const works = document.querySelectorAll(".gallery figure");
+  works.forEach((work) => {
+    if (work.dataset.id !== categoryId) {
+      work.classList.add("hidden");
+    } else {
+      work.classList.remove("hidden");
+    }
+  });
 }
 
 getWorks();