From bd6428d473cee31aff918a1467ad375567f06159 Mon Sep 17 00:00:00 2001
From: icarus <eurfelux@gmail.com>
Date: Mon, 22 Sep 2025 11:22:57 +0800
Subject: [PATCH] refactor(AgentSettings): extract modal content into separate
 component for better readability

---
 .../pages/settings/AgentSettings/index.tsx    | 38 ++++++++++++-------
 1 file changed, 24 insertions(+), 14 deletions(-)

diff --git a/src/renderer/src/pages/settings/AgentSettings/index.tsx b/src/renderer/src/pages/settings/AgentSettings/index.tsx
index e1801d3954..05413115a7 100644
--- a/src/renderer/src/pages/settings/AgentSettings/index.tsx
+++ b/src/renderer/src/pages/settings/AgentSettings/index.tsx
@@ -1,3 +1,4 @@
+import { Spinner } from '@heroui/react'
 import { HStack } from '@renderer/components/Layout'
 import { TopView } from '@renderer/components/TopView'
 import { useAgent } from '@renderer/hooks/agents/useAgent'
@@ -55,6 +56,28 @@ const AgentSettingPopupContainer: React.FC<AgentSettingPopupParams> = ({ tab, ag
     ] satisfies { key: AgentSettingPopupTab; label: string }[]
   ).filter(Boolean) as { key: string; label: string }[]
 
+  const ModalContent = () => {
+    if (!agent) {
+      return <Spinner />
+    }
+    return (
+      <HStack>
+        <LeftMenu>
+          <StyledMenu
+            defaultSelectedKeys={[tab || 'essential'] satisfies AgentSettingPopupTab[]}
+            mode="vertical"
+            items={items}
+            onSelect={({ key }) => setMenu(key as AgentSettingPopupTab)}
+          />
+        </LeftMenu>
+        <Settings>
+          {menu === 'essential' && <AgentEssentialSettings agent={agent} update={updateAgent} />}
+          {menu === 'prompt' && <AgentPromptSettings agent={agent} update={updateAgent} />}
+        </Settings>
+      </HStack>
+    )
+  }
+
   return (
     <StyledModal
       open={open}
@@ -85,20 +108,7 @@ const AgentSettingPopupContainer: React.FC<AgentSettingPopupParams> = ({ tab, ag
       width="min(800px, 70vw)"
       height="80vh"
       centered>
-      <HStack>
-        <LeftMenu>
-          <StyledMenu
-            defaultSelectedKeys={[tab || 'essential'] satisfies AgentSettingPopupTab[]}
-            mode="vertical"
-            items={items}
-            onSelect={({ key }) => setMenu(key as AgentSettingPopupTab)}
-          />
-        </LeftMenu>
-        <Settings>
-          {menu === 'essential' && <AgentEssentialSettings agent={agent} update={updateAgent} />}
-          {menu === 'prompt' && <AgentPromptSettings agent={agent} update={updateAgent} />}
-        </Settings>
-      </HStack>
+      <ModalContent />
     </StyledModal>
   )
 }