jettypod 4.4.120 → 4.4.121

package/apps/dashboard/components/RealTimeKanbanWrapper.tsx

@@ -1,7 +1,5 @@
-'use client';
-
-import { useState, useCallback, useEffect, useRef, useMemo } from 'react';
-import { useSearchParams, useRouter } from 'next/navigation';
+import { useState, useCallback, useEffect, useRef, useMemo, startTransition } from 'react';
+import { useSearchParams, useNavigate } from 'react-router-dom';
 import { KanbanBoard } from './KanbanBoard';
 import { OnboardingWelcome } from './OnboardingWelcome';
 import { useToast } from './Toast';
@@ -10,9 +8,11 @@ import { useSessionState, useSessionActions, useSessionPersistence } from '../co
 import { useConnectionStatus } from '../contexts/ConnectionStatusContext';
 import { useUsage } from '../contexts/UsageContext';
 import type { InFlightItem, KanbanGroup } from '@/lib/db';
+import { invoke } from '@/lib/tauri';
+import { dataBridge, invalidateKanbanCache, isLocalMutationRecent, markLocalMutation, patchKanbanItem } from '@/lib/data-bridge';
 import { getRegistry } from '@/lib/stream-manager-registry';
 import { getWebSocketUrl } from '@/lib/utils';
-import { type KanbanData, findItemById, getOnboardingItems, buildStatusMap, buildModeMap } from '@/lib/kanban-utils';
+import { type KanbanData, findItemById, getOnboardingItems, buildStatusMap, buildModeMap, applyStatusChange, applyTitleChange, applyOrderChange, applyEpicAssign } from '@/lib/kanban-utils';
 import { useKanbanUndo } from '../hooks/useKanbanUndo';
 import { useKanbanAnimation } from '../hooks/useKanbanAnimation';
 
