Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 | 708x 252x 708x | import React from "react";
import {Paper, Table, TableBody, TableCell, TableContainer, TableRow} from "@mui/material";
import ColorViewer from "./ColorViewer";
export type Score = {
idx: number,
playerName: string,
score: number,
color: string
}
type Props = {
scores: Score[],
title: string
}
export default function Scores(props: Props) {
const fields = props.scores.map((score, index) =>
<TableRow key={score.playerName + index.toString()}>
<TableCell>
<ColorViewer color={score.color}/>
</TableCell>
<TableCell>
{score.playerName}
</TableCell>
<TableCell>
{score.score}
</TableCell>
</TableRow>
);
return (
<>
<h2>{props.title}</h2>
<TableContainer component={Paper}>
<Table aria-label={props.title} id="currentScores">
<TableBody>
{fields}
</TableBody>
</Table>
</TableContainer>
</>
)
}
|