Spaces:
Sleeping
Sleeping
File size: 3,985 Bytes
01d5a5d |
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 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 |
import type { IThinkingModelParams } from '@/service/modelConfig';
import { updateThinkingConfig } from '@/service/modelConfig';
import { useModelConfigStore } from '@/store/useModelConfigStore';
import { Input, message, Modal } from 'antd';
import { useEffect, useState } from 'react';
interface IProps {
open: boolean;
onClose: () => void;
}
const ThinkingModelModal = (props: IProps) => {
const { open, onClose: handleCancel } = props;
const fetchModelConfig = useModelConfigStore((store) => store.fetchModelConfig);
const [thinkingModelParams, setThinkingModelParams] = useState<IThinkingModelParams>(
{} as IThinkingModelParams
);
const updateThinkingModelConfig = useModelConfigStore((store) => store.updateThinkingModelConfig);
const thinkingModelConfig = useModelConfigStore((store) => store.thinkingModelConfig);
useEffect(() => {
if (open) {
fetchModelConfig();
}
}, [open]);
useEffect(() => {
setThinkingModelParams(thinkingModelConfig);
}, [thinkingModelConfig]);
const handleUpdate = () => {
const thinkingConfigComplete =
!!thinkingModelParams.thinking_model_name &&
!!thinkingModelParams.thinking_api_key &&
!!thinkingModelParams.thinking_endpoint;
if (!thinkingConfigComplete) {
message.error('Please fill in all thinking model configuration fields');
return;
}
updateThinkingConfig(thinkingModelParams)
.then((res) => {
if (res.data.code == 0) {
updateThinkingModelConfig(thinkingModelParams);
handleCancel();
} else {
throw new Error(res.data.message);
}
})
.catch((error) => {
console.error(error.message || 'Failed to update model config');
});
};
return (
<Modal
centered
onCancel={handleCancel}
onOk={() => {
handleUpdate();
}}
open={open}
>
<div className="flex flex-col gap-2 mb-4">
<div className="text-xl leading-6 font-semibold text-gray-900">Thinking model</div>
<div className="text-sm font-medium text-gray-700">Currently only supports DeepSeek</div>
</div>
<div className="p-4 border rounded-lg hover:shadow-md transition-shadow">
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div>
<label className="block text-sm font-medium text-gray-700 mb-1">Model Name</label>
<Input
autoComplete="off"
className="w-full"
onChange={(e) =>
setThinkingModelParams({
...thinkingModelParams,
thinking_model_name: e.target.value
})
}
value={thinkingModelParams.thinking_model_name}
/>
</div>
<div>
<label className="block text-sm font-medium text-gray-700 mb-1">API Key</label>
{/* form is to disable autoComplete */}
<form autoComplete="off">
<Input.Password
autoComplete="off"
className="w-full"
onChange={(e) =>
setThinkingModelParams({
...thinkingModelParams,
thinking_api_key: e.target.value
})
}
value={thinkingModelParams.thinking_api_key}
/>
</form>
</div>
</div>
<div className="mt-4">
<label className="block text-sm font-medium text-gray-700 mb-1">API Endpoint</label>
<Input
autoComplete="off"
className="w-full"
onChange={(e) =>
setThinkingModelParams({
...thinkingModelParams,
thinking_endpoint: e.target.value
})
}
value={thinkingModelParams.thinking_endpoint}
/>
</div>
</div>
</Modal>
);
};
export default ThinkingModelModal;
|