36 lines
1.3 KiB
JavaScript
36 lines
1.3 KiB
JavaScript
import lock from '../../../../images/login-page/lock.png';
|
|
import styles from './ServersTable.module.css';
|
|
|
|
const ServerListTable = ({ rooms, handleJoinClick }) => {
|
|
return (
|
|
<table className={styles.rooms}>
|
|
<thead>
|
|
<tr>
|
|
<th className={styles.firstColumn}></th>
|
|
<th>Server</th>
|
|
<th>#/#</th>
|
|
<th>Status</th>
|
|
<th className={styles.lastColumn}></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{rooms.map((room, index) => {
|
|
return room.started ? null : (
|
|
<tr key={index}>
|
|
<td>{room.private ? <img src={lock} alt='private' /> : null}</td>
|
|
<td className={styles.roomName}>{room.name}</td>
|
|
<td>{`${room.players.length}/4`}</td>
|
|
<td>{room.isStarted ? 'started' : 'waiting'}</td>
|
|
<td className={styles.lastColumn}>
|
|
<button onClick={() => handleJoinClick(room)}>Join</button>
|
|
</td>
|
|
</tr>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
);
|
|
};
|
|
|
|
export default ServerListTable;
|