From 8912216cb29e91fb2dffff1580bf0506b98c5225 Mon Sep 17 00:00:00 2001
From: duskzhen <zerob13@gmail.com>
Date: Mon, 5 Jan 2026 16:25:38 +0800
Subject: [PATCH] fix(common): improve window dragging area in FullScreenPanel
 (#525)

Add data-tauri-drag-region and WebkitAppRegion styles to header area to match	App.tsx behavior, ensuring proper window dragging on macOS.
---
 src/components/common/FullScreenPanel.tsx | 35 ++++++++++++++++-------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/components/common/FullScreenPanel.tsx b/src/components/common/FullScreenPanel.tsx
index a0a757361..a58bba95a 100644
--- a/src/components/common/FullScreenPanel.tsx
+++ b/src/components/common/FullScreenPanel.tsx
@@ -50,31 +50,44 @@ export const FullScreenPanel: React.FC<FullScreenPanelProps> = ({
           {/* Drag region - match App.tsx */}
           <div
             data-tauri-drag-region
-            style={{
-              WebkitAppRegion: "drag",
-              height: DRAG_BAR_HEIGHT,
-            } as React.CSSProperties}
+            style={
+              {
+                WebkitAppRegion: "drag",
+                height: DRAG_BAR_HEIGHT,
+              } as React.CSSProperties
+            }
           />
 
           {/* Header - match App.tsx */}
           <div
             className="flex-shrink-0 flex items-center"
-            style={{
-              backgroundColor: "hsl(var(--background))",
-              height: HEADER_HEIGHT,
-            }}
+            data-tauri-drag-region
+            style={
+              {
+                WebkitAppRegion: "drag",
+                backgroundColor: "hsl(var(--background))",
+                height: HEADER_HEIGHT,
+              } as React.CSSProperties
+            }
           >
-            <div className="mx-auto max-w-[56rem] px-6 w-full flex items-center gap-4">
+            <div
+              className="mx-auto max-w-[56rem] px-6 w-full flex items-center gap-4"
+              data-tauri-drag-region
+              style={{ WebkitAppRegion: "drag" } as React.CSSProperties}
+            >
               <Button
                 type="button"
                 variant="outline"
                 size="icon"
                 onClick={onClose}
-                className="rounded-lg"
+                className="rounded-lg select-none"
+                style={{ WebkitAppRegion: "no-drag" } as React.CSSProperties}
               >
                 <ArrowLeft className="h-4 w-4" />
               </Button>
-              <h2 className="text-lg font-semibold text-foreground">{title}</h2>
+              <h2 className="text-lg font-semibold text-foreground select-none">
+                {title}
+              </h2>
             </div>
           </div>