diff --git a/src/renderer/src/FloatingApp.tsx b/src/renderer/src/FloatingApp.tsx index c46766e..d1b3974 100644 --- a/src/renderer/src/FloatingApp.tsx +++ b/src/renderer/src/FloatingApp.tsx @@ -1,4 +1,4 @@ -import { useEffect, useState } from 'react' +import { useEffect, useMemo, useState } from 'react' import MihomoIcon from './components/base/mihomo-icon' import { calcTraffic } from './utils/calc' import { showContextMenu, triggerMainWindow } from './utils/ipc' @@ -8,13 +8,27 @@ import { useControledMihomoConfig } from './hooks/use-controled-mihomo-config' const FloatingApp: React.FC = () => { const { appConfig } = useAppConfig() const { controledMihomoConfig } = useControledMihomoConfig() - const { sysProxy } = appConfig || {} + const { sysProxy, spinFloatingIcon = true } = appConfig || {} const { tun } = controledMihomoConfig || {} const sysProxyEnabled = sysProxy?.enable const tunEnabled = tun?.enable const [upload, setUpload] = useState(0) const [download, setDownload] = useState(0) + const slowest = 10 + const fastest = 0.1 + + const spinDuration = useMemo(() => { + let duration = upload + download === 0 ? slowest : 409600 / (upload + download) + if (duration > slowest) { + duration = slowest + } + if (duration < fastest) { + duration = fastest + } + return duration + }, [upload, download]) + useEffect(() => { window.electron.ipcRenderer.on('mihomoTraffic', async (_e, info: IMihomoTrafficInfo) => { setUpload(info.up) @@ -24,6 +38,7 @@ const FloatingApp: React.FC = () => { window.electron.ipcRenderer.removeAllListeners('mihomoTraffic') } }, []) + return (
@@ -36,6 +51,7 @@ const FloatingApp: React.FC = () => { onClick={() => { triggerMainWindow() }} + style={spinFloatingIcon ? { animation: `spin ${spinDuration}s linear infinite` } : {}} className={`app-nodrag cursor-pointer floating-thumb ${tunEnabled ? 'bg-secondary' : sysProxyEnabled ? 'bg-primary' : 'bg-default'} hover:opacity-hover rounded-full h-[calc(100%-4px)] aspect-square`} > diff --git a/src/renderer/src/components/settings/general-config.tsx b/src/renderer/src/components/settings/general-config.tsx index 1e036e8..00c1cb4 100644 --- a/src/renderer/src/components/settings/general-config.tsx +++ b/src/renderer/src/components/settings/general-config.tsx @@ -43,6 +43,7 @@ const GeneralConfig: React.FC = () => { proxyInTray = true, disableTray = false, showFloatingWindow: showFloating = false, + spinFloatingIcon = true, useWindowFrame = false, autoQuitWithoutCore = false, autoQuitWithoutCoreDelay = 60, @@ -195,6 +196,16 @@ const GeneralConfig: React.FC = () => { }} /> + + { + await patchAppConfig({ spinFloatingIcon: v }) + window.electron.ipcRenderer.send('updateFloatingWindow') + }} + /> + {showFloating && (