prettier

2026-10-13 10:26:38 +08:00 · 2026-07-13 15:08:40 +08:00
parent 08e8eea932
commit 1eff7878a1
441 changed files with 26491 additions and 18405 deletions
@@ -1,10 +1,10 @@
-"use client"
+'use client';

-import {useEffect} from "react"
-import {zodResolver} from "@hookform/resolvers/zod"
-import {Loader2} from "lucide-react"
-import {useForm} from "react-hook-form"
-import {z} from "zod"
+import {useEffect} from 'react';
+import {zodResolver} from '@hookform/resolvers/zod';
+import {Loader2} from 'lucide-react';
+import {useForm} from 'react-hook-form';
+import {z} from 'zod';

 import {
  AlertDialog,
@@ -14,22 +14,22 @@ import {
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogTitle,
-} from "@/components/ui/alert-dialog"
-import {Button} from "@/components/ui/button"
-import {Input} from "@/components/ui/input"
-import {Label} from "@/components/ui/label"
+} from '@/components/ui/alert-dialog';
+import {Button} from '@/components/ui/button';
+import {Input} from '@/components/ui/input';
+import {Label} from '@/components/ui/label';

 const cleanupSchema = z.object({
-  keepCount: z.number().int().min(3, "最少保留 3 个历史快照"),
-})
+  keepCount: z.number().int().min(3, '最少保留 3 个历史快照'),
+});

-type CleanupFormValues = z.infer<typeof cleanupSchema>
+type CleanupFormValues = z.infer<typeof cleanupSchema>;

 interface CleanupDialogProps {
-  open: boolean
-  onOpenChange: (open: boolean) => void
-  onConfirm: (keepCount: number) => void
-  loading: boolean
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  onConfirm: (keepCount: number) => void;
+  loading: boolean;
 }

 export function CleanupDialog({
@@ -41,17 +41,17 @@ export function CleanupDialog({
  const form = useForm<CleanupFormValues>({
    resolver: zodResolver(cleanupSchema),
    defaultValues: { keepCount: 10 },
-  })
+  });

  useEffect(() => {
    if (open) {
-      form.reset({ keepCount: 10 })
+      form.reset({ keepCount: 10 });
    }
-  }, [form, open])
+  }, [form, open]);

  const handleConfirm = form.handleSubmit((values) => {
-    onConfirm(values.keepCount)
-  })
+    onConfirm(values.keepCount);
+  });

  return (
    <AlertDialog open={open} onOpenChange={onOpenChange}>
@@ -63,35 +63,43 @@ export function CleanupDialog({
          </AlertDialogDescription>
        </AlertDialogHeader>

-        <div className="space-y-2">
-          <Label htmlFor="keepCount">保留最近快照个数</Label>
+        <div className='space-y-2'>
+          <Label htmlFor='keepCount'>保留最近快照个数</Label>
          <Input
-            id="keepCount"
-            type="number"
+            id='keepCount'
+            type='number'
            min={3}
            disabled={loading}
-            {...form.register("keepCount", { valueAsNumber: true })}
+            {...form.register('keepCount', { valueAsNumber: true })}
          />
-          <p className="text-xs text-muted-foreground">默认为 10 个，最少需保留 3 个。</p>
+          <p className='text-xs text-muted-foreground'>
+            默认为 10 个，最少需保留 3 个。
+          </p>
          {form.formState.errors.keepCount ? (
-            <p className="text-xs text-destructive">{form.formState.errors.keepCount.message}</p>
+            <p className='text-xs text-destructive'>
+              {form.formState.errors.keepCount.message}
+            </p>
          ) : null}
        </div>

        <AlertDialogFooter>
          <AlertDialogCancel disabled={loading}>取消</AlertDialogCancel>
-          <Button variant="destructive" onClick={() => void handleConfirm()} disabled={loading}>
+          <Button
+            variant='destructive'
+            onClick={() => void handleConfirm()}
+            disabled={loading}
+          >
            {loading ? (
              <>
-                <Loader2 className="size-4 animate-spin mr-1" />
+                <Loader2 className='size-4 animate-spin mr-1' />
                清理中...
              </>
            ) : (
-              "确认清理"
+              '确认清理'
            )}
          </Button>
        </AlertDialogFooter>
      </AlertDialogContent>
    </AlertDialog>
-  )
-}
+  );
+}
@@ -1,46 +1,50 @@
-"use client"
+'use client';

-import {Loader2} from "lucide-react"
+import {Loader2} from 'lucide-react';

