Favorieten toegevoegd aan de navigatiebalk en sidebar.

views/favorites/index.ejs

@@ -0,0 +1,26 @@
+<div class="page-header mb-4">
+    <h1>💙 Favorieten</h1>
+</div>
+
+<div class="card">
+    <div class="card-body">
+        <% if (favorites.length === 0) { %>
+            <p class="text-secondary">Je hebt nog geen favoriete producten.</p>
+        <% } else { %>
+            <div class="list-group">
+                <% favorites.forEach(product => { %>
+                    <div class="list-group-item d-flex justify-content-between align-items-center gap-3">
+                        <div>
+                            <strong><%= product.category_icon || "" %> <%= product.name %></strong>
+                            <div class="text-secondary"><%= product.category_name || "Geen categorie" %></div>
+                        </div>
+
+                        <form method="post" action="/favorites/<%= product.id %>/delete">
+                            <button class="btn btn-sm btn-outline-danger" type="submit">Verwijder</button>
+                        </form>
+                    </div>
+                <% }); %>
+            </div>
+        <% } %>
+    </div>
+</div>

views/lists/show.ejs

@@ -2,10 +2,20 @@
     <a href="/lists" class="btn btn-outline-secondary mb-3">&larr; Terug naar lijsten</a>
     <div class="d-flex flex-wrap align-items-center justify-content-between gap-3">
         <h1 class="mb-0"><%= list.name %></h1>
-        <form method="post" action="/lists/<%= list.id %>/items/reset"
-              onsubmit="return confirm('Alle producten weer openzetten?');">
-            <button class="btn btn-outline-primary" type="submit">Alles weer openzetten</button>
-        </form>
+        <div class="d-flex flex-wrap gap-2">
+            <form method="post" action="/lists/<%= list.id %>/favorites/add"
+                  onsubmit="return confirm('Alle favorieten toevoegen aan deze lijst?');">
+                <button class="btn btn-outline-primary" type="submit">Alle favorieten toevoegen</button>
+            </form>
+            <form method="post" action="/lists/<%= list.id %>/items/reset"
+                  onsubmit="return confirm('Alle producten weer openzetten?');">
+                <button class="btn btn-outline-primary" type="submit">Alles weer openzetten</button>
+            </form>
+            <form method="post" action="/lists/<%= list.id %>/items/clear"
+                  onsubmit="return confirm('Weet je zeker dat je alle producten uit deze lijst wilt verwijderen?');">
+                <button class="btn btn-outline-danger" type="submit">Alles verwijderen</button>
+            </form>
+        </div>
     </div>
 </div>
 

views/partials/navbar.ejs

@@ -27,6 +27,7 @@
         <a class="nav-link" href="/">Dashboard</a>
         <a class="nav-link" href="/lists">Lijsten</a>
         <a class="nav-link" href="/products">Producten</a>
+        <a class="nav-link" href="/favorites">Favorieten</a>
         <a class="nav-link" href="/categories">Categorieën</a>
         <a class="nav-link" href="/household">Huishouden</a>
         <a class="nav-link text-danger" href="/logout">Uitloggen</a>

views/partials/sidebar.ejs

@@ -26,6 +26,12 @@
 
 </a>
 
+<a class="nav-link" href="/favorites">
+
+💙 Favorieten
+
+</a>
+
 
 <a class="nav-link" href="/household">
 

views/products/edit.ejs

@@ -32,7 +32,7 @@
                     <button class="btn btn-primary" type="submit" form="product-edit-<%= product.id %>">Wijzigingen opslaan</button>
                     <form method="post" action="/products/<%= product.id %>/delete"
                           onsubmit="return confirm('Weet je zeker dat je dit product wilt verwijderen?');">
-                        <button class="btn btn-outline-danger" type="submit">Product verwijderen</button>
+                        <button class="btn btn-light border text-danger" type="submit">Product verwijderen</button>
                     </form>
                     <a class="btn btn-link" href="/products">Annuleren</a>
                 </div>

views/products/index.ejs

@@ -23,9 +23,18 @@
                                         <strong><%= product.category_icon || "" %> <%= product.name %></strong>
                                         <div class="text-secondary"><%= product.category_name || "Geen categorie" %></div>
                                     </div>
-                                    <a class="btn btn-sm btn-outline-primary" href="/products/<%= product.id %>/edit">
-                                        Wijzigen
-                                    </a>
+                                    <div class="d-flex align-items-center gap-2">
+                                        <form method="post" action="/products/<%= product.id %>/favorite">
+                                            <button class="btn btn-sm <%= product.is_favorite ? 'btn-danger' : 'btn-outline-secondary' %>"
+                                                    type="submit"
+                                                    aria-label="<%= product.is_favorite ? 'Verwijder uit favorieten' : 'Toevoegen aan favorieten' %>">
+                                                <%= product.is_favorite ? '♥' : '♡' %>
+                                            </button>
+                                        </form>
+                                        <a class="btn btn-sm btn-outline-primary" href="/products/<%= product.id %>/edit">
+                                            Wijzigen
+                                        </a>
+                                    </div>
                                 </div>
                             </div>
                         <% }); %>