fix: remove dead General settings section, show read-only OIDC config

This commit is contained in:
2026-06-29 08:42:49 +02:00
parent e56d97f808
commit 02041751e3

View File

@@ -1,4 +1,4 @@
import { useState } from 'react'
import { useState, useEffect } from 'react'
import { api } from '../lib/api'
const D = 'rgba(237,237,240,'
@@ -15,20 +15,29 @@ function Section({ title, badge, children }: { title: string; badge?: React.Reac
)
}
function Field({ label, children }: { label: string; children: React.ReactNode }) {
function ReadonlyField({ label, value }: { label: string; value: string }) {
return (
<div>
<label style={{ display: 'block', fontSize: 12, fontWeight: 500, color: `${D}0.55)`, marginBottom: 6 }}>{label}</label>
{children}
<div style={{
background: 'rgba(0,0,0,0.18)', border: '1px solid rgba(255,255,255,0.07)', borderRadius: 6,
padding: '8px 12px', fontSize: 13, color: `${D}0.4)`, fontFamily: "'DM Mono',monospace",
userSelect: 'all',
}}>{value || '—'}</div>
</div>
)
}
const inputStyle = { width: '100%', background: 'rgba(0,0,0,0.28)', border: '1px solid rgba(255,255,255,0.09)', borderRadius: 6, padding: '8px 12px', fontSize: 13, color: '#ededf0', outline: 'none' }
interface AuthConfig { client_id: string; auth_url: string; token_url: string }
export default function Settings() {
const [syncLoading, setSyncLoading] = useState(false)
const [syncMsg, setSyncMsg] = useState('')
const [auth, setAuth] = useState<AuthConfig | null>(null)
useEffect(() => {
fetch('/api/auth/config').then(r => r.json()).then(setAuth).catch(() => {})
}, [])
async function forceSync() {
setSyncLoading(true)
@@ -43,47 +52,19 @@ export default function Settings() {
}
}
const issuer = auth?.auth_url
? new URL(auth.auth_url).origin + new URL(auth.auth_url).pathname.replace(/\/authorize$/, '')
: ''
return (
<div className="animate-fade-up" style={{ maxWidth: 620 }}>
<Section title="General">
<div style={{ display: 'grid', gap: 15 }}>
<Field label="Router name">
<input type="text" defaultValue="Local Model Routex" style={inputStyle}/>
</Field>
<Field label="Base URL">
<input type="text" defaultValue="http://localhost:8080" style={{ ...inputStyle, fontFamily: "'DM Mono',monospace" }}/>
</Field>
<div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 12 }}>
<Field label="Log level">
<select style={{ ...inputStyle, cursor: 'pointer' }}>
<option>info</option><option>debug</option><option>warn</option><option>error</option>
</select>
</Field>
<Field label="Log retention">
<select style={{ ...inputStyle, cursor: 'pointer' }}>
<option>7 days</option><option>30 days</option><option>90 days</option>
</select>
</Field>
</div>
</div>
</Section>
<Section title="Authentication"
badge={<span style={{ fontSize: 10, fontWeight: 600, padding: '2px 7px', borderRadius: 3, background: 'rgba(34,197,94,0.12)', color: '#4ade80', border: '1px solid rgba(34,197,94,0.2)' }}>OIDC</span>}>
<div style={{ display: 'grid', gap: 14 }}>
<Field label="OIDC Issuer URL">
<input type="text" placeholder="https://auth.example.com/application/o/routex/" style={{ ...inputStyle, fontFamily: "'DM Mono',monospace" }}/>
</Field>
<div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 12 }}>
<Field label="Client ID">
<input type="text" placeholder="routex-dashboard" style={{ ...inputStyle, fontFamily: "'DM Mono',monospace" }}/>
</Field>
<Field label="Admin group">
<input type="text" placeholder="llm-admins" style={{ ...inputStyle, fontFamily: "'DM Mono',monospace" }}/>
</Field>
</div>
<p style={{ fontSize: 12, color: `${D}0.3)`, lineHeight: 1.5 }}>
OIDC is configured via environment variables (<code style={{ fontFamily: 'monospace' }}>GATEWAY_OIDC_*</code>). Restart the server after changing them.
<ReadonlyField label="OIDC Issuer URL" value={issuer} />
<ReadonlyField label="Client ID" value={auth?.client_id ?? ''} />
<p style={{ fontSize: 12, color: `${D}0.3)`, lineHeight: 1.5, margin: 0 }}>
Configured via environment variables (<code style={{ fontFamily: 'monospace' }}>GATEWAY_OIDC_*</code>).
</p>
</div>
</Section>
@@ -105,15 +86,6 @@ export default function Settings() {
</button>
</div>
</Section>
<div style={{ display: 'flex', justifyContent: 'flex-end', gap: 8 }}>
<button style={{ background: 'transparent', border: '1px solid rgba(255,255,255,0.1)', borderRadius: 7, padding: '8px 16px', fontSize: 13, color: `${D}0.5)`, cursor: 'pointer' }}>
Discard
</button>
<button style={{ background: '#7c3aed', border: 'none', borderRadius: 7, padding: '8px 20px', fontSize: 13, fontWeight: 500, color: 'white', cursor: 'pointer' }}>
Save changes
</button>
</div>
</div>
)
}