clementine-agent 1.18.78 → 1.18.80

package/dist/cli/dashboard.js

@@ -15119,6 +15119,49 @@ if('serviceWorker' in navigator){navigator.serviceWorker.getRegistrations().then
   /* ── Recent history row hover (Tasks page bottom zone) ── */
   .history-row { transition: background 0.12s ease; }
   .history-row:hover { background: var(--bg-hover); }
+  /* PRD Phase 1.2: "Run task once" running-state pulse on the Last run tab. */
+  @keyframes pulse {
+    0%, 100% { opacity: 0.4; transform: scale(0.85); }
+    50% { opacity: 1; transform: scale(1); }
+  }
+  /* PRD Phase 1.3a: inner config-tab strip — switches which Configure
+     section blocks are visible without changing the outer Configure /
+     What-will-run / Last-run tabs. Visual: pill chips along the top of
+     the Configure pane. */
+  .cron-config-tabs {
+    display: flex;
+    gap: 4px;
+    margin: 0 0 14px;
+    border-bottom: 1px solid var(--border);
+    padding-bottom: 0;
+  }
+  .cron-config-tab-btn {
+    background: none;
+    border: none;
+    color: var(--text-muted);
+    font-size: 12px;
+    font-weight: 500;
+    padding: 8px 12px;
+    cursor: pointer;
+    border-bottom: 2px solid transparent;
+    transition: color 0.15s, border-color 0.15s;
+    margin-bottom: -1px;
+  }
+  .cron-config-tab-btn:hover { color: var(--text-primary); }
+  .cron-config-tab-btn.active {
+    color: var(--accent);
+    border-bottom-color: var(--accent);
+  }
+  /* Sections are tagged with data-config-tab; the active tab attr on the
+     Configure pane controls visibility. .force-show overrides for power-user
+     "show everything" later. */
+  #cron-tab-configure[data-active-config-tab="basics"]   [data-config-tab]:not([data-config-tab="basics"]),
+  #cron-tab-configure[data-active-config-tab="prompt"]   [data-config-tab]:not([data-config-tab="prompt"]),
+  #cron-tab-configure[data-active-config-tab="tools"]    [data-config-tab]:not([data-config-tab="tools"]),
+  #cron-tab-configure[data-active-config-tab="scope"]    [data-config-tab]:not([data-config-tab="scope"]),
+  #cron-tab-configure[data-active-config-tab="limits"]   [data-config-tab]:not([data-config-tab="limits"]) {
+    display: none;
+  }
   /* ── Trick capability strip (skills + MCP + tools at a glance) ─── */
   .task-cap-strip {
     border-top: 1px solid var(--border-light);
@@ -19903,15 +19946,28 @@ if('serviceWorker' in navigator){navigator.serviceWorker.getRegistrations().then
     <div class="cron-tabs" role="tablist">
       <button type="button" class="cron-tab-btn active" data-cron-tab="configure" onclick="switchCronTab('configure')">Configure</button>
       <button type="button" class="cron-tab-btn" id="cron-tab-btn-preview" data-cron-tab="preview" onclick="switchCronTab('preview')" title="See exactly what the agent will receive at fire-time">What will run</button>
+      <button type="button" class="cron-tab-btn" id="cron-tab-btn-lastrun" data-cron-tab="lastrun" onclick="switchCronTab('lastrun')" title="Watch the most recent run — click Run task once to fire it now">Last run</button>
     </div>
     <div class="modal-body">
       <!-- ── Tab: Configure ─────────────────────────────────────────── -->
-      <div class="cron-tab-pane active" id="cron-tab-configure">
+      <!-- PRD §5.1 right-inspector pattern lives here as inner tabs (1.3a).
+           data-active-config-tab controls which section blocks render via
+           CSS — no JS show/hide needed beyond setting the attribute. -->
+      <div class="cron-tab-pane active" id="cron-tab-configure" data-active-config-tab="basics">
         <!-- Legacy / mismatch banner (populated by openEditCronModal) -->
         <div id="cron-legacy-banner-host"></div>
 
+        <!-- Inner tab strip — pill nav swapping which section blocks show -->
+        <div class="cron-config-tabs" role="tablist">
+          <button type="button" class="cron-config-tab-btn active" data-config-tab-btn="basics" onclick="switchCronConfigTab('basics')">Basics</button>
+          <button type="button" class="cron-config-tab-btn" data-config-tab-btn="prompt" onclick="switchCronConfigTab('prompt')">Prompt</button>
+          <button type="button" class="cron-config-tab-btn" data-config-tab-btn="tools" onclick="switchCronConfigTab('tools')">Tools &amp; MCP</button>
+          <button type="button" class="cron-config-tab-btn" data-config-tab-btn="scope" onclick="switchCronConfigTab('scope')">Scope</button>
+          <button type="button" class="cron-config-tab-btn" data-config-tab-btn="limits" onclick="switchCronConfigTab('limits')">Limits</button>
+        </div>
+
         <!-- Identity: name + category + tags -->
-        <div class="cron-section-card">
+        <div class="cron-section-card" data-config-tab="basics">
           <h4>Identity</h4>
           <p class="cron-section-desc">A unique name and optional grouping for the dashboard.</p>
           <div class="form-group">
@@ -19927,7 +19983,7 @@ if('serviceWorker' in navigator){navigator.serviceWorker.getRegistrations().then
         </div>
 
         <!-- Schedule -->
-        <div class="cron-section-card">
+        <div class="cron-section-card" data-config-tab="basics">
           <h4>Schedule</h4>
           <p class="cron-section-desc">When this task fires. Pick a frequency or write a cron expression.</p>
           <div class="form-group" style="margin:0">
@@ -20016,7 +20072,7 @@ if('serviceWorker' in navigator){navigator.serviceWorker.getRegistrations().then
         </div>
 
         <!-- What it does: prompt + context + reference files -->
-        <div class="cron-section-card">
+        <div class="cron-section-card" data-config-tab="prompt">
           <h4>What it does</h4>
           <p class="cron-section-desc">The instruction the agent receives. Long prompts are fine — drag the corner to resize.</p>
           <div class="form-group">
@@ -20044,7 +20100,7 @@ if('serviceWorker' in navigator){navigator.serviceWorker.getRegistrations().then
              The single most important new field set. Without one of these, a
              run "finished"; with one, a run "accomplished what it was meant
              to". Banner warns (does not block) when neither is set. -->
-        <div class="cron-section-card">
+        <div class="cron-section-card" data-config-tab="prompt">
           <h4>Goal <span style="color:var(--text-muted);font-weight:normal;font-size:12px">— how do you know this task succeeded?</span></h4>
           <p class="cron-section-desc">Optional but strongly recommended. Use plain English (an evaluator agent grades the run) or a JSON Schema (validated against the agent's structured output).</p>
           <div id="cron-goal-warning" style="display:none;margin-bottom:12px;padding:10px 12px;border-radius:6px;background:rgba(245,158,11,0.10);border:1px solid rgba(245,158,11,0.30);color:var(--yellow);font-size:12px">
@@ -20067,7 +20123,7 @@ if('serviceWorker' in navigator){navigator.serviceWorker.getRegistrations().then
         </div>
 
         <!-- Skills & tools: pinned skills + MCP + tools + tags -->
-        <div class="cron-section-card">
+        <div class="cron-section-card" data-config-tab="tools">
           <h4>Skills &amp; tools</h4>
           <p class="cron-section-desc">Pin the skills and tools this task should use. Switch to the <strong>What will run</strong> tab to see exactly what the agent receives.</p>
 
@@ -20118,85 +20174,90 @@ if('serviceWorker' in navigator){navigator.serviceWorker.getRegistrations().then
           </div>
         </div>
 
-        <!-- Advanced: tier + workdir + mode + max-hours + retries + after -->
-        <details class="cron-section-card" style="padding:0">
-          <summary style="padding:14px 16px;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between">
-            <span><strong style="font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.6px">Advanced</strong> <span style="color:var(--text-muted);font-size:11px;margin-left:6px">tier, mode, retries, project context</span></span>
-            <span style="color:var(--text-muted);font-size:11px">▾</span>
-          </summary>
-          <div style="padding:0 16px 14px">
-            <div class="form-row">
-              <div class="form-group">
-                <label class="form-label">Tier</label>
-                <select id="cron-tier">
-                  <option value="1">Tier 1 — Read-only (vault, search, web)</option>
-                  <option value="2">Tier 2 — Read + Write (Bash, files, sub-agents)</option>
-                  <option value="3">Tier 3 — Full access (use with caution)</option>
-                </select>
-              </div>
-              <div class="form-group">
-                <label class="form-label">Project Context <span style="color:var(--text-muted);font-weight:normal">(optional)</span></label>
-                <select id="cron-workdir">
-                  <option value="">None — runs in default context</option>
-                </select>
-                <div class="form-hint">Run inside a project directory. Agent gets that project's CLAUDE.md.</div>
-              </div>
+        <!-- ── Scope: where the task can read/write ── -->
+        <div class="cron-section-card" data-config-tab="scope">
+          <h4>Scope</h4>
+          <p class="cron-section-desc">Where the agent runs and what files it can read.</p>
+          <div class="form-row">
+            <div class="form-group">
+              <label class="form-label">Project Context <span style="color:var(--text-muted);font-weight:normal">(optional)</span></label>
+              <select id="cron-workdir">
+                <option value="">None — runs in default context</option>
+              </select>
+              <div class="form-hint">Run inside a project directory. Agent gets that project's CLAUDE.md.</div>
             </div>
-            <!-- PRD Phase 1: read scope beyond cwd. One absolute path per line. -->
-            <div class="form-row">
-              <div class="form-group" style="flex:1">
-                <label class="form-label">Additional read directories <span style="color:var(--text-muted);font-weight:normal">(optional)</span></label>
-                <textarea id="cron-add-dirs" rows="2" placeholder="/Users/me/notes&#10;/Users/me/clients/acme" style="font-family:'JetBrains Mono',monospace;font-size:11px"></textarea>
-                <div class="form-hint">One absolute path per line. The agent gets read access to these in addition to the Project Context cwd.</div>
-              </div>
+          </div>
+          <!-- PRD Phase 1: read scope beyond cwd. One absolute path per line. -->
+          <div class="form-row">
+            <div class="form-group" style="flex:1">
+              <label class="form-label">Additional read directories <span style="color:var(--text-muted);font-weight:normal">(optional)</span></label>
+              <textarea id="cron-add-dirs" rows="2" placeholder="/Users/me/notes&#10;/Users/me/clients/acme" style="font-family:'JetBrains Mono',monospace;font-size:11px"></textarea>
+              <div class="form-hint">One absolute path per line. The agent gets read access to these in addition to the Project Context cwd.</div>
             </div>
-            <div class="form-row">
-              <div class="form-group">
-                <label class="form-label">Mode</label>
-                <select id="cron-mode" onchange="toggleUnleashedOptions()">
-                  <option value="standard">Standard</option>
-                  <option value="unleashed">Unleashed (long-running)</option>
-                </select>
-                <div class="form-hint">Unleashed runs in phases with checkpointing for hour-scale tasks.</div>
-              </div>
-              <div class="form-group" id="cron-maxhours-group" style="display:none">
-                <label class="form-label">Max Hours</label>
-                <select id="cron-maxhours">
-                  <option value="1">1 hour</option>
-                  <option value="2">2 hours</option>
-                  <option value="4">4 hours</option>
-                  <option value="6" selected>6 hours (default)</option>
-                  <option value="8">8 hours</option>
-                  <option value="12">12 hours</option>
-                  <option value="24">24 hours</option>
-                </select>
-              </div>
+          </div>
+        </div>
+
+        <!-- ── Limits: budgets, mode, retries, chain triggers ── -->
+        <div class="cron-section-card" data-config-tab="limits">
+          <h4>Limits</h4>
+          <p class="cron-section-desc">Permission level, runtime mode, and retry/chain rules.</p>
+          <div class="form-row">
+            <div class="form-group">
+              <label class="form-label">Tier</label>
+              <select id="cron-tier">
+                <option value="1">Tier 1 — Read-only (vault, search, web)</option>
+                <option value="2">Tier 2 — Read + Write (Bash, files, sub-agents)</option>
+                <option value="3">Tier 3 — Full access (use with caution)</option>
+              </select>
+              <div class="form-hint">Permission level. Higher tiers can do more but require trust.</div>
             </div>
-            <div class="form-row">
-              <div class="form-group">
-                <label class="form-label">Max Retries <span style="color:var(--text-muted);font-weight:normal">(optional)</span></label>
-                <select id="cron-max-retries">
-                  <option value="">Auto (based on error history)</option>
-                  <option value="0">0 — No retries</option>
-                  <option value="1">1</option>
-                  <option value="2">2</option>
-                  <option value="3">3</option>
-                  <option value="5">5</option>
-                </select>
-                <div class="form-hint">Override automatic retry count for transient errors.</div>
-              </div>
-              <div class="form-group">
-                <label class="form-label">After Job <span style="color:var(--text-muted);font-weight:normal">(chain)</span></label>
-                <select id="cron-after">
-                  <option value="">None — runs on schedule</option>
-                </select>
-                <div class="form-hint">Trigger after another job succeeds (ignores schedule).</div>
-              </div>
+            <div class="form-group">
+              <label class="form-label">Mode</label>
+              <select id="cron-mode" onchange="toggleUnleashedOptions()">
+                <option value="standard">Standard</option>
+                <option value="unleashed">Unleashed (long-running)</option>
+              </select>
+              <div class="form-hint">Unleashed runs in phases with checkpointing for hour-scale tasks.</div>
             </div>
           </div>
-        </details>
+          <div class="form-row">
+            <div class="form-group" id="cron-maxhours-group" style="display:none">
+              <label class="form-label">Max Hours</label>
+              <select id="cron-maxhours">
+                <option value="1">1 hour</option>
+                <option value="2">2 hours</option>
+                <option value="4">4 hours</option>
+                <option value="6" selected>6 hours (default)</option>
+                <option value="8">8 hours</option>
+                <option value="12">12 hours</option>
+                <option value="24">24 hours</option>
+              </select>
+            </div>
+            <div class="form-group">
+              <label class="form-label">Max Retries <span style="color:var(--text-muted);font-weight:normal">(optional)</span></label>
+              <select id="cron-max-retries">
+                <option value="">Auto (based on error history)</option>
+                <option value="0">0 — No retries</option>
+                <option value="1">1</option>
+                <option value="2">2</option>
+                <option value="3">3</option>
+                <option value="5">5</option>
+              </select>
+              <div class="form-hint">Override automatic retry count for transient errors.</div>
+            </div>
+          </div>
+          <div class="form-row">
+            <div class="form-group">
+              <label class="form-label">After Job <span style="color:var(--text-muted);font-weight:normal">(chain)</span></label>
+              <select id="cron-after">
+                <option value="">None — runs on schedule</option>
+              </select>
+              <div class="form-hint">Trigger after another job succeeds (ignores schedule).</div>
+            </div>
+          </div>
+        </div>
 
-        <!-- Training Chat -->
+        <!-- Training Chat — visible across all config tabs (it's a tool, not a field group) -->
         <div class="form-group" id="cron-training-section" style="display:none">
           <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:8px">
             <label class="form-label" style="margin:0">Training Chat</label>
@@ -20222,10 +20283,23 @@ if('serviceWorker' in navigator){navigator.serviceWorker.getRegistrations().then
           </div>
         </div>
       </div><!-- /cron-tab-preview -->
+
+      <!-- ── Tab: Last run ── PRD Phase 1.2: "Run task once" inline output. -->
+      <div class="cron-tab-pane" id="cron-tab-lastrun">
+        <div id="cron-lastrun-body" style="padding:0">
+          <div style="padding:36px 24px;color:var(--text-muted);text-align:center;font-size:13px">
+            Save the task first, then click <strong>Run task once</strong> to fire it now and watch the result here.
+          </div>
+        </div>
+      </div><!-- /cron-tab-lastrun -->
     </div>
     <div class="modal-footer">
       <div style="display:flex;align-items:center;gap:8px;flex:1">
         <button class="btn btn-sm" id="cron-train-btn" onclick="showCronTraining()" style="font-size:11px;display:none">Train with Agent</button>
+        <!-- PRD §5.1 header bullet: "Run task once" green button. Visible only
+             when editing a saved task (set by openEditCronModal). Disabled
+             during an in-flight run. -->
+        <button class="btn btn-sm btn-success" id="cron-run-once-btn" onclick="runCronOnceFromModal()" style="display:none;font-size:12px;padding:6px 14px">▶ Run task once</button>
       </div>
       <button onclick="closeCronModal()">Cancel</button>
       <button class="btn-primary" id="cron-modal-save" onclick="saveCronJob()">Create Task</button>
@@ -24750,8 +24824,10 @@ function switchCronTab(tab) {
   });
   var configurePane = document.getElementById('cron-tab-configure');
   var previewPane = document.getElementById('cron-tab-preview');
+  var lastRunPane = document.getElementById('cron-tab-lastrun');
   if (configurePane) configurePane.classList.toggle('active', tab === 'configure');
   if (previewPane) previewPane.classList.toggle('active', tab === 'preview');
+  if (lastRunPane) lastRunPane.classList.toggle('active', tab === 'lastrun');
   if (tab === 'preview') {
     var name = editingCronJob;
     if (!name) {
@@ -24760,6 +24836,10 @@ function switchCronTab(tab) {
       return;
     }
     if (_cronPreviewLoadedFor !== name) loadCronPreviewIntoTab(name);
+  } else if (tab === 'lastrun') {
+    // Re-render in case run-state changed since the modal opened.
+    var jobLR = (typeof cronJobsData !== 'undefined' ? cronJobsData : []).find(function(j) { return j.name === editingCronJob; });
+    if (jobLR) renderCronLastRunPane(jobLR);
   }
 }
 
@@ -24784,6 +24864,181 @@ async function loadCronPreviewIntoTab(jobName) {
 // Mark the preview as stale (call after save so next tab visit refetches).
 function markCronPreviewDirty() { _cronPreviewLoadedFor = null; }
 
+// PRD Phase 1.3a: inner Configure pane tabs. Sets the data-active-config-tab
+// attribute on #cron-tab-configure; CSS handles section visibility via
+// data-config-tab attributes on each section. JS-light by design.
+function switchCronConfigTab(tab) {
+  var pane = document.getElementById('cron-tab-configure');
+  if (!pane) return;
+  pane.setAttribute('data-active-config-tab', tab);
+  document.querySelectorAll('.cron-config-tab-btn').forEach(function(b) {
+    b.classList.toggle('active', b.getAttribute('data-config-tab-btn') === tab);
+  });
+}
+
+// ── PRD Phase 1.2: "Run task once" — inline run + Last run tab ───────────
+// Tracks an in-flight run triggered FROM the modal so the SSE listeners
+// know when a cron_complete event belongs to "the run I just kicked off"
+// vs a scheduled tick that fired in the background. Cleared when the run
+// completes or the modal closes.
+var _cronRunOnceInFlight = null;     // { jobName: string, startedAt: number }
+var _cronRunOnceTickerId = null;     // setInterval id for the elapsed counter
+
+// Render the Last run pane from the job's most-recent JSONL entry. Called
+// when the modal opens for a saved task and when switchCronTab('lastrun')
+// reactivates the pane.
+function renderCronLastRunPane(job) {
+  var pane = document.getElementById('cron-lastrun-body');
+  if (!pane) return;
+  // If we have an in-flight run, render the running state regardless of
+  // what's on disk — the on-disk lastRun is from BEFORE this fire.
+  if (_cronRunOnceInFlight && _cronRunOnceInFlight.jobName === (job && job.name)) {
+    pane.innerHTML = renderCronRunningState(_cronRunOnceInFlight.startedAt);
+    return;
+  }
+  var lr = job && job.lastRun;
+  if (!lr) {
+    pane.innerHTML = '<div style="padding:36px 24px;color:var(--text-muted);text-align:center;font-size:13px">No runs yet. Click <strong>Run task once</strong> below to fire it now and watch the result here.</div>';
+    return;
+  }
+  pane.innerHTML = renderCronRunDetails(lr);
+}
+
+function renderCronRunningState(startedAtMs) {
+  var elapsed = Math.max(0, Math.round((Date.now() - startedAtMs) / 1000));
+  return ''
+    + '<div style="padding:36px 24px;text-align:center">'
+    +   '<div class="run-once-pulse" style="font-size:14px;color:var(--accent);font-weight:500;margin-bottom:8px">'
+    +     '<span class="pulse-dot" style="display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:6px;animation:pulse 1.4s ease-in-out infinite"></span>'
+    +     'Running…'
+    +   '</div>'
+    +   '<div style="font-size:12px;color:var(--text-muted)">Elapsed: <span id="cron-run-once-elapsed">' + elapsed + 's</span></div>'
+    +   '<div style="font-size:11px;color:var(--text-muted);margin-top:14px">Live output streaming will land here when the run completes.</div>'
+    + '</div>';
+}
+
+function renderCronRunDetails(lr) {
+  var ok = lr.status === 'ok';
+  var statusColor = ok ? 'var(--green)' : (lr.status === 'error' ? 'var(--red)' : 'var(--yellow)');
+  var statusIcon = ok ? '✓' : (lr.status === 'error' ? '✗' : '⏱');
+  var dur = lr.durationMs != null ? formatDurationMs(lr.durationMs) : '—';
+  var when = lr.finishedAt || lr.startedAt;
+  var whenLabel = when ? new Date(when).toLocaleString() : '—';
+  var html = ''
+    + '<div style="padding:24px">'
+    +   '<div style="display:flex;align-items:baseline;gap:10px;margin-bottom:14px">'
+    +     '<span style="color:' + statusColor + ';font-size:18px">' + statusIcon + '</span>'
+    +     '<span style="font-size:14px;font-weight:600;color:var(--text-primary);text-transform:capitalize">' + esc(lr.status || 'unknown') + '</span>'
+    +     '<span style="flex:1"></span>'
+    +     '<span style="font-size:12px;color:var(--text-muted)">' + esc(whenLabel) + ' · ' + esc(dur) + (lr.attempt && lr.attempt > 1 ? ' · attempt ' + esc(lr.attempt) : '') + '</span>'
+    +   '</div>';
+  if (lr.goalCheck) {
+    var gc = lr.goalCheck;
+    var gIcon = gc.status === 'pass' ? '🎯' : gc.status === 'fail' ? '✗' : '⚠';
+    var gColor = gc.status === 'pass' ? 'var(--green)' : gc.status === 'fail' ? 'var(--red)' : 'var(--yellow)';
+    var gLabel = gc.status === 'pass' ? 'Goal met' : gc.status === 'fail' ? 'Goal NOT met' : 'Goal evaluation failed';
+    var gReason = gc.evaluatorReason || (Array.isArray(gc.schemaErrors) ? gc.schemaErrors.join('; ') : '');
+    html += '<div style="padding:10px 14px;border-radius:6px;background:rgba(255,255,255,0.04);border-left:3px solid ' + gColor + ';margin-bottom:14px">'
+      +    '<div style="font-size:13px;font-weight:500;color:' + gColor + '">' + gIcon + ' ' + gLabel + '</div>'
+      +    (gReason ? '<div style="font-size:12px;color:var(--text-secondary);margin-top:4px">' + esc(gReason) + '</div>' : '')
+      +  '</div>';
+  }
+  if (lr.error) {
+    html += '<div style="margin-bottom:14px"><div style="font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.04em;margin-bottom:6px">Error</div>'
+      +    '<div style="font-family:\\x27JetBrains Mono\\x27,monospace;font-size:11px;color:var(--red);background:rgba(239,68,68,0.06);border:1px solid rgba(239,68,68,0.2);padding:10px;border-radius:6px;white-space:pre-wrap;word-break:break-word">'
+      +    esc(String(lr.error).slice(0, 2000)) + '</div></div>';
+  }
+  if (lr.outputPreview) {
+    html += '<div style="margin-bottom:14px"><div style="font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.04em;margin-bottom:6px">Output preview</div>'
+      +    '<div style="font-size:12px;color:var(--text-primary);background:var(--bg-secondary);border:1px solid var(--border);padding:10px;border-radius:6px;white-space:pre-wrap;word-break:break-word;max-height:300px;overflow-y:auto">'
+      +    esc(String(lr.outputPreview).slice(0, 4000)) + '</div></div>';
+  }
+  if (Array.isArray(lr.skillsApplied) && lr.skillsApplied.length) {
+    html += '<div style="font-size:11px;color:var(--text-muted);margin-bottom:6px">Skills active: ' + esc(lr.skillsApplied.map(function(s){ return s.name; }).join(', ')) + '</div>';
+  }
+  if (Array.isArray(lr.mcpServersApplied) && lr.mcpServersApplied.length) {
+    html += '<div style="font-size:11px;color:var(--text-muted);margin-bottom:6px">MCP servers: ' + esc(lr.mcpServersApplied.join(', ')) + '</div>';
+  }
+  html += '<div style="margin-top:14px;display:flex;gap:8px"><button class="btn-sm" onclick="openTraceViewer(\\x27' + jsStr(lr.jobName || editingCronJob || '') + '\\x27)" style="font-size:11px">Open trace</button></div>';
+  html += '</div>';
+  return html;
+}
+
+// Click handler for the green "Run task once" button. Triggers the existing
+// /api/cron/run/:job endpoint and switches to the Last run tab so the user
+// sees the running state. The SSE handler at the bottom of this file picks
+// up cron_complete and re-renders the pane with the result.
+async function runCronOnceFromModal() {
+  if (!editingCronJob) {
+    toast('Save the task first, then Run task once.', 'error');
+    return;
+  }
+  if (_cronRunOnceInFlight) {
+    toast('Already running — wait for the current run to finish.', 'info');
+    return;
+  }
+  if (isCronModalDirty()) {
+    if (!confirm('You have unsaved changes. Run the SAVED version (your edits stay in the form)?')) return;
+  }
+  var btn = document.getElementById('cron-run-once-btn');
+  if (btn) { btn.disabled = true; btn.textContent = 'Triggering…'; }
+  _cronRunOnceInFlight = { jobName: editingCronJob, startedAt: Date.now() };
+  // Show the running state and switch the pane immediately.
+  switchCronTab('lastrun');
+  var pane = document.getElementById('cron-lastrun-body');
+  if (pane) pane.innerHTML = renderCronRunningState(_cronRunOnceInFlight.startedAt);
+  // Tick the elapsed counter once a second.
+  if (_cronRunOnceTickerId) clearInterval(_cronRunOnceTickerId);
+  _cronRunOnceTickerId = setInterval(function() {
+    if (!_cronRunOnceInFlight) { clearInterval(_cronRunOnceTickerId); _cronRunOnceTickerId = null; return; }
+    var elapsedEl = document.getElementById('cron-run-once-elapsed');
+    if (elapsedEl) {
+      var s = Math.max(0, Math.round((Date.now() - _cronRunOnceInFlight.startedAt) / 1000));
+      elapsedEl.textContent = s + 's';
+    }
+  }, 1000);
+  try {
+    var r = await apiFetch('/api/cron/run/' + encodeURIComponent(editingCronJob), { method: 'POST' });
+    var d = await r.json();
+    if (!r.ok || d.ok === false) {
+      toast(d.error || 'Run failed to start', 'error');
+      _cronRunOnceInFlight = null;
+      if (_cronRunOnceTickerId) { clearInterval(_cronRunOnceTickerId); _cronRunOnceTickerId = null; }
+      if (pane) pane.innerHTML = '<div style="padding:36px 24px;color:var(--red);text-align:center;font-size:13px">' + esc(d.error || 'Run failed to start') + '</div>';
+    }
+  } catch (e) {
+    toast('Run failed to start: ' + String(e), 'error');
+    _cronRunOnceInFlight = null;
+    if (_cronRunOnceTickerId) { clearInterval(_cronRunOnceTickerId); _cronRunOnceTickerId = null; }
+  } finally {
+    if (btn) { btn.disabled = false; btn.textContent = '▶ Run task once'; }
+  }
+}
+
+// Called from the SSE handler when cron_complete fires. The same SSE handler
+// also schedules refreshCron() which updates cronJobsData with the fresh
+// lastRun. We just wait a beat for that, then re-render the pane.
+function handleCronRunOnceComplete(jobName) {
+  if (!_cronRunOnceInFlight || _cronRunOnceInFlight.jobName !== jobName) return;
+  if (_cronRunOnceTickerId) { clearInterval(_cronRunOnceTickerId); _cronRunOnceTickerId = null; }
+  _cronRunOnceInFlight = null;
+  // refreshCron is racing with us; give it ~600ms to land the new entry
+  // into cronJobsData before we read. The SSE handler at line 34927 already
+  // kicks it off when this event arrives.
+  setTimeout(function() {
+    var pane = document.getElementById('cron-lastrun-body');
+    if (!pane) return;
+    var fresh = (Array.isArray(cronJobsData) ? cronJobsData : []).find(function(j) { return j.name === jobName; });
+    var lr = fresh && fresh.lastRun;
+    if (lr) {
+      pane.innerHTML = renderCronRunDetails(lr);
+      toast('Run finished — ' + (lr.status === 'ok' ? 'success' : lr.status), lr.status === 'ok' ? 'success' : 'error');
+    } else {
+      pane.innerHTML = '<div style="padding:36px 24px;color:var(--text-muted);text-align:center;font-size:13px">Run finished but the result is still propagating. Refresh the dashboard to see it.</div>';
+    }
+  }, 600);
+}
+
 // ── Predictable mode: visual card sync + legacy banner ───────────
 function onPredictableChange() {
   var predEl = document.getElementById('cron-predictable');
@@ -24899,12 +25154,18 @@ function openCreateCronModal(agentSlug) {
   // No saved state to preview when creating — disable the Preview tab.
   var previewBtn = document.getElementById('cron-tab-btn-preview');
   if (previewBtn) previewBtn.setAttribute('disabled', 'disabled');
+  // Last run + Run-task-once button only make sense for saved tasks.
+  var lastRunBtn = document.getElementById('cron-tab-btn-lastrun');
+  if (lastRunBtn) lastRunBtn.setAttribute('disabled', 'disabled');
+  var runOnceBtn = document.getElementById('cron-run-once-btn');
+  if (runOnceBtn) runOnceBtn.style.display = 'none';
   var host = document.getElementById('cron-legacy-banner-host');
   if (host) host.innerHTML = '';
   // Reset the "Use a cron expression" link in case it was hidden last time.
   var schedLink = document.getElementById('sched-cron-link');
   if (schedLink) schedLink.style.display = '';
   switchCronTab('configure');
+  switchCronConfigTab('basics');  // PRD 1.3a: always start on Basics for new tasks
   onPredictableChange();
   document.getElementById('cron-modal').classList.add('show');
   // Snapshot AFTER all defaults are populated so an immediate close with no
@@ -24990,10 +25251,20 @@ function openEditCronModal(jobName) {
   renderTagsPickerChips();
   _pendingAttachments = [];
   loadCronAttachments(jobName);
-  // Existing job has saved state, enable Preview tab.
+  // Existing job has saved state, enable Preview + Last run tabs.
   var previewBtn = document.getElementById('cron-tab-btn-preview');
   if (previewBtn) previewBtn.removeAttribute('disabled');
+  var lastRunBtnEdit = document.getElementById('cron-tab-btn-lastrun');
+  if (lastRunBtnEdit) lastRunBtnEdit.removeAttribute('disabled');
+  // Show "Run task once" only for saved tasks.
+  var runOnceBtnEdit = document.getElementById('cron-run-once-btn');
+  if (runOnceBtnEdit) runOnceBtnEdit.style.display = '';
+  // Render the most recent run from the loaded job into the Last run tab so
+  // the user sees something the moment they switch to it (rather than a
+  // dead empty pane). The pane updates live when Run task once fires.
+  renderCronLastRunPane(job);
   switchCronTab('configure');
+  switchCronConfigTab('basics');  // PRD 1.3a: always start on Basics
   document.getElementById('cron-modal').classList.add('show');
   setTimeout(captureCronModalSnapshot, 0);
 }
@@ -25200,6 +25471,10 @@ function closeCronModal(force) {
   editingCronJob = null;
   _cronPreviewLoadedFor = null;
   _cronModalSnapshot = null;
+  // Clear any pending Run-task-once watch so SSE events for a different job
+  // don't accidentally re-render the (now closed) Last run pane.
+  if (_cronRunOnceTickerId) { clearInterval(_cronRunOnceTickerId); _cronRunOnceTickerId = null; }
+  _cronRunOnceInFlight = null;
   var attachList = document.getElementById('cron-attachments-list');
   if (attachList) attachList.innerHTML = '';
   var bannerHost = document.getElementById('cron-legacy-banner-host');
@@ -25336,26 +25611,34 @@ async function saveCronJob() {
   // Field-specific validation. Toasting one message per problem is more
   // actionable than the old "Please fill in all fields" — and we bail before
   // hitting the API so the user sees the issue without a round-trip.
-  if (!name) { toast('Task name is required', 'error'); document.getElementById('cron-name').focus(); return; }
+  // Helper: focus a field on a possibly-hidden inner config tab. Switches
+  // to the tab that owns the field first so the user sees the cursor land.
+  function focusOnConfigTab(fieldId, configTab) {
+    if (typeof switchCronConfigTab === 'function') switchCronConfigTab(configTab);
+    var el = document.getElementById(fieldId);
+    if (el) el.focus();
+  }
+  if (!name) { toast('Task name is required', 'error'); focusOnConfigTab('cron-name', 'basics'); return; }
   if (!/^[a-z][a-z0-9-]{0,63}$/.test(name)) {
     toast('Task name must start with a lowercase letter and contain only a–z, 0–9, and hyphens (max 64 chars)', 'error');
-    document.getElementById('cron-name').focus();
+    focusOnConfigTab('cron-name', 'basics');
     return;
   }
   if (!editingCronJob && Array.isArray(cronJobsData)) {
     var dup = cronJobsData.find(function(j) { return String(j.name || '').toLowerCase() === name.toLowerCase(); });
-    if (dup) { toast('A task named "' + name + '" already exists', 'error'); document.getElementById('cron-name').focus(); return; }
+    if (dup) { toast('A task named "' + name + '" already exists', 'error'); focusOnConfigTab('cron-name', 'basics'); return; }
   }
-  if (!schedule) { toast('Schedule is required', 'error'); return; }
+  if (!schedule) { toast('Schedule is required', 'error'); switchCronConfigTab('basics'); return; }
   // Light client-side cron sanity check — server uses real cron-parser.
   // Catches obvious garbage like "foo bar" without making a round-trip.
   // Note: the hyphen sits at the END of the character class to avoid being
   // interpreted as a range. \\\\s in source → \\s in served JS → \s in regex.
   if (!/^([0-9*/, -]+|@(yearly|annually|monthly|weekly|daily|hourly|reboot))$/i.test(schedule) && schedule.split(/\\s+/).length < 5) {
     toast('Schedule does not look like a valid cron expression', 'error');
+    switchCronConfigTab('basics');
     return;
   }
-  if (!prompt) { toast('Prompt is required — tell the agent what to do', 'error'); document.getElementById('cron-prompt').focus(); return; }
+  if (!prompt) { toast('Prompt is required — tell the agent what to do', 'error'); focusOnConfigTab('cron-prompt', 'prompt'); return; }
 
   // PRD Phase 1 goal fields. successCriteriaText is freeform; successSchema
   // is parsed JSON. Validate JSON early so the user gets a clean error before
@@ -25368,12 +25651,12 @@ async function saveCronJob() {
       successSchema = JSON.parse(successSchemaRaw);
       if (!successSchema || typeof successSchema !== 'object' || Array.isArray(successSchema)) {
         toast('Success schema must be a JSON object', 'error');
-        document.getElementById('cron-success-schema').focus();
+        focusOnConfigTab('cron-success-schema', 'prompt');
         return;
       }
     } catch (e) {
       toast('Success schema is not valid JSON: ' + (e.message || String(e)), 'error');
-      document.getElementById('cron-success-schema').focus();
+      focusOnConfigTab('cron-success-schema', 'prompt');
       return;
     }
   }
@@ -34891,6 +35174,11 @@ try {
         refreshActivity();
         if (currentPage === 'build') refreshCron();
         refreshTeamNav();
+        // PRD Phase 1.2: if the user just clicked "Run task once" in the
+        // modal, re-render the Last run pane with the fresh result.
+        if (evt.type === 'cron_complete' && evt.data && evt.data.job && typeof handleCronRunOnceComplete === 'function') {
+          try { handleCronRunOnceComplete(evt.data.job); } catch (err) { /* non-fatal */ }
+        }
       }
       // A delete on one tab should drop the card from every open dashboard
       // without waiting for the next poll. cron_toggled is similar but lighter.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clementine-agent",
-  "version": "1.18.78",
+  "version": "1.18.80",
   "description": "Clementine — Personal AI Assistant (TypeScript)",
   "type": "module",
   "main": "dist/index.js",