[优化] 代码优化Format

openflare_server/web/features/waf/components/ip-groups-page.tsx

@@ -1,7 +1,15 @@
 'use client';
 
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import { ArrowLeft, Download, Play, Plus, Save, Trash2, Eye } from 'lucide-react';
+import {
+  ArrowLeft,
+  Download,
+  Play,
+  Plus,
+  Save,
+  Trash2,
+  Eye,
+} from 'lucide-react';
 import { useRouter } from 'next/navigation';
 import { useEffect, useMemo, useState } from 'react';
 
@@ -626,7 +634,7 @@ export function WAFIPGroupsPage() {
                         <div className="mb-2 text-xs font-medium text-[var(--foreground-secondary)]">
                           命中 IP 列表
                         </div>
-                        <pre className="overflow-x-auto whitespace-pre-wrap break-all text-sm text-[var(--foreground-primary)]">
+                        <pre className="overflow-x-auto text-sm break-all whitespace-pre-wrap text-[var(--foreground-primary)]">
                           {autoTestResult.matched_ips.join('\n')}
                         </pre>
                       </div>
@@ -694,7 +702,10 @@ export function WAFIPGroupsPage() {
           onClose={() => setIsCapturedIPsModalOpen(false)}
           footer={
             <div className="flex justify-end">
-              <SecondaryButton type="button" onClick={() => setIsCapturedIPsModalOpen(false)}>
+              <SecondaryButton
+                type="button"
+                onClick={() => setIsCapturedIPsModalOpen(false)}
+              >
                 关闭
               </SecondaryButton>
             </div>
@@ -712,19 +723,29 @@ export function WAFIPGroupsPage() {
                   <table className="min-w-full divide-y divide-[var(--border-default)]">
                     <thead className="bg-[var(--surface-muted)]">
                       <tr>
-                        <th className="px-4 py-3 text-left text-xs font-semibold text-[var(--foreground-secondary)]">IP 地址</th>
-                        <th className="px-4 py-3 text-left text-xs font-semibold text-[var(--foreground-secondary)]">抓取时间</th>
-                        <th className="px-4 py-3 text-left text-xs font-semibold text-[var(--foreground-secondary)]">封禁剩余时间</th>
+                        <th className="px-4 py-3 text-left text-xs font-semibold text-[var(--foreground-secondary)]">
+                          IP 地址
+                        </th>
+                        <th className="px-4 py-3 text-left text-xs font-semibold text-[var(--foreground-secondary)]">
+                          抓取时间
+                        </th>
+                        <th className="px-4 py-3 text-left text-xs font-semibold text-[var(--foreground-secondary)]">
+                          封禁剩余时间
+                        </th>
                       </tr>
                     </thead>
                     <tbody className="divide-y divide-[var(--border-default)] bg-[var(--surface-elevated)]">
                       {selectedGroup.ext_ips.map((item) => {
-                        const autoConfig = selectedGroup.auto_config as { ttl?: number } | undefined;
+                        const autoConfig = selectedGroup.auto_config as
+                          | { ttl?: number }
+                          | undefined;
                         const ttl = autoConfig?.ttl ?? -1;
                         let expireText = '永久';
                         if (ttl > 0) {
                           const capturedDate = new Date(item.captured_at);
-                          const expireDate = new Date(capturedDate.getTime() + ttl * 1000);
+                          const expireDate = new Date(
+                            capturedDate.getTime() + ttl * 1000,
+                          );
                           const now = new Date();
                           if (expireDate.getTime() <= now.getTime()) {
                             expireText = '已过期';
@@ -741,9 +762,20 @@ export function WAFIPGroupsPage() {
                         }
                         return (
                           <tr key={item.ip}>
-                            <td className="whitespace-nowrap px-4 py-3 text-sm font-medium text-[var(--foreground-primary)] font-mono">{item.ip}</td>
-                            <td className="whitespace-nowrap px-4 py-3 text-sm text-[var(--foreground-secondary)]">{new Date(item.captured_at).toLocaleString()}</td>
-                            <td className={cn("whitespace-nowrap px-4 py-3 text-sm font-medium", ttl > 0 ? "text-amber-500" : "text-emerald-500")}>{expireText}</td>
+                            <td className="px-4 py-3 font-mono text-sm font-medium whitespace-nowrap text-[var(--foreground-primary)]">
+                              {item.ip}
+                            </td>
+                            <td className="px-4 py-3 text-sm whitespace-nowrap text-[var(--foreground-secondary)]">
+                              {new Date(item.captured_at).toLocaleString()}
+                            </td>
+                            <td
+                              className={cn(
+                                'px-4 py-3 text-sm font-medium whitespace-nowrap',
+                                ttl > 0 ? 'text-amber-500' : 'text-emerald-500',
+                              )}
+                            >
+                              {expireText}
+                            </td>
                           </tr>
                         );
                       })}

openflare_server/web/features/waf/components/pow-tab-panel.tsx

@@ -108,9 +108,11 @@ export function PowTabPanel({
           <select
             value={config.algorithm}
             onChange={(event) =>
-              updateConfig(enabled, { algorithm: event.target.value as 'fast' | 'slow' })
+              updateConfig(enabled, {
+                algorithm: event.target.value as 'fast' | 'slow',
+              })
             }
-            className="w-full rounded-2xl border border-[var(--border-default)] bg-[var(--control-background)] px-4 py-3 text-sm text-[var(--foreground-primary)] outline-none transition focus:border-[var(--border-strong)]"
+            className="w-full rounded-2xl border border-[var(--border-default)] bg-[var(--control-background)] px-4 py-3 text-sm text-[var(--foreground-primary)] transition outline-none focus:border-[var(--border-strong)]"
           >
             <option value="fast">Fast</option>
             <option value="slow">Slow</option>
@@ -143,7 +145,9 @@ export function PowTabPanel({
             min={30}
             value={config.challenge_ttl}
             onChange={(event) =>
-              updateConfig(enabled, { challenge_ttl: Number(event.target.value) })
+              updateConfig(enabled, {
+                challenge_ttl: Number(event.target.value),
+              })
             }
           />
         </ResourceField>

openflare_server/web/features/waf/components/rule-entry-modal.tsx

@@ -188,7 +188,8 @@ export function RuleEntryModal({
                   选择 IP 组
                 </h3>
                 <p className="mt-1 text-xs leading-5 text-[var(--foreground-secondary)]">
-                  发布版本只保存引用 ID，IP 组成员由 Agent 按 checksum 差异同步。
+                  发布版本只保存引用 ID，IP 组成员由 Agent 按 checksum
+                  差异同步。
                 </p>
               </div>
               <span className="rounded-full border border-[var(--border-default)] px-2.5 py-1 text-xs font-medium text-[var(--foreground-secondary)]">

openflare_server/web/features/waf/components/site-apply-drawer.tsx

@@ -2,7 +2,10 @@ import { useEffect, useMemo, useState } from 'react';
 import { Check, Search } from 'lucide-react';
 import { Drawer } from '@/components/ui/drawer';
 import type { ProxyRouteItem } from '@/features/proxy-routes/types';
-import { PrimaryButton, SecondaryButton } from '@/features/shared/components/resource-primitives';
+import {
+  PrimaryButton,
+  SecondaryButton,
+} from '@/features/shared/components/resource-primitives';
 import type { WAFRuleGroup } from '@/features/waf/types';
 import { cn } from '@/lib/utils/cn';