File size: 2,185 Bytes
7e26e0d 88e5a61 7e26e0d 3fb07ee 7e26e0d 3fb07ee 7e26e0d 3fb07ee 7e26e0d 88e5a61 7e26e0d 3fb07ee 7e26e0d 21cf732 7e26e0d 88e5a61 7e26e0d 3fb07ee 7e26e0d 88e5a61 7e26e0d 88e5a61 7e26e0d 3fb07ee 88e5a61 3fb07ee 88e5a61 3fb07ee 3313a7c 3fb07ee 7e26e0d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 |
import { IModalManagerChildrenProps } from '@/components/modal-manager';
import { useTranslate } from '@/hooks/commonHooks';
import { Form, Input, Modal } from 'antd';
import { useEffect } from 'react';
interface IProps extends Omit<IModalManagerChildrenProps, 'showModal'> {
loading: boolean;
initialValue: string;
llmFactory: string;
onOk: (name: string, baseUrl: string) => void;
showModal?(): void;
}
type FieldType = {
api_key?: string;
base_url?: string;
};
const ApiKeyModal = ({
visible,
hideModal,
llmFactory,
loading,
initialValue,
onOk,
}: IProps) => {
const [form] = Form.useForm();
const { t } = useTranslate('setting');
const handleOk = async () => {
const ret = await form.validateFields();
return onOk(ret.api_key, ret.base_url);
};
const handleCancel = () => {
hideModal();
};
const onFinish = (values: any) => {
console.log('Success:', values);
};
const onFinishFailed = (errorInfo: any) => {
console.log('Failed:', errorInfo);
};
useEffect(() => {
if (visible) {
form.setFieldValue('api_key', initialValue);
}
}, [initialValue, form, visible]);
return (
<Modal
title={t('modify')}
open={visible}
onOk={handleOk}
onCancel={handleCancel}
okButtonProps={{ loading }}
confirmLoading={loading}
>
<Form
name="basic"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
style={{ maxWidth: 600 }}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
autoComplete="off"
form={form}
>
<Form.Item<FieldType>
label={t('apiKey')}
name="api_key"
tooltip={t('apiKeyTip')}
rules={[{ required: true, message: t('apiKeyMessage') }]}
>
<Input />
</Form.Item>
{llmFactory === 'OpenAI' && (
<Form.Item<FieldType>
label={t('baseUrl')}
name="base_url"
tooltip={t('baseUrlTip')}
>
<Input placeholder="https://api.openai.com/v1" />
</Form.Item>
)}
</Form>
</Modal>
);
};
export default ApiKeyModal;
|