servicepoint-tanks/tank-frontend/src/Scoreboard.tsx
2024-04-13 23:07:08 +02:00

27 lines
861 B
TypeScript

import {getScores, PlayerResponse} from "./serverCalls.tsx";
import {useEffect, useState} from "react";
import DataTable from "./components/DataTable.tsx";
export default function Scoreboard({}: {}) {
const [players, setPlayers] = useState<PlayerResponse[]>([]);
useEffect(() => {
const refresh = () => {
getScores().then(value => {
if (value)
setPlayers(value);
});
};
const timer = setInterval(refresh, 5000);
return () => clearInterval(timer);
}, [players]);
return <DataTable<PlayerResponse> data={players} columns={[
{field: 'name'},
{field: 'kills', visualize: p => p.scores.kills},
{field: 'deaths', visualize: p => p.scores.deaths},
{field: 'k/d', visualize: p => p.scores.kills / p.scores.deaths}
]}/>
}