From d199cbec6cb22882c09e1eb7b53cc5147fc970e2 Mon Sep 17 00:00:00 2001
From: 7418 <7418@openclaw.ai>
Date: Fri, 13 Feb 2026 14:33:06 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20file=20tree=20height=20cut=20off=20at=20?=
 =?UTF-8?q?half=20panel=20=E2=80=94=20fill=20remaining=20space?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Remove hardcoded max-h-[400px] on tree content area. Convert the
right panel body and Files section to flex column layout so the
file tree expands to fill all available vertical space.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/components/layout/RightPanel.tsx | 14 +++++++-------
 src/components/project/FileTree.tsx  |  8 ++++----
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/components/layout/RightPanel.tsx b/src/components/layout/RightPanel.tsx
index 2f0c791..1d511dd 100644
--- a/src/components/layout/RightPanel.tsx
+++ b/src/components/layout/RightPanel.tsx
@@ -133,9 +133,9 @@ export function RightPanel({ width }: RightPanelProps) {
       </div>
 
       {/* Body */}
-      <div className="flex-1 overflow-auto p-4 space-y-4">
+      <div className="flex flex-1 flex-col overflow-hidden p-4 space-y-4">
         {/* Name - editable */}
-        <div>
+        <div className="shrink-0">
           <label className="text-[11px] font-medium uppercase tracking-wider text-muted-foreground/70 mb-1.5 block">Name</label>
           {isEditingName ? (
             <div className="flex items-center gap-1.5">
@@ -167,12 +167,12 @@ export function RightPanel({ width }: RightPanelProps) {
         </div>
 
         {/* Divider */}
-        <div className="h-px bg-border/50" />
+        <div className="h-px bg-border/50 shrink-0" />
 
-        {/* Files — always show FileTree */}
-        <div className="flex flex-col min-h-0">
-          <span className="text-[11px] font-medium uppercase tracking-wider text-muted-foreground/70 mb-1.5 block">Files</span>
-          <div className="overflow-hidden">
+        {/* Files — always show FileTree, fill remaining space */}
+        <div className="flex flex-1 flex-col min-h-0 overflow-hidden">
+          <span className="text-[11px] font-medium uppercase tracking-wider text-muted-foreground/70 mb-1.5 block shrink-0">Files</span>
+          <div className="flex-1 overflow-hidden">
             <FileTree
               workingDirectory={workingDirectory}
               onFileSelect={handleFileSelect}
diff --git a/src/components/project/FileTree.tsx b/src/components/project/FileTree.tsx
index 75293f0..9827398 100644
--- a/src/components/project/FileTree.tsx
+++ b/src/components/project/FileTree.tsx
@@ -150,9 +150,9 @@ export function FileTree({ workingDirectory, onFileSelect, onFileAdd }: FileTree
   );
 
   return (
-    <div className="flex flex-col">
+    <div className="flex flex-col h-full min-h-0">
       {/* Header */}
-      <div className="flex items-center gap-2 p-2 border-b border-border/30">
+      <div className="flex items-center gap-2 p-2 border-b border-border/30 shrink-0">
         <p className="min-w-0 flex-1 truncate text-[11px] text-muted-foreground" title={workingDirectory}>
           {workingDirectory || 'No directory selected'}
         </p>
@@ -169,7 +169,7 @@ export function FileTree({ workingDirectory, onFileSelect, onFileAdd }: FileTree
       </div>
 
       {/* Search */}
-      <div className="relative p-2 border-b border-border/30">
+      <div className="relative p-2 border-b border-border/30 shrink-0">
         <HugeiconsIcon icon={Search01Icon} className="absolute left-4 top-1/2 h-3 w-3 -translate-y-1/2 text-muted-foreground" />
         <Input
           placeholder="Filter files..."
@@ -180,7 +180,7 @@ export function FileTree({ workingDirectory, onFileSelect, onFileAdd }: FileTree
       </div>
 
       {/* Tree */}
-      <div className="max-h-[400px] overflow-auto">
+      <div className="flex-1 overflow-auto">
         {loading && tree.length === 0 ? (
           <div className="flex items-center justify-center py-8">
             <HugeiconsIcon icon={RefreshIcon} className="h-4 w-4 animate-spin text-muted-foreground" />