dialog: Wortmeldungs-Zähler am „→ Dialog"-Link + Live via Polling (10s)

- Artikel-Link zeigt „→ Dialog · N" wenn Wortmeldungen existieren
- Widget lädt alle 10s nach, rendert nur bei Änderung neu (kein Flackern),
  pausiert im Hintergrund-Tab. Echtes Supabase-Realtime bleibt optional.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

layouts/_default/single.html

@@ -64,7 +64,16 @@
     {{- end }}
 
     {{/* Dialog liegt auf eigener Seite — der Beitrag bleibt sauber */}}
-    <a class="dialog-link" href="/dialog/?thread={{ .RelPermalink }}">→ Dialog</a>
+    <a class="dialog-link" id="dialog-link" data-thread="{{ .RelPermalink }}" href="/dialog/?thread={{ .RelPermalink }}">→ Dialog</a>
+    <script>
+      (function () {
+        var l = document.getElementById('dialog-link'); if (!l) return;
+        fetch('/api/comments?thread=' + encodeURIComponent(l.dataset.thread))
+          .then(function (r) { return r.ok ? r.json() : []; })
+          .then(function (d) { var n = d.filter(function (c) { return !c.deleted; }).length; if (n) l.textContent = '→ Dialog · ' + n; })
+          .catch(function () {});
+      })();
+    </script>
   </article>
 
 {{ end }}

static/dialog.js

@@ -49,13 +49,16 @@
     return d.toLocaleDateString('de-CH');
   }
 
+  let lastSig = '';
   async function load() {
     let data = [];
     try {
       const res = await fetch('/api/comments?thread=' + encodeURIComponent(thread));
       if (res.ok) data = await res.json();
-    } catch { /* offline */ }
+    } catch { return; /* offline: alte Ansicht behalten */ }
-    render(data);
+    // Nur neu rendern, wenn sich wirklich etwas geändert hat (kein Flackern).
+    const sig = (token ? 'in:' : 'out:') + data.map((c) => c.id + (c.deleted ? 'd' : '')).join(',');
+    if (sig !== lastSig) { lastSig = sig; render(data); }
   }
 
   function render(data) {
@@ -161,4 +164,6 @@
 
   renderComposer();
   load();
+  // Live genug: alle 10 s nachladen (pausiert, wenn der Tab im Hintergrund ist).
+  setInterval(() => { if (!document.hidden) load(); }, 10000);
 })();