合并远程主分支客户端收口

src/pages/Settings/index.tsx

@@ -16,6 +16,7 @@ import {
 } from 'lucide-react';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
+import { DisclosureContent } from '@/components/ui/disclosure';
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { Separator } from '@/components/ui/separator';
@@ -259,7 +260,7 @@ export function Settings() {
   };
 
   return (
-    <main className="min-h-full bg-background">
+    <main data-testid="settings-page" className="min-h-full bg-background">
       <div className="mx-auto flex max-w-4xl flex-col gap-8 px-8 py-8">
         <div>
           <h1 className="text-2xl font-semibold tracking-normal">{t('title')}</h1>
@@ -282,7 +283,7 @@ export function Settings() {
               >
                 <ChevronDown
                   className={cn(
-                    'h-4 w-4 transition-transform',
+                    'h-4 w-4 transition-transform duration-200 ease-out',
                     showAdditionalSettings && 'rotate-180'
                   )}
                 />
@@ -316,8 +317,7 @@ export function Settings() {
           </div>
         </section>
 
-        {showAdditionalSettings && (
-          <>
+        <DisclosureContent open={showAdditionalSettings} innerClassName="space-y-8">
             <Separator />
 
             <section className="space-y-5" data-testid="settings-opencode-workspace">
@@ -534,7 +534,7 @@ export function Settings() {
 
             <Separator />
 
-            <section className="space-y-5">
+            <section className="space-y-5" data-testid="settings-proxy-section">
               <div>
                 <h2 className="text-lg font-medium">Network</h2>
                 <p className="text-sm text-muted-foreground">
@@ -550,7 +550,11 @@ export function Settings() {
                       Route local runtime traffic through a proxy.
                     </p>
                   </div>
-                  <Switch checked={proxyEnabledDraft} onCheckedChange={setProxyEnabledDraft} />
+                  <Switch
+                    data-testid="settings-proxy-toggle"
+                    checked={proxyEnabledDraft}
+                    onCheckedChange={setProxyEnabledDraft}
+                  />
                 </div>
 
                 <div className="grid gap-4 sm:grid-cols-2">
@@ -604,6 +608,7 @@ export function Settings() {
 
                 <div className="flex justify-end">
                   <Button
+                    data-testid="settings-proxy-save-button"
                     onClick={handleSaveProxySettings}
                     disabled={!proxySettingsDirty || savingProxy}
                   >
@@ -639,7 +644,11 @@ export function Settings() {
                   <Label className="text-sm font-medium">{t('advanced.devMode')}</Label>
                   <p className="text-sm text-muted-foreground">{t('advanced.devModeDesc')}</p>
                 </div>
-                <Switch checked={devModeUnlocked} onCheckedChange={setDevModeUnlocked} />
+                <Switch
+                  data-testid="settings-dev-mode-switch"
+                  checked={devModeUnlocked}
+                  onCheckedChange={setDevModeUnlocked}
+                />
               </div>
 
               <div className="flex items-center justify-between rounded-lg border bg-card p-4">
@@ -669,11 +678,9 @@ export function Settings() {
                     </Button>
                   </div>
                 </div>
-                {showLogs && (
-                  <pre className="mt-4 max-h-80 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-3 text-xs">
+                <DisclosureContent open={showLogs} className="mt-4" innerClassName="max-h-80 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-3 text-xs">
                     {logContent || '(No logs available yet)'}
-                  </pre>
-                )}
+                </DisclosureContent>
               </div>
 
               {devModeUnlocked && (
@@ -705,18 +712,15 @@ export function Settings() {
                       </Button>
                     </div>
                   </div>
-                  {showTelemetryViewer && (
-                    <pre className="mt-4 max-h-80 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-3 text-xs">
+                  <DisclosureContent open={showTelemetryViewer} className="mt-4" innerClassName="max-h-80 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-3 text-xs">
                       {telemetryEntries.length > 0
                         ? JSON.stringify(telemetryEntries, null, 2)
                         : '(No telemetry entries)'}
-                    </pre>
-                  )}
+                  </DisclosureContent>
                 </div>
               )}
             </section>
-          </>
-        )}
+        </DisclosureContent>
       </div>
     </main>
   );