@@ -29,27 +29,51 @@ interface RealTimeKanbanWrapperProps {
 // Component uses context providers from AppShell (ToastProvider, ClaudeSessionProvider)
 // DO NOT wrap with duplicate providers - it creates isolated context state
 export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: RealTimeKanbanWrapperProps) {
-  const searchParams = useSearchParams();
-  const router = useRouter();
+  const [searchParams] = useSearchParams();
+  const navigate = useNavigate();
   const { showToast } = useToast();
   const { allowed: usageAllowed } = useUsage();
-  const [data, setData] = useState<KanbanData>(() => ({
-    inFlight: initialData.inFlight,
-    backlog: new Map(initialData.backlog),
-    done: new Map(initialData.done),
-  }));
+  const [data, setData] = useState<KanbanData>(() => {
+    const inFlight = initialData.inFlight;
+    const backlog = new Map(initialData.backlog);
+    const done = new Map(initialData.done);
+    // Build lookup maps for initial data
+    const itemMap = new Map<number, InFlightItem>();
+    const statusMap = new Map<number, string>();
+    for (const item of inFlight) {
+      itemMap.set(item.id, item);
+      statusMap.set(item.id, item.status);
+    }
+    for (const group of backlog.values()) {
+      for (const item of group.items) {
+        itemMap.set(item.id, item as InFlightItem);
+        statusMap.set(item.id, item.status);
+      }
+    }
+    for (const group of done.values()) {
+      for (const item of group.items) {
+        itemMap.set(item.id, item as InFlightItem);
+        statusMap.set(item.id, item.status);
+      }
+    }
+    return { inFlight, backlog, done, itemMap, statusMap };
+  });
   const [statusError, setStatusError] = useState<string | null>(null);
 
   // Ref to latest data — lets callbacks read current data without closing over it,
   // keeping function references stable across data changes (preserves memo on cards)
   const dataRef = useRef(data);
-  dataRef.current = data;
+  useEffect(() => { dataRef.current = data; }, [data]);
 
   // Use ClaudeSessionContext for session state and actions
   const { sessions, standaloneSessions } = useSessionState();
   const { setClaudePanelOpen, openSession, switchSession, closeSession, createAddToBacklogSession, sendMessage } = useSessionActions();
   const { setSessions } = useSessionPersistence();
 
+  // Stable set of active session IDs — only changes when sessions are added/removed,
+  // not when session metadata updates. Prevents busting React.memo on all EpicGroups.
+  const activeSessionIds = useMemo(() => new Set(sessions.keys()), [sessions]);
+
   // Onboarding state: show OnboardingWelcome instead of KanbanBoard for blank projects
   const [showOnboarding, setShowOnboarding] = useState(!!isBlank);
   const onboardingItems = useMemo(() => getOnboardingItems(data), [data]);
@@ -67,7 +91,7 @@ export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: Rea
   const handleExternalAnimationComplete = useCallback(() => {
     const pending = rawHandleExternalAnimationComplete();
     if (pending) {
-      setData(pending);
+      startTransition(() => setData(pending));
     }
   }, [rawHandleExternalAnimationComplete]);
 
@@ -78,18 +102,6 @@ export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: Rea
   const dbChangeTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const kanbanFetchAbortRef = useRef<AbortController | null>(null);
 
-  const refreshData = useCallback(async (): Promise<KanbanData> => {
-    const kanbanResponse = await fetch('/api/kanban');
-    const newData = await kanbanResponse.json();
-    const kanbanData: KanbanData = {
-      inFlight: newData.inFlight,
-      backlog: new Map(newData.backlog),
-      done: new Map(newData.done),
-    };
-    setData(kanbanData);
-    return kanbanData;
-  }, []);
-
   // Sync session titles with work item titles from kanban data
   const syncSessionTitles = useCallback((kanbanData: KanbanData) => {
     setSessions(prev => {
@@ -123,142 +135,177 @@ export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: Rea
     const previousStatus = found?.status;
     const itemTitle = found?.item.title ?? `Item #${id}`;
 
-    try {
-      if (newStatus === 'done') {
-        lastInternallyAnimatedIdRef.current = id;
-      }
+    if (newStatus === 'done') {
+      lastInternallyAnimatedIdRef.current = id;
+    }
 
-      const response = await fetch(`/api/work/${id}/status`, {
-        method: 'PATCH',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ status: newStatus }),
+    // Optimistic: update UI immediately, suppress WS refetches during IPC
+    startTransition(() => setData(prev => applyStatusChange(prev, id, newStatus)));
+    markLocalMutation();
+
+    if (!skipUndo && previousStatus && previousStatus !== newStatus) {
+      pushActionRef.current({
+        type: 'status_change',
+        itemId: id,
+        itemTitle,
+        before: previousStatus,
+        after: newStatus,
+        timestamp: Date.now(),
       });
-      if (!response.ok) {
-        if (response.status === 404) {
-          setStatusError('Item no longer exists');
-          await refreshData();
-          return { success: false, notFound: true };
-        } else {
-          setStatusError('Failed to update status');
-          await refreshData();
-          return { success: false };
-        }
-      }
+    }
 
-      if (!skipUndo && previousStatus && previousStatus !== newStatus) {
-        pushActionRef.current({
-          type: 'status_change',
-          itemId: id,
-          itemTitle,
-          before: previousStatus,
-          after: newStatus,
-          timestamp: Date.now(),
-        });
+    // Fire IPC in background
+    try {
+      const success = await dataBridge.updateStatus(id, newStatus);
+      if (!success) {
+        // Rollback with reverse mutation
+        startTransition(() => setData(prev => applyStatusChange(prev, id, previousStatus ?? 'backlog')));
+        setStatusError('Failed to update status');
+        return { success: false };
       }
-
-      await refreshData();
       if (newStatus === 'done') {
         lastInternallyAnimatedIdRef.current = null;
       }
       return { success: true };
-    } catch {
-      setStatusError('Failed to update status');
+    } catch (err) {
+      // Rollback with reverse mutation
+      startTransition(() => setData(prev => applyStatusChange(prev, id, previousStatus ?? 'backlog')));
+      const msg = err instanceof Error ? err.message : String(err);
+      console.error('Status update failed:', msg);
+      setStatusError(`Failed to update status: ${msg}`);
       return { success: false };
     }
-  }, [refreshData, lastInternallyAnimatedIdRef]);
+  }, [lastInternallyAnimatedIdRef]);
 
   const { pushAction, handleUndo, handleRedo, canUndo, canRedo } = useKanbanUndo({
     onStatusChange: handleStatusChange,
     showToast,
   });
-  pushActionRef.current = pushAction;
+  useEffect(() => { pushActionRef.current = pushAction; }, [pushAction]);
 
-  const handleMessage = useCallback((message: WebSocketMessage) => {
-    if (message.type === 'db_change') {
-      // Debounce: clear any pending fetch, coalesce rapid db_change events
-      if (dbChangeTimerRef.current) {
-        clearTimeout(dbChangeTimerRef.current);
-      }
+  // Full refetch handler — shared between db_change and db_delta fallback
+  const doFullRefetch = useCallback(async () => {
+    if (isLocalMutationRecent()) return;
 
-      dbChangeTimerRef.current = setTimeout(async () => {
-        // Abort any in-flight fetch from a previous db_change
-        if (kanbanFetchAbortRef.current) {
-          kanbanFetchAbortRef.current.abort();
-        }
-        const abortController = new AbortController();
-        kanbanFetchAbortRef.current = abortController;
+    const oldStatusMap = buildStatusMap(dataRef.current);
+    const internallyAnimatedId = lastInternallyAnimatedIdRef.current;
 
-        const oldStatusMap = buildStatusMap(dataRef.current);
-        const internallyAnimatedId = lastInternallyAnimatedIdRef.current;
+    invalidateKanbanCache();
 
-        let rawData;
-        try {
-          const kanbanResponse = await fetch('/api/kanban', { signal: abortController.signal });
-          rawData = await kanbanResponse.json();
-        } catch (e: unknown) {
-          if (e instanceof DOMException && e.name === 'AbortError') return;
-          throw e;
-        }
+    let newKanbanData: KanbanData;
+    try {
+      newKanbanData = await dataBridge.getKanbanData();
+    } catch (e: unknown) {
+      console.error('Failed to refresh kanban data:', e);
+      return;
+    }
 
-        const newKanbanData: KanbanData = {
-          inFlight: rawData.inFlight,
-          backlog: new Map(rawData.backlog),
-          done: new Map(rawData.done),
-        };
-        const newStatusMap = buildStatusMap(newKanbanData);
+    if (newKanbanData === dataRef.current) return;
 
-        // Detect feature mode changes and inject gate cards into active sessions
-        const newModeMap = buildModeMap(newKanbanData);
-        if (previousModeMapRef.current) {
-          const registry = getRegistry();
-          for (const [featureId, newMode] of newModeMap) {
-            const oldMode = previousModeMapRef.current.get(featureId);
-            if (newMode && newMode !== oldMode) {
-              const sessionId = String(featureId);
-              const streamManager = registry.get(sessionId);
-              if (streamManager) {
-                streamManager.injectGate(`mode-${newMode}-start`);
-              }
-            }
-          }
-        }
-        previousModeMapRef.current = newModeMap;
-
-        // Check if any item transitioned to done externally
-        let newlyDoneItemId: number | null = null;
-        for (const [id, newStatus] of newStatusMap) {
-          const oldStatus = oldStatusMap.get(id);
-          if (newStatus === 'done' && oldStatus && oldStatus !== 'done') {
-            newlyDoneItemId = id;
-            break;
+    const newStatusMap = buildStatusMap(newKanbanData);
+
+    // Detect feature mode changes and inject gate cards into active sessions
+    const newModeMap = buildModeMap(newKanbanData);
+    if (previousModeMapRef.current) {
+      const registry = getRegistry();
+      for (const [featureId, newMode] of newModeMap) {
+        const oldMode = previousModeMapRef.current.get(featureId);
+        if (newMode && newMode !== oldMode) {
+          const sessionId = String(featureId);
+          const streamManager = registry.get(sessionId);
+          if (streamManager) {
+            streamManager.injectGate(`mode-${newMode}-start`);
           }
         }
+      }
+    }
+    previousModeMapRef.current = newModeMap;
+
+    // Check if any item transitioned to done externally
+    let newlyDoneItemId: number | null = null;
+    for (const [id, newStatus] of newStatusMap) {
+      const oldStatus = oldStatusMap.get(id);
+      if (newStatus === 'done' && oldStatus && oldStatus !== 'done') {
+        newlyDoneItemId = id;
+        break;
+      }
+    }
+
+    if (newlyDoneItemId !== null && externalAnimatingItemId === null) {
+      if (internallyAnimatedId === newlyDoneItemId) {
+        startTransition(() => setData(newKanbanData));
+        syncSessionTitles(newKanbanData);
+        return;
+      }
+      pendingDataRef.current = newKanbanData;
+      setExternalAnimatingItemId(newlyDoneItemId);
+      syncSessionTitles(newKanbanData);
+    } else {
+      startTransition(() => setData(newKanbanData));
+      syncSessionTitles(newKanbanData);
+    }
+  }, [syncSessionTitles, externalAnimatingItemId, lastInternallyAnimatedIdRef, pendingDataRef, setExternalAnimatingItemId]);
 
-        if (newlyDoneItemId !== null && externalAnimatingItemId === null) {
-          if (internallyAnimatedId === newlyDoneItemId) {
-            setData(newKanbanData);
-            syncSessionTitles(newKanbanData);
-            return;
+  const handleMessage = useCallback((message: WebSocketMessage) => {
+    // ---- Delta updates (from SQLite update_hook via Tauri IPC writes) ----
+    if (message.type === 'db_delta' && message.table === 'work_items' && message.rowid != null) {
+      if (isLocalMutationRecent()) return;
+
+      // For updates to existing items, try a targeted single-item patch.
+      // For inserts/deletes or non-work_items tables, fall back to full refetch.
+      if (message.action === 'update') {
+        // Debounce rapid deltas (e.g., batch display_order updates)
+        if (dbChangeTimerRef.current) clearTimeout(dbChangeTimerRef.current);
+        dbChangeTimerRef.current = setTimeout(async () => {
+          if (isLocalMutationRecent()) return;
+          const patched = await patchKanbanItem(message.rowid!);
+          if (patched) {
+            // Successfully patched — apply without full refetch
+            if (patched !== dataRef.current) {
+              startTransition(() => setData(patched));
+              syncSessionTitles(patched);
+            }
+          } else {
+            // Patch failed (status changed, item not in cache) — full refetch
+            await doFullRefetch();
           }
-          pendingDataRef.current = newKanbanData;
-          setExternalAnimatingItemId(newlyDoneItemId);
-          syncSessionTitles(newKanbanData);
-        } else {
-          setData(newKanbanData);
-          syncSessionTitles(newKanbanData);
-        }
+        }, 50);
+      } else {
+        // Insert or delete — full refetch (these are infrequent)
+        if (dbChangeTimerRef.current) clearTimeout(dbChangeTimerRef.current);
+        dbChangeTimerRef.current = setTimeout(() => {
+          if (isLocalMutationRecent()) return;
+          doFullRefetch();
+        }, 150);
+      }
+      return;
+    }
+
+    // ---- Full refetch fallback (from file mtime polling — external writes) ----
+    if (message.type === 'db_change') {
+      if (isLocalMutationRecent()) return;
+      if (dbChangeTimerRef.current) clearTimeout(dbChangeTimerRef.current);
+      dbChangeTimerRef.current = setTimeout(() => {
+        if (isLocalMutationRecent()) return;
+        doFullRefetch();
       }, 150);
     }
-  }, [syncSessionTitles, externalAnimatingItemId, lastInternallyAnimatedIdRef, pendingDataRef, setExternalAnimatingItemId]);
+  }, [syncSessionTitles, doFullRefetch]);
 
   const handleTitleSave = useCallback(async (id: number, newTitle: string) => {
-    await fetch(`/api/work/${id}/title`, {
-      method: 'PATCH',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ title: newTitle }),
-    });
-    await refreshData();
-  }, [refreshData]);
+    const previousTitle = dataRef.current.itemMap.get(id)?.title ?? '';
+
+    // Optimistic: update UI immediately, suppress WS refetches during IPC
+    startTransition(() => setData(prev => applyTitleChange(prev, id, newTitle)));
+    markLocalMutation();
+
+    try {
+      await dataBridge.updateTitle(id, newTitle);
+    } catch {
+      // Rollback
+      startTransition(() => setData(prev => applyTitleChange(prev, id, previousTitle)));
+    }
+  }, []);
 
   const handleReject = useCallback(async (id: number, reason: string) => {
     setStatusError(null);
@@ -267,79 +314,116 @@ export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: Rea
     const previousStatus = found?.status;
     const itemTitle = found?.item.title ?? `Item #${id}`;
 
-    try {
-      const response = await fetch(`/api/work/${id}/status`, {
-        method: 'PATCH',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ status: 'in_progress', rejectionReason: reason }),
+    // Optimistic: move to in_progress with rejection info immediately, suppress WS refetches during IPC
+    startTransition(() => setData(prev => applyStatusChange(prev, id, 'in_progress', { reason })));
+    markLocalMutation();
+
+    if (previousStatus && previousStatus !== 'in_progress') {
+      pushAction({
+        type: 'status_change',
+        itemId: id,
+        itemTitle,
+        before: previousStatus,
+        after: 'in_progress',
+        timestamp: Date.now(),
       });
-      if (!response.ok) {
-        setStatusError('Failed to reject item');
-        return;
+    }
+
+    showToast(`Rejected: "${itemTitle}" — ${reason}`);
+
+    // Open chat session for the rejected item so Claude can address the rejection
+    const sessionId = String(id);
+    const itemType = found?.item.type ?? 'chore';
+    openSession(sessionId, itemTitle, itemType, false, null, true);
+
+    // Inject rejection gate and send reason to Claude
+    setTimeout(() => {
+      const registry = getRegistry();
+      const streamManager = registry.get(sessionId);
+      if (streamManager) {
+        streamManager.injectGate('rejection', { reason });
       }
+      sendMessage(reason);
+    }, 0);
 
-      if (previousStatus && previousStatus !== 'in_progress') {
-        pushAction({
-          type: 'status_change',
-          itemId: id,
-          itemTitle,
-          before: previousStatus,
-          after: 'in_progress',
-          timestamp: Date.now(),
-        });
+    // Fire IPC in background
+    try {
+      const success = await dataBridge.updateStatus(id, 'in_progress', reason);
+      if (!success) {
+        // Rollback
+        startTransition(() => setData(prev => applyStatusChange(prev, id, previousStatus ?? 'backlog')));
+        setStatusError('Failed to reject item');
+        return;
       }
 
-      await refreshData();
-      showToast(`Rejected: "${itemTitle}" — ${reason}`);
-
-      // Open chat session for the rejected item so Claude can address the rejection
-      const sessionId = String(id);
-      const itemType = found?.item.type ?? 'chore';
-      openSession(sessionId, itemTitle, itemType, false, null, true);
-
-      // Inject rejection gate card on next tick
-      // (after React state updates from openSession have been committed)
-      setTimeout(() => {
-        const registry = getRegistry();
-        const streamManager = registry.get(sessionId);
-        if (streamManager) {
-          streamManager.injectGate('rejection', { reason });
+      // Load existing conversation + persisted rejection gate from DB into stream manager.
+      // Fire-and-forget — don't block the rejection flow on content loading.
+      void (async () => {
+        try {
+          const registry = getRegistry();
+          const mgr = registry.get(sessionId);
+          if (mgr && mgr.status !== 'streaming' && mgr.messages.length === 0) {
+            const content = await invoke<string>('db_get_session_content', { id: parseInt(sessionId, 10) });
+            if (content) {
+              try {
+                const parsed = JSON.parse(content);
+                if (Array.isArray(parsed) && parsed.length > 0) {
+                  mgr.setMessages(parsed);
+                }
+              } catch {
+                // Content wasn't JSON array — ignore
+              }
+            }
+          }
+        } catch {
+          // Content loading failed — gate was still persisted to DB, will show on next refresh
         }
-      }, 0);
-    } catch {
-      setStatusError('Failed to reject item');
+      })();
+    } catch (err) {
+      // Rollback
+      startTransition(() => setData(prev => applyStatusChange(prev, id, previousStatus ?? 'backlog')));
+      const msg = err instanceof Error ? err.message : String(err);
+      console.error('Reject failed:', msg);
+      setStatusError(`Failed to reject item: ${msg}`);
     }
-  }, [refreshData, pushAction, showToast, openSession]);
+  }, [pushAction, showToast, openSession, sendMessage]);
 
   const handleOrderChange = useCallback(async (id: number, newOrder: number) => {
+    const item = dataRef.current.itemMap.get(id);
+    // Use effective display_order for rollback — null maps to id*10 in sort
+    // comparators, so use that same value to preserve original position on failure.
+    const previousOrder = item?.display_order ?? (item ? item.id * 10 : 0);
+
+    // Optimistic: update order immediately, suppress WS refetches during IPC
+    startTransition(() => setData(prev => applyOrderChange(prev, id, newOrder)));
+    markLocalMutation();
+
     try {
-      const response = await fetch(`/api/work/${id}/order`, {
-        method: 'PATCH',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ display_order: newOrder }),
-      });
-      if (!response.ok) {
-        throw new Error('Failed to update order');
-      }
-      await refreshData();
+      await dataBridge.updateDisplayOrders([[id, newOrder]]);
     } catch (error) {
+      // Rollback
+      startTransition(() => setData(prev => applyOrderChange(prev, id, previousOrder)));
       const errorMessage = error instanceof Error ? error.message : 'Failed to reorder item';
       showToast(errorMessage, 'error');
     }
-  }, [refreshData, showToast]);
+  }, [showToast]);
 
   const handleEpicAssign = useCallback(async (id: number, epicId: number | null) => {
+    const previousEpicId = dataRef.current.itemMap.get(id)?.parent_id ?? null;
+
+    // Optimistic: move between epic groups immediately, suppress WS refetches during IPC
+    startTransition(() => setData(prev => applyEpicAssign(prev, id, epicId)));
+    markLocalMutation();
+
     try {
-      await fetch(`/api/work/${id}/epic`, {
-        method: 'PATCH',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ epic_id: epicId }),
-      });
-      await refreshData();
+      await invoke('db_assign_epic', { id, epicId });
+      invalidateKanbanCache();
     } catch {
+      // Rollback
+      startTransition(() => setData(prev => applyEpicAssign(prev, id, previousEpicId)));
       showToast('Failed to assign epic', 'error');
     }
-  }, [refreshData, showToast]);
+  }, [showToast]);
 
   const handleDragError = useCallback((message: string) => {
     showToast(message, 'error');
@@ -377,8 +461,9 @@ export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: Rea
       if (streamManager) {
         streamManager.injectGate('rejection', { reason });
       }
+      sendMessage(reason);
     }, 0);
