From b75de8b5e6f800ebcd657aefc5a4675c93d769bb Mon Sep 17 00:00:00 2001
From: m4 <m4@m4deMac-mini.local>
Date: Tue, 11 Aug 2026 07:22:20 +0800
Subject: [PATCH] Revert "feat(webui): pin sidebar collapse button to the
 resize divider"

This reverts commit adc59ba. The divider-mounted tab broke the header's
visual consistency; the collapse toggle stays in the top header.
---
 src/app/page.tsx                | 75 +++++++++++----------------------
 src/components/ui/resizable.tsx |  2 -
 2 files changed, 25 insertions(+), 52 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 904a706..cc7e0bd 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -315,36 +315,30 @@ function HomePageInner({ authEnabled }: HomePageInnerProps) {
               )}
             </div>
             <div className="flex items-center gap-0.5">
-              {/* On desktop the expanded sidebar's collapse button lives on the
-                  resize handle (it tracks the divider as the panel is resized);
-                  the header keeps the toggle only for the collapsed and mobile
-                  (overlay) states. */}
-              {(!sidebar || isDesktopLayout === false) && (
-                <Button
-                  variant="ghost"
-                  size="icon"
-                  onClick={toggleSidebar}
-                  aria-label={sidebarToggleLabel}
-                  className="relative size-8"
-                >
-                  {sidebar ? (
-                    <PanelLeftClose
-                      className="size-5"
-                      aria-hidden="true"
-                    />
-                  ) : (
-                    <PanelLeft
-                      className="size-5"
-                      aria-hidden="true"
-                    />
-                  )}
-                  {interruptCount > 0 && (
-                    <span className="absolute right-0 top-0 inline-flex min-h-4 min-w-4 items-center justify-center rounded-full bg-destructive px-1 text-[10px] text-destructive-foreground">
-                      {interruptCount}
-                    </span>
-                  )}
-                </Button>
-              )}
+              <Button
+                variant="ghost"
+                size="icon"
+                onClick={toggleSidebar}
+                aria-label={sidebarToggleLabel}
+                className="relative size-8"
+              >
+                {sidebar ? (
+                  <PanelLeftClose
+                    className="size-5"
+                    aria-hidden="true"
+                  />
+                ) : (
+                  <PanelLeft
+                    className="size-5"
+                    aria-hidden="true"
+                  />
+                )}
+                {interruptCount > 0 && (
+                  <span className="absolute right-0 top-0 inline-flex min-h-4 min-w-4 items-center justify-center rounded-full bg-destructive px-1 text-[10px] text-destructive-foreground">
+                    {interruptCount}
+                  </span>
+                )}
+              </Button>
               {!sidebar && (
                 <Button
                   variant="ghost"
@@ -526,26 +520,7 @@ function HomePageInner({ authEnabled }: HomePageInnerProps) {
                     onInterruptCountChange={setInterruptCount}
                   />
                 </ResizablePanel>
-                <ResizableHandle>
-                  <Button
-                    variant="ghost"
-                    size="icon"
-                    onClick={toggleSidebar}
-                    onPointerDown={(event) => event.stopPropagation()}
-                    aria-label={sidebarToggleLabel}
-                    className="absolute left-1/2 top-0 z-10 size-8 -translate-x-1/2 rounded-none rounded-b-md border border-t-0 border-border bg-background shadow-sm"
-                  >
-                    <PanelLeftClose
-                      className="size-5"
-                      aria-hidden="true"
-                    />
-                    {interruptCount > 0 && (
-                      <span className="absolute right-0 top-0 inline-flex min-h-4 min-w-4 items-center justify-center rounded-full bg-destructive px-1 text-[10px] text-destructive-foreground">
-                        {interruptCount}
-                      </span>
-                    )}
-                  </Button>
-                </ResizableHandle>
+                <ResizableHandle />
               </>
             )}
 
diff --git a/src/components/ui/resizable.tsx b/src/components/ui/resizable.tsx
index 0000bf3..c0929f4 100644
--- a/src/components/ui/resizable.tsx
+++ b/src/components/ui/resizable.tsx
@@ -23,7 +23,6 @@ const ResizablePanel = ResizablePrimitive.Panel;
 const ResizableHandle = ({
   withHandle,
   className,
-  children,
   ...props
 }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
   withHandle?: boolean;
@@ -40,7 +39,6 @@ const ResizableHandle = ({
         <GripVertical className="h-2.5 w-2.5" />
       </div>
     )}
-    {children}
   </ResizablePrimitive.PanelResizeHandle>
 );