claude-code-watch 0.0.7 → 0.0.9

package/README.md

@@ -12,7 +12,7 @@ Claude Code writes detailed JSONL logs under `~/.claude/projects/` as it works
 - **Multi-session** — watch all active Claude Code sessions simultaneously in a tree view
 - **Subagent tracking** — see subagent activity nested under their parent session
 - **Token & cost visibility** — tracks input/output/cache tokens per agent, with context window utilization
-- **Filter controls** — toggle thinking, tool input, tool output, and text visibility independently
+- **Filter controls** — toggle thinking, tool input, tool output, hook output, and text visibility independently
 - **Auto-discovery** — automatically picks up new sessions as they start (toggleable)
 
 ## Quick Start
@@ -51,7 +51,7 @@ OPTIONS:
     -n                   Start from newest (skip history, live only)
     -l [N]               List recent sessions (default 10) and exit
     -a [N]               List active sessions (default all) and exit
-    -w <dur>             Active window duration (default 5m, e.g. 30s, 2m, 10m)
+    -w <dur>             Active window duration (default 30m, e.g. 30s, 2m, 10m)
     -m <N>               Max sessions to show in tree (default 0=unlimited)
     -c <dur>             Auto-collapse sessions inactive for this duration (e.g. 2m)
     -D                   Debug: show raw type:subtype for every JSONL line we'd drop

package/README.zh-CN.md

@@ -22,7 +22,7 @@ Claude Code 在运行时会将详细的 JSONL 日志写入 `~/.claude/projects/`
 - **多会话监视** — 同时查看所有活跃的 Claude Code 会话
 - **子代理追踪** — 在父会话下嵌套显示子代理活动
 - **Token/成本追踪** — 每个代理的输入/输出/缓存 token 及上下文窗口利用率
-- **过滤控制** — 独立切换 thinking、工具输入/输出、文本的可见性
+- **过滤控制** — 独立切换 thinking、工具输入/输出、hook 输出、文本的可见性
 - **自动发现** — 新会话启动时自动纳入监控
 
 ## 致谢

package/bin/claude-watch.js

