feat: complete stage 4 cleanup and code formatting

This commit completes stage 4 of the refactoring plan, focusing on cleanup
and optimization of the modernized codebase.

## Key Changes

### Code Cleanup
- Remove legacy `src/lib/styles.ts` (no longer needed)
- Remove old modal components (`ImportProgressModal.tsx`, `ProviderList.tsx`)
- Streamline `src/lib/tauri-api.ts` from 712 lines to 17 lines (-97.6%)
  - Remove global `window.api` pollution
  - Keep only event listeners (`tauriEvents.onProviderSwitched`)
  - All API calls now use modular `@/lib/api/*` layer

### Type System
- Clean up `src/vite-env.d.ts` (remove 156 lines of outdated types)
- Remove obsolete global type declarations
- All TypeScript checks pass with zero errors

### Code Formatting
- Format all source files with Prettier (82 files)
- Fix formatting issues in 15 files:
  - App.tsx and core components
  - MCP management components
  - Settings module components
  - Provider management components
  - UI components

### Documentation Updates
- Update `REFACTORING_CHECKLIST.md` with stage 4 progress
- Mark completed tasks in `REFACTORING_MASTER_PLAN.md`

## Impact

**Code Reduction:**
- Total: -1,753 lines, +384 lines (net -1,369 lines)
- tauri-api.ts: 712 → 17 lines (-97.6%)
- Removed styles.ts: -82 lines
- Removed vite-env.d.ts declarations: -156 lines

**Quality Improvements:**
- ✅ Zero TypeScript errors
- ✅ Zero TODO/FIXME comments
- ✅ 100% Prettier compliant
- ✅ Zero `window.api` references
- ✅ Fully modular API layer

## Testing
- [x] TypeScript compilation passes
- [x] Code formatting validated
- [x] No linting errors

Stage 4 completion: 100%
Ready for stage 5 (testing and bug fixes)

src/components/settings/AboutSection.tsx

@@ -59,8 +59,8 @@ export function AboutSection({ isPortable }: AboutSectionProps) {
       const displayVersion = targetVersion.startsWith("v")
         ? targetVersion
         : targetVersion
-        ? `v${targetVersion}`
-        : "";
+          ? `v${targetVersion}`
+          : "";
 
       if (!displayVersion) {
         await settingsApi.openExternal(
@@ -108,7 +108,10 @@ export function AboutSection({ isPortable }: AboutSectionProps) {
         try {
           await settingsApi.checkUpdates();
         } catch (fallbackError) {
-          console.error("[AboutSection] Failed to open fallback updater", fallbackError);
+          console.error(
+            "[AboutSection] Failed to open fallback updater",
+            fallbackError,
+          );
         }
       } finally {
         setIsDownloading(false);
@@ -119,9 +122,7 @@ export function AboutSection({ isPortable }: AboutSectionProps) {
     try {
       const available = await checkUpdate();
       if (!available) {
-        toast.success(
-          t("settings.upToDate", { defaultValue: "已是最新版本" }),
-        );
+        toast.success(t("settings.upToDate", { defaultValue: "已是最新版本" }));
       }
     } catch (error) {
       console.error("[AboutSection] Check update failed", error);
@@ -131,14 +132,7 @@ export function AboutSection({ isPortable }: AboutSectionProps) {
         }),
       );
     }
-  }, [
-    checkUpdate,
-    hasUpdate,
-    isPortable,
-    resetDismiss,
-    t,
-    updateHandle,
-  ]);
+  }, [checkUpdate, hasUpdate, isPortable, resetDismiss, t, updateHandle]);
 
   const displayVersion =
     version ?? t("common.unknown", { defaultValue: "未知" });

src/components/settings/DirectorySettings.tsx

