fix styles

Author: Pompurin404

src/main/utils/ipc.ts

@@ -67,6 +67,7 @@ export function registerIpcMainHandlers(): void {
   ipcMain.handle('isEncryptionAvailable', isEncryptionAvailable)
   ipcMain.handle('encryptString', (_e, str) => safeStorage.encryptString(str))
   ipcMain.handle('checkUpdate', () => checkUpdate())
+  ipcMain.handle('getVersion', () => app.getVersion())
   ipcMain.handle('platform', () => process.platform)
   ipcMain.handle('quitApp', () => app.quit())
 }

src/renderer/src/components/profiles/profile-item.tsx

@@ -47,6 +47,7 @@ const ProfileItem: React.FC<Props> = (props) => {
   const usage = (extra?.upload ?? 0) + (extra?.download ?? 0)
   const total = extra?.total ?? 0
   const [updating, setUpdating] = useState(false)
+  const [selecting, setSelecting] = useState(false)
   const [openInfo, setOpenInfo] = useState(false)
   const [openFile, setOpenFile] = useState(false)
 
@@ -119,7 +120,17 @@ const ProfileItem: React.FC<Props> = (props) => {
           updateProfileItem={updateProfileItem}
         />
       )}
-      <Card fullWidth isPressable onPress={onClick} className={isCurrent ? 'bg-primary' : ''}>
+      <Card
+        fullWidth
+        isPressable
+        onPress={() => {
+          setSelecting(true)
+          onClick().finally(() => {
+            setSelecting(false)
+          })
+        }}
+        className={`${isCurrent ? 'bg-primary' : ''} ${selecting ? 'blur-sm' : ''}`}
+      >
         <CardBody className="pb-1">
           <div className="flex justify-between h-[32px]">
             <h3
@@ -171,7 +182,7 @@ const ProfileItem: React.FC<Props> = (props) => {
             </div>
           </div>
           <div
-            className={`mt-2 flex justify-between ${isCurrent ? 'text-white' : 'text-foreground'}`}
+            className={`mt-2 flex select-none justify-between ${isCurrent ? 'text-white' : 'text-foreground'}`}
           >
             <small>{extra ? `${calcTraffic(usage)}/${calcTraffic(total)}` : undefined}</small>
             <small>{dayjs(info.updated).fromNow()}</small>

src/renderer/src/components/proxies/proxy-item.tsx

@@ -62,7 +62,7 @@ const ProxyItem: React.FC<Props> = (props) => {
       radius="sm"
     >
       <CardBody className="p-2">
-        <div className="flex justify-between items-center">
+        <div className="flex select-none justify-between items-center">
           <div>
             <div className="inline text-ellipsis whitespace-nowrap overflow-hidden">
               {proxy.name}

src/renderer/src/components/sider/profile-card.tsx

@@ -60,7 +60,9 @@ const ProfileCard: React.FC = () => {
             />
           </Button>
         </div>
-        <div className={`mt-2 flex justify-between ${match ? 'text-white' : 'text-foreground'} `}>
+        <div
+          className={`mt-2 flex select-none justify-between ${match ? 'text-white' : 'text-foreground'} `}
+        >
           <small>{extra ? `${calcTraffic(usage)}/${calcTraffic(total)}` : undefined}</small>
           <small>{dayjs(info.updated).fromNow()}</small>
         </div>

src/renderer/src/components/sider/proxy-card.tsx

@@ -39,11 +39,11 @@ const ProxyCard: React.FC = () => {
               match
                 ? {
                     base: 'border-white',
-                    content: 'text-white'
+                    content: 'text-white select-none'
                   }
                 : {
                     base: 'border-primary',
-                    content: 'text-primary'
+                    content: 'text-primary select-none'
                   }
             }
             size="sm"

src/renderer/src/components/sider/rule-card.tsx

@@ -36,11 +36,11 @@ const RuleCard: React.FC = () => {
               match
                 ? {
                     base: 'border-white',
-                    content: 'text-white'
+                    content: 'text-white select-none'
                   }
                 : {
                     base: 'border-primary',
-                    content: 'text-primary'
+                    content: 'text-primary select-none'
                   }
             }
             size="sm"

src/renderer/src/pages/proxies.tsx

@@ -158,7 +158,7 @@ const Proxies: React.FC = () => {
                           src={groups[index].icon}
                         />
                       ) : null}
-                      <div className="h-[32px] text-ellipsis whitespace-nowrap overflow-hidden text-md leading-[32px]">
+                      <div className="h-[32px] select-none text-ellipsis whitespace-nowrap overflow-hidden text-md leading-[32px]">
                         {groups[index].name}
                         {proxyDisplayMode === 'full' && (
                           <>
@@ -174,7 +174,7 @@ const Proxies: React.FC = () => {
                     </div>
                     <div className="flex ">
                       {proxyDisplayMode === 'full' && (
-                        <Chip size="sm" className="my-1 mr-2">
+                        <Chip size="sm" className="my-1 mr-2 select-none">
                           {groups[index].all.length}
                         </Chip>
                       )}

src/renderer/src/pages/settings.tsx

@@ -11,7 +11,7 @@ import {
   checkUpdate
 } from '@renderer/utils/ipc'
 import { IoLogoGithub } from 'react-icons/io5'
-
+import { version } from '@renderer/utils/init'
 import useSWR from 'swr'
 
 const Settings: React.FC = () => {
@@ -108,11 +108,16 @@ const Settings: React.FC = () => {
                   (): void => {
                     open(`https://github.com/pompurin404/mihomo-party/releases/tag/v${v}`)
                   }
+              } else {
+                new window.Notification('当前已是最新版本', { body: '无需更新' })
               }
             })
           }}
         />
-        <SettingItem title="退出应用" onPress={quitApp} />
+        <SettingItem title="退出应用" onPress={quitApp} divider />
+        <SettingItem title="应用版本">
+          <div className="select-none">v{version}</div>
+        </SettingItem>
       </SettingCard>
     </BasePage>
   )

src/renderer/src/utils/init.ts

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
-import { getPlatform } from './ipc'
+import { getPlatform, getVersion } from './ipc'
 const originError = console.error
 const originWarn = console.warn
 console.error = function (...args: any[]): void {
@@ -17,7 +17,9 @@ console.warn = function (...args): void {
 }
 
 export let platform: NodeJS.Platform
+export let version: string
 
 export async function init(): Promise<void> {
   platform = await getPlatform()
+  version = await getVersion()
 }

src/renderer/src/utils/ipc.ts

@@ -131,6 +131,10 @@ export async function checkUpdate(): Promise<string | undefined> {
   return await window.electron.ipcRenderer.invoke('checkUpdate')
 }
 
+export async function getVersion(): Promise<string> {
+  return await window.electron.ipcRenderer.invoke('getVersion')
+}
+
 export async function getPlatform(): Promise<NodeJS.Platform> {
   return await window.electron.ipcRenderer.invoke('platform')
 }