收口 Makelore 客户端变更

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';
@@ -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">
@@ -669,11 +669,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 +703,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>
   );