From f9311c8459831b7ab7b737140c51688cd85ee123 Mon Sep 17 00:00:00 2001
From: "alan.cl" <1165243776@qq.com>
Date: Wed, 11 Mar 2026 15:46:23 +0800
Subject: [PATCH] optimize: optimize collapse panel button

---
 .../chat/content/ManusRightPanel.tsx          | 11 +-------
 web/pages/index.tsx                           | 26 +++++++++----------
 2 files changed, 13 insertions(+), 24 deletions(-)

diff --git a/web/new-components/chat/content/ManusRightPanel.tsx b/web/new-components/chat/content/ManusRightPanel.tsx
index 794e30b75..02d4bebf0 100644
--- a/web/new-components/chat/content/ManusRightPanel.tsx
+++ b/web/new-components/chat/content/ManusRightPanel.tsx
@@ -1598,16 +1598,7 @@ const ManusRightPanel: React.FC<ManusRightPanelProps> = ({
 
   return (
     <div className='relative flex flex-col h-full bg-[#f8f9fc] dark:bg-[#0d0e11]'>
-      {onCollapse && (
-        <Tooltip title={t('collapse_panel')} placement='left'>
-          <button
-            onClick={() => onCollapse()}
-            className='absolute left-0 top-1/2 -translate-y-1/2 -translate-x-1/2 z-10 w-6 h-12 flex items-center justify-center bg-white dark:bg-[#1a1b1e] border border-gray-200 dark:border-gray-700 rounded-full shadow-sm hover:bg-gray-50 dark:hover:bg-gray-800 hover:shadow-md transition-all text-gray-400 hover:text-gray-600 dark:hover:text-gray-300'
-          >
-            <LeftOutlined style={{ fontSize: 10 }} />
-          </button>
-        </Tooltip>
-      )}
+      {/* Collapse button is rendered by the parent layout to avoid overflow clipping */}
 
       {/* Terminal Header */}
       <div className='flex items-center justify-between px-5 py-3 bg-white dark:bg-[#111217] border-b border-gray-200 dark:border-gray-800'>
diff --git a/web/pages/index.tsx b/web/pages/index.tsx
index 2a2c42d83..38dbc56b9 100644
--- a/web/pages/index.tsx
+++ b/web/pages/index.tsx
@@ -31,6 +31,7 @@ import {
   FileOutlined,
   FilePptOutlined,
   FileTextOutlined,
+  LeftOutlined,
   PaperClipOutlined,
   PieChartOutlined,
   PlusOutlined,
@@ -2718,20 +2719,17 @@ const Playground: NextPage = () => {
                   </div>
                 </div>
 
-                {rightPanelCollapsed && (
-                  <div className='absolute right-0 top-1/2 -translate-y-1/2 z-10'>
-                    <Tooltip title={t('expand_panel')}>
-                      <Button
-                        type='text'
-                        shape='circle'
-                        size='small'
-                        icon={<RightOutlined />}
-                        onClick={() => setRightPanelCollapsed(false)}
-                        className='text-gray-400 hover:text-gray-600 hover:bg-gray-100 dark:hover:bg-gray-800 shadow-sm border border-gray-200 dark:border-gray-700 bg-white dark:bg-[#1a1b1e]'
-                      />
-                    </Tooltip>
-                  </div>
-                )}
+              </div>
+              {/* Panel toggle handle — placed between panels to avoid overflow clipping */}
+              <div className='relative z-20 flex-shrink-0'>
+                <Tooltip title={rightPanelCollapsed ? t('expand_panel') : t('collapse_panel')} placement='left'>
+                  <button
+                    onClick={() => setRightPanelCollapsed(prev => !prev)}
+                    className='absolute top-1/2 -translate-y-1/2 -translate-x-1/2 w-4 h-8 flex items-center justify-center bg-white dark:bg-[#1a1b1e] border border-gray-200 dark:border-gray-700 rounded-full shadow-sm hover:bg-gray-100 dark:hover:bg-gray-800 hover:w-5 hover:shadow-md transition-all duration-200 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300'
+                  >
+                    {rightPanelCollapsed ? <LeftOutlined style={{ fontSize: 10 }} /> : <RightOutlined style={{ fontSize: 10 }} />}
+                  </button>
+                </Tooltip>
               </div>
               <div
                 className={`${rightPanelCollapsed ? 'w-0 min-w-0 overflow-hidden opacity-0' : 'flex-[3] min-w-0 overflow-hidden'} bg-[#f8f8fb] dark:bg-[#0f1114] flex flex-col transition-all duration-300`}