added expand buttons for middle and side pane and fixed issue with moving new chat to side pane

apps/x/apps/renderer/src/App.tsx

@@ -5,7 +5,7 @@ import { RunEvent, ListRunsResponse } from '@x/shared/src/runs.js';
 import type { LanguageModelUsage, ToolUIPart } from 'ai';
 import './App.css'
 import z from 'zod';
-import { CheckIcon, LoaderIcon, PanelLeftIcon, ArrowRight, MessageSquare, ChevronLeftIcon, ChevronRightIcon, Plus, HistoryIcon, X } from 'lucide-react';
+import { CheckIcon, LoaderIcon, PanelLeftIcon, ArrowRight, MessageSquare, ChevronLeftIcon, ChevronRightIcon, Plus, HistoryIcon } from 'lucide-react';
 import { cn } from '@/lib/utils';
 import { MarkdownEditor, type MarkdownEditorHandle } from './components/markdown-editor';
 import { ChatSidebar } from './components/chat-sidebar';
@@ -3391,8 +3391,10 @@ function App() {
     setIsMeetingsOpen(false); setIsLiveNotesOpen(false); setIsBgTasksOpen(false); setIsEmailOpen(false); setIsWorkspaceOpen(false); setIsKnowledgeViewOpen(false); setIsChatHistoryOpen(false); setIsHomeOpen(false)
   }, [selectedPath, isGraphOpen, isSuggestedTopicsOpen, isMeetingsOpen, isLiveNotesOpen, isBgTasksOpen, isEmailOpen, isWorkspaceOpen, isKnowledgeViewOpen, isChatHistoryOpen, dismissBrowserOverlay])
 