@@ -106,7 +106,10 @@ function DirectoryInput({
   onReset,
 }: DirectoryInputProps) {
   const { t } = useTranslation();
-  const displayValue = useMemo(() => value ?? resolvedValue ?? "", [value, resolvedValue]);
+  const displayValue = useMemo(
+    () => value ?? resolvedValue ?? "",
+    [value, resolvedValue],
+  );
 
   return (
     <div className="space-y-1.5">

src/components/settings/ImportExportSection.tsx

@@ -156,7 +156,9 @@ function ImportStatusMessage({
 
   if (status === "success") {
     return (
-      <div className={`${baseClass} border-green-200 bg-green-100/70 text-green-700`}>
+      <div
+        className={`${baseClass} border-green-200 bg-green-100/70 text-green-700`}
+      >
         <CheckCircle2 className="mt-0.5 h-4 w-4" />
         <div className="space-y-1">
           <p className="font-medium">{t("settings.importSuccess")}</p>

src/components/settings/LanguageSettings.tsx

@@ -21,16 +21,10 @@ export function LanguageSettings({ value, onChange }: LanguageSettingsProps) {
         </p>
       </header>
       <div className="inline-flex gap-1 rounded-md border border-border bg-background p-1">
-        <LanguageButton
-          active={value === "zh"}
-          onClick={() => onChange("zh")}
-        >
+        <LanguageButton active={value === "zh"} onClick={() => onChange("zh")}>
           {t("settings.languageOptionChinese")}
         </LanguageButton>
-        <LanguageButton
-          active={value === "en"}
-          onClick={() => onChange("en")}
-        >
+        <LanguageButton active={value === "en"} onClick={() => onChange("en")}>
           {t("settings.languageOptionEnglish")}
         </LanguageButton>
       </div>
@@ -55,7 +49,7 @@ function LanguageButton({ active, onClick, children }: LanguageButtonProps) {
         "min-w-[96px]",
         active
           ? "shadow-sm"
-          : "text-muted-foreground hover:text-foreground hover:bg-muted"
+          : "text-muted-foreground hover:text-foreground hover:bg-muted",
       )}
     >
       {children}

src/components/settings/SettingsDialog.tsx

@@ -1,7 +1,13 @@
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { Loader2, Save } from "lucide-react";
 import { toast } from "sonner";
-import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog";
+import {
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Button } from "@/components/ui/button";
 import { settingsApi } from "@/lib/api";
@@ -84,7 +90,13 @@ export function SettingsDialog({
     clearSelection();
     resetStatus();
     onOpenChange(false);
-  }, [acknowledgeRestart, clearSelection, onOpenChange, resetSettings, resetStatus]);
+  }, [
+    acknowledgeRestart,
+    clearSelection,
+    onOpenChange,
+    resetSettings,
+    resetStatus,
+  ]);
 
   const handleDialogChange = useCallback(
     (nextOpen: boolean) => {
@@ -173,9 +185,7 @@ export function SettingsDialog({
                 <TabsTrigger value="advanced">
                   {t("settings.tabAdvanced", { defaultValue: "高级" })}
                 </TabsTrigger>
-                <TabsTrigger value="about">
-                  {t("common.about")}
-                </TabsTrigger>
+                <TabsTrigger value="about">{t("common.about")}</TabsTrigger>
               </TabsList>
 
               <div className="flex-1 overflow-y-auto pr-1">

src/components/settings/WindowSettings.tsx

@@ -13,9 +13,7 @@ export function WindowSettings({ settings, onChange }: WindowSettingsProps) {
   return (
     <section className="space-y-4">
       <header className="space-y-1">
-        <h3 className="text-sm font-medium">
-          {t("settings.windowBehavior")}
-        </h3>
+        <h3 className="text-sm font-medium">{t("settings.windowBehavior")}</h3>
         <p className="text-xs text-muted-foreground">
           {t("settings.windowBehaviorHint", {
             defaultValue: "配置窗口最小化与 Claude 插件联动策略。",
@@ -27,9 +25,7 @@ export function WindowSettings({ settings, onChange }: WindowSettingsProps) {
         title={t("settings.minimizeToTray")}
         description={t("settings.minimizeToTrayDescription")}
         checked={settings.minimizeToTrayOnClose}
-        onCheckedChange={(value) =>
-          onChange({ minimizeToTrayOnClose: value })
-        }
+        onCheckedChange={(value) => onChange({ minimizeToTrayOnClose: value })}
       />
 
       <ToggleRow