@@ -150,7 +150,7 @@ async function main() {
     sessionID: '',
     skipHistory: false,
     pollMs: 500,
-    activeWindow: 5 * 60 * 1000,
+    activeWindow: 30 * 60 * 1000,
     maxSessions: 0,
     collapseAfter: 0,
     debugAll: false,
@@ -190,7 +190,7 @@ async function main() {
         break;
       case '-w':
         try {
-          options.activeWindow = parseDuration(args[++i] || '5m');
+          options.activeWindow = parseDuration(args[++i] || '30m');
         } catch {
           options.activeWindow = 5 * 60 * 1000;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-watch",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "description": "Web-based real-time monitor for Claude Code.",
   "main": "./src/server/server.js",
   "bin": {

package/public/index.html

@@ -264,6 +264,7 @@ body {
   <button class="btn on" id="btn-tool-input" onclick="toggleToolInput()" data-tooltip="Toggle tool input">🔧 Tools</button>
   <button class="btn on" id="btn-tool-output" onclick="toggleToolOutput()" data-tooltip="Toggle tool output">📤 Output</button>
   <button class="btn on" id="btn-text" onclick="toggleText()" data-tooltip="Toggle text responses">💬 Text</button>
+  <button class="btn on" id="btn-hook" onclick="toggleHook()" data-tooltip="Toggle hook output">🪝 Hook</button>
   <span class="sep">│</span>
   <button class="btn on" id="btn-autoscroll" onclick="toggleAutoScroll()" data-tooltip="Auto-scroll">⇣ Auto</button>
   <button class="btn" id="btn-tree-toggle" onclick="toggleTree()" data-tooltip="Toggle tree panel">📂 Tree</button>
@@ -337,49 +338,29 @@ let lastMsgTime = 0;
 let staleCheckTimer = null;
 
 let sessions = [];
+let sessionsMap = new Map(); // id -> session, for O(1) lookups
 let treeNodes = [];
 let treeCursor = 0;
 let streamItems = [];
-const seenToolIDsKeys = [];
-const seenToolIDsSet = new Set();
-const seenToolIDsMax = 5000;
-
-function seenToolIDsHas(key) {
-  return seenToolIDsSet.has(key);
-}
-function seenToolIDsAdd(key) {
-  seenToolIDsSet.add(key);
-  seenToolIDsKeys.push(key);
-  if (seenToolIDsKeys.length > seenToolIDsMax) {
-    const evictCount = seenToolIDsKeys.length >> 1;
-    for (let i = 0; i < evictCount; i++) {
-      seenToolIDsSet.delete(seenToolIDsKeys[i]);
-    }
-    seenToolIDsKeys.splice(0, evictCount);
-  }
-}
-const toolNameMapMax = 2000;
-let toolNameMap = new Map();  // toolID -> toolName
-let toolNameMapKeys = [];
-
-function toolNameMapSet(toolID, toolName) {
-  if (toolNameMap.has(toolID)) return;
-  toolNameMap.set(toolID, toolName);
-  toolNameMapKeys.push(toolID);
-  if (toolNameMapKeys.length > toolNameMapMax) {
-    const evictCount = toolNameMapKeys.length >> 1;
-    for (let i = 0; i < evictCount; i++) {
-      toolNameMap.delete(toolNameMapKeys[i]);
-    }
-    toolNameMapKeys.splice(0, evictCount);
-  }
-}
+let visibleItems = [];
+let visibleDirty = true;
+// LRU cache: recently accessed keys survive eviction, so a tool_input's ID
+// stays alive long enough for its matching tool_output to arrive and merge.
+class LRUCache {
+  constructor(max) { this.max = max; this.map = new Map(); }
+  has(key) { if (!this.map.has(key)) return false; const v = this.map.get(key); this.map.delete(key); this.map.set(key, v); return true; }
+  get(key) { if (!this.map.has(key)) return undefined; const v = this.map.get(key); this.map.delete(key); this.map.set(key, v); return v; }
+  set(key, val) { if (this.map.has(key)) this.map.delete(key); this.map.set(key, val); if (this.map.size > this.max) { const oldest = this.map.keys().next().value; this.map.delete(oldest); } }
+}
+const seenToolIDs = new LRUCache(5000);
+const toolNameMap = new LRUCache(2000);
 let filters = new Map();
 
 let showThinking = true;
 let showToolInput = true;
 let showToolOutput = true;
 let showText = true;
+let showHook = true;
 let autoDiscovery = true;
 
 let renderPending = false;
@@ -401,10 +382,11 @@ let collapseAfter = 0;
 let collapseTimer = null;
 let activeRefreshTimer = null;
 
-const MAX_ITEMS = 1000;
+const MAX_ITEMS = 3000;
 const MAX_LINES = 50;
 let renderedItemCount = 0;
 let needsFullRender = true;
+  visibleDirty = true;
 
 // ══════════════════════════════════════════════════════════════════════════════
 // Markdown renderer (marked + highlight.js)
@@ -523,7 +505,7 @@ function sendCmd(action, extra = {}) {
 function handleSnapshot(payload) {
   autoDiscovery = payload.autoDiscovery;
   for (const s of (payload.sessions || [])) {
-    let session = sessions.find(x => x.id === s.id);
+    let session = sessionsMap.get(s.id);
     if (!session) {
       session = {
         id: s.id, projectPath: s.projectPath, title: '',
@@ -532,6 +514,7 @@ function handleSnapshot(payload) {
         lastActivity: Date.now(),
       };
       sessions.push(session);
+      sessionsMap.set(session.id, session);
       session.agents.push({ id: '', name: 'Main', type: 'main' });
     }
     session.lastActivity = Date.now();
@@ -552,25 +535,31 @@ function handleSnapshot(payload) {
   }
   updateFilters();
   rebuildNodes();
+  needsFullRender = true;
+  visibleDirty = true;
   scheduleRender();
 }
 
 function handleNewSession(payload) {
-  if (sessions.find(s => s.id === payload.sessionID)) return;
-  sessions.push({
+  if (sessionsMap.has(payload.sessionID)) return;
+  const session = {
     id: payload.sessionID, projectPath: payload.projectPath,
     title: '', folder: folderName(payload.projectPath), model: '',
     agents: [{ id: '', name: 'Main', type: 'main' }],
     tasks: [], collapsed: false, pinned: false,
     lastActivity: Date.now(),
-  });
+  };
+  sessions.push(session);
+  sessionsMap.set(session.id, session);
   updateFilters();
   rebuildNodes();
+  needsFullRender = true;
+  visibleDirty = true;
   scheduleRender();
 }
 
 function handleNewAgent(payload) {
-  const s = sessions.find(s => s.id === payload.sessionID);
+  const s = sessionsMap.get(payload.sessionID);
   if (!s || s.agents.find(a => a.id === payload.agentID)) return;
   s.agents.push({
     id: payload.agentID,
@@ -579,11 +568,13 @@ function handleNewAgent(payload) {
   });
   updateFilters();
   rebuildNodes();
+  needsFullRender = true;
+  visibleDirty = true;
   scheduleRender();
 }
 
 function handleNewBgTask(payload) {
-  const s = sessions.find(s => s.id === payload.sessionID);
+  const s = sessionsMap.get(payload.sessionID);
   if (!s || s.tasks.find(t => t.id === payload.toolID)) return;
   s.tasks.push({
     id: payload.toolID, parentAgentID: payload.parentAgentID,
@@ -596,9 +587,14 @@ function handleNewBgTask(payload) {
 
 function handleSessionRemoved(payload) {
   const idx = sessions.findIndex(s => s.id === payload.sessionID);
-  if (idx >= 0) sessions.splice(idx, 1);
+  if (idx >= 0) {
+    const session = sessions.splice(idx, 1)[0];
+    sessions.push(session);
+  }
   updateFilters();
   rebuildNodes();
+  needsFullRender = true;
+  visibleDirty = true;
   scheduleRender();
 }
 
@@ -608,13 +604,13 @@ function handleSessionRemoved(payload) {
 
 function handleItem(item) {
   if (item.type === 'session_title') {
-    const s = sessions.find(s => s.id === item.sessionID);
+    const s = sessionsMap.get(item.sessionID);
     if (s) { s.title = item.content.slice(0, 30); }
     scheduleRender();
     return;
   }
   // Update activity
-  const s = sessions.find(s => s.id === item.sessionID);
+  const s = sessionsMap.get(item.sessionID);
   if (s) s.lastActivity = Date.now();
   pushItem(item);
   scheduleRender();
@@ -623,7 +619,7 @@ function handleItem(item) {
 function handleItemBatch(items) {
   for (const item of items) {
     if (item.type === 'session_title') {
-      const s = sessions.find(s => s.id === item.sessionID);
+      const s = sessionsMap.get(item.sessionID);
       if (s) { s.title = item.content.slice(0, 30); }
       continue;
     }
@@ -637,24 +633,28 @@ function pushItem(item) {
   // to avoid divergence between frontend accumulation and server tracking
 
   if (item.model) {
-    const s = sessions.find(s => s.id === item.sessionID);
+    const s = sessionsMap.get(item.sessionID);
     if (s) s.model = item.model;
   }
 
   if (item.type === 'tool_input' && item.toolID && item.toolName) {
-    toolNameMapSet(item.toolID, item.toolName);
+    toolNameMap.set(item.toolID, item.toolName);
   }
 
   if (item.toolID) {
     const key = `${item.toolID}:${item.type}`;
-    if (seenToolIDsHas(key)) return;
-    seenToolIDsAdd(key);
+    if (seenToolIDs.has(key)) return;
+    seenToolIDs.set(key, true);
   }
 
   streamItems.push(item);
   if (streamItems.length > MAX_ITEMS) {
     streamItems = streamItems.slice(-MAX_ITEMS);
-    needsFullRender = true;
+    visibleDirty = true;
+  }
+  // Incrementally update visibleItems — no need to re-filter on every item
+  if (!visibleDirty && isItemVisible(item)) {
+    visibleItems.push(item);
   }
 }
 
@@ -665,6 +665,7 @@ function isItemVisible(item) {
     case 'tool_input': return showToolInput;
     case 'tool_output': return showToolOutput;
     case 'text': return showText;
+    case 'hook_output': return showHook;
     default: return true;
   }
 }
@@ -820,7 +821,14 @@ function isSessionActive(session) {
 // ══════════════════════════════════════════════════════════════════════════════
 
 function renderStream() {
-  const visible = streamItems.filter(isItemVisible);
+  // Rebuild visibleItems from scratch only when filters/toggles changed
+  if (visibleDirty) {
+    visibleItems = streamItems.filter(isItemVisible);
+    visibleDirty = false;
+  }
+
+  const visible = visibleItems;
+  const wasAutoScroll = autoScroll;
 
   if (needsFullRender || renderedItemCount > visible.length) {
     // Full rebuild: filter changed, items trimmed, or initial render
@@ -844,10 +852,9 @@ function renderStream() {
     streamEl.innerHTML = html;
     renderedItemCount = visible.length;
     needsFullRender = false;
-    if (autoScroll) requestAnimationFrame(() => { streamEl.scrollTop = streamEl.scrollHeight; });
+    if (wasAutoScroll) requestAnimationFrame(() => { streamEl.scrollTop = streamEl.scrollHeight; });
   } else {
     // Incremental append: only add new items since last render
-    const wasAtBottom = streamEl.scrollHeight - streamEl.scrollTop - streamEl.clientHeight < 50;
     for (let i = renderedItemCount; i < visible.length; i++) {
       for (const l of renderItem(visible[i])) {
         const div = document.createElement('div');
@@ -857,7 +864,7 @@ function renderStream() {
       }
     }
     renderedItemCount = visible.length;
-    if (autoScroll && wasAtBottom) requestAnimationFrame(() => { streamEl.scrollTop = streamEl.scrollHeight; });
+    if (autoScroll) requestAnimationFrame(() => { streamEl.scrollTop = streamEl.scrollHeight; });
   }
 
   const maxScroll = streamEl.scrollHeight - streamEl.clientHeight;
@@ -951,6 +958,7 @@ function refreshButtons() {
   document.getElementById('btn-tool-input').classList.toggle('on', showToolInput);
   document.getElementById('btn-tool-output').classList.toggle('on', showToolOutput);
   document.getElementById('btn-text').classList.toggle('on', showText);
+  document.getElementById('btn-hook').classList.toggle('on', showHook);
   document.getElementById('btn-autoscroll').classList.toggle('on', autoScroll);
   document.getElementById('btn-tree-toggle').classList.toggle('on', showTree);
   document.getElementById('btn-autodisco').classList.toggle('on', autoDiscovery);
@@ -1104,8 +1112,12 @@ function removeSelectedSession() {
   if (node.type === 'session') sid = node.id;
   else sid = node.sessionID;
   if (!sid) return;
-  if (!confirm(`Remove session ${sid.slice(0, 12)}...?`)) return;
-  sessions = sessions.filter(s => s.id !== sid);
+  if (!confirm(`Move session ${sid.slice(0, 12)}... to bottom?`)) return;
+  const idx = sessions.findIndex(s => s.id === sid);
+  if (idx >= 0) {
+    const session = sessions.splice(idx, 1)[0];
+    sessions.push(session);
+  }
   sendCmd('removeSession', { sessionID: sid });
   updateFilters();
   rebuildNodes();
@@ -1116,17 +1128,23 @@ function removeSelectedSession() {
 // Toggles
 // ══════════════════════════════════════════════════════════════════════════════
 
-function toggleThinking() { showThinking = !showThinking; needsFullRender = true; renderStream(); refreshButtons(); }
-function toggleToolInput() { showToolInput = !showToolInput; needsFullRender = true; renderStream(); refreshButtons(); }
-function toggleToolOutput() { showToolOutput = !showToolOutput; needsFullRender = true; renderStream(); refreshButtons(); }
-function toggleText() { showText = !showText; needsFullRender = true; renderStream(); refreshButtons(); }
+function toggleThinking() { showThinking = !showThinking; needsFullRender = true;
+  visibleDirty = true; renderStream(); refreshButtons(); }
+function toggleToolInput() { showToolInput = !showToolInput; needsFullRender = true;
+  visibleDirty = true; renderStream(); refreshButtons(); }
+function toggleToolOutput() { showToolOutput = !showToolOutput; needsFullRender = true;
+  visibleDirty = true; renderStream(); refreshButtons(); }
+function toggleText() { showText = !showText; needsFullRender = true;
+  visibleDirty = true; renderStream(); refreshButtons(); }
+function toggleHook() { showHook = !showHook; needsFullRender = true;
+  visibleDirty = true; renderStream(); refreshButtons(); }
 function toggleAutoScroll() { autoScroll = !autoScroll; if (autoScroll) streamEl.scrollTop = streamEl.scrollHeight; renderAll(); }
 function toggleTree() { showTree = !showTree; document.getElementById('tree-panel').classList.toggle('hidden', !showTree); }
 function toggleAutoDiscovery() { sendCmd('toggleAutoDiscovery'); }
 
 function scrollToTop() { streamEl.scrollTop = 0; autoScroll = false; renderAll(); }
 function scrollUp() { streamEl.scrollTop -= 80; autoScroll = false; renderAll(); }
-function scrollDown() { streamEl.scrollTop += 80; renderAll(); }
+function scrollDown() { streamEl.scrollTop += 80; if (autoScroll) autoScroll = false; renderAll(); }
 function scrollToBottom() { streamEl.scrollTop = streamEl.scrollHeight; autoScroll = true; renderAll(); }
 
 // ══════════════════════════════════════════════════════════════════════════════
@@ -1260,6 +1278,7 @@ function fmtTok(n) {
 
 function renderAll() {
   needsFullRender = true;
+  visibleDirty = true;
   renderTree();
   renderStream();
   refreshButtons();
@@ -1270,7 +1289,9 @@ function scheduleRender() {
     renderPending = true;
     requestAnimationFrame(() => {
       renderPending = false;
-      renderAll();
+      renderTree();
+      renderStream();
+      refreshButtons();
     });
   }
 }

package/src/parser/parser.js

@@ -145,6 +145,7 @@ function parseSessionTitle(raw, timestamp, title) {
     type: StreamItemType.SESSION_TITLE,
     sessionID: raw.sessionId,
     content: title,
+    timestamp,
   })];
 }
 
@@ -162,6 +163,7 @@ function parseSystemMessage(raw, timestamp) {
         agentID: raw.agentId || '',
         agentName: name,
         durationMs: raw.durationMs || 0,
+        timestamp,
       })];
     case 'compact_boundary':
       return [makeItem({
@@ -170,6 +172,7 @@ function parseSystemMessage(raw, timestamp) {
         agentID: raw.agentId || '',
         agentName: name,
         content: formatCompactSummary(raw.compactMetadata),
+        timestamp,
       })];
     default:
       return [];
@@ -216,6 +219,7 @@ function parseAttachment(raw, timestamp) {
         toolName: raw.attachment.hookName || '',
         content: body,
         durationMs: raw.attachment.durationMs || 0,
+        timestamp,
       })];
     }
     case 'diagnostics':
@@ -237,6 +241,7 @@ function diagnosticsItems(raw, timestamp, agentName) {
       agentName,
       toolName: diagnosticsHeader(f),
       content: diagnosticsBody(f.diagnostics),
+      timestamp,
     }));
   }
   return items;
@@ -289,6 +294,7 @@ function parsePRLink(raw, timestamp) {
     type: StreamItemType.PR_LINK,
     sessionID: raw.sessionId,
     content,
+    timestamp,
   })];
 }
 
@@ -312,6 +318,7 @@ function parseAssistantMessage(raw, timestamp) {
             agentID: raw.agentId || '',
             agentName: name,
             content: block.thinking,
+            timestamp,
           }));
         }
         break;
@@ -322,6 +329,7 @@ function parseAssistantMessage(raw, timestamp) {
             agentID: raw.agentId || '',
             agentName: name,
             content: block.text,
+            timestamp,
           }));
         }
         break;
@@ -333,6 +341,7 @@ function parseAssistantMessage(raw, timestamp) {
           content: formatToolInput(block.name, block.input),
           toolName: prettyToolName(block.name),
           toolID: block.id || '',
+          timestamp,
         }));
         break;
     }
@@ -378,6 +387,7 @@ function parseUserMessage(raw, timestamp) {
         content: extractToolResultContent(result.content),
         toolID: result.tool_use_id || '',
         durationMs,
+        timestamp,
       }));
     }
   }
