fix: incorrect maximize status on custom windows controller (#5033)

* fix: windows controller

* chore: update style

* chore: update style

src/components/controller/window-controller.tsx

@@ -1,5 +1,5 @@
 import { Close, CropSquare, FilterNone, Minimize } from "@mui/icons-material";
-import { IconButton } from "@mui/material";
+import { Box, IconButton } from "@mui/material";
 import { forwardRef, useImperativeHandle } from "react";
 
 import { useWindowControls } from "@/hooks/use-window";
@@ -40,7 +40,16 @@ export const WindowControls = forwardRef(function WindowControls(props, ref) {
   // 这可能是上游缺陷，保险起见跨平台以窗口的最大化翻转为准
 
   return (
-    <div style={{ display: "flex", gap: 4 }}>
+    <Box
+      sx={{
+        display: "flex",
+        gap: 1,
+        alignItems: "center",
+        "> button": {
+          cursor: "default",
+        },
+      }}
+    >
       {OS === "macos" && (
         <>
           {/* macOS 风格：关闭 → 最小化 → 全屏 */}
@@ -67,22 +76,26 @@ export const WindowControls = forwardRef(function WindowControls(props, ref) {
       {OS === "windows" && (
         <>
           {/* Windows 风格：最小化 → 最大化 → 关闭 */}
-          <IconButton size="small" sx={{ fontSize: 14 }} onClick={minimize}>
-            <Minimize fontSize="small" color="inherit" />
+          <IconButton size="small" sx={{ fontSize: 16 }} onClick={minimize}>
+            <Minimize fontSize="inherit" color="inherit" />
           </IconButton>
           <IconButton
             size="small"
-            sx={{ fontSize: 14 }}
+            sx={{ fontSize: 16 }}
             onClick={toggleMaximize}
           >
             {maximized ? (
-              <FilterNone fontSize="small" color="inherit" />
+              <FilterNone fontSize="inherit" color="inherit" />
             ) : (
-              <CropSquare fontSize="small" color="inherit" />
+              <CropSquare fontSize="inherit" color="inherit" />
             )}
           </IconButton>
-          <IconButton size="small" sx={{ fontSize: 14 }} onClick={close}>
-            <Close fontSize="small" color="inherit" />
+          <IconButton
+            size="small"
+            sx={{ fontSize: 16, ":hover": { bgcolor: "red", color: "white" } }}
+            onClick={close}
+          >
+            <Close fontSize="inherit" color="inherit" />
           </IconButton>
         </>
       )}
@@ -90,25 +103,29 @@ export const WindowControls = forwardRef(function WindowControls(props, ref) {
       {OS === "linux" && (
         <>
           {/* Linux 桌面常见布局（GNOME/KDE 多为：最小化 → 最大化 → 关闭） */}
-          <IconButton size="small" sx={{ fontSize: 14 }} onClick={minimize}>
-            <Minimize fontSize="small" color="inherit" />
+          <IconButton size="small" sx={{ fontSize: 16 }} onClick={minimize}>
+            <Minimize fontSize="inherit" color="inherit" />
           </IconButton>
           <IconButton
             size="small"
-            sx={{ fontSize: 14 }}
+            sx={{ fontSize: 16 }}
             onClick={toggleMaximize}
           >
             {maximized ? (
-              <FilterNone fontSize="small" color="inherit" />
+              <FilterNone fontSize="inherit" color="inherit" />
             ) : (
-              <CropSquare fontSize="small" color="inherit" />
+              <CropSquare fontSize="inherit" color="inherit" />
             )}
           </IconButton>
-          <IconButton size="small" sx={{ fontSize: 14 }} onClick={close}>
-            <Close fontSize="small" color="inherit" />
+          <IconButton
+            size="small"
+            sx={{ fontSize: 16, ":hover": { bgcolor: "red", color: "white" } }}
+            onClick={close}
+          >
+            <Close fontSize="inherit" color="inherit" />
           </IconButton>
         </>
       )}
-    </div>
+    </Box>
   );
 });

src/hooks/use-window.tsx

@@ -1,4 +1,5 @@
 import { getCurrentWindow } from "@tauri-apps/api/window";
+import { debounce } from "lodash-es";
 import React, {
   createContext,
   useCallback,
@@ -31,6 +32,20 @@ export const WindowProvider: React.FC<{ children: React.ReactNode }> = ({
   const close = useCallback(() => currentWindow.close(), [currentWindow]);
   const minimize = useCallback(() => currentWindow.minimize(), [currentWindow]);
 
+  useEffect(() => {
+    const checkMaximized = debounce(async () => {
+      const value = await currentWindow.isMaximized();
+      if (maximized !== value) {
+        setMaximized(value);
+      }
+    }, 100);
+    const unlistenResize = currentWindow.onResized(checkMaximized);
+
+    return () => {
+      unlistenResize.then((fn) => fn());
+    };
+  }, [currentWindow, maximized]);
+
   const toggleMaximize = useCallback(async () => {
     if (await currentWindow.isMaximized()) {
       await currentWindow.unmaximize();

src/pages/_layout.tsx

@@ -552,16 +552,15 @@ const Layout = () => {
             borderTopRightRadius: "0px",
           }}
           onContextMenu={(e) => {
-            // TODO: 禁止右键菜单
-            // if (
-            //   OS === "windows" &&
-            //   !["input", "textarea"].includes(
-            //     e.currentTarget.tagName.toLowerCase(),
-            //   ) &&
-            //   !e.currentTarget.isContentEditable
-            // ) {
-            //   e.preventDefault();
-            // }
+            if (
+              OS === "windows" &&
+              !["input", "textarea"].includes(
+                e.currentTarget.tagName.toLowerCase(),
+              ) &&
+              !e.currentTarget.isContentEditable
+            ) {
+              e.preventDefault();
+            }
           }}
           sx={[
             ({ palette }) => ({ bgcolor: palette.background.paper }),