-  const handleCloseFullScreenChat = useCallback(() => {
+  const handleCloseFullScreenChat = useCallback((): boolean => {
+    let restored = false
     if (expandedFrom) {
+      restored = true
       if (expandedFrom.graph) {
         setIsGraphOpen(true)
         setIsSuggestedTopicsOpen(false)
@@ -3434,10 +3436,16 @@ function App() {
         setIsSuggestedTopicsOpen(false)
         setIsMeetingsOpen(false); setIsLiveNotesOpen(false); setIsBgTasksOpen(false); setIsEmailOpen(false); setIsWorkspaceOpen(false); setIsKnowledgeViewOpen(false); setIsChatHistoryOpen(false); setIsHomeOpen(false)
         setSelectedPath(expandedFrom.path)
+      } else {
+        // expandedFrom was captured from a view this restorer doesn't track
+        // (e.g. Home): there's nothing to re-open, so report it and let the
+        // caller fall back instead of leaving a blank full-screen chat.
+        restored = false
       }
       setExpandedFrom(null)
       setIsRightPaneMaximized(false)
     }
+    return restored
   }, [expandedFrom])
 
   const currentViewState = React.useMemo<ViewState>(() => {
@@ -3885,12 +3893,13 @@ function App() {
   const pushChatToSidePane = useCallback(() => {
     setIsRightPaneMaximized(false)
     setIsChatSidebarOpen(true)
-    if (expandedFrom) {
+    // Restore the view we expanded from; if there was nothing to restore
-      handleCloseFullScreenChat()
+    // (e.g. the chat was started fresh from Home), fall back to Home so a
-    } else {
+    // single click always docks the chat instead of needing two.
+    if (!handleCloseFullScreenChat()) {
       void navigateToView({ type: 'home' })
     }
-  }, [expandedFrom, handleCloseFullScreenChat, navigateToView])
+  }, [handleCloseFullScreenChat, navigateToView])
 
   const navigateBack = useCallback(async () => {
     const { back, forward } = historyRef.current
@@ -5375,7 +5384,7 @@ function App() {
                     : (viewOpen && !isChatSidebarOpen)
                       ? { onClick: openChatSidePane, icon: <MessageSquare className="size-5" />, label: 'Open chat' }
                       : (viewOpen && isChatSidebarOpen && !isRightPaneMaximized)
-                        ? { onClick: toggleRightPaneMaximize, icon: <X className="size-5" />, label: 'Expand chat' }
+                        ? { onClick: () => setIsChatSidebarOpen(false), icon: <ArrowRight className="size-5" />, label: 'Expand pane' }
                         : null
                   return (
                     <Tooltip>
@@ -5899,7 +5908,6 @@ function App() {
                 }}
                 onOpenChatHistory={() => void navigateToView({ type: 'chat-history' })}
                 onOpenFullScreen={toggleRightPaneMaximize}
-                onCloseChat={() => { setIsRightPaneMaximized(false); setIsChatSidebarOpen(false) }}
                 conversation={conversation}
                 currentAssistantMessage={currentAssistantMessage}
                 chatTabStates={chatViewStateByTab}

apps/x/apps/renderer/src/components/chat-sidebar.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
-import { ArrowRight, X } from 'lucide-react'
+import { ArrowLeft, ArrowRight } from 'lucide-react'
 
 import { Button } from '@/components/ui/button'
 import { cn } from '@/lib/utils'
@@ -125,7 +125,6 @@ interface ChatSidebarProps {
   onSelectRun?: (runId: string) => void
   onOpenChatHistory?: () => void
   onOpenFullScreen?: () => void
-  onCloseChat?: () => void
   conversation: ConversationItem[]
   currentAssistantMessage: string
   chatTabStates?: Record<string, ChatTabViewState>
@@ -183,7 +182,6 @@ export function ChatSidebar({
   onSelectRun,
   onOpenChatHistory,
   onOpenFullScreen,
-  onCloseChat,
   conversation,
   currentAssistantMessage,
   chatTabStates = {},
@@ -515,40 +513,21 @@ export function ChatSidebar({
               onSelectRun={onSelectRun}
               onOpenChatHistory={onOpenChatHistory}
             />
-            {isMaximized ? (
+            {onOpenFullScreen && (
-              onOpenFullScreen && (
+              <Tooltip>
-                <Tooltip>
+                <TooltipTrigger asChild>
-                  <TooltipTrigger asChild>
+                  <Button
-                    <Button
+                    variant="ghost"
-                      variant="ghost"
+                    size="icon"
-                      size="icon"
+                    onClick={onOpenFullScreen}
-                      onClick={onOpenFullScreen}
+                    className="titlebar-no-drag my-1 mr-2 h-8 w-8 shrink-0 text-muted-foreground hover:text-foreground"
-                      className="titlebar-no-drag my-1 mr-2 h-8 w-8 shrink-0 text-muted-foreground hover:text-foreground"
+                    aria-label={isMaximized ? 'Dock chat to side pane' : 'Expand chat'}
-                      aria-label="Dock chat to side pane"
+                  >
-                    >
+                    {isMaximized ? <ArrowRight className="size-5" /> : <ArrowLeft className="size-5" />}
-                      <ArrowRight className="size-5" />
+                  </Button>
-                    </Button>
+                </TooltipTrigger>
-                  </TooltipTrigger>
+                <TooltipContent side="bottom">{isMaximized ? 'Dock to side pane' : 'Expand chat'}</TooltipContent>
-                  <TooltipContent side="bottom">Dock to side pane</TooltipContent>
+              </Tooltip>
-                </Tooltip>
-              )
-            ) : (
-              onCloseChat && (
-                <Tooltip>
-                  <TooltipTrigger asChild>
-                    <Button
-                      variant="ghost"
-                      size="icon"
-                      onClick={onCloseChat}
-                      className="titlebar-no-drag my-1 mr-2 h-8 w-8 shrink-0 text-muted-foreground hover:text-foreground"
-                      aria-label="Close chat"
-                    >
-                      <X className="size-5" />
-                    </Button>
-                  </TooltipTrigger>
-                  <TooltipContent side="bottom">Close chat</TooltipContent>
-                </Tooltip>
-              )
             )}
           </header>