Encartes-web/src/Rooms.js

import TableContainer from '@mui/material/TableContainer';
import Table from '@mui/material/Table';
import TableHead from '@mui/material/TableHead';
import TableRow from '@mui/material/TableRow';
import TableCell from '@mui/material/TableCell';
import TableBody from '@mui/material/TableBody';

export default function Rooms({callbackRoomSelected}) {
  return <TableContainer variant="outlined">
    <Table aria-label="demo table">
      <TableHead>
        <TableRow>
          <TableCell>Salle</TableCell>
          <TableCell>Occupants</TableCell>
        </TableRow>
      </TableHead>
      <TableBody>
        <TableRow hover={true} onClick={() => callbackRoomSelected('salle-M-GN1-3-av')}>
          <TableCell>Amphi A</TableCell>
          <TableCell>Maths</TableCell>
        </TableRow>
        <TableRow hover={true} onClick={() => callbackRoomSelected('salle-M-GN1-3-ae')}>
          <TableCell>Amphi B</TableCell>
          <TableCell>Infos</TableCell>
        </TableRow>
      </TableBody>
    </Table>
  </TableContainer>
}