refactor: adapting AppBar for macOS

Sloaix · Aug 10, 2023 · c5d6dc5 · c5d6dc5
1 parent 8d7ca20
commit c5d6dc5
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 1 deletion.
diff --git a/electron/main/handler.ts b/electron/main/handler.ts
@@ -216,6 +216,13 @@ ipcMain.handle('get-desktop-path', async () => {
   return app.getPath('desktop')
 })
 
+/**
+ * 返回系统平台
+ * @returns 'darwin' | 'linux'| 'win32'
+ */
+ipcMain.handle('get-platform', async () => {
+  return process.platform
+})
 /**
  * 返回Locale
  */

diff --git a/src/layouts/MainLayout/AppBar.tsx b/src/layouts/MainLayout/AppBar.tsx
@@ -1,15 +1,38 @@
+import { getPlatform } from '@/utils/common'
 import classNames from 'classnames'
+import { useEffect } from 'react'
+import { create } from 'zustand'
 import { name } from '../../../package.json'
 
+type Store = {
+  platform?: string
+  setPlatform: (platform: string) => void
+}
+
+const useStore = create<Store>()((set) => ({
+  setPlatform: (platform) => set({ platform })
+}))
+
 export default ({ className }: { className?: string }) => {
+  const [platform, setPlatform] = useStore((state) => [state.platform, state.setPlatform])
+  const isWindows = platform === 'win32'
+  const isMac = platform === 'darwin'
+
+  useEffect(() => {
+    ;(async () => {
+      setPlatform(await getPlatform())
+    })()
+  }, [])
   return (
     <div
       data-tauri-drag-region
       className={classNames(
         className,
-        'z-[99999] px-4 flex justify-between items-center w-full border-b-[1px] border-gray-200 select-none py-2'
+        'z-[99999] px-4 flex w-full border-b-[1px] border-gray-200 select-none py-2',
+        isWindows ? 'justify-start' : isMac ? 'justify-end' : 'justify-center'
       )}
     >
+      {/* logo */}
       <div className="inline-flex justify-center items-end shrink-0 space-x-2">
         <div className="w-[1.4rem] mb-1">
           <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 580 580">

diff --git a/src/pages/TorrentGenerator.tsx b/src/pages/TorrentGenerator.tsx
@@ -310,6 +310,7 @@ export default () => {
         />
       </FormItem>
 
+      {/* TODO 忽略隐藏文件  */}
       {/* TODO 分块对齐 */}
       {/* <FormItem >
         <Tooltip content={t('page.torrent-generator.piece-alignment-desc')} position="right">

diff --git a/src/utils/common/index.ts b/src/utils/common/index.ts
@@ -1,4 +1,7 @@
 // 为函数设置最短执行时间,例如: 为函数设置最短执行时间为 1000ms,如果函数执行了300ms,那么会等待700ms后再返回结果
+
+import { ipcRenderer } from 'electron'
+
 // 这样的目的是为了防止函数执行时间过短,导致加载动画一闪而过,给用户造成不好的体验
 export function setMinExecuteTime<T = any>(fn: Promise<T> | Function, minTime: number = 1000): Promise<T> {
   return new Promise<T>(async (resolve) => {
@@ -25,3 +28,8 @@ export function sleep(time: number): Promise<void> {
     }, time)
   })
 }
+
+// 获取当前系统平台
+export function getPlatform(): Promise<string> {
+  return ipcRenderer.invoke('get-platform')
+}