Refactor imports and improve code organization across multiple components and hooks

- Consolidated and reordered imports in various files for better readability and maintainability.
- Removed unused imports and ensured consistent import styles.
- Enhanced the structure of components by grouping related imports together.
- Updated the layout and organization of hooks to streamline functionality.
- Improved the overall code quality by following best practices in import management.

src/pages/_layout.tsx

@@ -1,36 +1,44 @@
-import dayjs from "dayjs";
-import relativeTime from "dayjs/plugin/relativeTime";
-import { SWRConfig, mutate } from "swr";
-import { useEffect, useCallback, useState, useRef } from "react";
-import { useTranslation } from "react-i18next";
-import { useLocation, useRoutes, useNavigate } from "react-router-dom";
 import { List, Paper, ThemeProvider, SvgIcon } from "@mui/material";
 import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow";
+import dayjs from "dayjs";
+import relativeTime from "dayjs/plugin/relativeTime";
+import { useLocalStorage } from "foxact/use-local-storage";
+import { useEffect, useCallback, useState, useRef } from "react";
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { useLocation, useRoutes, useNavigate } from "react-router-dom";
+import { SWRConfig, mutate } from "swr";
+
 import { routers } from "./_routers";
-import { getAxios } from "@/services/api";
-import { forceRefreshClashConfig } from "@/services/cmds";
-import { useVerge } from "@/hooks/use-verge";
-import { useI18n } from "@/hooks/use-i18n";
-import LogoSvg from "@/assets/image/logo.svg?react";
-import iconLight from "@/assets/image/icon_light.svg?react";
+
 import iconDark from "@/assets/image/icon_dark.svg?react";
-import { useThemeMode, useEnableLog } from "@/services/states";
+import iconLight from "@/assets/image/icon_light.svg?react";
+import LogoSvg from "@/assets/image/logo.svg?react";
 import { LayoutItem } from "@/components/layout/layout-item";
 import { LayoutTraffic } from "@/components/layout/layout-traffic";
 import { UpdateButton } from "@/components/layout/update-button";
 import { useCustomTheme } from "@/components/layout/use-custom-theme";
+import { useI18n } from "@/hooks/use-i18n";
+import { useVerge } from "@/hooks/use-verge";
+import { getAxios } from "@/services/api";
+import { forceRefreshClashConfig } from "@/services/cmds";
+import { useThemeMode, useEnableLog } from "@/services/states";
 import getSystem from "@/utils/get-system";
+
 import "dayjs/locale/ru";
 import "dayjs/locale/zh-cn";
-import React from "react";
+
 import { useListen } from "@/hooks/use-listen";
+
 import { listen } from "@tauri-apps/api/event";
+
 import { useClashInfo } from "@/hooks/use-clash";
 import { initGlobalLogService } from "@/services/global-log-service";
+
 import { invoke } from "@tauri-apps/api/core";
+
 import { showNotice } from "@/services/noticeService";
 import { NoticeManager } from "@/components/base/NoticeManager";
-import { useLocalStorage } from "foxact/use-local-storage";
 import { LogLevel } from "@/hooks/use-log-data";
 
 const appWindow = getCurrentWebviewWindow();

src/pages/_routers.tsx

@@ -1,30 +1,30 @@
-import LogsPage from "./logs";
-import ProxiesPage from "./proxies";
-import ProfilesPage from "./profiles";
-import SettingsPage from "./settings";
-import ConnectionsPage from "./connections";
-import RulesPage from "./rules";
-import HomePage from "./home";
-import UnlockPage from "./unlock";
-import { BaseErrorBoundary } from "@/components/base";
-
-import HomeSvg from "@/assets/image/itemicon/home.svg?react";
-import ProxiesSvg from "@/assets/image/itemicon/proxies.svg?react";
-import ProfilesSvg from "@/assets/image/itemicon/profiles.svg?react";
-import ConnectionsSvg from "@/assets/image/itemicon/connections.svg?react";
-import RulesSvg from "@/assets/image/itemicon/rules.svg?react";
-import LogsSvg from "@/assets/image/itemicon/logs.svg?react";
-import UnlockSvg from "@/assets/image/itemicon/unlock.svg?react";
-import SettingsSvg from "@/assets/image/itemicon/settings.svg?react";
-
-import WifiRoundedIcon from "@mui/icons-material/WifiRounded";
 import DnsRoundedIcon from "@mui/icons-material/DnsRounded";
