claude-code-watch 0.0.15 → 0.0.16

package/package.json

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

package/public/index.html

@@ -200,6 +200,7 @@ body {
 .stream-line.tool-output { color: var(--green); }
 .stream-line.text { color: var(--text); }
 .stream-line.hook { color: var(--cyan); }
+.stream-line .hook-label { color: var(--dim); }
 .stream-line.diag { color: var(--red); }
 .stream-line.debug { color: var(--gray); }
 .stream-line.marker { color: var(--dim); }
@@ -983,7 +984,11 @@ function renderItem(item) {
       if (item.toolName) label += ' ' + item.toolName;
       if (item.durationMs > 0) label += ' ' + fmtDur(item.durationMs);
       lines.push({ cls: agentTagCls, text: `<span class="tag-label">${esc(agentName + sep + label)}</span>${tsHtml}`, html: true });
-      for (const l of truncContent(item.content)) lines.push({ cls: 'stream-line hook', text: l });
+      if (item.hookCommand) lines.push({ cls: 'stream-line hook', text: `<span class="hook-label">command:</span> ${esc(item.hookCommand)}`, html: true });
+      if (item.hookContent) {
+        for (const l of truncContent(item.hookContent)) lines.push({ cls: 'stream-line hook', text: `<span class="hook-label">content:</span> ${esc(l)}`, html: true });
+      }
+      for (const l of truncContent(item.content)) lines.push({ cls: 'stream-line hook', text: `<span class="hook-label">stdout:</span> ${esc(l)}`, html: true });
       break;
     }
     case 'diagnostics': {

package/src/parser/parser.js

@@ -28,6 +28,7 @@ function makeItem(overrides = {}) {
   return {
     type: '', sessionID: '', agentID: '', agentName: '', timestamp: 0,
     content: '', toolName: '', toolID: '', durationMs: 0,
+    hookContent: '', hookCommand: '',
     inputTokens: 0, outputTokens: 0, cacheCreationTokens: 0, cacheReadTokens: 0,
     model: '',
     ...overrides,
@@ -212,14 +213,18 @@ function parseAttachment(raw, timestamp) {
   const name = agentDisplayName(raw.agentId);
   switch (raw.attachment.type) {
     case 'hook_success': {
-      const body = raw.attachment.stdout || '';
+      const stdout = (raw.attachment.stdout || '').replace(/\n$/, '');
+      const stdin = raw.attachment.content || '';
+      const hookContent = stdin && stdin !== stdout ? stdin : '';
       return [makeItem({
         type: StreamItemType.HOOK_OUTPUT,
         sessionID: raw.sessionId,
         agentID: raw.agentId || '',
         agentName: name,
         toolName: raw.attachment.hookName || '',
-        content: body,
+        content: stdout,
+        hookContent: hookContent,
+        hookCommand: raw.attachment.command || '',
         durationMs: raw.attachment.durationMs || 0,
         timestamp,
       })];