web: show execution id and agent type on running task cards

Each running task card now shows a meta row with the assigned agent
type (e.g. "claude" or "gemini") and the short execution ID, which is
filled in asynchronously once the execution record is fetched.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

1 files changed, 19 insertions, 0 deletions

diff --git a/web/app.js b/web/app.js
index 95fce38..7ac64dc 100644
--- a/web/app.js
+++ b/web/app.js
@@ -1659,6 +1659,18 @@ function renderRunningView(tasks) {
         .catch(() => { parentEl.textContent = ''; });
     }
 
+    // Meta row: agent type + execution ID (exec ID filled in async)
+    const metaRow = document.createElement('div');
+    metaRow.className = 'task-meta running-exec-meta';
+    const agentType = (task.agent && task.agent.type) ? task.agent.type : 'claude';
+    const agentSpan = document.createElement('span');
+    agentSpan.textContent = `Agent: ${agentType}`;
+    const execIdSpan = document.createElement('span');
+    execIdSpan.className = 'execution-id running-exec-id';
+    execIdSpan.textContent = 'exec: …';
+    metaRow.append(agentSpan, execIdSpan);
+    card.appendChild(metaRow);
+
     // Log area
     const logArea = document.createElement('div');
     logArea.className = 'running-log';
@@ -1694,6 +1706,13 @@ function startRunningLogStream(taskId, logArea) {
       if (!execs || execs.length === 0) return;
       const execId = execs[0].id;
 
+      // Update the exec ID shown in the running card.
+      const card = document.querySelector(`[data-task-id="${taskId}"]`);
+      if (card) {
+        const execIdEl = card.querySelector('.running-exec-id');
+        if (execIdEl) execIdEl.textContent = `exec: ${execId.slice(0, 8)}`;
+      }
+
       let userScrolled = false;
       logArea.addEventListener('scroll', () => {
         const nearBottom = logArea.scrollHeight - logArea.scrollTop - logArea.clientHeight < 50;