jettypod 4.4.116 → 4.4.120

package/apps/dashboard/lib/session-stream-manager.ts

@@ -29,6 +29,12 @@ export type StreamStatus = 'idle' | 'connecting' | 'creating' | 'streaming' | 'd
 export interface SessionContext {
   workItemId: string;
   standalone: boolean;
+  conversational?: boolean;
+}
+
+export interface QueuedMessage {
+  message: string;
+  images?: AttachedImage[];
 }
 
 export interface StreamState {
@@ -40,11 +46,12 @@ export interface StreamState {
   isReconnecting: boolean;
   reconnectAttempt: number;
   narratedMode: boolean;
+  queuedMessage: QueuedMessage | null;
 }
 
 export interface StreamManagerCallbacks {
   onStateChange?: (state: StreamState) => void;
-  onWorkItemCreated?: (workItemId: number, title: string) => void;
+  onWorkItemCreated?: (workItemId: number, title: string, sourceSessionId: string) => void;
   onGate?: (gate: ClaudeMessage) => void;
   onQuestion?: (gate: ClaudeMessage) => void;
 }
@@ -188,6 +195,23 @@ function transformClaudeMessage(parsed: any): ClaudeMessage | null {
         timestamp,
       };
 
+    // Claude CLI v2.1.49+ may emit streaming content block deltas
+    case 'content_block_delta': {
+      const delta = parsed.delta as { type?: string; text?: string } | undefined;
+      if (delta?.type === 'text_delta' && delta.text) {
+        return { type: 'assistant', content: delta.text, timestamp };
+      }
+      return null;
+    }
+
+    case 'content_block_start':
+    case 'content_block_stop':
+    case 'message_start':
+    case 'message_delta':
+    case 'message_stop':
+      // Streaming lifecycle events — no user-visible content
+      return null;
+
     default:
       return null;
   }
