42 lines
1.5 KiB
JavaScript
42 lines
1.5 KiB
JavaScript
import React from 'react';
|
|
import GameRow from './GameRow';
|
|
|
|
export default function GameGrid({ grid, width, middle }) {
|
|
return (
|
|
<table id="actors">
|
|
<tbody>
|
|
{grid.map((row, rowIndex) => {
|
|
if (row.separator !== undefined) {
|
|
return (
|
|
<tr key={rowIndex} className="separator-row">
|
|
<td />
|
|
{Array.from({ length: middle }, (_, i) => (
|
|
<td key={i} />
|
|
))}
|
|
<td className="letter-static separator-char">
|
|
{row.separator === ' ' ? '' : row.separator}
|
|
</td>
|
|
{Array.from({ length: width - middle }, (_, i) => (
|
|
<td key={middle + 1 + i} />
|
|
))}
|
|
</tr>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<GameRow
|
|
key={rowIndex}
|
|
actorName={row.actorName}
|
|
pos={row.pos}
|
|
colStart={middle - row.pos}
|
|
totalWidth={width}
|
|
hintType={row.hintType}
|
|
hintText={row.hintText}
|
|
/>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
);
|
|
}
|