62 lines
1.8 KiB
TypeScript
62 lines
1.8 KiB
TypeScript
import { useState } from 'react'
|
|
import type { FormEvent } from 'react'
|
|
import { getApiClient, resetApiClient } from '../lib/api-client'
|
|
import {
|
|
getRuntimeConfig,
|
|
setRuntimeConfig,
|
|
} from '../lib/runtime-config'
|
|
import type { RuntimeConfig } from '../lib/runtime-config'
|
|
import { reconnectSocket } from '../lib/socket-client'
|
|
|
|
export default function WorkspacePage() {
|
|
const [form, setForm] = useState<RuntimeConfig>(getRuntimeConfig())
|
|
const [health, setHealth] = useState('')
|
|
|
|
async function onSave(e: FormEvent) {
|
|
e.preventDefault()
|
|
setRuntimeConfig(form)
|
|
resetApiClient()
|
|
reconnectSocket()
|
|
setHealth('配置已保存')
|
|
}
|
|
|
|
async function checkHealth() {
|
|
try {
|
|
const res = await getApiClient().get('/healthz')
|
|
setHealth(JSON.stringify(res.data))
|
|
} catch {
|
|
setHealth('healthz 访问失败')
|
|
}
|
|
}
|
|
|
|
return (
|
|
<section>
|
|
<h2>工作台</h2>
|
|
<form onSubmit={onSave} style={{ display: 'grid', gap: 8, maxWidth: 760 }}>
|
|
<input
|
|
value={form.guildApiBase}
|
|
onChange={(e) => setForm((v) => ({ ...v, guildApiBase: e.target.value }))}
|
|
placeholder="Guild API Base"
|
|
/>
|
|
<input
|
|
value={form.guildSocketBase}
|
|
onChange={(e) => setForm((v) => ({ ...v, guildSocketBase: e.target.value }))}
|
|
placeholder="Guild Socket Base"
|
|
/>
|
|
<input
|
|
value={form.apiKey}
|
|
onChange={(e) => setForm((v) => ({ ...v, apiKey: e.target.value }))}
|
|
placeholder="API Key"
|
|
/>
|
|
<div style={{ display: 'flex', gap: 8 }}>
|
|
<button type="submit">保存配置</button>
|
|
<button type="button" onClick={checkHealth}>
|
|
测试 healthz
|
|
</button>
|
|
</div>
|
|
</form>
|
|
<p>{health}</p>
|
|
</section>
|
|
)
|
|
}
|