-import {Badge} from "@/components/ui/badge"
-import {Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle,} from "@/components/ui/dialog"
-import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow,} from "@/components/ui/table"
-import type {ConfigDiffResult} from "@/lib/services/openflare"
+import {Badge} from '@/components/ui/badge';
+import {Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle,} from '@/components/ui/dialog';
+import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow,} from '@/components/ui/table';
+import type {ConfigDiffResult} from '@/lib/services/openflare';

 interface DiffDialogProps {
-  open: boolean
-  onOpenChange: (open: boolean) => void
-  diff: ConfigDiffResult | null
-  loading: boolean
-  error: string | null
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  diff: ConfigDiffResult | null;
+  loading: boolean;
+  error: string | null;
 }

 function DiffChipList({ title, items }: { title: string; items: string[] }) {
  return (
-    <div className="space-y-2">
-      <div className="flex items-center justify-between gap-2">
-        <p className="text-xs font-semibold">{title}</p>
-        <Badge variant="outline" className="text-[10px] rounded-full">
+    <div className='space-y-2'>
+      <div className='flex items-center justify-between gap-2'>
+        <p className='text-xs font-semibold'>{title}</p>
+        <Badge variant='outline' className='text-[10px] rounded-full'>
          {items.length} 项
        </Badge>
      </div>
      {items.length > 0 ? (
-        <div className="flex flex-wrap gap-1.5">
+        <div className='flex flex-wrap gap-1.5'>
          {items.map((item) => (
-            <Badge key={item} variant="secondary" className="text-[10px] font-normal">
+            <Badge
+              key={item}
+              variant='secondary'
+              className='text-[10px] font-normal'
+            >
              {item}
            </Badge>
          ))}
        </div>
      ) : (
-        <p className="text-xs text-muted-foreground">无变更</p>
+        <p className='text-xs text-muted-foreground'>无变更</p>
      )}
    </div>
-  )
+  );
 }

 function renderOptionValue(value: string) {
-  return value === "" ? "空" : value
+  return value === '' ? '空' : value;
 }

 export function DiffDialog({
@@ -52,7 +56,7 @@ export function DiffDialog({
 }: DiffDialogProps) {
  return (
    <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="sm:max-w-3xl max-h-[85vh] overflow-y-auto">
+      <DialogContent className='sm:max-w-3xl max-h-[85vh] overflow-y-auto'>
        <DialogHeader>
          <DialogTitle>配置差异</DialogTitle>
          <DialogDescription>
@@ -61,69 +65,98 @@ export function DiffDialog({
        </DialogHeader>

        {loading ? (
-          <div className="flex items-center justify-center gap-2 py-12 text-sm text-muted-foreground">
-            <Loader2 className="size-4 animate-spin" />
+          <div className='flex items-center justify-center gap-2 py-12 text-sm text-muted-foreground'>
+            <Loader2 className='size-4 animate-spin' />
            正在加载差异数据...
          </div>
        ) : error ? (
-          <p className="text-sm text-destructive">{error}</p>
+          <p className='text-sm text-destructive'>{error}</p>
        ) : diff ? (
-          <div className="space-y-5">
-            <div className="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
-              <div className="rounded-lg border border-dashed p-3">
-                <p className="text-[10px] uppercase tracking-wider text-muted-foreground">激活版本</p>
-                <p className="mt-1 text-sm font-medium">{diff.active_version || "无"}</p>
+          <div className='space-y-5'>
+            <div className='grid gap-3 sm:grid-cols-2 lg:grid-cols-4'>
+              <div className='rounded-lg border border-dashed p-3'>
+                <p className='text-[10px] uppercase tracking-wider text-muted-foreground'>
+                  激活版本
+                </p>
+                <p className='mt-1 text-sm font-medium'>
+                  {diff.active_version || '无'}
+                </p>
              </div>
-              <div className="rounded-lg border border-dashed p-3">
-                <p className="text-[10px] uppercase tracking-wider text-muted-foreground">新增域名</p>
-                <p className="mt-1 text-lg font-semibold text-emerald-600">{diff.added_domains.length}</p>
+              <div className='rounded-lg border border-dashed p-3'>
+                <p className='text-[10px] uppercase tracking-wider text-muted-foreground'>
+                  新增域名
+                </p>
+                <p className='mt-1 text-lg font-semibold text-emerald-600'>
+                  {diff.added_domains.length}
+                </p>
              </div>
-              <div className="rounded-lg border border-dashed p-3">
-                <p className="text-[10px] uppercase tracking-wider text-muted-foreground">删除域名</p>
-                <p className="mt-1 text-lg font-semibold text-amber-600">{diff.removed_domains.length}</p>
+              <div className='rounded-lg border border-dashed p-3'>
+                <p className='text-[10px] uppercase tracking-wider text-muted-foreground'>
+                  删除域名
+                </p>
+                <p className='mt-1 text-lg font-semibold text-amber-600'>
+                  {diff.removed_domains.length}
+                </p>
              </div>
-              <div className="rounded-lg border border-dashed p-3">
-                <p className="text-[10px] uppercase tracking-wider text-muted-foreground">修改域名</p>
-                <p className="mt-1 text-lg font-semibold text-blue-600">{diff.modified_domains.length}</p>
+              <div className='rounded-lg border border-dashed p-3'>
+                <p className='text-[10px] uppercase tracking-wider text-muted-foreground'>
+                  修改域名
+                </p>
+                <p className='mt-1 text-lg font-semibold text-blue-600'>
+                  {diff.modified_domains.length}
+                </p>
              </div>
            </div>

-            <div className="grid gap-4 md:grid-cols-3">
-              <DiffChipList title="新增域名" items={diff.added_domains} />
-              <DiffChipList title="删除域名" items={diff.removed_domains} />
-              <DiffChipList title="修改域名" items={diff.modified_domains} />
+            <div className='grid gap-4 md:grid-cols-3'>
+              <DiffChipList title='新增域名' items={diff.added_domains} />
+              <DiffChipList title='删除域名' items={diff.removed_domains} />
+              <DiffChipList title='修改域名' items={diff.modified_domains} />
            </div>

-            <div className="flex flex-wrap gap-2">
-              <Badge variant={diff.main_config_changed ? "destructive" : "outline"}>
-                主配置 {diff.main_config_changed ? "已变化" : "无变化"}
+            <div className='flex flex-wrap gap-2'>
+              <Badge
+                variant={diff.main_config_changed ? 'destructive' : 'outline'}
+              >
+                主配置 {diff.main_config_changed ? '已变化' : '无变化'}
              </Badge>
-              <Badge variant={diff.waf_config_changed ? "destructive" : "outline"}>
-                WAF {diff.waf_config_changed ? "已变化" : "无变化"}
+              <Badge
+                variant={diff.waf_config_changed ? 'destructive' : 'outline'}
+              >
+                WAF {diff.waf_config_changed ? '已变化' : '无变化'}
              </Badge>
-              <Badge variant="outline">
-                网站数 {diff.active_website_count} → {diff.current_website_count}
+              <Badge variant='outline'>
+                网站数 {diff.active_website_count} →{' '}
+                {diff.current_website_count}
              </Badge>
            </div>

            {diff.changed_option_details.length > 0 ? (
-              <div className="border border-dashed rounded-lg overflow-hidden">
+              <div className='border border-dashed rounded-lg overflow-hidden'>
                <Table>
-                  <TableHeader className="bg-muted/40">
-                    <TableRow className="border-dashed hover:bg-transparent">
-                      <TableHead className="text-xs font-semibold">参数</TableHead>
-                      <TableHead className="text-xs font-semibold">激活值</TableHead>
-                      <TableHead className="text-xs font-semibold">待发布值</TableHead>
+                  <TableHeader className='bg-muted/40'>
+                    <TableRow className='border-dashed hover:bg-transparent'>
+                      <TableHead className='text-xs font-semibold'>
+                        参数
+                      </TableHead>
+                      <TableHead className='text-xs font-semibold'>
+                        激活值
+                      </TableHead>
+                      <TableHead className='text-xs font-semibold'>
+                        待发布值
+                      </TableHead>
                    </TableRow>
                  </TableHeader>
                  <TableBody>
                    {diff.changed_option_details.map((item) => (
-                      <TableRow key={item.key} className="border-dashed">
-                        <TableCell className="text-xs font-medium">{item.key}</TableCell>
-                        <TableCell className="text-xs font-mono text-muted-foreground">
+                      <TableRow key={item.key} className='border-dashed'>
+                        <TableCell className='text-xs font-medium'>
+                          {item.key}
+                        </TableCell>
+                        <TableCell className='text-xs font-mono text-muted-foreground'>
                          {renderOptionValue(item.previous_value)}
                        </TableCell>
-                        <TableCell className="text-xs font-mono text-muted-foreground">
+                        <TableCell className='text-xs font-mono text-muted-foreground'>
                          {renderOptionValue(item.current_value)}
                        </TableCell>
                      </TableRow>
@@ -132,11 +165,13 @@ export function DiffDialog({
                </Table>
              </div>
            ) : (
-              <p className="text-xs text-muted-foreground">当前无 OpenResty 参数变化。</p>
+              <p className='text-xs text-muted-foreground'>
+                当前无 OpenResty 参数变化。
+              </p>
            )}
          </div>
        ) : null}
      </DialogContent>
    </Dialog>
-  )
+  );
 }
@@ -1,22 +1,29 @@
-"use client"
+'use client';

-import {Loader2} from "lucide-react"
+import { Loader2 } from 'lucide-react';

-import {Badge} from "@/components/ui/badge"
-import {Button} from "@/components/ui/button"
-import {CodeBlock} from "@/components/ui/code-block"
-import {Sheet, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle,} from "@/components/ui/sheet"
-import type {ConfigPreviewResult} from "@/lib/services/openflare"
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import { CodeBlock } from '@/components/ui/code-block';
+import {
+  Sheet,
+  SheetContent,
+  SheetDescription,
+  SheetFooter,
+  SheetHeader,
+  SheetTitle,
+} from '@/components/ui/sheet';
+import type { ConfigPreviewResult } from '@/lib/services/openflare';

 interface PreviewSheetProps {
-  open: boolean
-  onOpenChange: (open: boolean) => void
-  preview: ConfigPreviewResult | null
-  loading: boolean
-  error: string | null
-  publishing: boolean
-  canPublish: boolean
-  onPublish: () => void
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  preview: ConfigPreviewResult | null;
+  loading: boolean;
+  error: string | null;
+  publishing: boolean;
+  canPublish: boolean;
+  onPublish: () => void;
 }

 export function PreviewSheet({
@@ -31,65 +38,86 @@ export function PreviewSheet({
 }: PreviewSheetProps) {
  return (
    <Sheet open={open} onOpenChange={onOpenChange}>
-      <SheetContent className="sm:max-w-2xl w-full p-0 flex h-svh flex-col gap-0">
-        <SheetHeader className="px-5 py-4 border-b">
+      <SheetContent className='sm:max-w-2xl w-full p-0 flex h-svh flex-col gap-0'>
+        <SheetHeader className='px-5 py-4 border-b'>
          <SheetTitle>发布预览</SheetTitle>
          <SheetDescription>
            查看待发布配置的渲染结果与支持文件。
          </SheetDescription>
        </SheetHeader>

-        <div className="flex-1 min-h-0 overflow-y-auto px-5 py-4">
+        <div className='flex-1 min-h-0 overflow-y-auto px-5 py-4'>
          {loading ? (
-            <div className="flex items-center justify-center gap-2 py-16 text-sm text-muted-foreground">
-              <Loader2 className="size-4 animate-spin" />
+            <div className='flex items-center justify-center gap-2 py-16 text-sm text-muted-foreground'>
+              <Loader2 className='size-4 animate-spin' />
              正在加载预览...
            </div>
          ) : error ? (
-            <p className="text-sm text-destructive">{error}</p>
+            <p className='text-sm text-destructive'>{error}</p>
          ) : preview ? (
-            <div className="space-y-5 pb-4">
-              <div className="flex flex-wrap gap-2">
-                <Badge variant="outline" className="rounded-full text-[10px]">
+            <div className='space-y-5 pb-4'>
+              <div className='flex flex-wrap gap-2'>
+                <Badge variant='outline' className='rounded-full text-[10px]'>
                  规则 {preview.route_count} 条
                </Badge>
-                <Badge variant="outline" className="rounded-full text-[10px]">
+                <Badge variant='outline' className='rounded-full text-[10px]'>
                  网站 {preview.website_count} 个
                </Badge>
-                <Badge variant="outline" className="rounded-full text-[10px] font-mono">
+                <Badge
+                  variant='outline'
+                  className='rounded-full text-[10px] font-mono'
+                >
                  {preview.checksum.slice(0, 16)}...
                </Badge>
              </div>

-              <div className="space-y-2">
-                <p className="text-xs font-semibold">主配置</p>
-                <CodeBlock code={preview.main_config} language="nginx" className="my-0 text-xs" />
+              <div className='space-y-2'>
+                <p className='text-xs font-semibold'>主配置</p>
+                <CodeBlock
+                  code={preview.main_config}
+                  language='nginx'
+                  className='my-0 text-xs'
+                />
              </div>

-              <div className="space-y-2">
-                <p className="text-xs font-semibold">路由配置</p>
-                <CodeBlock code={preview.rendered_config} language="nginx" className="my-0 text-xs" />
+              <div className='space-y-2'>
+                <p className='text-xs font-semibold'>路由配置</p>
+                <CodeBlock
+                  code={preview.rendered_config}
+                  language='nginx'
+                  className='my-0 text-xs'
+                />
              </div>

              {preview.support_files.length > 0 ? (
-                <div className="space-y-2">
-                  <p className="text-xs font-semibold">支持文件 ({preview.support_files.length})</p>
+                <div className='space-y-2'>
+                  <p className='text-xs font-semibold'>
+                    支持文件 ({preview.support_files.length})
+                  </p>
                  {preview.support_files.map((file) => (
                    <details
                      key={file.path}
-                      className="rounded-lg border border-dashed px-3 py-2"
+                      className='rounded-lg border border-dashed px-3 py-2'
                    >
-                      <summary className="cursor-pointer text-xs font-medium">{file.path}</summary>
-                      <CodeBlock code={file.content} language="text" className="my-2 text-xs" />
+                      <summary className='cursor-pointer text-xs font-medium'>
+                        {file.path}
+                      </summary>
+                      <CodeBlock
+                        code={file.content}
+                        language='text'
+                        className='my-2 text-xs'
+                      />
                    </details>
                  ))}
                </div>
              ) : (
-                <p className="text-xs text-muted-foreground">当前发布不需要额外支持文件。</p>
+                <p className='text-xs text-muted-foreground'>
+                  当前发布不需要额外支持文件。
+                </p>
              )}

              {!canPublish ? (
-                <p className="text-xs text-muted-foreground">
+                <p className='text-xs text-muted-foreground'>
                  当前规则与已激活版本一致，无法重复发布。
                </p>
              ) : null}
@@ -97,22 +125,29 @@ export function PreviewSheet({
          ) : null}
        </div>

-        <SheetFooter className="px-5 py-4 border-t">
-          <Button variant="outline" onClick={() => onOpenChange(false)} disabled={publishing}>
+        <SheetFooter className='px-5 py-4 border-t'>
+          <Button
+            variant='outline'
+            onClick={() => onOpenChange(false)}
+            disabled={publishing}
+          >
            关闭
          </Button>
-          <Button onClick={onPublish} disabled={!canPublish || publishing || loading}>
+          <Button
+            onClick={onPublish}
+            disabled={!canPublish || publishing || loading}
+          >
            {publishing ? (
              <>
-                <Loader2 className="size-4 animate-spin mr-1" />
+                <Loader2 className='size-4 animate-spin mr-1' />
                发布中...
              </>
            ) : (
-              "确认发布"
+              '确认发布'
            )}
          </Button>
        </SheetFooter>
      </SheetContent>
    </Sheet>
-  )
+  );
 }
@@ -1,20 +1,31 @@
-"use client"
+'use client';

-import {useEffect, useState} from "react"
-import {Loader2} from "lucide-react"
-import {toast} from "sonner"
+import { useEffect, useState } from 'react';
+import { Loader2 } from 'lucide-react';
+import { toast } from 'sonner';

-import {Badge} from "@/components/ui/badge"
-import {Button} from "@/components/ui/button"
-import {CodeBlock} from "@/components/ui/code-block"
-import {Sheet, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle,} from "@/components/ui/sheet"
-import {type ConfigVersionDetail, ConfigVersionService, type ConfigVersionSummary,} from "@/lib/services/openflare"
-import {formatDateTime} from "@/lib/utils"
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import { CodeBlock } from '@/components/ui/code-block';
+import {
+  Sheet,
+  SheetContent,
+  SheetDescription,
+  SheetFooter,
+  SheetHeader,
+  SheetTitle,
+} from '@/components/ui/sheet';
+import {
+  type ConfigVersionDetail,
+  ConfigVersionService,
+  type ConfigVersionSummary,
+} from '@/lib/services/openflare';
+import { formatDateTime } from '@/lib/utils';

 interface VersionSnapshotSheetProps {
-  version: ConfigVersionSummary | null
-  open: boolean
-  onOpenChange: (open: boolean) => void
+  version: ConfigVersionSummary | null;
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
 }

 export function VersionSnapshotSheet({
@@ -22,97 +33,112 @@ export function VersionSnapshotSheet({
  open,
  onOpenChange,
 }: VersionSnapshotSheetProps) {
-  const [detail, setDetail] = useState<ConfigVersionDetail | null>(null)
-  const [loading, setLoading] = useState(false)
+  const [detail, setDetail] = useState<ConfigVersionDetail | null>(null);
+  const [loading, setLoading] = useState(false);

  useEffect(() => {
    if (!open || !version) {
-      setDetail(null)
-      return
+      setDetail(null);
+      return;
    }

-    let cancelled = false
-    setLoading(true)
+    let cancelled = false;
+    setLoading(true);

    ConfigVersionService.getById(version.id)
      .then((data) => {
-        if (!cancelled) setDetail(data)
+        if (!cancelled) setDetail(data);
      })
      .catch((err) => {
        if (!cancelled) {
-          toast.error("加载版本快照失败", {
-            description: err instanceof Error ? err.message : "未知错误",
-          })
+          toast.error('加载版本快照失败', {
+            description: err instanceof Error ? err.message : '未知错误',
+          });
        }
      })
      .finally(() => {
-        if (!cancelled) setLoading(false)
-      })
+        if (!cancelled) setLoading(false);
+      });

    return () => {
-      cancelled = true
-    }
-  }, [open, version])
+      cancelled = true;
+    };
+  }, [open, version]);

  return (
    <Sheet open={open} onOpenChange={onOpenChange}>
-      <SheetContent className="sm:max-w-2xl w-full p-0 flex h-svh flex-col gap-0">
-        <SheetHeader className="px-5 py-4 border-b">
+      <SheetContent className='sm:max-w-2xl w-full p-0 flex h-svh flex-col gap-0'>
+        <SheetHeader className='px-5 py-4 border-b'>
          <SheetTitle>
-            {version ? `版本 ${version.version}` : "版本快照"}
+            {version ? `版本 ${version.version}` : '版本快照'}
          </SheetTitle>
          <SheetDescription>查看历史配置版本的完整快照内容。</SheetDescription>
        </SheetHeader>

-        <div className="flex-1 min-h-0 overflow-y-auto px-5 py-4">
+        <div className='flex-1 min-h-0 overflow-y-auto px-5 py-4'>
          {loading ? (
-            <div className="flex items-center justify-center gap-2 py-16 text-sm text-muted-foreground">
-              <Loader2 className="size-4 animate-spin" />
+            <div className='flex items-center justify-center gap-2 py-16 text-sm text-muted-foreground'>
+              <Loader2 className='size-4 animate-spin' />
              正在加载快照...
            </div>
          ) : detail ? (
-            <div className="space-y-5 pb-4">
-              <div className="flex flex-wrap gap-2">
+            <div className='space-y-5 pb-4'>
+              <div className='flex flex-wrap gap-2'>
                {detail.is_active ? (
-                  <Badge className="rounded-full text-[10px]">当前激活</Badge>
+                  <Badge className='rounded-full text-[10px]'>当前激活</Badge>
                ) : (
-                  <Badge variant="outline" className="rounded-full text-[10px]">历史版本</Badge>
+                  <Badge variant='outline' className='rounded-full text-[10px]'>
+                    历史版本
+                  </Badge>
                )}
-                <Badge variant="outline" className="rounded-full text-[10px] font-mono">
+                <Badge
+                  variant='outline'
+                  className='rounded-full text-[10px] font-mono'
+                >
                  {detail.checksum}
                </Badge>
              </div>

-              <div className="grid gap-3 sm:grid-cols-2 text-xs">
+              <div className='grid gap-3 sm:grid-cols-2 text-xs'>
                <div>
-                  <p className="text-muted-foreground">创建人</p>
-                  <p className="font-medium">{detail.created_by || "系统"}</p>
+                  <p className='text-muted-foreground'>创建人</p>
+                  <p className='font-medium'>{detail.created_by || '系统'}</p>
                </div>
                <div>
-                  <p className="text-muted-foreground">创建时间</p>
-                  <p className="font-medium">{formatDateTime(detail.created_at)}</p>
+                  <p className='text-muted-foreground'>创建时间</p>
+                  <p className='font-medium'>
+                    {formatDateTime(detail.created_at)}
+                  </p>
                </div>
              </div>

-              <div className="space-y-2">
-                <p className="text-xs font-semibold">主配置</p>
-                <CodeBlock code={detail.main_config} language="nginx" className="my-0 text-xs" />
+              <div className='space-y-2'>
+                <p className='text-xs font-semibold'>主配置</p>
+                <CodeBlock
+                  code={detail.main_config}
+                  language='nginx'
+                  className='my-0 text-xs'
+                />
              </div>

-              <div className="space-y-2">
-                <p className="text-xs font-semibold">路由配置</p>
-                <CodeBlock code={detail.rendered_config} language="nginx" className="my-0 text-xs" />
+              <div className='space-y-2'>
+                <p className='text-xs font-semibold'>路由配置</p>
+                <CodeBlock
+                  code={detail.rendered_config}
+                  language='nginx'
+                  className='my-0 text-xs'
+                />
              </div>
            </div>
          ) : null}
        </div>

-        <SheetFooter className="px-5 py-4 border-t">
-          <Button variant="outline" onClick={() => onOpenChange(false)}>
+        <SheetFooter className='px-5 py-4 border-t'>
+          <Button variant='outline' onClick={() => onOpenChange(false)}>
            关闭
          </Button>
        </SheetFooter>
      </SheetContent>
    </Sheet>
-  )
+  );
 }
@@ -1,12 +1,20 @@
-"use client"
+'use client';

-import {useCallback, useEffect, useMemo, useState} from "react"
-import {Eye, GitCompare, History, Loader2, Play, RefreshCw, Trash2,} from "lucide-react"
-import {toast} from "sonner"
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import {
+  Eye,
+  GitCompare,
+  History,
+  Loader2,
+  Play,
+  RefreshCw,
+  Trash2,
+} from 'lucide-react';
+import { toast } from 'sonner';

-import {EmptyStateWithBorder} from "@/components/layout/empty"
-import {ErrorInline} from "@/components/layout/error"
-import {LoadingStateWithBorder} from "@/components/layout/loading"
+import { EmptyStateWithBorder } from '@/components/layout/empty';
+import { ErrorInline } from '@/components/layout/error';
+import { LoadingStateWithBorder } from '@/components/layout/loading';
 import {
  AlertDialog,
  AlertDialogCancel,
@@ -15,26 +23,33 @@ import {
  AlertDialogFooter,
  AlertDialogHeader,
  AlertDialogTitle,
-} from "@/components/ui/alert-dialog"
-import {Badge} from "@/components/ui/badge"
-import {Button} from "@/components/ui/button"
-import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow,} from "@/components/ui/table"
+} from '@/components/ui/alert-dialog';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from '@/components/ui/table';
 import {
  type ConfigDiffResult,
  type ConfigPreviewResult,
  ConfigVersionService,
  type ConfigVersionSummary,
-} from "@/lib/services/openflare"
-import {formatDateTime} from "@/lib/utils"
+} from '@/lib/services/openflare';
+import { formatDateTime } from '@/lib/utils';

-import {CleanupDialog} from "./components/cleanup-dialog"
-import {DiffDialog} from "./components/diff-dialog"
-import {PreviewSheet} from "./components/preview-sheet"
-import {VersionSnapshotSheet} from "./components/version-snapshot-sheet"
+import { CleanupDialog } from './components/cleanup-dialog';
+import { DiffDialog } from './components/diff-dialog';
+import { PreviewSheet } from './components/preview-sheet';
+import { VersionSnapshotSheet } from './components/version-snapshot-sheet';

 function truncateChecksum(checksum: string) {
-  if (!checksum) return "—"
-  return checksum.length > 16 ? `${checksum.slice(0, 16)}...` : checksum
+  if (!checksum) return '—';
+  return checksum.length > 16 ? `${checksum.slice(0, 16)}...` : checksum;
 }

 function hasConfigDiff(diff: ConfigDiffResult) {
@@ -49,285 +64,323 @@ function hasConfigDiff(diff: ConfigDiffResult) {
    diff.waf_config_changed ||
    diff.changed_option_keys.length > 0 ||
    !diff.active_version
-  )
+  );
 }

 export default function ConfigVersionsPage() {
-  const [versions, setVersions] = useState<ConfigVersionSummary[]>([])
-  const [loading, setLoading] = useState(true)
-  const [error, setError] = useState<string | null>(null)
+  const [versions, setVersions] = useState<ConfigVersionSummary[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);

-  const [previewOpen, setPreviewOpen] = useState(false)
-  const [preview, setPreview] = useState<ConfigPreviewResult | null>(null)
-  const [previewLoading, setPreviewLoading] = useState(false)
-  const [previewError, setPreviewError] = useState<string | null>(null)
+  const [previewOpen, setPreviewOpen] = useState(false);
+  const [preview, setPreview] = useState<ConfigPreviewResult | null>(null);
+  const [previewLoading, setPreviewLoading] = useState(false);
+  const [previewError, setPreviewError] = useState<string | null>(null);

-  const [diffOpen, setDiffOpen] = useState(false)
-  const [diff, setDiff] = useState<ConfigDiffResult | null>(null)
-  const [diffLoading, setDiffLoading] = useState(false)
-  const [diffError, setDiffError] = useState<string | null>(null)
+  const [diffOpen, setDiffOpen] = useState(false);
+  const [diff, setDiff] = useState<ConfigDiffResult | null>(null);
+  const [diffLoading, setDiffLoading] = useState(false);
+  const [diffError, setDiffError] = useState<string | null>(null);

-  const [snapshotVersion, setSnapshotVersion] = useState<ConfigVersionSummary | null>(null)
-  const [snapshotOpen, setSnapshotOpen] = useState(false)
+  const [snapshotVersion, setSnapshotVersion] =
+    useState<ConfigVersionSummary | null>(null);
+  const [snapshotOpen, setSnapshotOpen] = useState(false);

-  const [publishConfirmOpen, setPublishConfirmOpen] = useState(false)
-  const [forcePublishConfirmOpen, setForcePublishConfirmOpen] = useState(false)
-  const [activateTarget, setActivateTarget] = useState<ConfigVersionSummary | null>(null)
-  const [cleanupOpen, setCleanupOpen] = useState(false)
+  const [publishConfirmOpen, setPublishConfirmOpen] = useState(false);
+  const [forcePublishConfirmOpen, setForcePublishConfirmOpen] = useState(false);
+  const [activateTarget, setActivateTarget] =
+    useState<ConfigVersionSummary | null>(null);
+  const [cleanupOpen, setCleanupOpen] = useState(false);

-  const [publishing, setPublishing] = useState(false)
-  const [activating, setActivating] = useState(false)
-  const [cleaning, setCleaning] = useState(false)
+  const [publishing, setPublishing] = useState(false);
+  const [activating, setActivating] = useState(false);
+  const [cleaning, setCleaning] = useState(false);

  const canPublish = useMemo(
-    () => Boolean(preview && preview.route_count > 0 && diff && hasConfigDiff(diff)),
+    () =>
+      Boolean(
+        preview && preview.route_count > 0 && diff && hasConfigDiff(diff),
+      ),
    [preview, diff],
-  )
+  );

  const sortedVersions = useMemo(
    () =>
      [...versions].sort(
        (left, right) =>
-          new Date(right.created_at).getTime() - new Date(left.created_at).getTime(),
+          new Date(right.created_at).getTime() -
+          new Date(left.created_at).getTime(),
      ),
    [versions],
-  )
+  );

  const fetchVersions = useCallback(async () => {
-    setLoading(true)
-    setError(null)
+    setLoading(true);
+    setError(null);
    try {
-      const data = await ConfigVersionService.list()
-      setVersions(data)
+      const data = await ConfigVersionService.list();
+      setVersions(data);
    } catch (err) {
-      setError(err instanceof Error ? err.message : "加载失败")
+      setError(err instanceof Error ? err.message : '加载失败');
    } finally {
-      setLoading(false)
+      setLoading(false);
    }
-  }, [])
+  }, []);

  useEffect(() => {
-    void fetchVersions()
-  }, [fetchVersions])
+    void fetchVersions();
+  }, [fetchVersions]);

  const loadPreviewData = async () => {
-    setPreviewLoading(true)
-    setPreviewError(null)
-    setDiffLoading(true)
-    setDiffError(null)
+    setPreviewLoading(true);
+    setPreviewError(null);
+    setDiffLoading(true);
+    setDiffError(null);

    try {
      const [previewData, diffData] = await Promise.all([
        ConfigVersionService.preview(),
        ConfigVersionService.diff(),
-      ])
-      setPreview(previewData)
-      setDiff(diffData)
+      ]);
+      setPreview(previewData);
+      setDiff(diffData);
    } catch (err) {
-      const message = err instanceof Error ? err.message : "加载预览失败"
-      setPreviewError(message)
-      setDiffError(message)
+      const message = err instanceof Error ? err.message : '加载预览失败';
+      setPreviewError(message);
+      setDiffError(message);
    } finally {
-      setPreviewLoading(false)
-      setDiffLoading(false)
+      setPreviewLoading(false);
+      setDiffLoading(false);
    }
