feat: auto-refresh dashboard and datapoints every 10 seconds

Values now update live without manual page reload.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Christian Mueller 2026-04-07 08:33:39 +02:00
parent 3a4e762290
commit 07bb4acb57
2 changed files with 15 additions and 3 deletions

View File

@ -12,7 +12,7 @@ export default function Dashboard() {
const [displays, setDisplays] = useState<Display[]>([]); const [displays, setDisplays] = useState<Display[]>([]);
const [error, setError] = useState(''); const [error, setError] = useState('');
useEffect(() => { function loadAll() {
Promise.all([ Promise.all([
api.get<Broker[]>('/api/mqtt/brokers'), api.get<Broker[]>('/api/mqtt/brokers'),
api.get<Datapoint[]>('/api/datapoints'), api.get<Datapoint[]>('/api/datapoints'),
@ -23,7 +23,14 @@ export default function Dashboard() {
setDatapoints(d); setDatapoints(d);
setDisplays(disp); setDisplays(disp);
}) })
.catch((err) => setError((err as Error).message)); .catch((e) => setError((e as Error).message));
}
useEffect(() => {
loadAll();
const interval = setInterval(loadAll, 10000);
return () => clearInterval(interval);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []); }, []);
const lastUpdate = datapoints const lastUpdate = datapoints

View File

@ -30,7 +30,12 @@ export default function Datapoints() {
} }
} }
useEffect(() => { load(); }, []); useEffect(() => {
load();
const interval = setInterval(load, 10000);
return () => clearInterval(interval);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
async function handleBlur(id: number, field: 'label' | 'unit') { async function handleBlur(id: number, field: 'label' | 'unit') {
try { try {