mirror of
https://github.com/CherryHQ/cherry-studio.git
synced 2025-12-22 17:00:14 +08:00
fix(AgentSettingsPopup): inline ModalContent component for better readability
fix: Error: Cannot create components during render
This commit is contained in:
parent
e0c334b5ed
commit
b5004e2a51
@ -63,39 +63,6 @@ const AgentSettingPopupContainer: React.FC<AgentSettingPopupParams> = ({ tab, ag
|
|||||||
] as const satisfies { key: AgentSettingPopupTab; label: string }[]
|
] as const satisfies { key: AgentSettingPopupTab; label: string }[]
|
||||||
).filter(Boolean)
|
).filter(Boolean)
|
||||||
|
|
||||||
const ModalContent = () => {
|
|
||||||
if (isLoading) {
|
|
||||||
// TODO: use skeleton for better ux
|
|
||||||
return <Spinner />
|
|
||||||
}
|
|
||||||
if (error) {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<Alert color="danger" title={t('agent.get.error.failed')} />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<div className="flex w-full flex-1">
|
|
||||||
<LeftMenu>
|
|
||||||
<StyledMenu
|
|
||||||
defaultSelectedKeys={[tab || 'essential'] satisfies AgentSettingPopupTab[]}
|
|
||||||
mode="vertical"
|
|
||||||
selectedKeys={[menu]}
|
|
||||||
items={items}
|
|
||||||
onSelect={({ key }) => setMenu(key as AgentSettingPopupTab)}
|
|
||||||
/>
|
|
||||||
</LeftMenu>
|
|
||||||
<Settings>
|
|
||||||
{menu === 'essential' && <AgentEssentialSettings agent={agent} update={updateAgent} />}
|
|
||||||
{menu === 'prompt' && <PromptSettings agentBase={agent} update={updateAgent} />}
|
|
||||||
{menu === 'tooling' && <ToolingSettings agentBase={agent} update={updateAgent} />}
|
|
||||||
{menu === 'advanced' && <AdvancedSettings agentBase={agent} update={updateAgent} />}
|
|
||||||
</Settings>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<StyledModal
|
<StyledModal
|
||||||
open={open}
|
open={open}
|
||||||
@ -129,7 +96,31 @@ const AgentSettingPopupContainer: React.FC<AgentSettingPopupParams> = ({ tab, ag
|
|||||||
}}
|
}}
|
||||||
width="min(800px, 70vw)"
|
width="min(800px, 70vw)"
|
||||||
centered>
|
centered>
|
||||||
<ModalContent />
|
{isLoading && <Spinner />}
|
||||||
|
{!isLoading && error && (
|
||||||
|
<div>
|
||||||
|
<Alert color="danger" title={t('agent.get.error.failed')} />
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{!isLoading && !error && (
|
||||||
|
<div className="flex w-full flex-1">
|
||||||
|
<LeftMenu>
|
||||||
|
<StyledMenu
|
||||||
|
defaultSelectedKeys={[tab || 'essential'] satisfies AgentSettingPopupTab[]}
|
||||||
|
mode="vertical"
|
||||||
|
selectedKeys={[menu]}
|
||||||
|
items={items}
|
||||||
|
onSelect={({ key }) => setMenu(key as AgentSettingPopupTab)}
|
||||||
|
/>
|
||||||
|
</LeftMenu>
|
||||||
|
<Settings>
|
||||||
|
{menu === 'essential' && <AgentEssentialSettings agent={agent} update={updateAgent} />}
|
||||||
|
{menu === 'prompt' && <PromptSettings agentBase={agent} update={updateAgent} />}
|
||||||
|
{menu === 'tooling' && <ToolingSettings agentBase={agent} update={updateAgent} />}
|
||||||
|
{menu === 'advanced' && <AdvancedSettings agentBase={agent} update={updateAgent} />}
|
||||||
|
</Settings>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</StyledModal>
|
</StyledModal>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user