From ac2120da1eecc37e2c0c784d2d70751c6e764485 Mon Sep 17 00:00:00 2001
From: yyh <yuanyouhuilyz@gmail.com>
Date: Thu, 15 Jan 2026 17:56:07 +0800
Subject: [PATCH] refactor(skill): separate DropTip from tree container

- Move DropTip component outside the tree flex container
- Use Fragment to group tree container, DropTip and context menu
- DropTip is now an independent fixed element at the bottom
---
 .../components/workflow/skill/file-tree.tsx   | 52 ++++++++++---------
 1 file changed, 27 insertions(+), 25 deletions(-)

diff --git a/web/app/components/workflow/skill/file-tree.tsx b/web/app/components/workflow/skill/file-tree.tsx
index 3b3a61dcff..501c7d7d34 100644
--- a/web/app/components/workflow/skill/file-tree.tsx
+++ b/web/app/components/workflow/skill/file-tree.tsx
@@ -134,35 +134,37 @@ const FileTree: React.FC<FileTreeProps> = ({ className }) => {
   }
 
   return (
-    <div className={cn('flex min-h-0 flex-1 flex-col', className)}>
-      <div
-        ref={containerRef}
-        className="flex min-h-0 flex-1 flex-col overflow-hidden px-1 pt-1"
-      >
-        <Tree<TreeNodeData>
-          ref={treeRef}
-          data={treeData.children}
-          idAccessor="id"
-          childrenAccessor="children"
-          width="100%"
-          height={containerSize?.height ?? 400}
-          rowHeight={24}
-          indent={20}
-          overscanCount={5}
-          selection={activeTabId ?? undefined}
-          initialOpenState={initialOpensObject}
-          onToggle={handleToggle}
-          onActivate={handleActivate}
-          onRename={handleRename}
-          disableDrag
-          disableDrop
+    <>
+      <div className={cn('flex min-h-0 flex-1 flex-col', className)}>
+        <div
+          ref={containerRef}
+          className="flex min-h-0 flex-1 flex-col overflow-hidden px-1 pt-1"
         >
-          {TreeNode}
-        </Tree>
+          <Tree<TreeNodeData>
+            ref={treeRef}
+            data={treeData.children}
+            idAccessor="id"
+            childrenAccessor="children"
+            width="100%"
+            height={containerSize?.height ?? 400}
+            rowHeight={24}
+            indent={20}
+            overscanCount={5}
+            selection={activeTabId ?? undefined}
+            initialOpenState={initialOpensObject}
+            onToggle={handleToggle}
+            onActivate={handleActivate}
+            onRename={handleRename}
+            disableDrag
+            disableDrop
+          >
+            {TreeNode}
+          </Tree>
+        </div>
       </div>
       <DropTip />
       <TreeContextMenu treeRef={treeRef} />
-    </div>
+    </>
   )
 }