clideck 1.29.1 → 1.29.3

package/README.md

@@ -1,101 +1,87 @@
-<img src="public/img/clideck-logo-icon.png" width="48" alt="clideck logo">
+<p align="center">
+  <img src="public/img/clideck-logo-icon.png" width="64" alt="clideck logo">
+</p>
 
-# clideck
+<h1 align="center">clideck</h1>
 
-> **Formerly `termix-cli`** — if you arrived here from an old link, you're in the right place. The project has been renamed to **CliDeck**. Update your install: `npm install -g clideck`
+<p align="center">
+  one screen for AI coding agents.
+  <br><br>
+  <a href="https://clideck.dev">Website</a> · <a href="https://docs.clideck.dev">Docs</a> · <a href="https://youtu.be/hICrtjGAeDk">Demo</a>
+</p>
 
-Manage your AI agents like WhatsApp chats. Assign roles, let Autopilot route work between them, check in from your phone.
+<p align="center">
+  <a href="https://github.com/rustykuntz/clideck/stargazers">
+    <img src="https://img.shields.io/github/stars/rustykuntz/clideck?style=social" alt="stars">
+  </a>
+  <a href="https://www.npmjs.com/package/clideck">
+    <img src="https://img.shields.io/npm/v/clideck" alt="npm version">
+  </a>
+</p>
 