-  }, [openSession]);
+  }, [openSession, sendMessage]);
 
   const handleAddToBacklog = useCallback(async () => {
     await createAddToBacklogSession();
@@ -421,7 +506,7 @@ export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: Rea
     if (!rejectedId || !reason) return;
 
     // Clean the URL immediately
-    router.replace('/', { scroll: false });
+    navigate('/', { replace: true });
 
     const found = findItemById(dataRef.current, parseInt(rejectedId, 10));
     const itemTitle = found?.item.title ?? `Item #${rejectedId}`;
@@ -435,11 +520,12 @@ export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: Rea
       if (streamManager) {
         streamManager.injectGate('rejection', { reason });
       }
+      sendMessage(reason);
     }, 0);
-  }, [searchParams, router, openSession]);
+  }, [searchParams, navigate, openSession, sendMessage]);
 
   return (
-    <div className="h-full flex flex-col">
+    <div className="flex flex-col min-h-0">
       {statusError && (
         <div
           className="mb-4 p-3 bg-red-100 dark:bg-red-900/30 text-red-700 dark:text-red-300 rounded-lg flex items-center justify-between flex-shrink-0"
@@ -455,39 +541,38 @@ export function RealTimeKanbanWrapper({ initialData, isBlank, projectPath }: Rea
           </button>
         </div>
       )}
-      <div className="flex-1 min-h-0">
-        {showOnboarding ? (
-          <OnboardingWelcome
-            onboardingItems={onboardingItems}
-            onStartChore={handleStartOnboardingChore}
-          />
-        ) : (
-          <KanbanBoard
-            inFlight={data.inFlight}
-            backlog={data.backlog}
-            done={data.done}
-            onTitleSave={handleTitleSave}
-            onStatusChange={handleStatusChange}
-            onReject={handleReject}
-            onRestart={handleRestart}
-            onOrderChange={handleOrderChange}
-            onEpicAssign={handleEpicAssign}
-            onTriggerClaude={handleTriggerClaude}
-            onOpenSession={handleOpenSession}
-            onCloseSession={handleCloseSession}
-            activeSessions={sessions}
-            onUndo={handleUndo}
-            onRedo={handleRedo}
-            canUndo={canUndo}
-            canRedo={canRedo}
-            onError={handleDragError}
-            onAddToBacklog={handleAddToBacklog}
-            usageAllowed={usageAllowed}
-            externalAnimatingItemId={externalAnimatingItemId}
-            onExternalAnimationComplete={handleExternalAnimationComplete}
-          />
-        )}
-      </div>
+      {showOnboarding ? (
+        <OnboardingWelcome
+          onboardingItems={onboardingItems}
+          onStartChore={handleStartOnboardingChore}
+        />
+      ) : (
+        <KanbanBoard
+          inFlight={data.inFlight}
+          backlog={data.backlog}
+          done={data.done}
+          itemStatusMap={data.statusMap}
+          onTitleSave={handleTitleSave}
+          onStatusChange={handleStatusChange}
+          onReject={handleReject}
+          onRestart={handleRestart}
+          onOrderChange={handleOrderChange}
+          onEpicAssign={handleEpicAssign}
+          onTriggerClaude={handleTriggerClaude}
+          onOpenSession={handleOpenSession}
+          onCloseSession={handleCloseSession}
+          activeSessionIds={activeSessionIds}
+          onUndo={handleUndo}
+          onRedo={handleRedo}
+          canUndo={canUndo}
+          canRedo={canRedo}
+          onError={handleDragError}
+          onAddToBacklog={handleAddToBacklog}
+          usageAllowed={usageAllowed}
+          externalAnimatingItemId={externalAnimatingItemId}
+          onExternalAnimationComplete={handleExternalAnimationComplete}
+        />
+      )}
     </div>
   );
 }