delete list

.env

@@ -0,0 +1,11 @@
+PORT=3010
+
+NODE_ENV=development
+
+SESSION_SECRET=MijnSuperGeheimeSleutel123!
+
+DATABASE=database.sqlite
+
+OPENAI_API_KEY=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
+
+OPENAI_MODEL=gpt-5.4-mini

.gitignore

@@ -1,6 +1,4 @@
 node_modules/
-.env
-database.sqlite
 database.sqlite-shm
 database.sqlite-wal
 tmp-delete-test.sqlite

controllers/ShoppingListController.js

@@ -72,6 +72,17 @@ class ShoppingListController {
         res.json({ success: true });
     }
 
+    deleteList(req, res) {
+        const list = ShoppingListRepository.findById(req.params.id, req.user.household_id);
+        if (!list) return res.status(404).json({ error: "Lijst niet gevonden" });
+
+        const result = ShoppingListRepository.deleteList(list.id);
+        if (result.changes === 0) return res.status(404).json({ error: "Lijst niet gevonden" });
+
+        this.broadcastUpdate(req, list.id);
+        res.json({ success: true });
+    }
+
     broadcastUpdate(req, listId) {
         if (req.app.locals.io) {
             req.app.locals.io.to(`list:${listId}`).emit("list:updated", { listId });

repositories/ShoppingListRepository.js

@@ -77,6 +77,14 @@ class ShoppingListRepository {
             DELETE FROM shopping_list_items WHERE id = ? AND list_id = ?
         `).run(itemId, listId);
     }
+
+    deleteList(listId) {
+        db.prepare(`
+            DELETE FROM shopping_list_items WHERE list_id = ?
+        `).run(listId);
+        return db.prepare(`DELETE FROM shopping_lists WHERE id = ?
+        `).run(listId);
+    }
 }
 
 module.exports = new ShoppingListRepository();

routes/web.js

@@ -179,4 +179,11 @@ router.delete(
     ShoppingListController.deleteItem.bind(ShoppingListController)
 );
 
+router.delete(
+    "/lists/:id",
+    auth,
+    ShoppingListController.deleteList.bind(ShoppingListController)
+);
+
+
 module.exports = router;

views/lists/index.ejs

@@ -4,27 +4,45 @@
 
 <div class="row">
     <div class="col-md-8">
-        <div class="card">
+        
-            <div class="card-body">
+<div class="card">
-                <% if (lists.length === 0) { %>
+    <div class="card-body">
-                    <p class="text-secondary">Je hebt nog geen boodschappenlijsten.</p>
+        <% if (lists.length === 0) { %>
-                <% } else { %>
+            <p class="text-secondary">Je hebt nog geen boodschappenlijsten.</p>
-                    <div class="list-group">
+        <% } else { %>
-                        <% lists.forEach(list => { %>
+            <div class="list-group">
-                            <a href="/lists/<%= list.id %>" class="list-group-item list-group-item-action">
+                <% lists.forEach(list => { %>
-                                <div class="d-flex justify-content-between">
+                    <div class="list-group-item d-flex justify-content-between align-items-center">
-                                    <strong><%= list.name %></strong>
+                        
-                                    <span><%= list.checked_count || 0 %>/<%= list.item_count || 0 %> gedaan</span>
+                        <!-- Link + info -->
-                                </div>
+                        <a href="/lists/<%= list.id %>" class="flex-grow-1 text-decoration-none">
-                                <small class="text-muted">
+                            <div class="d-flex justify-content-between">
-                                    Aangemaakt <%= new Date(list.created_at).toLocaleDateString("nl-NL") %>
+                                <strong><%= list.name %></strong>
-                                </small>
+                                <span><%= list.checked_count || 0 %>/<%= list.item_count || 0 %> gedaan</span>
-                            </a>
+                            </div>
-                        <% }); %>
+                            <small class="text-muted">
+                                Aangemaakt <%= new Date(list.created_at).toLocaleDateString("nl-NL") %>
+                            </small>
+                        </a>
+
+                        <!-- Delete button -->
+                        <button class="btn btn-sm btn-danger ms-3 delete-list-button"
+                                type="button"
+                                data-list-id="<%= list.id %>"
+                                aria-label="Lijst <%= list.name %> verwijderen">
+                            🗑️
+                        </button>
+
                     </div>
-                <% } %>
+                <% }); %>
             </div>
-        </div>
+        <% } %>
+    </div>
+</div>
+
+
+
+
     </div>
     <div class="col-md-4">
         <div class="card">
@@ -40,3 +58,34 @@
         </div>
     </div>
 </div>
+
+<script>
+    document.querySelectorAll(".delete-list-button").forEach((button) => {
+        button.addEventListener("click", async () => {
+            const listId = button.dataset.listId;
+            const listName = button.closest(".list-group-item")?.querySelector("strong")?.textContent?.trim() || "deze lijst";
+
+            if (!confirm(`"${listName}" verwijderen?`)) return;
+
+            const response = await fetch(`/lists/${listId}`, {
+                method: "DELETE",
+                headers: { Accept: "application/json" }
+            });
+
+            if (response.ok) {
+                window.location.reload();
+                return;
+            }
+
+            let message = "Lijst kon niet worden verwijderd.";
+            try {
+                const data = await response.json();
+                if (data.error) message = data.error;
+            } catch (_) {
+                // ignore json parse errors
+            }
+
+            alert(message);
+        });
+    });
+</script>