Applicatie afmaken en GUI-flow herstellen

Voegt boodschappenlijsten, productbeheer, realtime synchronisatie en browsercache-updates toe. Herstelt login- en sessiegedrag en maakt database-seeding herhaalbaar.\n\nCo-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

public/js/app.js

@@ -0,0 +1,11 @@
+(() => {
+    const socket = window.io && window.io();
+    if (!socket) return;
+
+    const listMatch = window.location.pathname.match(/^\/lists\/(\d+)$/);
+    if (listMatch) socket.emit("list:join", listMatch[1]);
+
+    socket.on("list:updated", ({ listId }) => {
+        if (window.location.pathname === `/lists/${listId}`) window.location.reload();
+    });
+})();

public/service-worker.js

@@ -0,0 +1,43 @@
+const CACHE_NAME = "pantryhub-static-v3";
+
+self.addEventListener("install", () => {
+    self.skipWaiting();
+});
+
+self.addEventListener("activate", (event) => {
+    event.waitUntil(
+        caches.keys().then((keys) =>
+            Promise.all(
+                keys
+                    .filter((key) => key !== CACHE_NAME)
+                    .map((key) => caches.delete(key))
+            )
+        ).then(() => self.clients.claim())
+    );
+});
+
+self.addEventListener("fetch", (event) => {
+    if (event.request.method !== "GET") return;
+
+    const url = new URL(event.request.url);
+    if (url.origin !== self.location.origin) return;
+
+    // Authenticated HTML and API responses must never be served from stale cache.
+    if (event.request.mode === "navigate" || url.pathname.startsWith("/api/")) {
+        event.respondWith(fetch(event.request));
+        return;
+    }
+
+    event.respondWith(
+        caches.match(event.request).then((cached) => {
+            if (cached) return cached;
+            return fetch(event.request).then((response) => {
+                if (response.ok && response.type === "basic") {
+                    const copy = response.clone();
+                    caches.open(CACHE_NAME).then((cache) => cache.put(event.request, copy));
+                }
+                return response;
+            });
+        })
+    );
+});