fonction des etoiles

components/app.riot

@@ -39,7 +39,7 @@
                 <h3>Résultats ({searchs.pagination.items.total} résultats trouvés)</h3>
                 <div class="results-grid">
                     <div class="card" each="{item in searchs.items}">
-                        <a if={authUser}  onclick={() => addFavoris(item.id)}><i class={item.isFavorite ? "fa-solid fa-star" : "fa-regular fa-star"}></i></a>
+                        <a if={authUser}  onclick={() => item.isFavorite ? this.removeFavoris(item.id) : this.addFavoris(item.id)}><button><i class={item.isFavorite ? "fa-solid fa-star" : "fa-regular fa-star"}></i></button></a>
                         <a href={ "#/release-details/" + item.id}>
                             {item.title}
                             <img src="{item.cover_image} " alt="cover " />
@@ -105,6 +105,7 @@
 
             changePage(page) {
                 this.search(null, page);
+                this.update();
             },
 
             async onMounted() {
@@ -116,10 +117,26 @@
 
             addFavoris(id) {
                 window.favorite(id)
+                this.searchs.items = this.searchs.items.map(item =>
+                    item.id === id ? { ...item, isFavorite: true } : item
+                );
+
+                this.update();
+            },
+
+            async removeFavoris(id) {
+                await window.removeFavorite(id);
+
+                this.searchs.items = this.searchs.items.map(item =>
+                    item.id === id ? { ...item, isFavorite: false } : item
+                );
+
+                this.update();
             },
 
             Logout(){
                 window.logout()
+                this.update();
             }
         }
     </script>