-import LanguageRoundedIcon from "@mui/icons-material/LanguageRounded";
 import ForkRightRoundedIcon from "@mui/icons-material/ForkRightRounded";
-import SubjectRoundedIcon from "@mui/icons-material/SubjectRounded";
-import SettingsRoundedIcon from "@mui/icons-material/SettingsRounded";
 import HomeRoundedIcon from "@mui/icons-material/HomeRounded";
+import LanguageRoundedIcon from "@mui/icons-material/LanguageRounded";
 import LockOpenRoundedIcon from "@mui/icons-material/LockOpenRounded";
+import SettingsRoundedIcon from "@mui/icons-material/SettingsRounded";
+import SubjectRoundedIcon from "@mui/icons-material/SubjectRounded";
+import WifiRoundedIcon from "@mui/icons-material/WifiRounded";
+
+import ConnectionsPage from "./connections";
+import HomePage from "./home";
+import LogsPage from "./logs";
+import ProfilesPage from "./profiles";
+import ProxiesPage from "./proxies";
+import RulesPage from "./rules";
+import SettingsPage from "./settings";
+import UnlockPage from "./unlock";
+
+import ConnectionsSvg from "@/assets/image/itemicon/connections.svg?react";
+import HomeSvg from "@/assets/image/itemicon/home.svg?react";
+import LogsSvg from "@/assets/image/itemicon/logs.svg?react";
+import ProfilesSvg from "@/assets/image/itemicon/profiles.svg?react";
+import ProxiesSvg from "@/assets/image/itemicon/proxies.svg?react";
+import RulesSvg from "@/assets/image/itemicon/rules.svg?react";
+import SettingsSvg from "@/assets/image/itemicon/settings.svg?react";
+import UnlockSvg from "@/assets/image/itemicon/unlock.svg?react";
+import { BaseErrorBoundary } from "@/components/base";
 
 export const routers = [
   {

src/pages/connections.tsx

@@ -1,29 +1,30 @@
-import { useMemo, useRef, useState, useCallback } from "react";
-import { useLockFn } from "ahooks";
-import { Box, Button, IconButton, MenuItem } from "@mui/material";
-import { Virtuoso } from "react-virtuoso";
-import { useTranslation } from "react-i18next";
 import {
   TableChartRounded,
   TableRowsRounded,
   PlayCircleOutlineRounded,
   PauseCircleOutlineRounded,
 } from "@mui/icons-material";
-import { closeAllConnections } from "@/services/cmds";
-import { useConnectionSetting } from "@/services/states";
+import { Box, Button, IconButton, MenuItem } from "@mui/material";
+import { useTheme } from "@mui/material/styles";
+import { useLockFn } from "ahooks";
+import { useMemo, useRef, useState, useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import { Virtuoso } from "react-virtuoso";
+
 import { BaseEmpty, BasePage } from "@/components/base";
-import { ConnectionItem } from "@/components/connection/connection-item";
-import { ConnectionTable } from "@/components/connection/connection-table";
+import { BaseSearchBox } from "@/components/base/base-search-box";
+import { BaseStyledSelect } from "@/components/base/base-styled-select";
 import {
   ConnectionDetail,
   ConnectionDetailRef,
 } from "@/components/connection/connection-detail";
-import parseTraffic from "@/utils/parse-traffic";
-import { BaseSearchBox } from "@/components/base/base-search-box";
-import { BaseStyledSelect } from "@/components/base/base-styled-select";
-import { useTheme } from "@mui/material/styles";
+import { ConnectionItem } from "@/components/connection/connection-item";
+import { ConnectionTable } from "@/components/connection/connection-table";
 import { useVisibility } from "@/hooks/use-visibility";
 import { useAppData } from "@/providers/app-data-provider";
+import { closeAllConnections } from "@/services/cmds";
+import { useConnectionSetting } from "@/services/states";
+import parseTraffic from "@/utils/parse-traffic";
 
 const initConn: IConnections = {
   uploadTotal: 0,

src/pages/home.tsx

@@ -1,4 +1,11 @@
-import { useTranslation } from "react-i18next";
+import {
+  RouterOutlined,
+  SettingsOutlined,
+  DnsOutlined,
+  SpeedOutlined,
+  HelpOutlineRounded,
+  HistoryEduOutlined,
+} from "@mui/icons-material";
 import {
   Box,
   Button,
@@ -14,25 +21,19 @@ import {
   Grid,
   Skeleton,
 } from "@mui/material";
-import { useVerge } from "@/hooks/use-verge";
-import { useProfiles } from "@/hooks/use-profiles";
-import {
-  RouterOutlined,
-  SettingsOutlined,
-  DnsOutlined,
-  SpeedOutlined,
-  HelpOutlineRounded,
-  HistoryEduOutlined,
-} from "@mui/icons-material";
-import { ProxyTunCard } from "@/components/home/proxy-tun-card";
-import { ClashModeCard } from "@/components/home/clash-mode-card";
-import { EnhancedTrafficStats } from "@/components/home/enhanced-traffic-stats";
-import { useState, useMemo, Suspense, lazy, useCallback } from "react";
-import { HomeProfileCard } from "@/components/home/home-profile-card";
-import { EnhancedCard } from "@/components/home/enhanced-card";
-import { CurrentProxyCard } from "@/components/home/current-proxy-card";
-import { BasePage } from "@/components/base";
 import { useLockFn } from "ahooks";
+import { useState, useMemo, Suspense, lazy, useCallback } from "react";
+import { useTranslation } from "react-i18next";
+
+import { BasePage } from "@/components/base";
+import { ClashModeCard } from "@/components/home/clash-mode-card";
+import { CurrentProxyCard } from "@/components/home/current-proxy-card";
+import { EnhancedCard } from "@/components/home/enhanced-card";
+import { EnhancedTrafficStats } from "@/components/home/enhanced-traffic-stats";
+import { HomeProfileCard } from "@/components/home/home-profile-card";
+import { ProxyTunCard } from "@/components/home/proxy-tun-card";
+import { useProfiles } from "@/hooks/use-profiles";
+import { useVerge } from "@/hooks/use-verge";
 import { entry_lightweight_mode, openWebUrl } from "@/services/cmds";
 
 const LazyTestCard = lazy(() =>

src/pages/logs.tsx

@@ -1,26 +1,26 @@
-import { useMemo, useState } from "react";
-import { Box, Button, IconButton, MenuItem } from "@mui/material";
-import { Virtuoso } from "react-virtuoso";
-import { useTranslation } from "react-i18next";
-import { useLocalStorage } from "foxact/use-local-storage";
-
 import {
   PlayCircleOutlineRounded,
   PauseCircleOutlineRounded,
 } from "@mui/icons-material";
-import { LogLevel } from "@/hooks/use-log-data";
-import { useEnableLog } from "@/services/states";
+import { Box, Button, IconButton, MenuItem } from "@mui/material";
+import { useLocalStorage } from "foxact/use-local-storage";
+import { useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Virtuoso } from "react-virtuoso";
+
 import { BaseEmpty, BasePage } from "@/components/base";
-import LogItem from "@/components/log/log-item";
 import { BaseSearchBox } from "@/components/base/base-search-box";
-import { BaseStyledSelect } from "@/components/base/base-styled-select";
 import { SearchState } from "@/components/base/base-search-box";
+import { BaseStyledSelect } from "@/components/base/base-styled-select";
+import LogItem from "@/components/log/log-item";
+import { LogLevel } from "@/hooks/use-log-data";
 import {
   useGlobalLogData,
   clearGlobalLogs,
   changeLogLevel,
   toggleLogEnabled,
 } from "@/services/global-log-service";
+import { useEnableLog } from "@/services/states";
 
 // 后端通过 /logs?level={level} 进行筛选，前端不再需要手动筛选日志级别
 

src/pages/profiles.tsx

@@ -1,7 +1,3 @@
-import useSWR, { mutate } from "swr";
-import { useEffect, useMemo, useRef, useState } from "react";
-import { useLockFn } from "ahooks";
-import { Box, Button, IconButton, Stack, Divider, Grid } from "@mui/material";
 import {
   DndContext,
   closestCenter,
@@ -15,7 +11,6 @@ import {
   SortableContext,
   sortableKeyboardCoordinates,
 } from "@dnd-kit/sortable";
-import { LoadingButton } from "@mui/lab";
 import {
   ClearRounded,
   ContentPasteRounded,
@@ -23,7 +18,31 @@ import {
   RefreshRounded,
   TextSnippetOutlined,
 } from "@mui/icons-material";
+import { LoadingButton } from "@mui/lab";
+import { Box, Button, IconButton, Stack, Divider, Grid } from "@mui/material";
+import { listen } from "@tauri-apps/api/event";
+import { TauriEvent } from "@tauri-apps/api/event";
+import { readText } from "@tauri-apps/plugin-clipboard-manager";
+import { readTextFile } from "@tauri-apps/plugin-fs";
+import { useLockFn } from "ahooks";
+import { throttle } from "lodash-es";
+import { useEffect, useMemo, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
+import { useLocation } from "react-router-dom";
+import useSWR, { mutate } from "swr";
+
+import { BasePage, DialogRef } from "@/components/base";
+import { BaseStyledTextField } from "@/components/base/base-styled-text-field";
+import { ProfileItem } from "@/components/profile/profile-item";
+import { ProfileMore } from "@/components/profile/profile-more";
+import {
+  ProfileViewer,
+  ProfileViewerRef,
+} from "@/components/profile/profile-viewer";
+import { ConfigViewer } from "@/components/setting/mods/config-viewer";
+import { useListen } from "@/hooks/use-listen";
+import { useProfiles } from "@/hooks/use-profiles";
+import { closeAllConnections } from "@/services/cmds";
 import {
   importProfile,
   enhanceProfiles,
@@ -35,26 +54,8 @@ import {
   createProfile,
   getProfiles,
 } from "@/services/cmds";
-import { useSetLoadingCache, useThemeMode } from "@/services/states";
-import { closeAllConnections } from "@/services/cmds";
-import { BasePage, DialogRef } from "@/components/base";
-import {
-  ProfileViewer,
-  ProfileViewerRef,
-} from "@/components/profile/profile-viewer";
-import { ProfileMore } from "@/components/profile/profile-more";
-import { ProfileItem } from "@/components/profile/profile-item";
-import { useProfiles } from "@/hooks/use-profiles";
-import { ConfigViewer } from "@/components/setting/mods/config-viewer";
-import { throttle } from "lodash-es";
-import { BaseStyledTextField } from "@/components/base/base-styled-text-field";
-import { readTextFile } from "@tauri-apps/plugin-fs";
-import { readText } from "@tauri-apps/plugin-clipboard-manager";
-import { useLocation } from "react-router-dom";
-import { useListen } from "@/hooks/use-listen";
-import { listen } from "@tauri-apps/api/event";
-import { TauriEvent } from "@tauri-apps/api/event";
 import { showNotice } from "@/services/noticeService";
+import { useSetLoadingCache, useThemeMode } from "@/services/states";
 
 // 记录profile切换状态
 const debugProfileSwitch = (action: string, profile: string, extra?: any) => {

src/pages/proxies.tsx

@@ -1,8 +1,13 @@
-import useSWR from "swr";
-import { useEffect, useState } from "react";
-import { useLockFn } from "ahooks";
-import { useTranslation } from "react-i18next";
 import { Box, Button, ButtonGroup } from "@mui/material";
+import { useLockFn } from "ahooks";
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import useSWR from "swr";
+
+import { BasePage } from "@/components/base";
+import { ProviderButton } from "@/components/proxy/provider-button";
+import { ProxyGroups } from "@/components/proxy/proxy-groups";
+import { useVerge } from "@/hooks/use-verge";
 import {
   closeAllConnections,
   getClashConfig,
@@ -10,10 +15,6 @@ import {
   updateProxyChainConfigInRuntime,
 } from "@/services/cmds";
 import { patchClashMode } from "@/services/cmds";
-import { useVerge } from "@/hooks/use-verge";
-import { BasePage } from "@/components/base";
-import { ProxyGroups } from "@/components/proxy/proxy-groups";
-import { ProviderButton } from "@/components/proxy/provider-button";
 
 const ProxyPage = () => {
   const { t } = useTranslation();

src/pages/rules.tsx

@@ -1,14 +1,15 @@
+import { Box } from "@mui/material";
 import { useState, useMemo, useRef, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { Virtuoso, VirtuosoHandle } from "react-virtuoso";
-import { Box } from "@mui/material";
+
 import { BaseEmpty, BasePage } from "@/components/base";
-import RuleItem from "@/components/rule/rule-item";
-import { ProviderButton } from "@/components/rule/provider-button";
 import { BaseSearchBox } from "@/components/base/base-search-box";
 import { ScrollTopButton } from "@/components/layout/scroll-top-button";
-import { useAppData } from "@/providers/app-data-provider";
+import { ProviderButton } from "@/components/rule/provider-button";
+import RuleItem from "@/components/rule/rule-item";
 import { useVisibility } from "@/hooks/use-visibility";
+import { useAppData } from "@/providers/app-data-provider";
 
 const RulesPage = () => {
   const { t } = useTranslation();

src/pages/settings.tsx

@@ -1,15 +1,16 @@
+import { GitHub, HelpOutlineRounded, Telegram } from "@mui/icons-material";
 import { Box, ButtonGroup, IconButton, Grid } from "@mui/material";
 import { useLockFn } from "ahooks";
 import { useTranslation } from "react-i18next";
+
 import { BasePage } from "@/components/base";
-import { GitHub, HelpOutlineRounded, Telegram } from "@mui/icons-material";
-import { openWebUrl } from "@/services/cmds";
-import SettingVergeBasic from "@/components/setting/setting-verge-basic";
-import SettingVergeAdvanced from "@/components/setting/setting-verge-advanced";
 import SettingClash from "@/components/setting/setting-clash";
 import SettingSystem from "@/components/setting/setting-system";
-import { useThemeMode } from "@/services/states";
+import SettingVergeAdvanced from "@/components/setting/setting-verge-advanced";
+import SettingVergeBasic from "@/components/setting/setting-verge-basic";
+import { openWebUrl } from "@/services/cmds";
 import { showNotice } from "@/services/noticeService";
+import { useThemeMode } from "@/services/states";
 
 const SettingPage = () => {
   const { t } = useTranslation();

src/pages/test.tsx

@@ -1,6 +1,3 @@
-import { useEffect, useRef, useState } from "react";
-import { useVerge } from "@/hooks/use-verge";
-import { Box, Button, Grid } from "@mui/material";
 import {
   DndContext,
   closestCenter,
@@ -14,20 +11,22 @@ import {
   SortableContext,
   sortableKeyboardCoordinates,
 } from "@dnd-kit/sortable";
-
-import { useTranslation } from "react-i18next";
-import { BasePage } from "@/components/base";
-import { TestViewer, TestViewerRef } from "@/components/test/test-viewer";
-import { TestItem } from "@/components/test/test-item";
+import { Box, Button, Grid } from "@mui/material";
 import { emit } from "@tauri-apps/api/event";
 import { nanoid } from "nanoid";
-import { ScrollTopButton } from "@/components/layout/scroll-top-button";
+import { useEffect, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
 
 // test icons
 import apple from "@/assets/image/test/apple.svg?raw";
 import github from "@/assets/image/test/github.svg?raw";
 import google from "@/assets/image/test/google.svg?raw";
 import youtube from "@/assets/image/test/youtube.svg?raw";
+import { BasePage } from "@/components/base";
+import { ScrollTopButton } from "@/components/layout/scroll-top-button";
+import { TestItem } from "@/components/test/test-item";
+import { TestViewer, TestViewerRef } from "@/components/test/test-viewer";
+import { useVerge } from "@/hooks/use-verge";
 
 const TestPage = () => {
   const { t } = useTranslation();

src/pages/unlock.tsx

@@ -1,4 +1,11 @@
-import { useEffect, useState } from "react";
+import {
+  CheckCircleOutlined,
+  CancelOutlined,
+  HelpOutline,
+  PendingOutlined,
+  RefreshRounded,
+  AccessTimeOutlined,
+} from "@mui/icons-material";
 import {
   Box,
   Button,
@@ -12,18 +19,12 @@ import {
   useTheme,
   Grid,
 } from "@mui/material";
-import { useTranslation } from "react-i18next";
 import { invoke } from "@tauri-apps/api/core";
-import { BasePage, BaseEmpty } from "@/components/base";
 import { useLockFn } from "ahooks";
-import {
-  CheckCircleOutlined,
-  CancelOutlined,
-  HelpOutline,
-  PendingOutlined,
-  RefreshRounded,
-  AccessTimeOutlined,
-} from "@mui/icons-material";
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+
+import { BasePage, BaseEmpty } from "@/components/base";
 import { showNotice } from "@/services/noticeService";
 
 interface UnlockItem {