mirror of
https://github.com/CJackHwang/ds2api.git
synced 2026-05-15 05:35:07 +08:00
feat: Implement DeepSeek integration, refactor model adapters for streaming and tool calls, enhance admin and account management, and introduce new UI features for settings, API testing, and Vercel sync.
This commit is contained in:
CJACK
64
webui/src/features/settings/BackupSection.jsx
Normal file
64
webui/src/features/settings/BackupSection.jsx
Normal file
@@ -0,0 +1,64 @@
|
||||
import { Download, Upload } from 'lucide-react'
|
||||
|
||||
export default function BackupSection({
|
||||
t,
|
||||
importMode,
|
||||
setImportMode,
|
||||
importing,
|
||||
onLoadExportData,
|
||||
onImport,
|
||||
importText,
|
||||
setImportText,
|
||||
exportData,
|
||||
}) {
|
||||
return (
|
||||
<div className="bg-card border border-border rounded-xl p-5 space-y-4">
|
||||
<h3 className="font-semibold">{t('settings.backupTitle')}</h3>
|
||||
<div className="flex flex-wrap items-center gap-3">
|
||||
<button
|
||||
type="button"
|
||||
onClick={onLoadExportData}
|
||||
className="px-3 py-2 rounded-lg bg-secondary border border-border hover:bg-secondary/80 text-sm flex items-center gap-2"
|
||||
>
|
||||
<Download className="w-4 h-4" />
|
||||
{t('settings.loadExport')}
|
||||
</button>
|
||||
<select
|
||||
value={importMode}
|
||||
onChange={(e) => setImportMode(e.target.value)}
|
||||
className="bg-background border border-border rounded-lg px-3 py-2 text-sm"
|
||||
>
|
||||
<option value="merge">{t('settings.importModeMerge')}</option>
|
||||
<option value="replace">{t('settings.importModeReplace')}</option>
|
||||
</select>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onImport}
|
||||
disabled={importing}
|
||||
className="px-3 py-2 rounded-lg bg-secondary border border-border hover:bg-secondary/80 text-sm flex items-center gap-2"
|
||||
>
|
||||
<Upload className="w-4 h-4" />
|
||||
{importing ? t('settings.importing') : t('settings.importNow')}
|
||||
</button>
|
||||
</div>
|
||||
<textarea
|
||||
value={importText}
|
||||
onChange={(e) => setImportText(e.target.value)}
|
||||
rows={8}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2 font-mono text-xs"
|
||||
placeholder={t('settings.importPlaceholder')}
|
||||
/>
|
||||
{exportData && (
|
||||
<div className="space-y-2">
|
||||
<label className="text-sm text-muted-foreground">{t('settings.exportJson')}</label>
|
||||
<textarea
|
||||
value={exportData.json || ''}
|
||||
readOnly
|
||||
rows={6}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2 font-mono text-xs"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
63
webui/src/features/settings/BehaviorSection.jsx
Normal file
63
webui/src/features/settings/BehaviorSection.jsx
Normal file
@@ -0,0 +1,63 @@
|
||||
export default function BehaviorSection({ t, form, setForm }) {
|
||||
return (
|
||||
<div className="bg-card border border-border rounded-xl p-5 space-y-4">
|
||||
<h3 className="font-semibold">{t('settings.behaviorTitle')}</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.toolcallMode')}</span>
|
||||
<select
|
||||
value={form.toolcall.mode}
|
||||
onChange={(e) => setForm((prev) => ({
|
||||
...prev,
|
||||
toolcall: { ...prev.toolcall, mode: e.target.value },
|
||||
}))}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
>
|
||||
<option value="feature_match">feature_match</option>
|
||||
<option value="off">off</option>
|
||||
</select>
|
||||
</label>
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.earlyEmitConfidence')}</span>
|
||||
<select
|
||||
value={form.toolcall.early_emit_confidence}
|
||||
onChange={(e) => setForm((prev) => ({
|
||||
...prev,
|
||||
toolcall: { ...prev.toolcall, early_emit_confidence: e.target.value },
|
||||
}))}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
>
|
||||
<option value="high">high</option>
|
||||
<option value="low">low</option>
|
||||
<option value="off">off</option>
|
||||
</select>
|
||||
</label>
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.responsesTTL')}</span>
|
||||
<input
|
||||
type="number"
|
||||
min={30}
|
||||
value={form.responses.store_ttl_seconds}
|
||||
onChange={(e) => setForm((prev) => ({
|
||||
...prev,
|
||||
responses: { ...prev.responses, store_ttl_seconds: Number(e.target.value || 30) },
|
||||
}))}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
/>
|
||||
</label>
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.embeddingsProvider')}</span>
|
||||
<input
|
||||
type="text"
|
||||
value={form.embeddings.provider}
|
||||
onChange={(e) => setForm((prev) => ({
|
||||
...prev,
|
||||
embeddings: { ...prev.embeddings, provider: e.target.value },
|
||||
}))}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
27
webui/src/features/settings/ModelSection.jsx
Normal file
27
webui/src/features/settings/ModelSection.jsx
Normal file
@@ -0,0 +1,27 @@
|
||||
export default function ModelSection({ t, form, setForm }) {
|
||||
return (
|
||||
<div className="bg-card border border-border rounded-xl p-5 space-y-4">
|
||||
<h3 className="font-semibold">{t('settings.modelTitle')}</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.claudeMapping')}</span>
|
||||
<textarea
|
||||
value={form.claude_mapping_text}
|
||||
onChange={(e) => setForm((prev) => ({ ...prev, claude_mapping_text: e.target.value }))}
|
||||
rows={8}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2 font-mono text-xs"
|
||||
/>
|
||||
</label>
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.modelAliases')}</span>
|
||||
<textarea
|
||||
value={form.model_aliases_text}
|
||||
onChange={(e) => setForm((prev) => ({ ...prev, model_aliases_text: e.target.value }))}
|
||||
rows={8}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2 font-mono text-xs"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
48
webui/src/features/settings/RuntimeSection.jsx
Normal file
48
webui/src/features/settings/RuntimeSection.jsx
Normal file
@@ -0,0 +1,48 @@
|
||||
export default function RuntimeSection({ t, form, setForm }) {
|
||||
return (
|
||||
<div className="bg-card border border-border rounded-xl p-5 space-y-4">
|
||||
<h3 className="font-semibold">{t('settings.runtimeTitle')}</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.accountMaxInflight')}</span>
|
||||
<input
|
||||
type="number"
|
||||
min={1}
|
||||
value={form.runtime.account_max_inflight}
|
||||
onChange={(e) => setForm((prev) => ({
|
||||
...prev,
|
||||
runtime: { ...prev.runtime, account_max_inflight: Number(e.target.value || 1) },
|
||||
}))}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
/>
|
||||
</label>
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.accountMaxQueue')}</span>
|
||||
<input
|
||||
type="number"
|
||||
min={1}
|
||||
value={form.runtime.account_max_queue}
|
||||
onChange={(e) => setForm((prev) => ({
|
||||
...prev,
|
||||
runtime: { ...prev.runtime, account_max_queue: Number(e.target.value || 1) },
|
||||
}))}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
/>
|
||||
</label>
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.globalMaxInflight')}</span>
|
||||
<input
|
||||
type="number"
|
||||
min={1}
|
||||
value={form.runtime.global_max_inflight}
|
||||
onChange={(e) => setForm((prev) => ({
|
||||
...prev,
|
||||
runtime: { ...prev.runtime, global_max_inflight: Number(e.target.value || 1) },
|
||||
}))}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
54
webui/src/features/settings/SecuritySection.jsx
Normal file
54
webui/src/features/settings/SecuritySection.jsx
Normal file
@@ -0,0 +1,54 @@
|
||||
import { Lock } from 'lucide-react'
|
||||
|
||||
export default function SecuritySection({
|
||||
t,
|
||||
form,
|
||||
setForm,
|
||||
newPassword,
|
||||
setNewPassword,
|
||||
changingPassword,
|
||||
onUpdatePassword,
|
||||
}) {
|
||||
return (
|
||||
<div className="bg-card border border-border rounded-xl p-5 space-y-4">
|
||||
<h3 className="font-semibold">{t('settings.securityTitle')}</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.jwtExpireHours')}</span>
|
||||
<input
|
||||
type="number"
|
||||
min={1}
|
||||
max={720}
|
||||
value={form.admin.jwt_expire_hours}
|
||||
onChange={(e) => setForm((prev) => ({
|
||||
...prev,
|
||||
admin: { ...prev.admin, jwt_expire_hours: Number(e.target.value || 1) },
|
||||
}))}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
/>
|
||||
</label>
|
||||
<label className="text-sm space-y-2">
|
||||
<span className="text-muted-foreground">{t('settings.newPassword')}</span>
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="password"
|
||||
value={newPassword}
|
||||
onChange={(e) => setNewPassword(e.target.value)}
|
||||
placeholder={t('settings.newPasswordPlaceholder')}
|
||||
className="w-full bg-background border border-border rounded-lg px-3 py-2"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onUpdatePassword}
|
||||
disabled={changingPassword}
|
||||
className="px-3 py-2 rounded-lg bg-secondary border border-border hover:bg-secondary/80 text-sm flex items-center gap-1"
|
||||
>
|
||||
<Lock className="w-4 h-4" />
|
||||
{changingPassword ? t('settings.updating') : t('settings.updatePassword')}
|
||||
</button>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
121
webui/src/features/settings/SettingsContainer.jsx
Normal file
121
webui/src/features/settings/SettingsContainer.jsx
Normal file
@@ -0,0 +1,121 @@
|
||||
import { AlertTriangle, Save } from 'lucide-react'
|
||||
|
||||
import { useI18n } from '../../i18n'
|
||||
import { useSettingsForm } from './useSettingsForm'
|
||||
import SecuritySection from './SecuritySection'
|
||||
import RuntimeSection from './RuntimeSection'
|
||||
import BehaviorSection from './BehaviorSection'
|
||||
import ModelSection from './ModelSection'
|
||||
import BackupSection from './BackupSection'
|
||||
|
||||
export default function SettingsContainer({ onRefresh, onMessage, authFetch, onForceLogout, isVercel = false }) {
|
||||
const { t } = useI18n()
|
||||
const apiFetch = authFetch || fetch
|
||||
|
||||
const {
|
||||
form,
|
||||
setForm,
|
||||
loading,
|
||||
saving,
|
||||
changingPassword,
|
||||
importing,
|
||||
exportData,
|
||||
importMode,
|
||||
setImportMode,
|
||||
importText,
|
||||
setImportText,
|
||||
newPassword,
|
||||
setNewPassword,
|
||||
consecutiveFailures,
|
||||
autoFetchPaused,
|
||||
lastError,
|
||||
settingsMeta,
|
||||
syncHintVisible,
|
||||
retryLoadSettings,
|
||||
saveSettings,
|
||||
updatePassword,
|
||||
loadExportData,
|
||||
doImport,
|
||||
} = useSettingsForm({
|
||||
apiFetch,
|
||||
t,
|
||||
onMessage,
|
||||
onRefresh,
|
||||
onForceLogout,
|
||||
isVercel,
|
||||
})
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{autoFetchPaused && (
|
||||
<div className="p-4 rounded-lg border border-destructive/30 bg-destructive/10 text-destructive flex items-center justify-between gap-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<AlertTriangle className="w-4 h-4" />
|
||||
<span className="text-sm">
|
||||
{t('settings.autoFetchPaused', { count: consecutiveFailures, error: lastError || t('settings.loadFailed') })}
|
||||
</span>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
onClick={retryLoadSettings}
|
||||
className="px-3 py-1.5 text-xs rounded-md border border-destructive/40 hover:bg-destructive/10"
|
||||
>
|
||||
{t('settings.retryLoad')}
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
{settingsMeta.default_password_warning && (
|
||||
<div className="p-4 rounded-lg border border-amber-300/30 bg-amber-500/10 text-amber-700 flex items-center gap-2">
|
||||
<AlertTriangle className="w-4 h-4" />
|
||||
<span className="text-sm">{t('settings.defaultPasswordWarning')}</span>
|
||||
</div>
|
||||
)}
|
||||
{syncHintVisible && (
|
||||
<div className="p-4 rounded-lg border border-amber-300/30 bg-amber-500/10 text-amber-700 flex items-center gap-2">
|
||||
<AlertTriangle className="w-4 h-4" />
|
||||
<span className="text-sm">{t('settings.vercelSyncHint')}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<SecuritySection
|
||||
t={t}
|
||||
form={form}
|
||||
setForm={setForm}
|
||||
newPassword={newPassword}
|
||||
setNewPassword={setNewPassword}
|
||||
changingPassword={changingPassword}
|
||||
onUpdatePassword={updatePassword}
|
||||
/>
|
||||
|
||||
<RuntimeSection t={t} form={form} setForm={setForm} />
|
||||
|
||||
<BehaviorSection t={t} form={form} setForm={setForm} />
|
||||
|
||||
<ModelSection t={t} form={form} setForm={setForm} />
|
||||
|
||||
<BackupSection
|
||||
t={t}
|
||||
importMode={importMode}
|
||||
setImportMode={setImportMode}
|
||||
importing={importing}
|
||||
onLoadExportData={loadExportData}
|
||||
onImport={doImport}
|
||||
importText={importText}
|
||||
setImportText={setImportText}
|
||||
exportData={exportData}
|
||||
/>
|
||||
|
||||
<div className="flex justify-end">
|
||||
<button
|
||||
type="button"
|
||||
onClick={saveSettings}
|
||||
disabled={loading || saving}
|
||||
className="px-4 py-2 rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 flex items-center gap-2"
|
||||
>
|
||||
<Save className="w-4 h-4" />
|
||||
{saving ? t('settings.saving') : t('settings.save')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
49
webui/src/features/settings/settingsApi.js
Normal file
49
webui/src/features/settings/settingsApi.js
Normal file
@@ -0,0 +1,49 @@
|
||||
export async function parseJSONResponse(res, t) {
|
||||
const contentType = String(res.headers.get('content-type') || '').toLowerCase()
|
||||
if (!contentType.includes('application/json')) {
|
||||
throw new Error(t('settings.nonJsonResponse', { status: res.status }))
|
||||
}
|
||||
return res.json()
|
||||
}
|
||||
|
||||
export async function fetchSettings(apiFetch, t) {
|
||||
const res = await apiFetch('/admin/settings')
|
||||
const data = await parseJSONResponse(res, t)
|
||||
return { res, data }
|
||||
}
|
||||
|
||||
export async function putSettings(apiFetch, payload) {
|
||||
const res = await apiFetch('/admin/settings', {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(payload),
|
||||
})
|
||||
const data = await res.json()
|
||||
return { res, data }
|
||||
}
|
||||
|
||||
export async function postPassword(apiFetch, newPassword) {
|
||||
const res = await apiFetch('/admin/settings/password', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ new_password: newPassword }),
|
||||
})
|
||||
const data = await res.json()
|
||||
return { res, data }
|
||||
}
|
||||
|
||||
export async function getExportData(apiFetch) {
|
||||
const res = await apiFetch('/admin/config/export')
|
||||
const data = await res.json()
|
||||
return { res, data }
|
||||
}
|
||||
|
||||
export async function postImportData(apiFetch, mode, config) {
|
||||
const res = await apiFetch(`/admin/config/import?mode=${encodeURIComponent(mode)}`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ config, mode }),
|
||||
})
|
||||
const data = await res.json()
|
||||
return { res, data }
|
||||
}
|
||||
290
webui/src/features/settings/useSettingsForm.js
Normal file
290
webui/src/features/settings/useSettingsForm.js
Normal file
@@ -0,0 +1,290 @@
|
||||
import { useCallback, useEffect, useMemo, useState } from 'react'
|
||||
|
||||
import {
|
||||
fetchSettings,
|
||||
getExportData,
|
||||
postImportData,
|
||||
postPassword,
|
||||
putSettings,
|
||||
} from './settingsApi'
|
||||
|
||||
const MAX_AUTO_FETCH_FAILURES = 3
|
||||
|
||||
const DEFAULT_FORM = {
|
||||
admin: { jwt_expire_hours: 24 },
|
||||
runtime: { account_max_inflight: 2, account_max_queue: 10, global_max_inflight: 10 },
|
||||
toolcall: { mode: 'feature_match', early_emit_confidence: 'high' },
|
||||
responses: { store_ttl_seconds: 900 },
|
||||
embeddings: { provider: '' },
|
||||
claude_mapping_text: '{\n "fast": "deepseek-chat",\n "slow": "deepseek-reasoner"\n}',
|
||||
model_aliases_text: '{}',
|
||||
}
|
||||
|
||||
function parseJSONMap(raw, fieldName, t) {
|
||||
const text = String(raw || '').trim()
|
||||
if (!text) {
|
||||
return {}
|
||||
}
|
||||
let parsed
|
||||
try {
|
||||
parsed = JSON.parse(text)
|
||||
} catch (_e) {
|
||||
throw new Error(t('settings.invalidJsonField', { field: fieldName }))
|
||||
}
|
||||
if (!parsed || typeof parsed !== 'object' || Array.isArray(parsed)) {
|
||||
throw new Error(t('settings.invalidJsonField', { field: fieldName }))
|
||||
}
|
||||
return parsed
|
||||
}
|
||||
|
||||
function fromServerForm(data) {
|
||||
return {
|
||||
admin: { jwt_expire_hours: Number(data.admin?.jwt_expire_hours || 24) },
|
||||
runtime: {
|
||||
account_max_inflight: Number(data.runtime?.account_max_inflight || 2),
|
||||
account_max_queue: Number(data.runtime?.account_max_queue || 10),
|
||||
global_max_inflight: Number(data.runtime?.global_max_inflight || 10),
|
||||
},
|
||||
toolcall: {
|
||||
mode: data.toolcall?.mode || 'feature_match',
|
||||
early_emit_confidence: data.toolcall?.early_emit_confidence || 'high',
|
||||
},
|
||||
responses: {
|
||||
store_ttl_seconds: Number(data.responses?.store_ttl_seconds || 900),
|
||||
},
|
||||
embeddings: {
|
||||
provider: data.embeddings?.provider || '',
|
||||
},
|
||||
claude_mapping_text: JSON.stringify(data.claude_mapping || {}, null, 2),
|
||||
model_aliases_text: JSON.stringify(data.model_aliases || {}, null, 2),
|
||||
}
|
||||
}
|
||||
|
||||
function toServerPayload(form) {
|
||||
return {
|
||||
admin: { jwt_expire_hours: Number(form.admin.jwt_expire_hours) },
|
||||
runtime: {
|
||||
account_max_inflight: Number(form.runtime.account_max_inflight),
|
||||
account_max_queue: Number(form.runtime.account_max_queue),
|
||||
global_max_inflight: Number(form.runtime.global_max_inflight),
|
||||
},
|
||||
toolcall: {
|
||||
mode: String(form.toolcall.mode || '').trim(),
|
||||
early_emit_confidence: String(form.toolcall.early_emit_confidence || '').trim(),
|
||||
},
|
||||
responses: { store_ttl_seconds: Number(form.responses.store_ttl_seconds) },
|
||||
embeddings: { provider: String(form.embeddings.provider || '').trim() },
|
||||
}
|
||||
}
|
||||
|
||||
export function useSettingsForm({ apiFetch, t, onMessage, onRefresh, onForceLogout, isVercel = false }) {
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [saving, setSaving] = useState(false)
|
||||
const [changingPassword, setChangingPassword] = useState(false)
|
||||
const [importing, setImporting] = useState(false)
|
||||
const [exportData, setExportData] = useState(null)
|
||||
const [importMode, setImportMode] = useState('merge')
|
||||
const [importText, setImportText] = useState('')
|
||||
const [newPassword, setNewPassword] = useState('')
|
||||
const [consecutiveFailures, setConsecutiveFailures] = useState(0)
|
||||
const [autoFetchPaused, setAutoFetchPaused] = useState(false)
|
||||
const [lastError, setLastError] = useState('')
|
||||
const [settingsMeta, setSettingsMeta] = useState({
|
||||
default_password_warning: false,
|
||||
env_backed: false,
|
||||
needs_vercel_sync: false,
|
||||
})
|
||||
const [form, setForm] = useState(DEFAULT_FORM)
|
||||
|
||||
const trackLoadFailure = useCallback(() => {
|
||||
setConsecutiveFailures((prev) => {
|
||||
const next = prev + 1
|
||||
if (isVercel && next >= MAX_AUTO_FETCH_FAILURES) {
|
||||
setAutoFetchPaused(true)
|
||||
}
|
||||
return next
|
||||
})
|
||||
}, [isVercel])
|
||||
|
||||
const loadSettings = useCallback(async ({ manual = false } = {}) => {
|
||||
if (isVercel && autoFetchPaused && !manual) {
|
||||
return
|
||||
}
|
||||
setLoading(true)
|
||||
try {
|
||||
const { res, data } = await fetchSettings(apiFetch, t)
|
||||
if (!res.ok) {
|
||||
const detail = data.detail || t('settings.loadFailed')
|
||||
setLastError(detail)
|
||||
onMessage('error', detail)
|
||||
trackLoadFailure()
|
||||
return
|
||||
}
|
||||
setConsecutiveFailures(0)
|
||||
setAutoFetchPaused(false)
|
||||
setLastError('')
|
||||
setSettingsMeta({
|
||||
default_password_warning: Boolean(data.admin?.default_password_warning),
|
||||
env_backed: Boolean(data.env_backed),
|
||||
needs_vercel_sync: Boolean(data.needs_vercel_sync),
|
||||
})
|
||||
setForm(fromServerForm(data))
|
||||
} catch (e) {
|
||||
const detail = e?.message || t('settings.loadFailed')
|
||||
setLastError(detail)
|
||||
onMessage('error', detail)
|
||||
trackLoadFailure()
|
||||
// eslint-disable-next-line no-console
|
||||
console.error(e)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}, [apiFetch, autoFetchPaused, isVercel, onMessage, t, trackLoadFailure])
|
||||
|
||||
useEffect(() => {
|
||||
loadSettings()
|
||||
}, [loadSettings])
|
||||
|
||||
const retryLoadSettings = useCallback(() => {
|
||||
setAutoFetchPaused(false)
|
||||
loadSettings({ manual: true })
|
||||
}, [loadSettings])
|
||||
|
||||
const saveSettings = useCallback(async () => {
|
||||
let claudeMapping = {}
|
||||
let modelAliases = {}
|
||||
try {
|
||||
claudeMapping = parseJSONMap(form.claude_mapping_text, 'claude_mapping', t)
|
||||
modelAliases = parseJSONMap(form.model_aliases_text, 'model_aliases', t)
|
||||
} catch (e) {
|
||||
onMessage('error', e.message)
|
||||
return
|
||||
}
|
||||
|
||||
const payload = {
|
||||
...toServerPayload(form),
|
||||
claude_mapping: claudeMapping,
|
||||
model_aliases: modelAliases,
|
||||
}
|
||||
|
||||
setSaving(true)
|
||||
try {
|
||||
const { res, data } = await putSettings(apiFetch, payload)
|
||||
if (!res.ok) {
|
||||
onMessage('error', data.detail || t('settings.saveFailed'))
|
||||
return
|
||||
}
|
||||
onMessage('success', t('settings.saveSuccess'))
|
||||
if (typeof onRefresh === 'function') {
|
||||
onRefresh()
|
||||
}
|
||||
await loadSettings()
|
||||
} catch (e) {
|
||||
onMessage('error', t('settings.saveFailed'))
|
||||
// eslint-disable-next-line no-console
|
||||
console.error(e)
|
||||
} finally {
|
||||
setSaving(false)
|
||||
}
|
||||
}, [apiFetch, form, loadSettings, onMessage, onRefresh, t])
|
||||
|
||||
const updatePassword = useCallback(async () => {
|
||||
if (String(newPassword || '').trim().length < 4) {
|
||||
onMessage('error', t('settings.passwordTooShort'))
|
||||
return
|
||||
}
|
||||
setChangingPassword(true)
|
||||
try {
|
||||
const { res, data } = await postPassword(apiFetch, newPassword.trim())
|
||||
if (!res.ok) {
|
||||
onMessage('error', data.detail || t('settings.passwordUpdateFailed'))
|
||||
return
|
||||
}
|
||||
onMessage('success', t('settings.passwordUpdated'))
|
||||
setNewPassword('')
|
||||
if (typeof onForceLogout === 'function') {
|
||||
onForceLogout()
|
||||
}
|
||||
} catch (_e) {
|
||||
onMessage('error', t('settings.passwordUpdateFailed'))
|
||||
} finally {
|
||||
setChangingPassword(false)
|
||||
}
|
||||
}, [apiFetch, newPassword, onForceLogout, onMessage, t])
|
||||
|
||||
const loadExportData = useCallback(async () => {
|
||||
try {
|
||||
const { res, data } = await getExportData(apiFetch)
|
||||
if (!res.ok) {
|
||||
onMessage('error', data.detail || t('settings.exportFailed'))
|
||||
return
|
||||
}
|
||||
setExportData(data)
|
||||
onMessage('success', t('settings.exportLoaded'))
|
||||
} catch (_e) {
|
||||
onMessage('error', t('settings.exportFailed'))
|
||||
}
|
||||
}, [apiFetch, onMessage, t])
|
||||
|
||||
const doImport = useCallback(async () => {
|
||||
if (!String(importText || '').trim()) {
|
||||
onMessage('error', t('settings.importEmpty'))
|
||||
return
|
||||
}
|
||||
let parsed
|
||||
try {
|
||||
parsed = JSON.parse(importText)
|
||||
} catch (_e) {
|
||||
onMessage('error', t('settings.importInvalidJson'))
|
||||
return
|
||||
}
|
||||
setImporting(true)
|
||||
try {
|
||||
const { res, data } = await postImportData(apiFetch, importMode, parsed)
|
||||
if (!res.ok) {
|
||||
onMessage('error', data.detail || t('settings.importFailed'))
|
||||
return
|
||||
}
|
||||
onMessage('success', t('settings.importSuccess', { mode: importMode }))
|
||||
if (typeof onRefresh === 'function') {
|
||||
onRefresh()
|
||||
}
|
||||
await loadSettings()
|
||||
} catch (_e) {
|
||||
onMessage('error', t('settings.importFailed'))
|
||||
} finally {
|
||||
setImporting(false)
|
||||
}
|
||||
}, [apiFetch, importMode, importText, loadSettings, onMessage, onRefresh, t])
|
||||
|
||||
const syncHintVisible = useMemo(
|
||||
() => settingsMeta.env_backed || settingsMeta.needs_vercel_sync,
|
||||
[settingsMeta.env_backed, settingsMeta.needs_vercel_sync],
|
||||
)
|
||||
|
||||
return {
|
||||
form,
|
||||
setForm,
|
||||
loading,
|
||||
saving,
|
||||
changingPassword,
|
||||
importing,
|
||||
exportData,
|
||||
importMode,
|
||||
setImportMode,
|
||||
importText,
|
||||
setImportText,
|
||||
newPassword,
|
||||
setNewPassword,
|
||||
consecutiveFailures,
|
||||
autoFetchPaused,
|
||||
lastError,
|
||||
settingsMeta,
|
||||
syncHintVisible,
|
||||
retryLoadSettings,
|
||||
saveSettings,
|
||||
updatePassword,
|
||||
loadExportData,
|
||||
doImport,
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user