From ccdc75c74c58c43faecd177d656aea1c7decac1e Mon Sep 17 00:00:00 2001
From: "thomas.kopp" <thomas.kopp@tueit.de>
Date: Wed, 1 Apr 2026 14:40:01 +0200
Subject: [PATCH] feat: show date and time in transcript list items

---
 frontend/app.js     | 7 ++++++-
 frontend/index.html | 1 +
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/app.js b/frontend/app.js
index 7ed80e7..d80a868 100644
--- a/frontend/app.js
+++ b/frontend/app.js
@@ -121,6 +121,11 @@ async function loadTranscripts() {
       const div = document.createElement('div');
       div.className = 'transcript-item';
 
+      const dateMatch = t.filename.match(/^(\d{4}-\d{2}-\d{2})-(\d{2})(\d{2})-/);
+      const dateEl = document.createElement('span');
+      dateEl.className = 'meta item-date';
+      dateEl.textContent = dateMatch ? `${dateMatch[1]} ${dateMatch[2]}:${dateMatch[3]}` : '';
+
       const name = document.createElement('span');
       name.className = 'name';
       name.textContent = t.filename.replace(/\.md$/, '').replace(/^\d{4}-\d{2}-\d{2}-\d{4}-/, '');
@@ -159,7 +164,7 @@ async function loadTranscripts() {
       const actions = document.createElement('div');
       actions.className = 'item-actions';
       actions.append(reprocessBtn, delBtn);
-      div.append(name, meta, actions);
+      div.append(dateEl, name, meta, actions);
       return div;
     })
   );
diff --git a/frontend/index.html b/frontend/index.html
index ee5bdb8..46d1615 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -118,6 +118,7 @@
     .transcript-item:hover { border-color: var(--red); }
     .transcript-item .name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
     .transcript-item .meta { color: var(--muted); font-size: 0.75rem; flex-shrink: 0; }
+    .item-date { font-size: 0.75rem; color: var(--muted); flex-shrink: 0; font-variant-numeric: tabular-nums; }
     .item-actions { display: flex; gap: 2px; flex-shrink: 0; }
     .modal { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; }
     .modal.hidden { display: none; }