-  }
+  };

  const handleOpenPreview = async () => {
-    setPreviewOpen(true)
+    setPreviewOpen(true);
    if (!preview) {
-      await loadPreviewData()
+      await loadPreviewData();
    }
-  }
+  };

  const handleOpenDiff = async () => {
-    setDiffOpen(true)
+    setDiffOpen(true);
    if (!diff) {
-      setDiffLoading(true)
-      setDiffError(null)
+      setDiffLoading(true);
+      setDiffError(null);
      try {
-        const diffData = await ConfigVersionService.diff()
-        setDiff(diffData)
+        const diffData = await ConfigVersionService.diff();
+        setDiff(diffData);
      } catch (err) {
-        setDiffError(err instanceof Error ? err.message : "加载差异失败")
+        setDiffError(err instanceof Error ? err.message : '加载差异失败');
      } finally {
-        setDiffLoading(false)
+        setDiffLoading(false);
      }
    }
-  }
+  };

  const handlePublish = async (force = false) => {
-    setPublishing(true)
+    setPublishing(true);
    try {
-      const version = await ConfigVersionService.publish(force)
-      toast.success("发布成功", { description: `版本 ${version.version}` })
-      setPreviewOpen(false)
-      setPublishConfirmOpen(false)
-      setForcePublishConfirmOpen(false)
-      setPreview(null)
-      setDiff(null)
-      await fetchVersions()
+      const version = await ConfigVersionService.publish(force);
+      toast.success('发布成功', { description: `版本 ${version.version}` });
+      setPreviewOpen(false);
+      setPublishConfirmOpen(false);
+      setForcePublishConfirmOpen(false);
+      setPreview(null);
+      setDiff(null);
+      await fetchVersions();
    } catch (err) {
-      toast.error("发布失败", {
-        description: err instanceof Error ? err.message : "未知错误",
-      })
+      toast.error('发布失败', {
+        description: err instanceof Error ? err.message : '未知错误',
+      });
    } finally {
-      setPublishing(false)
+      setPublishing(false);
    }
-  }
+  };

  const handleActivate = async () => {
-    if (!activateTarget) return
+    if (!activateTarget) return;

-    setActivating(true)
+    setActivating(true);
    try {
-      const version = await ConfigVersionService.activate(activateTarget.id)
-      toast.success("激活成功", { description: `版本 ${version.version}` })
-      setActivateTarget(null)
-      await fetchVersions()
+      const version = await ConfigVersionService.activate(activateTarget.id);
+      toast.success('激活成功', { description: `版本 ${version.version}` });
+      setActivateTarget(null);
+      await fetchVersions();
    } catch (err) {
-      toast.error("激活失败", {
-        description: err instanceof Error ? err.message : "未知错误",
-      })
+      toast.error('激活失败', {
+        description: err instanceof Error ? err.message : '未知错误',
+      });
    } finally {
-      setActivating(false)
+      setActivating(false);
    }
-  }
+  };

  const handleCleanup = async (keepCount: number) => {
-    setCleaning(true)
+    setCleaning(true);
    try {
-      const result = await ConfigVersionService.cleanup({ keep_count: keepCount })
-      toast.success("清理完成", {
+      const result = await ConfigVersionService.cleanup({
+        keep_count: keepCount,
+      });
+      toast.success('清理完成', {
        description: `已删除 ${result.deleted_count} 个历史快照`,
-      })
-      setCleanupOpen(false)
-      await fetchVersions()
+      });
+      setCleanupOpen(false);
+      await fetchVersions();
    } catch (err) {
-      toast.error("清理失败", {
-        description: err instanceof Error ? err.message : "未知错误",
-      })
+      toast.error('清理失败', {
+        description: err instanceof Error ? err.message : '未知错误',
+      });
    } finally {
-      setCleaning(false)
+      setCleaning(false);
    }
-  }
+  };

  return (
-    <div className="py-6 px-1 space-y-6">
-      <div className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
-        <div className="flex items-center gap-2">
-          <History className="size-5 text-primary" />
+    <div className='py-6 px-1 space-y-6'>
+      <div className='flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between'>
+        <div className='flex items-center gap-2'>
+          <History className='size-5 text-primary' />
          <div>
-            <h1 className="text-2xl font-semibold tracking-tight">配置版本</h1>
-            <p className="text-sm text-muted-foreground">
+            <h1 className='text-2xl font-semibold tracking-tight'>配置版本</h1>
+            <p className='text-sm text-muted-foreground'>
              查看历史快照、预览待发布配置差异，并在需要时重新激活旧版本。
            </p>
          </div>
        </div>

-        <div className="flex flex-wrap gap-2">
-          <Button variant="outline" size="sm" onClick={() => void fetchVersions()} disabled={loading}>
-            <RefreshCw className={`size-3.5 mr-1 ${loading ? "animate-spin" : ""}`} />
+        <div className='flex flex-wrap gap-2'>
+          <Button
+            variant='outline'
+            size='sm'
+            onClick={() => void fetchVersions()}
+            disabled={loading}
+          >
+            <RefreshCw
+              className={`size-3.5 mr-1 ${loading ? 'animate-spin' : ''}`}
+            />
            刷新
          </Button>
-          <Button variant="outline" size="sm" onClick={() => setCleanupOpen(true)}>
-            <Trash2 className="size-3.5 mr-1" />
+          <Button
+            variant='outline'
+            size='sm'
+            onClick={() => setCleanupOpen(true)}
+          >
+            <Trash2 className='size-3.5 mr-1' />
            清理旧版本
          </Button>
-          <Button variant="outline" size="sm" onClick={() => void handleOpenDiff()}>
-            <GitCompare className="size-3.5 mr-1" />
+          <Button
+            variant='outline'
+            size='sm'
+            onClick={() => void handleOpenDiff()}
+          >
+            <GitCompare className='size-3.5 mr-1' />
            查看差异
          </Button>
-          <Button variant="outline" size="sm" onClick={() => setForcePublishConfirmOpen(true)}>
+          <Button
+            variant='outline'
+            size='sm'
+            onClick={() => setForcePublishConfirmOpen(true)}
+          >
            强制发布
          </Button>
-          <Button size="sm" onClick={() => void handleOpenPreview()}>
-            <Eye className="size-3.5 mr-1" />
+          <Button size='sm' onClick={() => void handleOpenPreview()}>
+            <Eye className='size-3.5 mr-1' />
            预览并发布
          </Button>
        </div>
      </div>

-      {error ? <ErrorInline message={error} onRetry={() => void fetchVersions()} /> : null}
+      {error ? (
+        <ErrorInline message={error} onRetry={() => void fetchVersions()} />
+      ) : null}

-      <div className="border border-dashed shadow-none rounded-lg overflow-hidden bg-background">
+      <div className='border border-dashed shadow-none rounded-lg overflow-hidden bg-background'>
        {loading ? (
          <LoadingStateWithBorder />
        ) : sortedVersions.length === 0 ? (
          <EmptyStateWithBorder
-            title="暂无历史版本"
-            description="当前还没有可查看的发布记录，请先触发一次配置发布。"
+            title='暂无历史版本'
+            description='当前还没有可查看的发布记录，请先触发一次配置发布。'
          />
        ) : (
          <Table>
-            <TableHeader className="bg-muted/40">
-              <TableRow className="border-dashed hover:bg-transparent">
-                <TableHead className="text-xs font-semibold">版本号</TableHead>
-                <TableHead className="text-xs font-semibold">状态</TableHead>
-                <TableHead className="text-xs font-semibold">创建人</TableHead>
-                <TableHead className="text-xs font-semibold">Checksum</TableHead>
-                <TableHead className="text-xs font-semibold">创建时间</TableHead>
-                <TableHead className="text-xs font-semibold text-right">操作</TableHead>
+            <TableHeader className='bg-muted/40'>
+              <TableRow className='border-dashed hover:bg-transparent'>
+                <TableHead className='text-xs font-semibold'>版本号</TableHead>
+                <TableHead className='text-xs font-semibold'>状态</TableHead>
+                <TableHead className='text-xs font-semibold'>创建人</TableHead>
+                <TableHead className='text-xs font-semibold'>
+                  Checksum
+                </TableHead>
+                <TableHead className='text-xs font-semibold'>
+                  创建时间
+                </TableHead>
+                <TableHead className='text-xs font-semibold text-right'>
+                  操作
+                </TableHead>
              </TableRow>
            </TableHeader>
            <TableBody>
              {sortedVersions.map((version) => (
                <TableRow
                  key={version.id}
-                  className="border-dashed hover:bg-muted/10 transition-colors"
+                  className='border-dashed hover:bg-muted/10 transition-colors'
                >
-                  <TableCell className="font-mono text-xs font-semibold">
+                  <TableCell className='font-mono text-xs font-semibold'>
                    {version.version}
                  </TableCell>
                  <TableCell>
                    {version.is_active ? (
                      <Badge
-                        variant="outline"
-                        className="text-[10px] bg-emerald-500/10 border-emerald-500/20 text-emerald-600 rounded-full py-0 px-2"
+                        variant='outline'
+                        className='text-[10px] bg-emerald-500/10 border-emerald-500/20 text-emerald-600 rounded-full py-0 px-2'
                      >
-                        <span className="size-1 bg-emerald-500 rounded-full mr-1.5 shrink-0" />
+                        <span className='size-1 bg-emerald-500 rounded-full mr-1.5 shrink-0' />
                        当前激活
                      </Badge>
                    ) : (
-                      <Badge variant="outline" className="text-[10px] rounded-full py-0 px-2">
+                      <Badge
+                        variant='outline'
+                        className='text-[10px] rounded-full py-0 px-2'
+                      >
                        历史版本
                      </Badge>
                    )}
                  </TableCell>
-                  <TableCell className="text-xs text-muted-foreground">
-                    {version.created_by || "系统"}
+                  <TableCell className='text-xs text-muted-foreground'>
+                    {version.created_by || '系统'}
                  </TableCell>
                  <TableCell
-                    className="text-xs font-mono text-muted-foreground"
+                    className='text-xs font-mono text-muted-foreground'
                    title={version.checksum}
                  >
                    {truncateChecksum(version.checksum)}
                  </TableCell>
-                  <TableCell className="text-xs text-muted-foreground">
+                  <TableCell className='text-xs text-muted-foreground'>
                    {formatDateTime(version.created_at)}
                  </TableCell>
-                  <TableCell className="text-right">
-                    <div className="flex items-center justify-end gap-1.5">
+                  <TableCell className='text-right'>
+                    <div className='flex items-center justify-end gap-1.5'>
                      <Button
-                        variant="ghost"
-                        size="sm"
-                        className="h-7 text-xs"
+                        variant='ghost'
+                        size='sm'
+                        className='h-7 text-xs'
                        onClick={() => {
-                          setSnapshotVersion(version)
-                          setSnapshotOpen(true)
+                          setSnapshotVersion(version);
+                          setSnapshotOpen(true);
                        }}
                      >
-                        <Eye className="size-3 mr-1" />
+                        <Eye className='size-3 mr-1' />
                        快照
                      </Button>
                      {!version.is_active ? (
                        <Button
-                          variant="ghost"
-                          size="sm"
-                          className="h-7 text-xs"
+                          variant='ghost'
+                          size='sm'
+                          className='h-7 text-xs'
                          onClick={() => setActivateTarget(version)}
                        >
-                          <Play className="size-3 mr-1" />
+                          <Play className='size-3 mr-1' />
                          激活
                        </Button>
                      ) : null}
@@ -372,7 +425,10 @@ export default function ConfigVersionsPage() {
        loading={cleaning}
      />

-      <AlertDialog open={publishConfirmOpen} onOpenChange={setPublishConfirmOpen}>
+      <AlertDialog
+        open={publishConfirmOpen}
+        onOpenChange={setPublishConfirmOpen}
+      >
        <AlertDialogContent>
          <AlertDialogHeader>
            <AlertDialogTitle>确认发布配置</AlertDialogTitle>
@@ -382,14 +438,24 @@ export default function ConfigVersionsPage() {
          </AlertDialogHeader>
          <AlertDialogFooter>
            <AlertDialogCancel disabled={publishing}>取消</AlertDialogCancel>
-            <Button onClick={() => void handlePublish(false)} disabled={publishing}>
-              {publishing ? <Loader2 className="size-4 animate-spin" /> : "确认发布"}
+            <Button
+              onClick={() => void handlePublish(false)}
+              disabled={publishing}
+            >
+              {publishing ? (
+                <Loader2 className='size-4 animate-spin' />
+              ) : (
+                '确认发布'
+              )}
            </Button>
          </AlertDialogFooter>
        </AlertDialogContent>
      </AlertDialog>

-      <AlertDialog open={forcePublishConfirmOpen} onOpenChange={setForcePublishConfirmOpen}>
+      <AlertDialog
+        open={forcePublishConfirmOpen}
+        onOpenChange={setForcePublishConfirmOpen}
+      >
        <AlertDialogContent>
          <AlertDialogHeader>
            <AlertDialogTitle>确认强制发布</AlertDialogTitle>
@@ -400,11 +466,15 @@ export default function ConfigVersionsPage() {
          <AlertDialogFooter>
            <AlertDialogCancel disabled={publishing}>取消</AlertDialogCancel>
            <Button
-              variant="destructive"
+              variant='destructive'
              onClick={() => void handlePublish(true)}
              disabled={publishing}
            >
-              {publishing ? <Loader2 className="size-4 animate-spin" /> : "强制发布"}
+              {publishing ? (
+                <Loader2 className='size-4 animate-spin' />
+              ) : (
+                '强制发布'
+              )}
            </Button>
          </AlertDialogFooter>
        </AlertDialogContent>
@@ -413,7 +483,7 @@ export default function ConfigVersionsPage() {
      <AlertDialog
        open={activateTarget !== null}
        onOpenChange={(open) => {
-          if (!open) setActivateTarget(null)
+          if (!open) setActivateTarget(null);
        }}
      >
        <AlertDialogContent>
@@ -422,17 +492,21 @@ export default function ConfigVersionsPage() {
            <AlertDialogDescription>
              {activateTarget
                ? `确认将版本 ${activateTarget.version} 设为当前激活版本吗？`
-                : ""}
+                : ''}
            </AlertDialogDescription>
          </AlertDialogHeader>
          <AlertDialogFooter>
            <AlertDialogCancel disabled={activating}>取消</AlertDialogCancel>
            <Button onClick={() => void handleActivate()} disabled={activating}>
-              {activating ? <Loader2 className="size-4 animate-spin" /> : "确认激活"}
+              {activating ? (
+                <Loader2 className='size-4 animate-spin' />
+              ) : (
+                '确认激活'
+              )}
            </Button>
          </AlertDialogFooter>
        </AlertDialogContent>
      </AlertDialog>
    </div>
-  )
+  );
 }