fix: bring back maximize button (#3024)

electron/handlers/native.ts

@@ -1,4 +1,4 @@
-import { app, ipcMain, dialog, shell, nativeTheme, screen } from 'electron'
+import { app, ipcMain, dialog, shell, nativeTheme } from 'electron'
 import { join } from 'path'
 import { windowManager } from '../managers/window'
 import {
@@ -41,12 +41,9 @@ export function handleAppIPCs() {
     windowManager.mainWindow?.minimize()
   })
 
-  ipcMain.handle(NativeRoute.setMaximizeApp, async () => {
+  ipcMain.handle(NativeRoute.setMaximizeApp, async (_event) => {
     if (windowManager.mainWindow?.isMaximized()) {
-      // const bounds = await getBounds()
-      // windowManager.mainWindow?.setSize(bounds.width, bounds.height)
-      // windowManager.mainWindow?.setPosition(Number(bounds.x), Number(bounds.y))
-      windowManager.mainWindow.restore()
+      windowManager.mainWindow.unmaximize()
     } else {
       windowManager.mainWindow?.maximize()
     }

electron/managers/mainWindowConfig.ts

@@ -4,11 +4,12 @@ export const mainWindowConfig: Electron.BrowserWindowConstructorOptions = {
   skipTaskbar: false,
   minWidth: DEFAULT_MIN_WIDTH,
   show: true,
+  transparent: true,
+  frame: false,
   titleBarStyle: 'hidden',
   vibrancy: 'fullscreen-ui',
   visualEffectState: 'active',
   backgroundMaterial: 'acrylic',
-  maximizable: false,
   autoHideMenuBar: true,
   trafficLightPosition: {
     x: 16,

web/containers/Layout/TopPanel/index.tsx

@@ -9,6 +9,7 @@ import {
   PanelRightCloseIcon,
   MinusIcon,
   MenuIcon,
+  SquareIcon,
   PaletteIcon,
   XIcon,
 } from 'lucide-react'
@@ -51,7 +52,7 @@ const TopPanel = () => {
             <Button
               theme="icon"
               onClick={() => {
-                window?.electronAPI.showOpenMenu(100, 100)
+                window?.electronAPI?.showOpenMenu(100, 100)
               }}
             >
               <MenuIcon size={16} />
@@ -100,13 +101,19 @@ const TopPanel = () => {
             <div className="flex items-center gap-x-2">
               <Button
                 theme="icon"
-                onClick={() => window?.electronAPI.setMinimizeApp()}
+                onClick={() => window?.electronAPI?.setMinimizeApp()}
               >
                 <MinusIcon size={16} />
               </Button>
               <Button
                 theme="icon"
-                onClick={() => window?.electronAPI.setCloseApp()}
+                onClick={() => window?.electronAPI?.setMaximizeApp()}
+              >
+                <SquareIcon size={14} />
+              </Button>
+              <Button
+                theme="icon"
+                onClick={() => window?.electronAPI?.setCloseApp()}
               >
                 <XIcon size={16} />
               </Button>