From 893823fa1d90c863b3b669cead07fba78b944c91 Mon Sep 17 00:00:00 2001
From: truetype <max.mauri@gmail.com>
Date: Wed, 1 Jul 2026 11:25:51 +0200
Subject: [PATCH] feat(ui): cronaca azioni nella sidebar

- Turn log mostra ultime 10 azioni con turno, azione e risultato
- Dati inclusi nello stato WS via ctx.log
- Ordinati dal piu recente
---
 src/web/server.py         |  1 +
 src/web/static/index.html | 37 +++++++++++++++++++++++++++++++++++++
 2 files changed, 38 insertions(+)

diff --git a/src/web/server.py b/src/web/server.py
index 8284e3c..714d4e2 100644
--- a/src/web/server.py
+++ b/src/web/server.py
@@ -260,6 +260,7 @@ def _build_state(campaign_id: int) -> dict:
         "areas": enriched,
         "current_area_id": ctx.current_area_id,
         "current_area_name": ctx.current_area_name,
+        "log": ctx.log,
     }
 
 
diff --git a/src/web/static/index.html b/src/web/static/index.html
index d632ba1..8213591 100644
--- a/src/web/static/index.html
+++ b/src/web/static/index.html
@@ -291,6 +291,23 @@ html, body {
   line-height: 1.4;
 }
 
+/* Turn log */
+#log-display {
+  max-height: 200px;
+  overflow-y: auto;
+  scrollbar-width: thin;
+  font-size: 12px;
+}
+.log-entry {
+  padding: 4px 0;
+  border-bottom: 1px solid var(--border);
+  line-height: 1.3;
+}
+.log-entry:last-child { border-bottom: none; padding-bottom: 0; }
+.log-turn { color: var(--gold-dim); font-weight: 700; font-size: 10px; }
+.log-action { color: var(--text-primary); }
+.log-result { color: var(--text-muted); font-size: 11px; }
+
 .area-item.visited { color: var(--text-secondary); }
 .area-item.current {
   color: var(--gold-bright);
@@ -861,6 +878,10 @@ html, body {
       <div id="area-preview-desc"></div>
       <div id="area-preview-atmo" style="font-size:12px;color:var(--text-muted);font-style:italic;margin-top:4px;"></div>
     </div>
+    <div class="sidebar-section" id="log-section">
+      <h2>Cronaca</h2>
+      <div id="log-display"><div class="empty-state">Nessuna azione</div></div>
+    </div>
     <div class="sidebar-section" id="area-section">
       <h2>Aree</h2>
       <div id="area-display"><div class="empty-state">Nessuna area</div></div>
@@ -1100,6 +1121,7 @@ function applyState(s) {
   renderQuests(s.quests);
   renderAreas(s.areas);
   renderAreaPreview(s.areas, s.current_area_id);
+  renderLog(s.log);
 }
 
 // ================================================================
@@ -1182,6 +1204,21 @@ function renderAreaPreview(areas, currentId) {
   }
 }
 
+function renderLog(log) {
+  const container = document.getElementById('log-display');
+  if (!log || log.length === 0) {
+    container.innerHTML = '<div class="empty-state">Nessuna azione</div>';
+    return;
+  }
+  container.innerHTML = [...log].reverse().slice(0, 10).map(e => `
+    <div class="log-entry">
+      <div class="log-turn">Turno ${e.turn}</div>
+      <div class="log-action">${escapeHtml(e.action? e.action.slice(0, 80) : '?')}</div>
+      <div class="log-result">${escapeHtml(e.result? e.result.slice(0, 60) : '')}</div>
+    </div>
+  `).join('');
+}
+
 async function replaceFunnelDead() {
   const resp = await fetch(`${BASE}/api/campaign/${campaignId}/character`, { method: 'POST' });
   const data = await resp.json();