mirror of
https://wget.la/https://github.com/leookun/cursor-byok
synced 2026-10-05 20:44:07 +08:00
31 lines
2.6 KiB
TypeScript
31 lines
2.6 KiB
TypeScript
import type { ProviderInput, ProviderType } from "../api";
|
|
import { FormField, TextInput } from "./ui/FormControls";
|
|
import { JsonEditor } from "./ui/JsonEditor";
|
|
import { Select } from "./ui/Select";
|
|
import { claudeIcon, openAiIcon } from "./ui/icons";
|
|
import styles from "./ProviderEditor.module.scss";
|
|
|
|
export function ProviderEditor({ value, headersText, extraText, editing, onChange, onHeadersChange, onExtraChange }: {
|
|
value: ProviderInput;
|
|
headersText: string;
|
|
extraText: string;
|
|
editing: boolean;
|
|
onChange: (value: ProviderInput) => void;
|
|
onHeadersChange: (value: string) => void;
|
|
onExtraChange: (value: string) => void;
|
|
}) {
|
|
const patch = (next: Partial<ProviderInput>) => onChange({ ...value, ...next });
|
|
return <div className={styles.form}>
|
|
<FormField className={styles.fullWidth} label={t("名称")}><TextInput placeholder={t("例如：OpenAI")} value={value.name} onChange={(event) => patch({ name: event.target.value })} /></FormField>
|
|
<FormField label={t("协议")} hint={t("选择上游服务使用的请求协议。")}><Select ariaLabel={t("协议")} value={value.provider_type} options={[
|
|
{ value: "openai-responses", label: "OpenAI Responses", icon: openAiIcon },
|
|
{ value: "openai-chat", label: "OpenAI Chat", icon: openAiIcon },
|
|
{ value: "anthropic", label: "Anthropic", icon: claudeIcon },
|
|
]} onChange={(provider_type) => patch({ provider_type: provider_type as ProviderType })} /></FormField>
|
|
<FormField label="Base URL" hint={t("模型服务的 API 根地址；修改后会同步更新该上游模型的路由身份。")}><TextInput placeholder="https://api.example.com/v1" value={value.base_url} onChange={(event) => patch({ base_url: event.target.value })} /></FormField>
|
|
<FormField className={styles.fullWidth} label="API Key" hint={editing ? t("留空表示保留当前 API Key。") : t("访问模型服务所需的密钥。")}><TextInput type="password" autoComplete="off" placeholder={editing ? t("留空以保留当前密钥") : "sk-xxxxxx"} value={value.api_key ?? ""} onChange={(event) => patch({ api_key: event.target.value })} /></FormField>
|
|
<FormField className={styles.fullWidth} label={t("自定义 Headers JSON")} hint={t("值必须是字符串；编辑时 null 表示保留对应敏感 Header 的原值。")}><JsonEditor ariaLabel={t("自定义 Headers JSON")} value={headersText} onChange={onHeadersChange} /></FormField>
|
|
<FormField className={styles.fullWidth} label={t("额外参数 JSON")} hint={t("合并到该上游所有模型的请求体。")}><JsonEditor ariaLabel={t("额外参数 JSON")} value={extraText} onChange={onExtraChange} /></FormField>
|
|
</div>;
|
|
}
|