Feat: Add model editing functionality with improved UI labels (#8855)

### What problem does this PR solve?

Add edit button for local LLM models
<img width="1531" height="1428" alt="image"
src="https://github.com/user-attachments/assets/19d62255-59a6-4a7e-9772-8b8743101f78"
/>

<img width="1531" height="1428" alt="image"
src="https://github.com/user-attachments/assets/c3a0f77e-cc6b-4190-95a6-13835463428b"
/>



### Type of change

- [ ] Bug Fix (non-breaking change which fixes an issue)
- [x] New Feature (non-breaking change which adds functionality)
- [ ] Documentation Update
- [ ] Refactoring
- [ ] Performance Improvement
- [ ] Other (please describe):

---------

Co-authored-by: Liu An <asiro@qq.com>
This commit is contained in:
Adrian Altermatt
2025-07-21 13:16:53 +02:00
committed by GitHub
parent dbc267758e
commit 6691532079
15 changed files with 197 additions and 30 deletions

View File

@ -13,6 +13,7 @@ import {
Switch,
} from 'antd';
import omit from 'lodash/omit';
import { useEffect } from 'react';
type FieldType = IAddLlmRequestBody & { vision: boolean };
@ -45,7 +46,13 @@ const OllamaModal = ({
onOk,
loading,
llmFactory,
}: IModalProps<IAddLlmRequestBody> & { llmFactory: string }) => {
editMode = false,
initialValues,
}: IModalProps<IAddLlmRequestBody> & {
llmFactory: string;
editMode?: boolean;
initialValues?: Partial<IAddLlmRequestBody>;
}) => {
const [form] = Form.useForm<FieldType>();
const { t } = useTranslate('setting');
@ -73,6 +80,22 @@ const OllamaModal = ({
await handleOk();
}
};
useEffect(() => {
if (visible && editMode && initialValues) {
const formValues = {
llm_name: initialValues.llm_name,
model_type: initialValues.model_type,
api_base: initialValues.api_base,
max_tokens: initialValues.max_tokens || 8192,
api_key: '',
...initialValues,
};
form.setFieldsValue(formValues);
} else if (visible && !editMode) {
form.resetFields();
}
}, [visible, editMode, initialValues, form]);
const url =
llmFactoryToUrlMap[llmFactory as LlmFactory] ||
@ -111,7 +134,7 @@ const OllamaModal = ({
};
return (
<Modal
title={t('addLlmTitle', { name: llmFactory })}
title={editMode ? t('editLlmTitle', { name: llmFactory }) : t('addLlmTitle', { name: llmFactory })}
open={visible}
onOk={handleOk}
onCancel={hideModal}
@ -173,7 +196,10 @@ const OllamaModal = ({
name="api_key"
rules={[{ required: false, message: t('apiKeyMessage') }]}
>
<Input placeholder={t('apiKeyMessage')} onKeyDown={handleKeyDown} />
<Input
placeholder={t('apiKeyMessage')}
onKeyDown={handleKeyDown}
/>
</Form.Item>
<Form.Item<FieldType>
label={t('maxTokens')}