@@ -266,9 +290,14 @@ export class SessionStreamManager {
   private _isReconnecting: boolean = false;
   private _reconnectAttempt: number = 0;
   private _narratedMode: boolean = true;
+  private _userToggledNarratedMode: boolean = false;
   private _pendingQuestion: ClaudeMessage | null = null;
+  private _queuedMessage: QueuedMessage | null = null;
   private _isFirstMessage: boolean = true;
 
+  // Notification batching — coalesces rapid state changes into one callback per frame
+  private _notifyPending: boolean = false;
+
   // Control
   private abortController: AbortController | null = null;
   private creatingStatusTimeout: ReturnType<typeof setTimeout> | null = null;
@@ -278,6 +307,7 @@ export class SessionStreamManager {
   // Last request (for retry/reconnect)
   private lastMessage: string | null = null;
   private lastImages: AttachedImage[] | undefined = undefined;
+  private _lastWasHidden: boolean = false;
 
   // Callbacks
   private callbacks: StreamManagerCallbacks;
@@ -327,11 +357,43 @@ export class SessionStreamManager {
     return this._pendingQuestion;
   }
 
+  get queuedMessage(): QueuedMessage | null {
+    return this._queuedMessage;
+  }
+
+  /**
+   * Queue a message to be sent after the current stream completes.
+   * Only one message can be queued at a time (last one wins).
+   */
+  queueMessage(message: string, images?: AttachedImage[]): void {
+    this._queuedMessage = { message, images };
+    this.notifyStateChange();
+  }
+
+  /**
+   * Clear a queued message (e.g., if user stops the stream).
+   */
+  clearQueuedMessage(): void {
+    this._queuedMessage = null;
+    this.notifyStateChange();
+  }
+
   setNarratedMode(enabled: boolean): void {
     this._narratedMode = enabled;
+    this._userToggledNarratedMode = true;
     this.notifyStateChange();
   }
 
+  /**
+   * Update narrated mode without firing notifyStateChange.
+   * Used when React state is the source of truth (e.g., user toggle)
+   * to keep the stream manager in sync without overwriting React state.
+   */
+  setNarratedModeQuiet(enabled: boolean): void {
+    this._narratedMode = enabled;
+    this._userToggledNarratedMode = true;
+  }
+
   /**
    * Answer a pending question gate by clearing it and sending the selection as a message
    */
@@ -351,6 +413,7 @@ export class SessionStreamManager {
       isReconnecting: this._isReconnecting,
       reconnectAttempt: this._reconnectAttempt,
       narratedMode: this._narratedMode,
+      queuedMessage: this._queuedMessage,
     };
   }
 
@@ -359,7 +422,20 @@ export class SessionStreamManager {
   // -------------------------------------------------------------------------
 
   private notifyStateChange(): void {
-    this.callbacks.onStateChange?.(this.getState());
+    if (!this._notifyPending) {
+      this._notifyPending = true;
+      const notify = () => {
+        this._notifyPending = false;
+        this.callbacks.onStateChange?.(this.getState());
+      };
+      // Batch rapid state changes (e.g., multiple stream events per frame) into one callback.
+      // requestAnimationFrame syncs with display refresh (~16ms); queueMicrotask as fallback.
+      if (typeof requestAnimationFrame !== 'undefined') {
+        requestAnimationFrame(notify);
+      } else {
+        queueMicrotask(notify);
+      }
+    }
   }
 
   setMessages(messages: ClaudeMessage[]): void {
@@ -401,9 +477,16 @@ export class SessionStreamManager {
     // Check for gate markers in tool results and text content
     const gate = extractGateFromMessage(message);
     if (gate) {
+      // Skip if the previous gate has the same gateType (prevents duplicate consecutive cards)
+      const lastGate = [...this._messages].reverse().find(m => m.type === 'gate');
+      if (lastGate && lastGate.gateType === gate.gateType) {
+        return;
+      }
       // Add the gate message instead of (or in addition to) the raw message
       this._messages = [...this._messages, gate];
-      this._narratedMode = true; // Auto-enable narrated mode on first gate
+      if (!this._userToggledNarratedMode) {
+        this._narratedMode = true; // Auto-enable narrated mode on first gate
+      }
       this.callbacks.onGate?.(gate);
 
       // Question gates pause the workflow for user input
@@ -471,18 +554,19 @@ export class SessionStreamManager {
     this.reconnectTimeout = setTimeout(() => {
       if (this.stopped || !this.lastMessage) return;
 
-      // Remove the user message we added (will be re-added on retry)
-      // Find and remove the last user message
-      const lastUserIndex = this._messages.findLastIndex(m => m.type === 'user');
-      if (lastUserIndex >= 0) {
-        this._messages = this._messages.slice(0, lastUserIndex);
+      // Remove the user message we added (will be re-added on retry) — skip if hidden
+      if (!this._lastWasHidden) {
+        const lastUserIndex = this._messages.findLastIndex(m => m.type === 'user');
+        if (lastUserIndex >= 0) {
+          this._messages = this._messages.slice(0, lastUserIndex);
+        }
       }
 
       this._isReconnecting = false;
       this.notifyStateChange();
 
       // Retry the request
-      this.sendMessage(this.lastMessage, this.lastImages);
+      this.sendMessage(this.lastMessage, this.lastImages, { hidden: this._lastWasHidden });
     }, delay);
   }
 
@@ -491,36 +575,48 @@ export class SessionStreamManager {
   // -------------------------------------------------------------------------
 
   /**
-   * Send a message to Claude and stream the response
+   * Send a message to Claude and stream the response.
+   * When hidden is true, the user message is not added to visible messages —
+   * used for conversational sessions where Claude should speak first.
    */
-  async sendMessage(message: string, images?: AttachedImage[]): Promise<void> {
+  async sendMessage(message: string, images?: AttachedImage[], options?: { hidden?: boolean }): Promise<void> {
+    const hidden = options?.hidden ?? false;
     this.stopped = false;
 
     // Store for potential retry/reconnect
     this.lastMessage = message;
     this.lastImages = images;
+    this._lastWasHidden = hidden;
+
+    // Add user message immediately (unless hidden — conversational system instructions)
+    if (!hidden) {
+      const userMessage: ClaudeMessage = {
+        type: 'user',
+        content: message,
+        timestamp: Date.now(),
+      };
+      this.addMessage(userMessage);
+    }
 
-    // Add user message immediately
-    const userMessage: ClaudeMessage = {
-      type: 'user',
-      content: message,
-      timestamp: Date.now(),
-    };
-    this.addMessage(userMessage);
-
-    // For first message in a new session, show "creating" status for 5 seconds
+    // For first message in a new session, show "creating" status
+    // Conversational sessions skip the 5s delay and go straight to streaming
     if (this._isFirstMessage) {
       this._isFirstMessage = false;
-      this._status = 'creating';
-      this.notifyStateChange();
-
-      // Transition to streaming after 5 seconds
-      this.creatingStatusTimeout = setTimeout(() => {
-        if (this._status === 'creating') {
-          this._status = 'streaming';
-          this.notifyStateChange();
-        }
-      }, 5000);
+      if (this.sessionContext.conversational) {
+        this._status = 'streaming';
+        this.notifyStateChange();
+      } else {
+        this._status = 'creating';
+        this.notifyStateChange();
+
+        // Transition to streaming after 5 seconds
+        this.creatingStatusTimeout = setTimeout(() => {
+          if (this._status === 'creating') {
+            this._status = 'streaming';
+            this.notifyStateChange();
+          }
+        }, 5000);
+      }
     } else {
       // Set status to streaming
       this._status = 'streaming';
@@ -541,7 +637,6 @@ export class SessionStreamManager {
         },
         body: JSON.stringify({
           message,
-          conversationHistory: this._messages.slice(0, -1), // Exclude the user message we just added
           images: images?.map(img => ({
             type: img.type,
             data: img.dataUrl,
@@ -618,7 +713,7 @@ export class SessionStreamManager {
                 if (this.sessionContext.standalone && this.callbacks.onWorkItemCreated) {
                   const created = checkMessageForWorkItemCreation(claudeMessage);
                   if (created) {
-                    this.callbacks.onWorkItemCreated(created.id, created.title);
+                    this.callbacks.onWorkItemCreated(created.id, created.title, this.sessionContext.workItemId);
                   }
                 }
               }
@@ -667,6 +762,7 @@ export class SessionStreamManager {
     this._status = 'idle';
     this._isReconnecting = false;
     this._reconnectAttempt = 0;
+    this._queuedMessage = null; // Clear queue on stop
     this.notifyStateChange();
   }
 
@@ -681,6 +777,7 @@ export class SessionStreamManager {
     this._canRetry = false;
     this._isReconnecting = false;
     this._reconnectAttempt = 0;
+    this._queuedMessage = null;
     this.lastMessage = null;
     this.lastImages = undefined;
     this.notifyStateChange();
@@ -700,16 +797,18 @@ export class SessionStreamManager {
     this._error = null;
     this._canRetry = false;
 
-    // Remove the failed user message (will be re-added on retry)
-    const lastUserIndex = this._messages.findLastIndex(m => m.type === 'user');
-    if (lastUserIndex >= 0) {
-      this._messages = this._messages.slice(0, lastUserIndex);
+    // Remove the failed user message (will be re-added on retry) — skip if hidden
+    if (!this._lastWasHidden) {
+      const lastUserIndex = this._messages.findLastIndex(m => m.type === 'user');
+      if (lastUserIndex >= 0) {
+        this._messages = this._messages.slice(0, lastUserIndex);
+      }
     }
 
     this.notifyStateChange();
 
     // Resend the last message
-    this.sendMessage(this.lastMessage, this.lastImages);
+    this.sendMessage(this.lastMessage, this.lastImages, { hidden: this._lastWasHidden });
   }
 
   /**
@@ -717,6 +816,11 @@ export class SessionStreamManager {
    * This adds the gate directly to the message list without parsing from stream text.
    */
   injectGate(gateType: string, gateData: Record<string, unknown> = {}): void {
+    // Skip if the previous gate has the same type (prevents duplicate consecutive cards)
+    const lastGate = [...this._messages].reverse().find(m => m.type === 'gate');
+    if (lastGate && lastGate.gateType === gateType) {
+      return;
+    }
     const gate: ClaudeMessage = {
       type: 'gate',
       gateType,
@@ -724,7 +828,9 @@ export class SessionStreamManager {
       timestamp: Date.now(),
     };
     this._messages = [...this._messages, gate];
-    this._narratedMode = true;
+    if (!this._userToggledNarratedMode) {
+      this._narratedMode = true;
+    }
     this.callbacks.onGate?.(gate);
     this.notifyStateChange();
   }

package/apps/dashboard/lib/shadows.ts

@@ -0,0 +1,7 @@
+/** Design system elevation tokens — shared across all components. */
+export const shadow = {
+  sm: '0 1px 2px rgba(0,0,0,0.04), 0 2px 6px rgba(0,0,0,0.02)',
+  md: '0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.03)',
+  lg: '0 4px 12px rgba(0,0,0,0.06), 0 12px 28px rgba(0,0,0,0.05)',
+  overlay: '0 8px 24px rgba(0,0,0,0.12), 0 16px 48px rgba(0,0,0,0.08)',
+};

package/apps/dashboard/lib/tests.ts

@@ -12,6 +12,7 @@ export interface TestScenario {
   title: string;
   status: 'pass' | 'fail' | 'pending';
   duration: string;
+  lastRun: string | null;
   error?: string;
   failedStep?: string;
   steps: string[];
@@ -200,7 +201,7 @@ export function getTestDashboardData(): TestDashboardData {
   const featureFiles = getFeatureFiles(projectRoot);
 
   // Build a map of scenario name → latest DB result
-  let dbResults: Map<string, { status: string; duration_ms: number; error_message: string | null; failed_step: string | null }>;
+  let dbResults: Map<string, { status: string; duration_ms: number; error_message: string | null; failed_step: string | null; run_at: string }>;
   let lastRun: string | null = null;
   try {
     const rows = getLatestResults();
@@ -248,6 +249,7 @@ export function getTestDashboardData(): TestDashboardData {
         title: scenario.name,
         status,
         duration,
+        lastRun: result?.run_at || null,
         error,
         failedStep,
         steps: scenario.steps,

package/apps/dashboard/lib/utils.ts

@@ -4,3 +4,9 @@ import { twMerge } from "tailwind-merge"
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs))
 }
+
+export function getWebSocketUrl(): string {
+  return typeof window !== 'undefined'
+    ? `ws://${window.location.hostname}:47808`
+    : 'ws://localhost:47808';
+}

package/apps/dashboard/next.config.js

@@ -1,9 +1,5 @@
 const path = require('path');
 
-// Dashboard is at apps/dashboard, jettypod lib is at ../../lib relative to that
-// process.cwd() is the dashboard directory during build
-const jettypodLibPath = path.resolve(process.cwd(), '../../lib');
-
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   // Externalize modules with native bindings or dynamic requires
@@ -18,22 +14,47 @@ const nextConfig = {
   // The webpack externals below properly externalize the jettypod lib chain
 
   webpack: (config, { isServer }) => {
+    // Split @dnd-kit into a separate chunk so it doesn't block initial page parse.
+    // The chunk loads in parallel and is only needed when KanbanBoard renders.
+    if (!isServer) {
+      config.optimization = config.optimization || {};
+      config.optimization.splitChunks = config.optimization.splitChunks || {};
+      config.optimization.splitChunks.cacheGroups = {
+        ...config.optimization.splitChunks.cacheGroups,
+        dndkit: {
+          test: /[\\/]node_modules[\\/]@dnd-kit[\\/]/,
+          name: 'dnd-kit',
+          chunks: 'all',
+          priority: 30,
+        },
+      };
+    }
+
     if (isServer) {
-      // Externalize the jettypod lib using absolute path resolution
       config.externals = config.externals || [];
-      config.externals.push(({ request, context }, callback) => {
-        // Externalize any require that goes to jettypod lib (dynamic requires)
+      config.externals.push(({ request }, callback) => {
+        // Externalize worktree-facade with RUNTIME path resolution.
+        // Uses 'var' external type so the path expression evaluates at runtime,
+        // not at build time (which would bake in the build machine's absolute path).
+        // Packaged app: JETTYPOD_RESOURCES_PATH/bin/lib/<module>
+        // Dev mode: process.cwd()/../../lib/<module>
         if (request && request.includes('lib/worktree-facade')) {
-          // Use absolute path to jettypod lib
           const moduleName = request.split('lib/')[1];
-          const absolutePath = path.join(jettypodLibPath, moduleName);
-          return callback(null, `commonjs ${absolutePath}`);
+          return callback(null,
+            `var require(process.env.JETTYPOD_RESOURCES_PATH ` +
+            `? require('path').join(process.env.JETTYPOD_RESOURCES_PATH, 'bin', 'lib', '${moduleName}') ` +
+            `: require('path').resolve(process.cwd(), '../../lib', '${moduleName}'))`
+          );
         }
-        // Externalize run-migrations.js - it uses dynamic require() to load
-        // migration files at runtime, which webpack replaces with a dead stub
+        // Externalize run-migrations.js with RUNTIME path resolution.
+        // It uses dynamic require() to load migration files, which webpack
+        // replaces with a dead stub if bundled.
+        // In both packaged and dev: process.cwd() is the dashboard dir,
+        // and run-migrations.js is at lib/run-migrations.js relative to it.
         if (request && request.includes('run-migrations')) {
-          const absolutePath = path.resolve(context || __dirname, request);
-          return callback(null, `commonjs ${absolutePath}`);
+          return callback(null,
+            `var require(require('path').join(process.cwd(), 'lib', 'run-migrations'))`
+          );
         }
         callback(undefined);
       });

package/apps/dashboard/package.json

@@ -1,10 +1,10 @@
 {
   "name": "dashboard",
-  "version": "0.1.0",
+  "version": "4.4.120",
   "private": true,
   "main": "electron/main.js",
   "scripts": {
-    "dev": "next dev --webpack",
+    "dev": "concurrently -n next,ws -c blue,green \"next dev --webpack\" \"node scripts/ws-server.js\"",
     "build": "next build --webpack",
     "start": "next start",
     "lint": "eslint",
@@ -18,7 +18,9 @@
     "electron:build:mac:universal": "npm run build && npx electron-builder --config electron-builder.config.js --mac --universal",
     "electron:build:win": "npm run build && npx electron-builder --config electron-builder.config.js --win",
     "electron:build:linux": "npm run build && npx electron-builder --config electron-builder.config.js --linux",
-    "electron:pack": "npm run build && npx electron-builder --config electron-builder.config.js --dir"
+    "electron:pack": "npm run build && npx electron-builder --config electron-builder.config.js --dir",
+    "upload:r2": "node scripts/upload-to-r2.js",
+    "electron:release": "npm run electron:build:mac && npm run upload:r2"
   },
   "dependencies": {
     "@dnd-kit/core": "^6.3.1",
@@ -45,6 +47,7 @@
     "@types/node": "^20",
     "@types/react": "^19",
     "@types/react-dom": "^19",
+    "concurrently": "^9.2.1",
     "electron": "^32.0.0",
     "electron-builder": "^26.4.0",
     "eslint": "^9",