feat: windows maximum button

RSSNext · Jul 30, 2024 · b9c050b · b9c050b
1 parent ea994cb
commit b9c050b
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 11 deletions.
diff --git a/src/main/tipc/setting.ts b/src/main/tipc/setting.ts
@@ -1,5 +1,6 @@
 import { createRequire } from "node:module"
 
+import type { BrowserWindow } from "electron"
 import { app, nativeTheme } from "electron"
 
 import { setDockCount } from "../lib/dock"
@@ -46,4 +47,16 @@ export const settingRoute = {
   setDockBadge: t.procedure.input<number>().action(async ({ input }) => {
     setDockCount(input)
   }),
+  getWindowIsMaximized: t.procedure
+    .input<void>()
+    .action(async ({ context }) => {
+      const window: BrowserWindow | null = (
+        context.sender as Sender
+      ).getOwnerBrowserWindow()
+      return window?.isMaximized()
+    }),
+}
+
+interface Sender extends Electron.WebContents {
+  getOwnerBrowserWindow: () => Electron.BrowserWindow | null
 }
diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx
@@ -6,7 +6,7 @@ import { env } from "../../env.js"
 import { useAppIsReady } from "./atoms/app"
 import { useUISettingKey } from "./atoms/settings/ui"
 import { appLog } from "./lib/log"
-import { getOS } from "./lib/utils"
+import { cn, getOS } from "./lib/utils"
 import { Titlebar } from "./modules/app/Titlebar.js"
 import { RootProviders } from "./providers/root-providers"
 import { handlers } from "./tipc"
@@ -44,15 +44,15 @@ function App() {
   const windowsElectron = window.electron && getOS() === "Windows"
   return (
     <>
-      {window.electron && (
-        <div
-          className="drag-region absolute inset-x-0 top-0 h-12 shrink-0"
-          aria-hidden
-        >
-          {windowsElectron && <Titlebar />}
-        </div>
-      )}
       <RootProviders>
+        {window.electron && (
+          <div
+            className={cn("drag-region absolute inset-x-0 top-0 h-12 shrink-0", windowsElectron && "pointer-events-none z-[9999]")}
+            aria-hidden
+          >
+            {windowsElectron && <Titlebar />}
+          </div>
+        )}
         <AppLayer />
       </RootProviders>
     </>

diff --git a/src/renderer/src/modules/app/Titlebar.tsx b/src/renderer/src/modules/app/Titlebar.tsx
@@ -1,4 +1,5 @@
 import { tipcClient } from "@renderer/lib/client"
+import { useQuery } from "@tanstack/react-query"
 import { useForceUpdate } from "framer-motion"
 import { useEffect } from "react"
 import { useLocation } from "react-router-dom"
@@ -9,10 +10,15 @@ export const Titlebar = () => {
   useEffect(() => {
     update()
   }, [location])
+  const { data: isMaximized, refetch } = useQuery({
+    queryFn: () => tipcClient?.getWindowIsMaximized(),
+    queryKey: ["windowIsMaximized"],
+  })
+
   return (
     <div className="flex h-10 w-full items-center justify-end rounded-t-[12px] pr-1">
       <button
-        className="no-drag-region flex h-[24px] w-[32px] items-center justify-center rounded duration-200 hover:bg-theme-item-active"
+        className="no-drag-region pointer-events-auto flex h-[24px] w-[32px] items-center justify-center rounded duration-200 hover:bg-theme-item-active"
         type="button"
         onClick={() => {
           tipcClient?.windowAction({ action: "minimize" })
@@ -23,7 +29,18 @@ export const Titlebar = () => {
 
       <button
         type="button"
-        className="no-drag-region flex h-[24px] w-[32px] items-center justify-center rounded duration-200 hover:bg-red-500 hover:!text-white"
+        className="no-drag-region pointer-events-auto flex h-[24px] w-[32px] items-center justify-center rounded duration-200 hover:bg-theme-item-active"
+        onClick={async () => {
+          await tipcClient?.windowAction({ action: "maximum" })
+          refetch()
+        }}
+      >
+        {isMaximized ? <i className="i-mingcute-restore-line" /> : <i className="i-mingcute-square-line" />}
+      </button>
+
+      <button
+        type="button"
+        className="no-drag-region pointer-events-auto flex h-[24px] w-[32px] items-center justify-center rounded duration-200 hover:bg-red-500 hover:!text-white"
         onClick={() => {
           tipcClient?.windowAction({ action: "close" })
         }}