@@ -406,14 +416,21 @@ function extractToolResultContent(content) {
 // Tool Input Formatting
 // ============================================================================
 
+var MAX_TOOL_INPUT_LENGTH = 5000;
+
+function truncate(s) {
+  if (!s || s.length <= MAX_TOOL_INPUT_LENGTH) return s;
+  return s.slice(0, MAX_TOOL_INPUT_LENGTH) + '...truncated';
+}
+
 function formatToolInput(toolName, input) {
   if (!input) return '';
   const inp = input;
 
   switch (toolName) {
     case 'Bash':
-      if (inp.description) return `${inp.command}\n  # ${inp.description}`;
-      return inp.command || '';
+      if (inp.description) return truncate(`${inp.command}\n  # ${inp.description}`);
+      return truncate(inp.command || '');
     case 'Read':
       return inp.file_path || '';
     case 'Write':
@@ -432,22 +449,22 @@ function formatToolInput(toolName, input) {
       return inp.query || '';
     case 'Task':
     case 'Agent':
-      if (inp.description) return inp.description;
-      return inp.prompt || '';
+      if (inp.description) return truncate(inp.description);
+      return truncate(inp.prompt || '');
     case 'Skill':
-      if (inp.args) return `${inp.skill} \u2014 ${inp.args}`;
+      if (inp.args) return truncate(`${inp.skill} \u2014 ${inp.args}`);
       return inp.skill || '';
     case 'ToolSearch':
       return inp.query || '';
     case 'ScheduleWakeup':
       if (inp.reason) return inp.reason;
       if (inp.delaySeconds > 0) return `delay ${inp.delaySeconds}s`;
-      return JSON.stringify(input);
+      return truncate(JSON.stringify(input));
     case 'TaskCreate':
       return inp.subject || '';
     case 'TaskUpdate':
       if (inp.taskId) return `task ${inp.taskId}`;
-      return JSON.stringify(input);
+      return truncate(JSON.stringify(input));
     case 'TaskStop':
       return inp.task_id || '';
     case 'EnterPlanMode':
@@ -456,9 +473,9 @@ function formatToolInput(toolName, input) {
       return '(exit plan mode)';
     case 'CronCreate':
       if (inp.cron && inp.prompt) return `${inp.cron}: ${inp.prompt}`;
-      return JSON.stringify(input);
+      return truncate(JSON.stringify(input));
     default:
-      return JSON.stringify(input);
+      return truncate(JSON.stringify(input));
   }
 }
 

package/src/server/server.js

@@ -21,7 +21,7 @@ var MIME = {
 };
 
 var MAX_ITEM_BUFFER = 2000;
-var CONTEXT_STALE_MS = 30 * 60 * 1000; // 30 minutes
+var CONTEXT_STALE_MS = 60 * 60 * 1000; // 60 minutes
 
 class DashboardServer {
   constructor(options = {}) {
@@ -33,9 +33,12 @@ class DashboardServer {
     this.itemBuffer = [];
     this.contextMap = new Map();
     this._contextCleanupTimer = null;
+    this._pendingItems = [];
+    this._flushTimer = null;
 
     this.server = null;
     this.wss = null;
+    this._heartbeatTimer = null;
 
     setDebugAll(options.debugAll || false);
     this.debugAll = options.debugAll || false;
@@ -52,7 +55,7 @@ class DashboardServer {
       ctx = { inputTokens: 0, outputTokens: 0, cacheCreation: 0, cacheRead: 0, model: '', contextWindow: 200000, lastActivity: Date.now() };
       this.contextMap.set(key, ctx);
     }
-    if (item.inputTokens) ctx.inputTokens += item.inputTokens;
+    if (item.inputTokens) ctx.inputTokens = Math.max(ctx.inputTokens, item.inputTokens);
     if (item.outputTokens) ctx.outputTokens += item.outputTokens;
     if (item.cacheCreationTokens) ctx.cacheCreation += item.cacheCreationTokens;
     if (item.cacheReadTokens) ctx.cacheRead += item.cacheReadTokens;
@@ -180,7 +183,16 @@ class DashboardServer {
       const filePath = params.get('path');
       if (!filePath) { this.sendJSON(res, { error: 'Missing path param' }, 400); return; }
       const resolved = path.resolve(filePath);
-      if (!resolved.startsWith(path.resolve(os.homedir(), '.claude', 'projects'))) {
+      const allowedPrefix = path.resolve(os.homedir(), '.claude', 'projects');
+      // Resolve symlinks before prefix check to prevent symlink-based path traversal
+      try {
+        const realPath = await fs.promises.realpath(resolved);
+        if (!realPath.startsWith(allowedPrefix)) {
+          this.sendJSON(res, { error: 'Access denied' }, 403);
+          return;
+        }
+      } catch {
+        // realpath fails for non-existent files — block them
         this.sendJSON(res, { error: 'Access denied' }, 403);
         return;
       }
@@ -296,7 +308,19 @@ class DashboardServer {
         this.itemBuffer = this.itemBuffer.slice(-MAX_ITEM_BUFFER);
       }
       this.updateContext(item);
-      this.broadcast('item', item);
+      this._pendingItems.push(item);
+      if (!this._flushTimer) {
+        this._flushTimer = setTimeout(() => {
+          this._flushTimer = null;
+          const batch = this._pendingItems;
+          this._pendingItems = [];
+          if (batch.length === 1) {
+            this.broadcast('item', batch[0]);
+          } else if (batch.length > 1) {
+            this.broadcast('itemBatch', batch);
+          }
+        }, 50);
+      }
     });
     w.on('broadcast', (type, payload) => {
       this.broadcast(type, payload);
@@ -334,11 +358,23 @@ class DashboardServer {
             if (process.platform === 'win32') {
               cp.execSync(`taskkill /PID ${parsedPid} /F`, { encoding: 'utf-8' });
             } else {
-              process.kill(parsedPid, 'SIGKILL');
+              process.kill(parsedPid, 'SIGTERM');
             }
           } catch {}
         }
       }
+
+      // Wait for graceful shutdown, then escalate to SIGKILL if still alive
+      if (process.platform !== 'win32') {
+        await new Promise(r => setTimeout(r, 3000));
+        for (const pid of pids) {
+          const parsedPid = parseInt(pid, 10);
+          if (Number.isInteger(parsedPid) && parsedPid > 0) {
+            try { process.kill(parsedPid, 0); process.kill(parsedPid, 'SIGKILL'); } catch {}
+          }
+        }
+      }
+
       // Wait briefly for the port to be released
       await new Promise(r => setTimeout(r, 500));
       return true;
@@ -353,7 +389,7 @@ class DashboardServer {
     }
     const skipHistory = options.skipHistory || false;
     const pollMs = options.pollMs || 500;
-    const activeWindow = options.activeWindow || 5 * 60 * 1000;
+    const activeWindow = options.activeWindow || 100 * 60 * 1000;
     const maxSessions = options.maxSessions || 0;
     const openBrowser = options.openBrowser !== false;
 
@@ -380,7 +416,7 @@ class DashboardServer {
       });
     });
 
-    this.wss = new WebSocketServer({ server: this.server });
+    this.wss = new WebSocketServer({ server: this.server, maxPayload: 1024 * 1024 });
     this.wss.on('connection', (ws) => this.onWsConnection(ws));
 
     // Register error handler once (not inside doListen to avoid accumulation)
@@ -400,40 +436,47 @@ class DashboardServer {
       await w.init();
       if (skipHistory) w.setSkipHistory(true);
       await w.start();
-
-      // Open browser AFTER sessions are discovered, so new clients get a full snapshot
-      if (openBrowser) {
-        const url = `http://localhost:${this.port}`;
-        const platform = process.platform;
-        if (platform === 'darwin') {
-          cp.spawn('open', [url]);
-        } else if (platform === 'win32') {
-          cp.spawn('cmd', ['/c', 'start', '', url]);
-        } else {
-          cp.spawn('xdg-open', [url]);
-        }
-      }
     } catch (err) {
       console.error('Watcher init error:', err.message);
       process.exit(1);
     }
 
     this._contextCleanupTimer = setInterval(() => this.cleanupContextMap(), CONTEXT_STALE_MS);
+    this._heartbeatTimer = setInterval(() => this.broadcast('heartbeat', null), 30000);
 
-    this.server.listen(this.port, this.host, () => {
-      const url = `http://localhost:${this.port}`;
-      console.log(`\n  claude-watch web server`);
-      console.log(`  ───────────────────────────`);
-      console.log(`  Local:   ${url}`);
-      console.log(`  Network: http://${this.host}:${this.port}`);
-      console.log(`  Quit:    Ctrl+C\n`);
+    // Start listening and wait for server to be ready before opening browser
+    await new Promise((resolve) => {
+      this.server.listen(this.port, this.host, () => {
+        const url = `http://localhost:${this.port}`;
+        console.log(`\n  claude-watch web server`);
+        console.log(`  ───────────────────────────`);
+        console.log(`  Local:   ${url}`);
+        console.log(`  Network: http://${this.host}:${this.port}`);
+        console.log(`  Quit:    Ctrl+C\n`);
+        resolve();
+      });
     });
 
+    // Open browser AFTER server is confirmed listening and watcher is ready
+    if (openBrowser) {
+      const url = `http://localhost:${this.port}`;
+      const platform = process.platform;
+      if (platform === 'darwin') {
+        cp.spawn('open', [url]);
+      } else if (platform === 'win32') {
+        cp.spawn('cmd', ['/c', 'start', '', url]);
+      } else {
+        cp.spawn('xdg-open', [url]);
+      }
+    }
+
     return { server: this.server, watcher: w };
   }
 
   stop() {
     if (this._contextCleanupTimer) clearInterval(this._contextCleanupTimer);
+    if (this._heartbeatTimer) clearInterval(this._heartbeatTimer);
+    if (this._flushTimer) clearTimeout(this._flushTimer);
     if (this.wss) this.wss.close();
     if (this.server) this.server.close();
     if (this.watcher) this.watcher.stop();

package/src/watcher/watcher.js

@@ -17,6 +17,7 @@ var AutoSkipLineThreshold = 100;
 var KeepRecentLines = 10;
 var CleanupInterval = 5 * 60 * 1000;
 var FsnotifyDiscoveryInterval = 60 * 1000;
+var MaxReadChunk = 64 * 1024;
 var RecentActivityThreshold = 2 * 60 * 1000;
 var DebounceInterval = 50;
 
@@ -31,7 +32,7 @@ function getClaudeProjectsDir() {
   return path.join(os.homedir(), '.claude', 'projects');
 }
 
-function resolveProjectPath(encoded) {
+async function resolveProjectPath(encoded) {
   let s = encoded;
   if (s.startsWith('-')) s = s.slice(1);
   if (!s) return '';
@@ -44,7 +45,7 @@ function resolveProjectPath(encoded) {
     const dirPart = parts.slice(joinFrom).join('-');
     const testPath = `/${pathPart}/${dirPart}`;
     try {
-      fs.accessSync(testPath);
+      await fsp.access(testPath);
       return `${pathPart}/${dirPart}`;
     } catch {
       // Path doesn't exist, try next combination
@@ -89,6 +90,7 @@ class Session {
     this.backgroundTasks = {}; // toolID -> BackgroundTask
     this.toolIndex = new Map(); // toolID -> { toolName, parentAgentID, hasResult }
     this.toolIndexPopulated = false;
+    this._toolIndexPromise = null;
   }
 }
 
@@ -111,7 +113,7 @@ class Watcher extends EventEmitter {
     super();
     this.claudeDir = getClaudeProjectsDir();
     this.pollInterval = pollInterval || 500;
-    this.activeWindow = activeWindow || 5 * 60 * 1000;
+    this.activeWindow = activeWindow || 100 * 60 * 1000;
     this.maxSessions = maxSessions || 0;
     this.sessions = new Map();
     this.filePositions = new Map();
@@ -187,22 +189,19 @@ class Watcher extends EventEmitter {
     if (jsonlFiles.length === 0) return null;
 
     // Sort by mtime (most recent first)
-    jsonlFiles.sort((a, b) => {
-      try {
-        const sa = fs.statSync(a);
-        const sb = fs.statSync(b);
-        return sb.mtimeMs - sa.mtimeMs;
-      } catch {
-        return 0;
-      }
-    });
+    const statResults = await Promise.all(jsonlFiles.map(async f => {
+      try { return { path: f, mtime: (await fsp.stat(f)).mtimeMs }; } catch { return null; }
+    }));
+    const validStats = statResults.filter(s => s !== null);
+    validStats.sort((a, b) => b.mtime - a.mtime);
 
     let mainFile;
     if (sessionID) {
-      mainFile = jsonlFiles.find(f => f.includes(sessionID));
+      mainFile = validStats.find(s => s.path.includes(sessionID));
       if (!mainFile) return null;
+      mainFile = mainFile.path;
     } else {
-      mainFile = jsonlFiles[0];
+      mainFile = validStats.length > 0 ? validStats[0].path : jsonlFiles[0];
     }
 
     return this.buildSession(mainFile);
@@ -212,7 +211,7 @@ class Watcher extends EventEmitter {
     const base = path.basename(mainFile);
     const id = base.replace(/\.jsonl$/, '');
     const projectDir = path.basename(path.dirname(mainFile));
-    const projectPath = resolveProjectPath(projectDir);
+    const projectPath = await resolveProjectPath(projectDir);
 
     const session = new Session(id, projectPath, mainFile);
 
@@ -322,11 +321,7 @@ class Watcher extends EventEmitter {
   async _startFsnotify() {
     // Set up watches
     try {
-      if (fs.existsSync(this.claudeDir)) {
-        this._addDirectoryWatches(this.claudeDir);
-      } else {
-        this._watchAncestor(this.claudeDir);
-      }
+      try { await fsp.stat(this.claudeDir); await this._addDirectoryWatches(this.claudeDir); } catch { await this._watchAncestor(this.claudeDir); }
     } catch (err) {
       if (this.debug) console.error('[watcher] start watch setup error:', err.message);
     }
@@ -338,7 +333,7 @@ class Watcher extends EventEmitter {
     }
 
     // chokidar events
-    this.watcher.on('add', (p) => this._handleFsCreate(p));
+    this.watcher.on('add', (p) => this._handleFsCreate(p).catch(() => {}));
     this.watcher.on('change', (p) => this._handleFsWrite(p));
     this.watcher.on('unlink', (p) => {
       this.filePositions.delete(p);
@@ -349,7 +344,7 @@ class Watcher extends EventEmitter {
     // Periodic cleanup and discovery
     this._cleanupTimer = setInterval(() => {
       if (!this._running) return;
-      this._cleanupFilePositions();
+      this._cleanupFilePositions().catch(() => {});
     }, CleanupInterval);
 
     this._discoveryTimer = setInterval(() => {
@@ -358,13 +353,13 @@ class Watcher extends EventEmitter {
     }, FsnotifyDiscoveryInterval);
   }
 
-  _watchAncestor(target) {
+  async _watchAncestor(target) {
     let dir = target;
     while (true) {
       const parent = path.dirname(dir);
       if (parent === dir) break;
       try {
-        fs.accessSync(parent);
+        await fsp.access(parent);
         this.watcher.add(parent);
         return;
       } catch {}
@@ -372,20 +367,20 @@ class Watcher extends EventEmitter {
     }
   }
 
-  _addDirectoryWatches(root, maxDepth = 10) {
-    const addRecursive = (dir, depth) => {
+  async _addDirectoryWatches(root, maxDepth = 10) {
+    const addRecursive = async (dir, depth) => {
       if (depth > maxDepth) return;
       try {
-        const entries = fs.readdirSync(dir, { withFileTypes: true });
+        const entries = await fsp.readdir(dir, { withFileTypes: true });
         this.watcher.add(dir);
         for (const entry of entries) {
           if (entry.isDirectory()) {
-            addRecursive(path.join(dir, entry.name), depth + 1);
+            await addRecursive(path.join(dir, entry.name), depth + 1);
           }
         }
       } catch {}
     };
-    addRecursive(root, 0);
+    await addRecursive(root, 0);
   }
 
   _registerSessionWatches(session) {
@@ -406,17 +401,17 @@ class Watcher extends EventEmitter {
   // chokidar event handlers
   // =========================================================================
 
-  _handleFsCreate(p) {
+  async _handleFsCreate(p) {
     let stats;
-    try { stats = fs.statSync(p); } catch { return; }
+    try { stats = await fsp.stat(p); } catch { return; }
 
     if (stats.isDirectory()) {
       this.watcher.add(p);
-      this._scanNewDirectory(p);
+      await this._scanNewDirectory(p);
       if (p === this.claudeDir || this.claudeDir.startsWith(p)) {
         try {
-          fs.accessSync(this.claudeDir);
-          this._addDirectoryWatches(this.claudeDir);
+          await fsp.access(this.claudeDir);
+          await this._addDirectoryWatches(this.claudeDir);
           this.discoverActiveSessions().catch(err => {
             if (this.debug) console.error('[watcher] discoverActiveSessions error:', err.message);
           });
@@ -441,15 +436,15 @@ class Watcher extends EventEmitter {
     }
   }
 
-  _scanNewDirectory(dirPath) {
+  async _scanNewDirectory(dirPath) {
     let entries;
-    try { entries = fs.readdirSync(dirPath, { withFileTypes: true }); } catch { return; }
+    try { entries = await fsp.readdir(dirPath, { withFileTypes: true }); } catch { return; }
     const base = path.basename(dirPath);
     for (const entry of entries) {
       const fullPath = path.join(dirPath, entry.name);
       if (entry.isDirectory()) {
         this.watcher.add(fullPath);
-        this._scanNewDirectory(fullPath);
+        await this._scanNewDirectory(fullPath);
         continue;
       }
       if (base === 'subagents' && entry.name.endsWith('.jsonl')) {
@@ -703,7 +698,20 @@ class Watcher extends EventEmitter {
 
   async _populateToolIndex(session) {
     if (session.toolIndexPopulated) return;
-    session.toolIndexPopulated = true;
+    // If another call is already populating, wait for it
+    if (session._toolIndexPromise) {
+      await session._toolIndexPromise;
+      return;
+    }
+    session._toolIndexPromise = this._doPopulateToolIndex(session);
+    try {
+      await session._toolIndexPromise;
+    } finally {
+      session._toolIndexPromise = null;
+    }
+  }
+
+  async _doPopulateToolIndex(session) {
     const files = [
       { path: session.mainFile, agentID: '' },
       ...Object.entries(session.subagents).map(([id, p]) => ({ path: p, agentID: id })),
@@ -751,6 +759,7 @@ class Watcher extends EventEmitter {
         if (this.debug) console.error('[watcher] _populateToolIndex error reading', filePath + ':', err.message);
       }
     }
+    session.toolIndexPopulated = true;
   }
 
   // =========================================================================
@@ -771,7 +780,7 @@ class Watcher extends EventEmitter {
 
     this._cleanupTimer = setInterval(() => {
       if (!this._running) return;
-      this._cleanupFilePositions();
+      this._cleanupFilePositions().catch(() => {});
     }, CleanupInterval);
   }
 
@@ -890,100 +899,119 @@ class Watcher extends EventEmitter {
       await prev;
 
       let handle;
-      let newPos = this.filePositions.get(filePath) || 0;
+      const pos = this.filePositions.get(filePath) || 0;
+      let newPos = pos;
       try {
         handle = await fsp.open(filePath, 'r');
-        const pos = this.filePositions.get(filePath) || 0;
         const stats = await handle.stat();
-        if (pos >= stats.size) { await handle.close(); handle = null; return; }
-
-        const readLen = stats.size - pos;
-        const buf = Buffer.alloc(readLen);
-        const { bytesRead } = await handle.read(buf, 0, readLen, pos);
-        if (bytesRead === 0) { await handle.close(); handle = null; return; }
+        if (pos > stats.size) {
+          // File was truncated — reset position to 0 so we re-read from the start
+          this.filePositions.set(filePath, 0);
+          await handle.close(); handle = null; return;
+        }
+        if (pos === stats.size) { await handle.close(); handle = null; return; }
 
         newPos = pos;
-        const content = bytesRead < readLen ? buf.toString('utf-8', 0, bytesRead) : buf.toString('utf-8');
-        const rawLines = content.split('\n');
-
-        // Detect Windows-style CRLF line endings
-        const firstNl = content.indexOf('\n');
-        const crlf = firstNl > 0 && content[firstNl - 1] === '\r';
-        const nlLen = crlf ? 2 : 1;
+        // Read in chunks to avoid large buffer allocations for big file deltas
+        let carryOver = ''; // incomplete trailing line from previous chunk
+        const buf = Buffer.alloc(MaxReadChunk);
+
+        while (true) {
+          const currentStats = await handle.stat();
+          const currentPos = this.filePositions.get(filePath) || 0;
+          if (currentPos >= currentStats.size) break;
+
+          const readLen = Math.min(MaxReadChunk, currentStats.size - currentPos);
+          const { bytesRead } = await handle.read(buf, 0, readLen, currentPos);
+          if (bytesRead === 0) break;
+
+          const chunk = bytesRead < readLen ? buf.toString('utf-8', 0, bytesRead) : buf.toString('utf-8');
+          const combined = carryOver + chunk;
+
+          // Detect CRLF from first newline in the combined text
+          let nlLen = 1;
+          const firstNl = combined.indexOf('\n');
+          if (firstNl > 0 && combined[firstNl - 1] === '\r') nlLen = 2;
+
+          const rawLines = combined.split('\n');
+
+          // If the chunk doesn't end with a newline, the last segment is incomplete.
+          // Save it as carryOver for the next chunk; don't process it yet.
+          if (!chunk.endsWith('\n')) {
+            carryOver = rawLines.pop();
+          } else {
+            // chunk ends with \n — split produces a trailing empty string; clear carryOver
+            carryOver = '';
+          }
 
-        let currentSize;
-        try { currentSize = (await handle.stat()).size; } catch { currentSize = stats.size; }
-        const fileGrew = currentSize > pos + bytesRead;
+          let chunkBytes = 0;
 
-        await handle.close();
-        handle = null;
+          for (let i = 0; i < rawLines.length; i++) {
+            let rawLine = rawLines[i];
 
-        for (let i = 0; i < rawLines.length; i++) {
-          const isLast = i === rawLines.length - 1;
-          let rawLine = rawLines[i];
-
-          // Trailing empty line after a final newline — skip it, advance position
-          if (isLast && rawLine === '' && content.endsWith('\n')) {
-            newPos += nlLen;
-            continue;
-          }
-
-          // Last line may be incomplete if file grew mid-read or lacks a trailing newline
-          if (isLast && !content.endsWith('\n')) {
-            // Don't process this line, don't advance position past it.
-            // Next read will re-read from the current newPos and get the complete line.
-            continue;
-          }
+            // Trailing empty after final newline — just advance position
+            if (rawLine === '' && i === rawLines.length - 1 && combined.endsWith('\n')) {
+              chunkBytes += nlLen;
+              continue;
+            }
 
-          // Strip trailing \r for clean line processing (Windows CRLF)
-          if (crlf && rawLine.endsWith('\r')) {
-            rawLine = rawLine.slice(0, -1);
-          }
+            // Strip trailing \r for CRLF
+            if (nlLen === 2 && rawLine.endsWith('\r')) {
+              rawLine = rawLine.slice(0, -1);
+            }
 
-          newPos += Buffer.byteLength(rawLine, 'utf-8');
-          newPos += nlLen;
+            chunkBytes += Buffer.byteLength(rawLine, 'utf-8') + nlLen;
 
-          if (!rawLine.trim()) continue;
+            if (!rawLine.trim()) continue;
 
-          const items = parseLine(rawLine);
-          for (const item of items) {
-            item.sessionID = sessionID;
+            const items = parseLine(rawLine);
+            for (const item of items) {
+              item.sessionID = sessionID;
 
-            if (agentID) {
-              if (!item.agentID) item.agentID = agentID;
-              if (agentType) {
-                const idx = agentType.lastIndexOf(':');
-                if (idx >= 0 && idx < agentType.length - 1) {
-                  item.agentName = agentType.slice(idx + 1);
-                } else {
-                  item.agentName = agentType;
+              if (agentID) {
+                if (!item.agentID) item.agentID = agentID;
+                if (agentType) {
+                  const idx = agentType.lastIndexOf(':');
+                  if (idx >= 0 && idx < agentType.length - 1) {
+                    item.agentName = agentType.slice(idx + 1);
+                  } else {
+                    item.agentName = agentType;
+                  }
+                } else if (!item.agentName || item.agentName.startsWith('Agent-')) {
+                  item.agentName = `Agent-${agentID.slice(0, Math.min(AgentIDDisplayLength, agentID.length))}`;
                 }
-              } else if (!item.agentName || item.agentName.startsWith('Agent-')) {
-                item.agentName = `Agent-${agentID.slice(0, Math.min(AgentIDDisplayLength, agentID.length))}`;
               }
-            }
 
-            if (item.toolID) {
-              const session = this.sessions.get(sessionID);
-              if (session) {
-                const existing = session.toolIndex.get(item.toolID);
-                if (item.type === 'tool_output') {
-                  if (existing) {
-                    existing.hasResult = true;
-                  } else {
-                    session.toolIndex.set(item.toolID, { toolName: '', parentAgentID: agentID || '', hasResult: true });
+              if (item.toolID) {
+                const session = this.sessions.get(sessionID);
+                if (session) {
+                  const existing = session.toolIndex.get(item.toolID);
+                  if (item.type === 'tool_output') {
+                    if (existing) {
+                      existing.hasResult = true;
+                    } else {
+                      session.toolIndex.set(item.toolID, { toolName: '', parentAgentID: agentID || '', hasResult: true });
+                    }
+                  } else if (item.type === 'tool_input' && !existing) {
+                    session.toolIndex.set(item.toolID, { toolName: item.toolName || '', parentAgentID: agentID || '', hasResult: false });
                   }
-                } else if (item.type === 'tool_input' && !existing) {
-                  session.toolIndex.set(item.toolID, { toolName: item.toolName || '', parentAgentID: agentID || '', hasResult: false });
                 }
               }
-            }
 
-            this.emit('item', item);
+              this.emit('item', item);
+            }
           }
+
+          newPos += chunkBytes;
+          this.filePositions.set(filePath, Math.min(newPos, currentStats.size));
         }
 
-        this.filePositions.set(filePath, Math.min(newPos, stats.size));
+        // Process any remaining carryOver as a final incomplete line (no trailing \n).
+        // This line may become complete on the next read, so we don't parse it yet.
+        // But we must NOT advance position past it — next read starts from newPos.
+
+        await handle.close();
+        handle = null;
       } catch (err) {
         if (newPos !== undefined) {
           this.filePositions.set(filePath, newPos);
@@ -1028,9 +1056,9 @@ class Watcher extends EventEmitter {
     }
   }
 
-  _cleanupFilePositions() {
+  async _cleanupFilePositions() {
     for (const p of this.filePositions.keys()) {
-      try { fs.accessSync(p); } catch {
+      try { await fsp.access(p); } catch {
         this.filePositions.delete(p);
         this.fileContexts.delete(p);
       }
@@ -1040,7 +1068,7 @@ class Watcher extends EventEmitter {
     const now = Date.now();
     for (const [sessionID, session] of this.sessions) {
       let stats;
-      try { stats = fs.statSync(session.mainFile); } catch {
+      try { stats = await fsp.stat(session.mainFile); } catch {
         this.removeSession(sessionID);
         this.emit('broadcast', 'sessionRemoved', { sessionID });
         continue;
@@ -1139,25 +1167,29 @@ async function _listSessionsFiltered(limit, activeWithin) {
   const sessions = [];
   const now = Date.now();
 
+  const candidates = [];
   try {
     await _walkDirStatic(claudeDir, (filePath, stats) => {
       if (!isMainSessionFile(filePath, stats)) return;
       if (activeWithin > 0 && (now - stats.mtimeMs) > activeWithin) return;
-
-      const basename = path.basename(filePath);
-      const projectDir = path.basename(path.dirname(filePath));
-      const projectPath = resolveProjectPath(projectDir);
-
-      sessions.push({
-        id: basename.replace(/\.jsonl$/, ''),
-        path: filePath,
-        projectPath,
-        modified: stats.mtime,
-        isActive: (now - stats.mtimeMs) < RecentActivityThreshold,
-      });
+      candidates.push({ filePath, stats });
     });
   } catch {}
 
+  for (const c of candidates) {
+    const basename = path.basename(c.filePath);
+    const projectDir = path.basename(path.dirname(c.filePath));
+    const projectPath = await resolveProjectPath(projectDir);
+
+    sessions.push({
+      id: basename.replace(/\.jsonl$/, ''),
+      path: c.filePath,
+      projectPath,
+      modified: c.stats.mtime,
+      isActive: (now - c.stats.mtimeMs) < RecentActivityThreshold,
+    });
+  }
+
   sessions.sort((a, b) => b.modified - a.modified);
   if (limit > 0 && sessions.length > limit) sessions.length = limit;