From e9fffa36cee5a612ef112e0d256728bfcaa9b736 Mon Sep 17 00:00:00 2001
From: Mischa <mischa@gorinskat.nl>
Date: Sun, 21 Jun 2026 21:20:59 +0200
Subject: [PATCH] fix: update triage badge dynamically when tag changes

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../travel-memories/app/templates/phase2.html | 24 ++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/services/travel-memories/app/templates/phase2.html b/services/travel-memories/app/templates/phase2.html
index 867938d..28a08ad 100644
--- a/services/travel-memories/app/templates/phase2.html
+++ b/services/travel-memories/app/templates/phase2.html
@@ -114,7 +114,27 @@
 {% block extra_scripts %}
 <script src="https://cdn.jsdelivr.net/npm/hammerjs@2.0.8/hammer.min.js"></script>
 <script>
-// ── Desktop Alpine app (unchanged) ──────────────────────────────────────────
+// ── Shared badge helper ──────────────────────────────────────────────────────
+function updateBadge(cardEl, tag) {
+  let badge = cardEl.querySelector('.badge');
+  if (!badge) {
+    badge = document.createElement('div');
+    cardEl.appendChild(badge);
+  }
+  const MAP = {
+    journal: ['badge-xs badge-success', 'J'],
+    story:   ['badge-xs badge-info',    'S'],
+    skip:    ['badge-xs badge-ghost opacity-60', 'X'],
+  };
+  if (MAP[tag]) {
+    badge.className = `absolute top-1 right-1 badge ${MAP[tag][0]}`;
+    badge.textContent = MAP[tag][1];
+  } else {
+    badge.remove();
+  }
+}
+
+// ── Desktop Alpine app ───────────────────────────────────────────────────────
 function triageApp(albumId) {
   return {
     focused: null,
@@ -145,6 +165,7 @@ function triageApp(albumId) {
       } else {
         el.classList.add('border-base-300', 'opacity-40');
       }
+      updateBadge(el, tag);
       this.updateCount();
     },
 
@@ -168,6 +189,7 @@ function triageApp(albumId) {
           .filter(c => !c.startsWith('border-') && c !== 'opacity-40')
           .join(' ');
         el.classList.add('border-base-300', 'opacity-40');
+        updateBadge(el, 'skip');
       });
       this.updateCount();
     },