feat(rah-light): remove chat pane, simplify to two-panel layout

- Deleted src/components/panes/ChatPane.tsx
- Removed 'chat' from PaneType in types.ts
- Updated ThreePanelLayout.tsx to remove chat pane case and references
- Updated LeftToolbar.tsx to remove chat icon and type
- Default slot B is now null (closed) instead of chat
- Cmd+\ now opens node pane instead of chat

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/components/layout/LeftToolbar.tsx

@@ -5,7 +5,6 @@ import {
   Search,
   Plus,
   LayoutList,
-  MessageSquare,
   Map,
   Folder,
   Workflow,
@@ -23,10 +22,9 @@ interface LeftToolbarProps {
   slotBType: PaneType | null;
 }
 
-// Map pane types to their icons
+// Map pane types to their icons (chat removed in rah-light)
 const PANE_TYPE_ICONS: Record<string, typeof LayoutList> = {
   views: LayoutList,
-  chat: MessageSquare,
   map: Map,
   dimensions: Folder,
   workflows: Workflow,
@@ -34,14 +32,13 @@ const PANE_TYPE_ICONS: Record<string, typeof LayoutList> = {
 
 const PANE_TYPE_LABELS: Record<string, string> = {
   views: 'Feed',
-  chat: 'Chat',
   map: 'Map',
   dimensions: 'Dimensions',
   workflows: 'Workflows',
 };
 
-// Pane types shown in the toolbar (excludes 'node' which is opened via Feed)
+// Pane types shown in the toolbar (excludes 'node' which is opened via Feed, chat removed in rah-light)
-const TOOLBAR_PANE_TYPES: PaneType[] = ['views', 'chat', 'map', 'dimensions', 'workflows'];
+const TOOLBAR_PANE_TYPES: PaneType[] = ['views', 'map', 'dimensions', 'workflows'];
 
 interface ToolbarButtonProps {
   icon: typeof Search;

src/components/layout/ThreePanelLayout.tsx

@@ -6,7 +6,7 @@ import SearchModal from '../nodes/SearchModal';
 import { Node } from '@/types/database';
 import { DatabaseEvent } from '@/services/events';
 import { usePersistentState } from '@/hooks/usePersistentState';
-import type { ChatMessage } from '@/components/agents/hooks/useSSEChat';
+// ChatMessage import removed - chat disabled in rah-light
 
 // Stub type for delegation (delegation system removed in rah-light)
 type AgentDelegation = {
@@ -25,8 +25,8 @@ type AgentDelegation = {
 import LeftToolbar from './LeftToolbar';
 import SplitHandle from './SplitHandle';
 
-// Pane components
+// Pane components (ChatPane removed in rah-light)
-import { NodePane, ChatPane, WorkflowsPane, DimensionsPane, MapPane, ViewsPane } from '../panes';
+import { NodePane, WorkflowsPane, DimensionsPane, MapPane, ViewsPane } from '../panes';
 import QuickAddInput from '../agents/QuickAddInput';
 import type { PaneType, SlotState, PaneAction } from '../panes/types';
 
@@ -35,14 +35,14 @@ export default function ThreePanelLayout() {
   const containerRef = useRef<HTMLDivElement>(null);
 
   // Slot states - the core of the flexible pane system
-  // Default: Feed on left, Chat on right
+  // Default: Feed on left, closed on right (chat removed in rah-light)
-  const [slotA, setSlotA] = usePersistentState<SlotState | null>('ui.slotA.v3', {
+  const [slotA, setSlotA] = usePersistentState<SlotState | null>('ui.slotA.v4', {
     type: 'views',
   });
 
   // SlotB can be null (closed) or a SlotState
-  // Default: Chat on the right
+  // Default: closed (chat removed in rah-light)
-  const [slotB, setSlotB] = usePersistentState<SlotState | null>('ui.slotB.v3', { type: 'chat' });
+  const [slotB, setSlotB] = usePersistentState<SlotState | null>('ui.slotB.v4', null);
 
   // SlotB width as percentage (when open)
   const [slotBWidth, setSlotBWidth] = usePersistentState<number>('ui.slotBWidth', 50);
@@ -75,17 +75,14 @@ export default function ThreePanelLayout() {
   const [focusPanelRefresh, setFocusPanelRefresh] = useState(0);
   const [folderViewRefresh, setFolderViewRefresh] = useState(0);
 
-  // Active dimension tracking (for chat context)
+  // Active dimension tracking
   const [activeDimension, setActiveDimension] = usePersistentState<string | null>('ui.focus.activeDimension', null);
 
   // Delegations state (deprecated - kept for component compatibility)
   const [delegationsMap] = useState<Record<string, AgentDelegation>>({});
   const delegations = useMemo(() => Object.values(delegationsMap), [delegationsMap]);
 
-  // Chat state (lifted to persist across pane type changes)
+  // Source awareness - highlighted passage context
-  const [chatMessages, setChatMessages] = useState<ChatMessage[]>([]);
-
-  // Source awareness - highlighted passage context for agent
   const [highlightedPassage, setHighlightedPassage] = useState<{
     nodeId: number;
     nodeTitle: string;
@@ -95,29 +92,13 @@ export default function ThreePanelLayout() {
   // Ref to get current openTabs value in SSE handler
   const openTabsRef = useRef<number[]>([]);
 
-  // Get open tabs from the slot that has nodes (for chat context)
+  // Get open tabs from the slot that has nodes
   // Memoize to prevent infinite re-renders
   const { openTabs, activeTab } = useMemo(() => {
     const slotAHasNodes = slotA?.type === 'node';
     const slotBHasNodes = slotB?.type === 'node';
 
-    // If chat is in Slot A, use Slot B's nodes
+    // Use Slot A if it has nodes
-    if (slotA?.type === 'chat' && slotBHasNodes) {
-      return {
-        openTabs: slotB.nodeTabs ?? [],
-        activeTab: slotB.activeNodeTab ?? null,
-      };
-    }
-
-    // If chat is in Slot B (default), use Slot A's nodes
-    if (slotB?.type === 'chat' && slotAHasNodes && slotA) {
-      return {
-        openTabs: slotA.nodeTabs ?? [],
-        activeTab: slotA.activeNodeTab ?? null,
-      };
-    }
-
-    // Fallback: use Slot A if it has nodes
     if (slotAHasNodes && slotA) {
       return {
         openTabs: slotA.nodeTabs ?? [],
@@ -125,6 +106,14 @@ export default function ThreePanelLayout() {
       };
     }
 
+    // Fallback: use Slot B if it has nodes
+    if (slotBHasNodes && slotB) {
+      return {
+        openTabs: slotB.nodeTabs ?? [],
+        activeTab: slotB.activeNodeTab ?? null,
+      };
+    }
+
     return { openTabs: [], activeTab: null };
   }, [slotA, slotB]);
 
@@ -189,8 +178,8 @@ export default function ThreePanelLayout() {
         if (slotB) {
           setSlotB(null);
         } else {
-          // Open with chat by default
+          // Open with node pane by default (chat removed in rah-light)
-          setSlotB({ type: 'chat' });
+          setSlotB({ type: 'node', nodeTabs: [], activeNodeTab: null });
         }
       }
       // Cmd+N - open Add Stuff modal
@@ -749,7 +738,7 @@ export default function ThreePanelLayout() {
 
   // Split handle callbacks
   const handleOpenSecondPane = useCallback(() => {
-    setSlotB({ type: 'chat' }); // Default to chat when opening
+    setSlotB({ type: 'node', nodeTabs: [], activeNodeTab: null }); // Default to node pane (chat removed in rah-light)
     setActivePane('B');
   }, [setSlotB]);
 
@@ -816,29 +805,7 @@ export default function ThreePanelLayout() {
           />
         );
 
-      case 'chat':
+      // case 'chat' removed in rah-light
-        return (
-          <ChatPane
-            slot={slot}
-            isActive={isActive}
-            onPaneAction={slot === 'A' ? handleSlotAAction : handleSlotBAction}
-            onCollapse={onCollapse}
-            onSwapPanes={slotB ? handleSwapPanes : undefined}
-            openTabsData={openTabsData}
-            activeTabId={activeTab}
-            activeDimension={activeDimension}
-            onClearDimension={() => setActiveDimension(null)}
-            onNodeClick={(nodeId) => {
-              handleNodeSelect(nodeId, false);
-              setActivePane(slot);
-            }}
-            delegations={delegations}
-            chatMessages={chatMessages as unknown[]}
-            setChatMessages={setChatMessages as React.Dispatch<React.SetStateAction<unknown[]>>}
-            highlightedPassage={highlightedPassage}
-            onClearPassage={() => setHighlightedPassage(null)}
-          />
-        );
 
       case 'workflows':
         return (

src/components/panes/ChatPane.tsx

@@ -1,183 +0,0 @@
-"use client";
-
-import { useState, useEffect } from 'react';
-import RAHChat from '@/components/agents/RAHChat';
-import PaneHeader from './PaneHeader';
-import { ChatPaneProps } from './types';
-import type { ChatMessage } from '@/components/agents/hooks/useSSEChat';
-
-export default function ChatPane({
-  slot,
-  isActive,
-  onPaneAction,
-  onCollapse,
-  onSwapPanes,
-  openTabsData,
-  activeTabId,
-  activeDimension,
-  onClearDimension,
-  onNodeClick,
-  delegations,
-  chatMessages: externalMessages,
-  setChatMessages: externalSetMessages,
-  highlightedPassage,
-  onClearPassage,
-}: ChatPaneProps) {
-  const [rahMode, setRahMode] = useState<'easy' | 'hard'>('easy');
-  const [hasStarted, setHasStarted] = useState(false);
-
-  // Use lifted state if provided, otherwise fall back to local state
-  const [internalMessages, setInternalMessages] = useState<ChatMessage[]>([]);
-
-  const rahMessages = (externalMessages as ChatMessage[]) ?? internalMessages;
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const setRahMessages = (externalSetMessages as any) ?? setInternalMessages;
-
-  // Load mode from localStorage
-  useEffect(() => {
-    if (typeof window === 'undefined') return;
-    const stored = window.localStorage.getItem('rah-mode');
-    if (stored === 'easy' || stored === 'hard') {
-      setRahMode(stored);
-    }
-  }, []);
-
-  // Persist mode to localStorage
-  useEffect(() => {
-    if (typeof window === 'undefined') return;
-    window.localStorage.setItem('rah-mode', rahMode);
-  }, [rahMode]);
-
-  // Listen for mode toggle events
-  useEffect(() => {
-    const handler = (event: Event) => {
-      const detail = (event as CustomEvent<{ mode: 'easy' | 'hard' }>).detail;
-      if (detail?.mode) {
-        setRahMode(detail.mode);
-      }
-    };
-    window.addEventListener('rah:mode-toggle', handler as EventListener);
-    return () => {
-      window.removeEventListener('rah:mode-toggle', handler as EventListener);
-    };
-  }, []);
-
-  // Auto-start if there are existing messages
-  useEffect(() => {
-    if (rahMessages.length > 0 && !hasStarted) {
-      setHasStarted(true);
-    }
-  }, [rahMessages.length, hasStarted]);
-
-  return (
-    <div style={{
-      height: '100%',
-      display: 'flex',
-      flexDirection: 'column',
-      background: 'transparent',
-      overflow: 'hidden',
-    }}>
-      <PaneHeader slot={slot} onCollapse={onCollapse} onSwapPanes={onSwapPanes} />
-
-      <div style={{ flex: 1, minHeight: 0, overflow: 'hidden' }}>
-        {!hasStarted ? (
-          <div style={{
-            height: '100%',
-            display: 'flex',
-            flexDirection: 'column',
-            padding: '20px',
-          }}>
-            {/* Start Chat button */}
-            <div style={{
-              flex: 1,
-              display: 'flex',
-              justifyContent: 'center',
-              alignItems: 'center'
-            }}>
-              <button
-                onClick={() => {
-                  setHasStarted(true);
-                  setRahMode('easy');
-                }}
-                style={{
-                  display: 'flex',
-                  alignItems: 'center',
-                  gap: '14px',
-                  padding: '0',
-                  background: 'transparent',
-                  border: 'none',
-                  cursor: 'pointer'
-                }}
-                onMouseEnter={(e) => {
-                  const text = e.currentTarget.querySelector('.start-text') as HTMLElement;
-                  const icon = e.currentTarget.querySelector('.start-icon') as HTMLElement;
-                  if (text) text.style.color = '#22c55e';
-                  if (icon) {
-                    icon.style.transform = 'translateY(-3px)';
-                    icon.style.boxShadow = '0 8px 20px rgba(34, 197, 94, 0.3), 0 0 0 4px rgba(34, 197, 94, 0.1)';
-                  }
-                }}
-                onMouseLeave={(e) => {
-                  const text = e.currentTarget.querySelector('.start-text') as HTMLElement;
-                  const icon = e.currentTarget.querySelector('.start-icon') as HTMLElement;
-                  if (text) text.style.color = '#737373';
-                  if (icon) {
-                    icon.style.transform = 'translateY(0)';
-                    icon.style.boxShadow = '0 0 0 0 rgba(34, 197, 94, 0)';
-                  }
-                }}
-              >
-                <span
-                  className="start-text"
-                  style={{
-                    color: '#737373',
-                    fontSize: '11px',
-                    fontWeight: 500,
-                    letterSpacing: '0.15em',
-                    textTransform: 'uppercase',
-                    transition: 'color 0.2s ease'
-                  }}
-                >
-                  Start
-                </span>
-                <div
-                  className="start-icon"
-                  style={{
-                    width: '44px',
-                    height: '44px',
-                    borderRadius: '50%',
-                    background: '#22c55e',
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    transition: 'all 0.25s cubic-bezier(0.4, 0, 0.2, 1)',
-                    boxShadow: '0 0 0 0 rgba(34, 197, 94, 0)'
-                  }}
-                >
-                  <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#0a0a0a" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round">
-                    <path d="M12 19V5"/>
-                    <path d="M5 12l7-7 7 7"/>
-                  </svg>
-                </div>
-              </button>
-            </div>
-          </div>
-        ) : (
-          <RAHChat
-            openTabsData={openTabsData}
-            activeTabId={activeTabId}
-            activeDimension={activeDimension}
-            onClearDimension={onClearDimension}
-            onNodeClick={onNodeClick}
-            delegations={delegations}
-            messages={rahMessages}
-            setMessages={setRahMessages}
-            mode={rahMode}
-            highlightedPassage={highlightedPassage}
-            onClearPassage={onClearPassage}
-          />
-        )}
-      </div>
-    </div>
-  );
-}

src/components/panes/index.ts

@@ -1,5 +1,4 @@
 export { default as NodePane } from './NodePane';
-export { default as ChatPane } from './ChatPane';
 export { default as WorkflowsPane } from './WorkflowsPane';
 export { default as DimensionsPane } from './DimensionsPane';
 export { default as MapPane } from './MapPane';

src/components/panes/types.ts

@@ -14,8 +14,8 @@ export type AgentDelegation = {
   updatedAt: string;
 };
 
-// The six pane types
+// The five pane types (chat removed in rah-light)
-export type PaneType = 'node' | 'chat' | 'workflows' | 'dimensions' | 'map' | 'views';
+export type PaneType = 'node' | 'workflows' | 'dimensions' | 'map' | 'views';
 
 // State for each slot
 export interface SlotState {
@@ -66,21 +66,7 @@ export interface HighlightedPassage {
   selectedText: string;
 }
 
-// ChatPane specific props
+// ChatPaneProps removed in rah-light
-export interface ChatPaneProps extends BasePaneProps {
-  openTabsData: Node[];
-  activeTabId: number | null;
-  activeDimension?: string | null;
-  onClearDimension?: () => void;
-  onNodeClick?: (nodeId: number) => void;
-  delegations: AgentDelegation[];
-  // Lifted state for persistence
-  chatMessages?: unknown[];
-  setChatMessages?: React.Dispatch<React.SetStateAction<unknown[]>>;
-  // Source awareness
-  highlightedPassage?: HighlightedPassage | null;
-  onClearPassage?: () => void;
-}
 
 // WorkflowsPane specific props
 export interface WorkflowsPaneProps extends BasePaneProps {
@@ -124,7 +110,6 @@ export interface PaneHeaderProps {
 // Labels for pane types
 export const PANE_LABELS: Record<PaneType, string> = {
   node: 'Nodes',
-  chat: 'Chat',
   workflows: 'Workflows',
   dimensions: 'Dimensions',
   map: 'Map',
@@ -139,5 +124,5 @@ export const DEFAULT_SLOT_A: SlotState = {
 };
 
 export const DEFAULT_SLOT_B: SlotState = {
-  type: 'chat',
+  type: 'workflows',
 };