Add 5-minute auto-reload and last-updated timestamp to admin UI
This commit is contained in:
parent
02b4ad06ca
commit
cf1b3f7786
@ -222,21 +222,31 @@ function App() {
|
||||
const [creating, setCreating] = useState(false);
|
||||
const [editKey, setEditKey] = useState(null);
|
||||
const [editForm, setEditForm] = useState({});
|
||||
|
||||
useEffect(() => {
|
||||
if (!password) { setLoading(false); return; }
|
||||
fetchApiKeys().finally(() => setLoading(false));
|
||||
}, [password]);
|
||||
const [refreshKey, setRefreshKey] = useState(0);
|
||||
const [lastUpdated, setLastUpdated] = useState(null);
|
||||
|
||||
const fetchApiKeys = async () => {
|
||||
try {
|
||||
const res = await axios.get('/api/api-keys', { headers: authHeaders(password) });
|
||||
setApiKeys(res.data);
|
||||
setLastUpdated(new Date());
|
||||
} catch {
|
||||
setError('API-Keys konnten nicht geladen werden.');
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!password) { setLoading(false); return; }
|
||||
fetchApiKeys().finally(() => setLoading(false));
|
||||
|
||||
const timer = setInterval(() => {
|
||||
fetchApiKeys();
|
||||
setRefreshKey(k => k + 1);
|
||||
}, 5 * 60 * 1000);
|
||||
|
||||
return () => clearInterval(timer);
|
||||
}, [password]);
|
||||
|
||||
const handleCreate = async (e) => {
|
||||
e.preventDefault();
|
||||
setCreating(true);
|
||||
@ -328,10 +338,17 @@ function App() {
|
||||
<div className="container">
|
||||
<div className="header">
|
||||
<h1>Ollama Proxy Admin</h1>
|
||||
<div className="header-right">
|
||||
{lastUpdated && (
|
||||
<span className="last-updated">
|
||||
Aktualisiert: {lastUpdated.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' })}
|
||||
</span>
|
||||
)}
|
||||
<button onClick={logout}>Abmelden</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<SettingsSection password={password} />
|
||||
<SettingsSection password={password} refreshKey={refreshKey} />
|
||||
|
||||
<section>
|
||||
<h2>Neuer API-Key</h2>
|
||||
|
||||
@ -486,3 +486,14 @@ tr:hover {
|
||||
color: #f5a0a0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.header-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.last-updated {
|
||||
font-size: 12px;
|
||||
color: #95a5a6;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user