Wave 2.2: 流式安装输出、软件内授权四模式、本机环境一键装与总览缓存

EOF

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/desktop/src/components/ConfigForm.tsx

@@ -7,27 +7,13 @@ import type {
   ConfigVerifyResult,
   WriteResult,
 } from "../ipc/types";
+import { AuthPanel } from "./AuthPanel";
 import { MonoChip } from "./MonoChip";
 
-/** 官方授权方式中文名 */
-function authModeLabel(mode: string): string {
-  switch (mode) {
-    case "browser_oauth":
-      return "账号授权（浏览器）";
-    case "device_code":
-      return "设备码";
-    case "api_key":
-      return "API Key";
-    case "local_tui":
-      return "本机终端授权";
-    default:
-      return mode;
-  }
-}
-
 /** 配置表单（视觉规范 §3.4：单列 ≤640px、敏感字段密码框 + 密钥库说明、吸底保存条）
- *  Wave 2.1：字段按官方配置方法渲染 + 保存后「生效检查」 */
-export function ConfigForm({ id }: { id: string }) {
+ *  Wave 2.1：字段按官方配置方法渲染 + 保存后「生效检查」
+ *  Wave 2.2：授权/登录层改为可操作授权流程（AuthPanel） */
+export function ConfigForm({ id, onAuthChanged }: { id: string; onAuthChanged?: () => void }) {
   const [state, setState] = useState<ConfigFormState | null>(null);
   const [values, setValues] = useState<Record<string, string>>({});
   const [revealed, setRevealed] = useState<Record<string, boolean>>({});
@@ -138,24 +124,12 @@ export function ConfigForm({ id }: { id: string }) {
     <div className="config-form">
       {!hasFields && <p className="panel-empty">该 CLI 未声明可配置的中文表单字段。</p>}
 
-      {/* 第一层：授权 / 登录（官方授权方式引导 + API Key 类字段） */}
+      {/* 第一层：授权 / 登录（可操作授权流程 + API Key 类字段） */}
       {(state.auth_modes.length > 0 || authFields.length > 0) && (
         <section className="config-section">
           <h4 className="config-section-title">授权 / 登录</h4>
           {state.auth_modes.length > 0 && (
-            <ul className="auth-modes">
-              {state.auth_modes.map((m) => (
-                <li key={m.mode} className="auth-mode">
-                  <span className="auth-mode-name">{authModeLabel(m.mode)}</span>
-                  {m.notes_zh && <span className="auth-mode-note">{m.notes_zh}</span>}
-                  {m.command.length > 0 && (
-                    <span className="auth-mode-cmd">
-                      <MonoChip>{m.command.join(" ")}</MonoChip>
-                    </span>
-                  )}
-                </li>
-              ))}
-            </ul>
+            <AuthPanel id={id} authModes={state.auth_modes} onAuthChanged={onAuthChanged ?? (() => {})} />
           )}
           {authFields.map(renderField)}
         </section>