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/components/profile/profile-viewer.tsx

@@ -1,13 +1,3 @@
-import {
-  forwardRef,
-  useEffect,
-  useImperativeHandle,
-  useRef,
-  useState,
-} from "react";
-import { useLockFn } from "ahooks";
-import { useTranslation } from "react-i18next";
-import { useForm, Controller } from "react-hook-form";
 import {
   Box,
   FormControl,
@@ -18,11 +8,23 @@ import {
   styled,
   TextField,
 } from "@mui/material";
-import { createProfile, patchProfile } from "@/services/cmds";
-import { BaseDialog, Switch } from "@/components/base";
 import { version } from "@root/package.json";
+import { useLockFn } from "ahooks";
+import {
+  forwardRef,
+  useEffect,
+  useImperativeHandle,
+  useRef,
+  useState,
+} from "react";
+import { useForm, Controller } from "react-hook-form";
+import { useTranslation } from "react-i18next";
+
 import { FileInput } from "./file-input";
+
+import { BaseDialog, Switch } from "@/components/base";
 import { useProfiles } from "@/hooks/use-profiles";
+import { createProfile, patchProfile } from "@/services/cmds";
 import { showNotice } from "@/services/noticeService";
 
 interface Props {