-[Documentation](https://docs.clideck.dev/) | [Video Demo](https://youtu.be/hICrtjGAeDk) | [Website](https://clideck.dev/)
+<!-- TODO: Replace with a ~10 second GIF showing: open clideck,
+     sidebar with multiple agents across projects, click between them,
+     one working one idle. No narration needed. -->
 
-![clideck dashboard](assets/clideck-themes.jpg)
+<p align="center">
+  <img src="assets/clideck-themes.jpg" width="720" alt="clideck dashboard">
+</p>
 
-You run Claude Code, Codex, Gemini CLI in separate terminals. You alt-tab between them, forget which one finished, lose sessions when you close the lid.
+clideck is a local app for running multiple AI coding agents without juggling terminals. Claude Code, Codex, Gemini CLI, and OpenCode all live in one browser window with a chat-style sidebar, live status, message previews, session resume, and projects to keep things organized. an autopilot routes work between agents automatically, and an E2E encrypted mobile relay gives full control over all agents from a phone.
 
-clideck puts all your agents in one screen — a sidebar with every session, live status, last message preview, and timestamps. Click a session, you're in its terminal. Exactly like switching between chats.
+the main problem with using multiple agents is not starting them. it is managing them. terminals pile up, finished work gets missed, good sessions disappear after a restart. clideck does not sit in the middle rewriting prompts or output - it only watches lightweight status signals (OpenTelemetry) so it can tell which agent is working, which is idle, and which is waiting. everything runs locally, no data leaves your machine.
 
-Give each agent a role (Programmer, Reviewer, Product Manager), turn on Autopilot, and walk away — it routes output between agents automatically until the task is done or it needs you. Check progress from your phone with a QR scan.
+## Why this exists
 
-Native terminals. Your keystrokes go straight to the agent, nothing in between. clideck never reads your prompts or output.
+Terminal multiplexers are great at panes. clideck is about conversations.
 
-## Quick Start
+A pane grid is flat. agent work usually is not. projects, roles, previews, timestamps, notifications, resume, and sometimes a bit of routing between specialists all fit more naturally into a chat app layout. it also maps naturally to mobile, so the same mental model works on desktop and phone.
 
-```bash
-npx clideck
-```
-
-Open [http://localhost:4000](http://localhost:4000). Click **+**, pick an agent and optionally a project and role, start working.
-
-New users get 3 built-in roles (Programmer, Reviewer, Product Manager) and 3 starter prompts in the prompt library.
-
-Or install globally:
+## Quick start
 
 ```bash
 npm install -g clideck
 clideck
 ```
 
-## What You Get
-
-- **Roles** — define reusable agent identities (Programmer, Reviewer, PM) and assign them when creating sessions. Instructions are injected into the agent automatically.
-- **Autopilot** — project-level workflow routing. Watches your role-assigned agents, waits for them to finish, forwards output to the next specialist. Fingerprints each output, tracks handoff history, and guards against repeat loops. Supports 8 LLM providers (Anthropic, OpenAI, Google, Groq, xAI, Mistral, OpenRouter, Cerebras). Notifies you when work is complete or blocked.
-- **Mobile access** — check on your agents from your phone with a QR scan. E2E encrypted.
-- **Live working/idle status** — see which agent is thinking and which is waiting for you, without checking each terminal
-- **Session resume** — close clideck, reopen it tomorrow, pick up where you left off
-- **Notifications** — browser and sound alerts when an agent finishes or needs input
-- **Message previews** — latest output from each agent, right in the sidebar
-- **Projects** — group sessions by project with drag-and-drop
-- **Search** — find any session by name or scroll back through transcript content
-- **Prompt Library** — save reusable prompts, type `//` in any terminal to paste them
-- **Plugins** — full server + client API with hooks for input, output, status, transcript, and menus. Programmatic session control, toolbar and project actions, session pills, and a settings UI. Ships with Voice Input, Trim Clip, and Autopilot — or build your own.
-- **15 themes** — dark and light, plus custom theme support
-
-## Mobile Access
-
-Start a task on your laptop, walk away, check progress from your phone. See who's working, who's idle, who needs input. Send messages, answer choice menus, browse conversation history, and resume sessions — all from the browser on your phone.
-
-Pair with one QR scan, no account needed. End-to-end encrypted with AES-256-GCM — the relay sees only opaque blobs. Your code never leaves your machines.
-
-Mobile access is provided by [`clideck-remote`](https://www.npmjs.com/package/clideck-remote), a separate optional package. Install it with `npm install -g clideck-remote`.
+Open [localhost:4000](http://localhost:4000). Click **+**, pick an agent, start working.
 
-## Supported Agents
+Or just run it once with `npx clideck`. Works on macOS and Windows. Node 18+. Linux: untested - if you try it, [open an issue](https://github.com/rustykuntz/clideck/issues).
 
-clideck auto-detects whether each agent is working or idle:
+## What makes it useful
 
-| Agent | Status detection | Setup |
-|-------|-----------------|-------|
-| **Claude Code** | Automatic | Nothing to configure |
-| **Codex** | Automatic | One-click setup in clideck |
-| **Gemini CLI** | Automatic | One-click setup in clideck |
-| **OpenCode** | Via plugin bridge | One-click setup in clideck |
-| **Shell** | I/O activity only | None |
+**Live status** - see which agent is working and which is waiting. Status detection for Claude Code, Codex, Gemini CLI, and OpenCode.
 
-Claude Code works out of the box. Other agents need a one-time setup that clideck walks you through.
+**Session resume** - close the lid, reopen tomorrow, pick up where things left off. each agent's session ID is captured automatically.
 
-Minimum supported agent versions:
+**Roles** - give agents reusable identities like programmer, reviewer, or product manager. prompts are injected automatically when a session starts.
 
-- Gemini CLI `v0.36.0+`
-- OpenAI Codex `v0.118.0+`
-- Claude Code `v2.1.90+`
-- OpenCode `v1.2.26+`
+**Autopilot** - enable autopilot on a project, walk away. it watches for one agent to finish, hands the output to the next one, and keeps going until the work is done or blocked. this is the part that makes sleep possible. routes content verbatim, no rewriting or summarizing. fingerprints each output and tracks handoff history to guard against repeat loops. ~50 output tokens per routing decision. supports Anthropic, OpenAI, Google, Groq, xAI, Mistral, OpenRouter, Cerebras.
 
-## How It Works
+<p align="center">
+  <img src="assets/autopilot.gif" width="720" alt="Autopilot routing work between agents">
+</p>
 
-Each agent runs in a real terminal (PTY) on your machine. clideck receives lightweight status signals via OpenTelemetry — it knows *that* an agent is working, not *what* it's working on.
+**Mobile remote** - the agents keep running on the local machine. status, prompts, history, and replies stay available from a phone while away. E2E encrypted, no account needed.
 
-Autopilot routes existing agent output between agents verbatim — it does not rewrite or summarize the routed content.
+**Native terminals** - each session opens into its real terminal. keys go straight to the agent, nothing sits in the middle.
 
-Everything runs locally. No data is collected, transmitted, or stored outside your machine.
+## Supported agents
 
-## Platform Support
+Claude Code, Codex, Gemini CLI, OpenCode, Shell, and any other terminal tool.
 
-Tested on **macOS** and **Windows**. Works in any modern browser. Linux: untested — if you try it, open an issue.
+## Also
 
-## Documentation
+- **Projects** - group sessions, drag and drop
+- **Prompt library** - save reusable prompts, type `//` to paste
+- **Search** - find sessions or scroll through transcripts
+- **Plugins** - server + client API. ships with Voice Input, Trim Clip, and Autopilot. build your own
+- **15 themes** - dark, light, or make your own
+- **Notifications** - browser + sound alerts when agents finish
 
-Full setup guides, agent configuration, and plugin development:
+## Docs
 
-**[docs.clideck.dev](https://docs.clideck.dev/)**
+Guides, agent setup, plugin development: **[docs.clideck.dev](https://docs.clideck.dev)**
 
 ## Acknowledgments
 
@@ -103,4 +89,4 @@ Built with [xterm.js](https://xtermjs.org/).
 
 ## License
 
-MIT — see [LICENSE](LICENSE).
+MIT - see [LICENSE](LICENSE).

package/handlers.js

@@ -59,19 +59,26 @@ function getInstalledVersion(bin) {
 function checkRemoteUpdate(ws) {
   const now = Date.now();
   if (remoteUpdateCache && now - remoteUpdateCheckedAt < REMOTE_UPDATE_INTERVAL) {
-    if (remoteUpdateCache.available) ws.send(JSON.stringify({ type: 'remote.update', ...remoteUpdateCache }));
+    ws.send(JSON.stringify({ type: 'remote.update', checked: true, ...remoteUpdateCache }));
     return;
   }
   const shellOpt = process.platform === 'win32';
   require('child_process').execFile('npm', ['list', '-g', 'clideck-remote', '--json', '--depth=0'], { shell: shellOpt, timeout: 10000 }, (err, stdout) => {
     let installed;
-    try { installed = JSON.parse(stdout).dependencies['clideck-remote'].version; } catch { return; }
+    try { installed = JSON.parse(stdout).dependencies['clideck-remote'].version; }
+    catch {
+      ws.send(JSON.stringify({ type: 'remote.update', available: false, checked: false }));
+      return;
+    }
     require('child_process').execFile('npm', ['view', 'clideck-remote', 'version'], { shell: shellOpt, timeout: 10000 }, (err2, stdout2) => {
-      if (err2) return;
+      if (err2) {
+        ws.send(JSON.stringify({ type: 'remote.update', installed, available: false, checked: false }));
+        return;
+      }
       const latest = stdout2.trim();
       remoteUpdateCache = { installed, latest, available: compareVersions(latest, installed) > 0 };
       remoteUpdateCheckedAt = now;
-      if (remoteUpdateCache.available) ws.send(JSON.stringify({ type: 'remote.update', ...remoteUpdateCache }));
+      ws.send(JSON.stringify({ type: 'remote.update', checked: true, ...remoteUpdateCache }));
     });
   });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clideck",
-  "version": "1.29.1",
+  "version": "1.29.3",
   "description": "One screen for all your AI coding agents — run, monitor, and manage multiple CLI agents from a single browser tab",
   "main": "server.js",
   "bin": {

package/plugins/autopilot/client.js

@@ -9,7 +9,11 @@ export function init(pluginApi) {
   api.onMessage('started', (msg) => {
     activeProjects.add(msg.projectId);
     updateToggle(msg.projectId, true);
-    api.toast('Autopilot started');
+    api.toast('Keep this browser tab active and prevent sleep while Autopilot runs.', {
+      title: 'Autopilot started',
+      type: 'warn',
+      duration: 5000,
+    });
   });
 
   api.onMessage('stopped', (msg) => {

package/plugins/autopilot/prompt.md

@@ -51,10 +51,11 @@ RULES
 
 DO NOT USE notify_user UNLESS ABSOLUTELY NECESSARY
 - Do NOT ask the user if you should continue. Do NOT notify them with requests like "Please resume agent X" or "Should I keep going?" or "Is this a good stopping point?"
+- Do NOT alert the user that some agent asking for the user input before proceeding, this is not an execuse to stop and ask the user what to do. You should route the work to the next best agent until the workflow is truly blocked and cannot proceed without user input. (e.g. if the programmer ask for the user input, first make sure the reivewer or QA agent has not already reviewed the code, if not route it to them first)
 - The user may be away from the computer and expects the agents to keep working until the task is naturally complete.
 - You are autonomous. If you are unsure how to proceed, re-read the workflow state and the latest agent outputs, think differently, and route again.
 - Repeat agents with the same output if needed, unless the routing state shows that the same handoff is being repeated without progress.
-- You steer between agents until the task is complete or the user interrupts you, period.
+- You steer between agents until the task is complete or the user interrupts you, period. 
 
 HOW TO THINK
 For each decision, reason in this order:

package/public/index.html

@@ -368,10 +368,10 @@
         <!-- Intro (not installed) -->
         <div id="remote-intro" class="hidden px-6 py-6 flex flex-col items-center gap-4">
           <svg class="w-12 h-12 text-slate-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="2" width="14" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>
-          <h3 class="text-[13px] font-semibold text-slate-200">CliDeck Mobile Remote</h3>
-          <p class="text-xs text-slate-400 text-center leading-relaxed">Control your AI agents from your phone. See live status, send messages, and get notifications — all end-to-end encrypted.</p>
+          <h3 id="remote-intro-title" class="text-[13px] font-semibold text-slate-200">CliDeck Mobile Remote</h3>
+          <p id="remote-intro-text" class="text-xs text-slate-400 text-center leading-relaxed">Control your AI agents from your phone. See live status, send messages, and get notifications — all end-to-end encrypted.</p>
           <button id="remote-add" class="mt-1 w-full px-4 py-2.5 text-[13px] font-medium bg-blue-600 hover:bg-blue-500 text-white rounded-lg transition-colors">Add to CliDeck</button>
-          <p class="text-[11px] text-slate-600 text-center">Installs the <code class="text-slate-500">clideck-remote</code> package via npm</p>
+          <p id="remote-intro-foot" class="text-[11px] text-slate-600 text-center">Installs the <code class="text-slate-500">clideck-remote</code> package via npm</p>
         </div>
 
         <!-- Installing -->

package/public/js/app.js

@@ -291,7 +291,11 @@ function connect() {
         handleInstallDone(msg.success);
         break;
       case 'remote.update':
-        showRemoteUpdateToast(msg);
+        remoteUpdateInfo = msg?.available ? msg : null;
+        if (remotePreflight?.pending) {
+          remotePreflight.updateSeen = true;
+          finishRemotePreflight();
+        }
         break;
       default:
         if (msg.type?.startsWith('plugin.')) dispatchPluginMessage(msg);
@@ -607,7 +611,12 @@ function openPrevSessionsMenu(anchorEl) {
   const menu = document.createElement('div');
   menu.className = 'fixed z-[400] min-w-[160px] bg-slate-800 border border-slate-700 rounded-lg shadow-xl shadow-black/40 py-1';
 
-  const dormantIds = state.resumable.filter(s => !s.projectId).map(s => s.id);
+  // Clear exactly the dormant sessions currently rendered in "Previous Sessions".
+  // This keeps the action aligned with the UI even if a session has a stale projectId
+  // that no longer resolves to a real project group.
+  const dormantIds = [...document.querySelectorAll('#resumable-section [data-resumable-id]')]
+    .map(el => el.dataset.resumableId)
+    .filter(Boolean);
 
   menu.innerHTML = `
     <button class="pv-action flex items-center gap-2 w-full px-3 py-2 text-sm text-slate-300 hover:bg-slate-700 transition-colors text-left" data-action="clear-dormant">
@@ -1046,6 +1055,9 @@ let remoteModalOpen = false;
 let remoteStatusPoll = null;
 let remoteConnectedAt = null;
 let remoteStatsTimer = null;
+let remoteUpdateInfo = null;
+let remotePreflight = null;
+let remoteLastStatus = null;
 
 function startRemotePoll() {
   stopRemotePoll();
@@ -1065,6 +1077,66 @@ function setRemotePane(pane) {
   }
 }
 
+function showRemoteIntro(opts = {}) {
+  const title = document.getElementById('remote-intro-title');
+  const text = document.getElementById('remote-intro-text');
+  const foot = document.getElementById('remote-intro-foot');
+  const btn = document.getElementById('remote-add');
+  title.textContent = opts.title || 'CliDeck Mobile Remote';
+  text.textContent = opts.text || 'Control your AI agents from your phone. See live status, send messages, and get notifications — all end-to-end encrypted.';
+  foot.innerHTML = opts.foot || 'Installs the <code class="text-slate-500">clideck-remote</code> package via npm';
+  btn.textContent = opts.button || 'Add to CliDeck';
+  setRemotePane('intro');
+}
+
+function showRemoteUpdateRequired() {
+  showRemoteIntro({
+    title: 'Update Required',
+    text: `Version ${remoteUpdateInfo.latest} is available. Update CliDeck Remote to continue with mobile pairing on this machine.`,
+    foot: `Installed: <code class="text-slate-500">${esc(remoteUpdateInfo.installed)}</code> · Latest: <code class="text-slate-500">${esc(remoteUpdateInfo.latest)}</code>`,
+    button: 'Update to Continue',
+  });
+}
+
+function finishRemotePreflight() {
+  if (!remotePreflight?.pending || !remotePreflight.statusSeen || !remotePreflight.updateSeen) return;
+  remotePreflight = null;
+  if (!remoteInstalled) {
+    showRemoteIntro();
+    return;
+  }
+  if (remoteUpdateInfo?.available) {
+    showRemoteUpdateRequired();
+    return;
+  }
+  if (remoteState === 'idle') {
+    remoteState = 'connecting';
+    setRemotePane('connecting');
+    send({ type: 'remote.pair' });
+    return;
+  }
+  if (remoteState === 'paired' && remoteLastStatus?.paired) {
+    setRemotePane('active');
+    setRemoteLock(true);
+    startRemoteStats(remoteLastStatus.pairedAt);
+    const deviceEl = document.getElementById('remote-device-info');
+    if (deviceEl) {
+      const parts = [remoteLastStatus.deviceName, remoteLastStatus.location].filter(Boolean);
+      deviceEl.textContent = parts.length ? parts.join(' · ') : '';
+    }
+    return;
+  }
+  if (remoteState === 'waiting' && remoteLastStatus?.connected && remoteLastStatus?.url) {
+    document.getElementById('remote-url-box').textContent = remoteLastStatus.url;
+    const qrImg = document.getElementById('remote-qr-img');
+    if (remoteLastStatus.qr && remoteLastStatus.qr.startsWith('data:')) { qrImg.src = remoteLastStatus.qr; qrImg.classList.remove('hidden'); }
+    else qrImg.classList.add('hidden');
+    setRemotePane('qr');
+    return;
+  }
+  setRemotePane(remoteState === 'paired' ? 'active' : remoteState === 'waiting' ? 'qr' : 'connecting');
+}
+
 function openRemoteModal() {
   remoteModalOpen = true;
   remoteModal.classList.remove('hidden');
@@ -1153,10 +1225,12 @@ function updateRemoteButton() {
 }
 
 function handleRemoteStatus(msg) {
+  remoteLastStatus = msg;
   remoteInstalled = !!msg.installed;
   state.remoteVersion = msg.version || (msg.installed ? null : 'not installed');
   updateVersionFooter();
   const wasPaired = remoteState === 'paired';
+  const preflighting = !!remotePreflight?.pending;
   if (!msg.installed) {
     remoteState = 'idle';
     stopRemotePoll();
@@ -1165,7 +1239,7 @@ function handleRemoteStatus(msg) {
     const wasFresh = remoteState !== 'paired';
     remoteState = 'paired';
     if (!remoteStatusPoll) startRemotePoll();
-    if (wasFresh) {
+    if (wasFresh && !preflighting) {
 
       setRemotePane('active');
       setRemoteLock(true);
@@ -1185,13 +1259,20 @@ function handleRemoteStatus(msg) {
     if (msg.qr && msg.qr.startsWith('data:')) { qrImg.src = msg.qr; qrImg.classList.remove('hidden'); }
     else qrImg.classList.add('hidden');
     startRemotePoll();
-    if (remoteModalOpen) setRemotePane('qr');
+    if (!preflighting && remoteModalOpen) setRemotePane('qr');
   } else {
     remoteState = 'idle';
     stopRemotePoll();
     if (wasPaired) { stopRemoteStats(); setRemoteLock(false); }
   }
+  if (remoteUpdateInfo?.available && remoteModalOpen) {
+    showRemoteUpdateRequired();
+  }
   updateRemoteButton();
+  if (remotePreflight?.pending) {
+    remotePreflight.statusSeen = true;
+    finishRemotePreflight();
+  }
 }
 
 function handleRemotePaired(msg) {
@@ -1201,9 +1282,18 @@ function handleRemotePaired(msg) {
   const qrImg = document.getElementById('remote-qr-img');
   if (msg.qr && msg.qr.startsWith('data:')) { qrImg.src = msg.qr; qrImg.classList.remove('hidden'); }
   else qrImg.classList.add('hidden');
-  setRemotePane('qr');
   updateRemoteButton();
   startRemotePoll();
+  if (remoteUpdateInfo?.available && remoteModalOpen) {
+    showRemoteUpdateRequired();
+    return;
+  }
+  if (remotePreflight?.pending) {
+    remotePreflight.statusSeen = true;
+    finishRemotePreflight();
+    return;
+  }
+  setRemotePane('qr');
 }
 
 function handleRemoteUnpaired() {
@@ -1232,6 +1322,7 @@ function appendInstallLog(text) {
 function handleInstallDone(success) {
   if (success) {
     remoteInstalled = true;
+    remoteUpdateInfo = null;
     // Installed — go straight to pairing
     remoteState = 'connecting';
     setRemotePane('connecting');
@@ -1243,74 +1334,20 @@ function handleInstallDone(success) {
   }
 }
 
-let remoteUpdateShown = false;
-
-function showRemoteUpdateToast(msg) {
-  if (remoteUpdateShown) return;
-  remoteUpdateShown = true;
-
-  const toast = document.createElement('div');
-  toast.className = 'fixed bottom-5 right-5 z-[500] w-[360px] bg-slate-800/95 backdrop-blur-sm border border-slate-700/60 rounded-xl shadow-2xl shadow-black/60';
-  toast.style.cssText = 'opacity:0;transform:translateY(12px);transition:opacity 0.3s ease,transform 0.3s ease';
-
-  toast.innerHTML = `
-    <div class="flex items-center gap-2.5 px-4 pt-3.5 pb-1">
-      <svg class="w-5 h-5 flex-shrink-0 text-blue-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"/></svg>
-      <span class="text-[13px] font-semibold text-slate-200">CliDeck Remote Update</span>
-      <button class="dismiss-btn ml-auto w-6 h-6 flex items-center justify-center rounded-md text-slate-500 hover:text-slate-300 hover:bg-slate-700/50 transition-colors">
-        <svg class="w-3.5 h-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M18 6L6 18M6 6l12 12"/></svg>
-      </button>
-    </div>
-    <p class="px-4 pt-1 pb-2.5 text-xs text-slate-400 leading-relaxed">
-      Version <span class="text-slate-300">${esc(msg.latest)}</span> is available (installed: ${esc(msg.installed)}).
-    </p>
-    <div class="px-4 pb-3.5 flex items-center gap-2">
-      <button class="update-btn flex-1 px-3 py-2 text-xs font-medium bg-blue-600 hover:bg-blue-500 text-white rounded-lg transition-colors">Update</button>
-      <button class="dismiss-btn px-3 py-2 text-xs text-slate-500 hover:text-slate-300 transition-colors">Later</button>
-    </div>`;
-
-  const dismiss = () => {
-    toast.style.opacity = '0';
-    toast.style.transform = 'translateY(12px)';
-    setTimeout(() => toast.remove(), 300);
-  };
-
-  toast.querySelectorAll('.dismiss-btn').forEach(b => {
-    b.onclick = () => { dismiss(); setTimeout(() => { remoteUpdateShown = false; }, 600000); };
-  });
-
-  toast.querySelector('.update-btn').onclick = () => {
-    dismiss();
-    remoteUpdateShown = false;
-    document.getElementById('remote-install-log').textContent = '';
-    setRemotePane('installing');
-    openRemoteModal();
-    send({ type: 'remote.install' });
-  };
-
-  document.body.appendChild(toast);
-  requestAnimationFrame(() => { toast.style.opacity = '1'; toast.style.transform = 'translateY(0)'; });
-}
-
 // Button click
 btnRemote.addEventListener('click', () => {
   if (remoteModalOpen && remoteState !== 'paired') { closeRemoteModal(); return; }
   if (remoteModalOpen) return; // paired — can't dismiss
   if (!remoteInstalled) {
-    setRemotePane('intro');
+    showRemoteIntro();
     document.getElementById('remote-install-log').textContent = '';
     openRemoteModal();
     return;
   }
-  if (remoteState === 'idle') {
-    remoteState = 'connecting';
-    setRemotePane('connecting');
-    openRemoteModal();
-    send({ type: 'remote.pair' });
-  } else {
-    setRemotePane(remoteState === 'paired' ? 'active' : remoteState === 'waiting' ? 'qr' : 'connecting');
-    openRemoteModal();
-  }
+  remotePreflight = { pending: true, statusSeen: false, updateSeen: false };
+  setRemotePane('connecting');
+  openRemoteModal();
+  send({ type: 'remote.status' });
 });
 
 // Install button

package/transcript-parser.js

@@ -4,12 +4,39 @@ function parseTurns(presetId, lines, users) {
 }
 
 function parseLastAgentOnly(presetId, lines) {
+  if (presetId === 'claude-code') return parseLastClaudeAgentOnly(lines);
   const turns = collapseAgentTurns((parsers[presetId] || (() => null))(lines, null));
   if (!turns?.length) return null;
   const last = [...turns].reverse().find(t => t.role === 'agent');
   return last || null;
 }
 
+function parseLastClaudeAgentOnly(lines) {
+  const userPromptRe = /^(?:[│ ]\s*)?[❯›]\s(.*)$/;
+  const agentRe = /^(?:[│ ]\s*)?[⏺•●]\s(.*)$/;
+  let promptIdx = -1;
+  for (let i = lines.length - 1; i >= 0; i--) {
+    if (userPromptRe.test(lines[i])) { promptIdx = i; break; }
+  }
+  const upperBound = promptIdx >= 0 ? promptIdx : lines.length;
+  let start = -1;
+  for (let i = upperBound - 1; i >= 0; i--) {
+    if (agentRe.test(lines[i])) { start = i; break; }
+  }
+  if (start < 0) return null;
+  const first = lines[start].match(agentRe);
+  const turn = { role: 'agent', text: first[1] };
+  for (let i = start + 1; i < upperBound; i++) {
+    if (userPromptRe.test(lines[i]) || agentRe.test(lines[i])) break;
+    let cont = lines[i];
+    if (cont.startsWith('│ ')) cont = cont.slice(2);
+    else if (cont.startsWith('  ')) cont = cont.slice(2);
+    turn.text += '\n' + cont;
+  }
+  turn.text = turn.text.replace(/\n+$/, '');
+  return turn;
+}
+
 const parsers = {
   'claude-code': (lines, users) => {
     const known = users?.length ? new Set(users) : null;