Can't display object key in thead table with react.js

Question

I want to display object's key into thead and object value to tbody. but it's showing nothing in thead. Could you help me to fix this issue?

const order = {t1: '123', t2: '234'};  

return (
    <TableContainer component={Paper}>
      <Table sx={{ minWidth: 1000 }}>
        <TableHead>
          <TableRow>
            { order && Object.keys(order).forEach((value) => <TableCell>{ value }</TableCell> )}
          </TableRow>
        </TableHead>
        <TableBody>
        </TableBody>
      </Table>
    </TableContainer>
  );

Answer 1

forEach doesn't return anything. replace forEach with map

const order = {t1: '123', t2: '234'};  

return (
    <TableContainer component={Paper}>
      <Table sx={{ minWidth: 1000 }}>
        <TableHead>
          <TableRow>
            { order && Object.keys(order).map((value) => <TableCell>{ value }</TableCell> )}
          </TableRow>
        </TableHead>
        <TableBody>
        </TableBody>
      </Table>
    </TableContainer>
  );