Northern_Lights/cherry-studio
1
0
Fork 0
mirror of https://github.com/CherryHQ/cherry-studio.git synced 2026-01-08 14:29:15 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

fix(AgentModal): improve modal layout and fix description field position

Browse Source 
Adjust modal height and overflow behavior
Move description textarea below prompt field for better logical flow
This commit is contained in:
icarus 2025-09-24 18:27:26 +08:00
parent 1973e4d290
commit 11a76ae90f
1 changed files with 33 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/renderer/src/components/Popups/agent/AgentModal.tsx
View File

@ -385,30 +385,38 @@ export const AgentModal: React.FC<Props> = ({ agent, trigger, isOpen: _isOpen, o
{trigger.content} {trigger.content}
</div> </div>
)} )}
<Modal isOpen={isOpen} onClose={onClose}> <Modal
isOpen={isOpen}
onClose={onClose}
classNames={{
base: 'max-h-[90vh]',
wrapper: 'overflow-hidden'
}}>
<ModalContent> <ModalContent>
{(onClose) => ( {(onClose) => (
<> <>
<ModalHeader>{isEditing(agent) ? t('agent.edit.title') : t('agent.add.title')}</ModalHeader> <ModalHeader>{isEditing(agent) ? t('agent.edit.title') : t('agent.add.title')}</ModalHeader>
<Form onSubmit={onSubmit} className="w-full"> <Form onSubmit={onSubmit} className="min-h-0 w-full shrink overflow-auto">
<ModalBody className="w-full"> <ModalBody className="min-h-0 w-full flex-1 shrink overflow-auto">
<Select <div className="flex gap-2">
isRequired <Select
isDisabled={isEditing(agent)} isRequired
selectionMode="single" isDisabled={isEditing(agent)}
selectedKeys={[form.type]} selectionMode="single"
onChange={onAgentTypeChange} selectedKeys={[form.type]}
items={agentOptions} onChange={onAgentTypeChange}
label={t('agent.type.label')} items={agentOptions}
placeholder={t('agent.add.type.placeholder')} label={t('agent.type.label')}
renderValue={renderOption}> placeholder={t('agent.add.type.placeholder')}
{(option) => ( renderValue={renderOption}>
<SelectItem key={option.key} textValue={option.label}> {(option) => (
<Option option={option} /> <SelectItem key={option.key} textValue={option.label}>
</SelectItem> <Option option={option} />
)} </SelectItem>
</Select> )}
<Input isRequired value={form.name} onValueChange={onNameChange} label={t('common.name')} /> </Select>
<Input isRequired value={form.name} onValueChange={onNameChange} label={t('common.name')} />
</div>
<Select <Select
isRequired isRequired
selectionMode="single" selectionMode="single"
@ -424,11 +432,6 @@ export const AgentModal: React.FC<Props> = ({ agent, trigger, isOpen: _isOpen, o
</SelectItem> </SelectItem>
)} )}
</Select> </Select>
<Textarea
label={t('common.description')}
value={form.description ?? ''}
onValueChange={onDescChange}
/>
<Select <Select
selectionMode="multiple" selectionMode="multiple"
selectedKeys={selectedToolKeys} selectedKeys={selectedToolKeys}
@ -483,6 +486,11 @@ export const AgentModal: React.FC<Props> = ({ agent, trigger, isOpen: _isOpen, o
)} )}
</div> </div>
<Textarea label={t('common.prompt')} value={form.instructions ?? ''} onValueChange={onInstChange} /> <Textarea label={t('common.prompt')} value={form.instructions ?? ''} onValueChange={onInstChange} />
<Textarea
label={t('common.description')}
value={form.description ?? ''}
onValueChange={onDescChange}
/>
</ModalBody> </ModalBody>
<ModalFooter className="w-full"> <ModalFooter className="w-full">
<Button onPress={onClose}>{t('common.close')}</Button> <Button onPress={onClose}>{t('common.close')}</Button>