feat: add vertex provider, oauth model mappings, and routing/log settings

2026-02-19 11:10:49 +08:00 · 2026-01-05 19:03:05 +08:00
parent 71556a51c5
commit 8dca670358
18 changed files with 1313 additions and 113 deletions
--- a/src/components/providers/VertexSection/VertexModal.tsx
+++ b/src/components/providers/VertexSection/VertexModal.tsx
@@ -0,0 +1,117 @@
+import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Button } from '@/components/ui/Button';
+import { HeaderInputList } from '@/components/ui/HeaderInputList';
+import { Input } from '@/components/ui/Input';
+import { Modal } from '@/components/ui/Modal';
+import { ModelInputList, modelsToEntries } from '@/components/ui/ModelInputList';
+import type { ProviderKeyConfig } from '@/types';
+import { buildHeaderObject, headersToEntries } from '@/utils/headers';
+import type { ProviderModalProps, VertexFormState } from '../types';
+
+interface VertexModalProps extends ProviderModalProps<ProviderKeyConfig, VertexFormState> {
+  isSaving: boolean;
+}
+
+const buildEmptyForm = (): VertexFormState => ({
+  apiKey: '',
+  prefix: '',
+  baseUrl: '',
+  proxyUrl: '',
+  headers: {},
+  models: [],
+  modelEntries: [{ name: '', alias: '' }],
+});
+
+export function VertexModal({
+  isOpen,
+  editIndex,
+  initialData,
+  onClose,
+  onSave,
+  isSaving,
+}: VertexModalProps) {
+  const { t } = useTranslation();
+  const [form, setForm] = useState<VertexFormState>(buildEmptyForm);
+
+  useEffect(() => {
+    if (!isOpen) return;
+    if (initialData) {
+      // eslint-disable-next-line react-hooks/set-state-in-effect
+      setForm({
+        ...initialData,
+        headers: initialData.headers ?? {},
+        modelEntries: modelsToEntries(initialData.models),
+      });
+      return;
+    }
+    setForm(buildEmptyForm());
+  }, [initialData, isOpen]);
+
+  return (
+    <Modal
+      open={isOpen}
+      onClose={onClose}
+      title={
+        editIndex !== null
+          ? t('ai_providers.vertex_edit_modal_title')
+          : t('ai_providers.vertex_add_modal_title')
+      }
+      footer={
+        <>
+          <Button variant="secondary" onClick={onClose} disabled={isSaving}>
+            {t('common.cancel')}
+          </Button>
+          <Button onClick={() => void onSave(form, editIndex)} loading={isSaving}>
+            {t('common.save')}
+          </Button>
+        </>
+      }
+    >
+      <Input
+        label={t('ai_providers.vertex_add_modal_key_label')}
+        placeholder={t('ai_providers.vertex_add_modal_key_placeholder')}
+        value={form.apiKey}
+        onChange={(e) => setForm((prev) => ({ ...prev, apiKey: e.target.value }))}
+      />
+      <Input
+        label={t('ai_providers.prefix_label')}
+        placeholder={t('ai_providers.prefix_placeholder')}
+        value={form.prefix ?? ''}
+        onChange={(e) => setForm((prev) => ({ ...prev, prefix: e.target.value }))}
+        hint={t('ai_providers.prefix_hint')}
+      />
+      <Input
+        label={t('ai_providers.vertex_add_modal_url_label')}
+        placeholder={t('ai_providers.vertex_add_modal_url_placeholder')}
+        value={form.baseUrl ?? ''}
+        onChange={(e) => setForm((prev) => ({ ...prev, baseUrl: e.target.value }))}
+      />
+      <Input
+        label={t('ai_providers.vertex_add_modal_proxy_label')}
+        placeholder={t('ai_providers.vertex_add_modal_proxy_placeholder')}
+        value={form.proxyUrl ?? ''}
+        onChange={(e) => setForm((prev) => ({ ...prev, proxyUrl: e.target.value }))}
+      />
+      <HeaderInputList
+        entries={headersToEntries(form.headers)}
+        onChange={(entries) => setForm((prev) => ({ ...prev, headers: buildHeaderObject(entries) }))}
+        addLabel={t('common.custom_headers_add')}
+        keyPlaceholder={t('common.custom_headers_key_placeholder')}
+        valuePlaceholder={t('common.custom_headers_value_placeholder')}
+      />
+      <div className="form-group">
+        <label>{t('ai_providers.vertex_models_label')}</label>
+        <ModelInputList
+          entries={form.modelEntries}
+          onChange={(entries) => setForm((prev) => ({ ...prev, modelEntries: entries }))}
+          addLabel={t('ai_providers.vertex_models_add_btn')}
+          namePlaceholder={t('common.model_name_placeholder')}
+          aliasPlaceholder={t('common.model_alias_placeholder')}
+          disabled={isSaving}
+        />
+        <div className="hint">{t('ai_providers.vertex_models_hint')}</div>
+      </div>
+    </Modal>
+  );
+}