import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow } from '@mui/material'

function CustomTable({ tableHead, zeroRadius, centerTable, children }) {
    return (
        <TableContainer
            className='!shadow-none table-shadow-none !border !border-solid !border-[#DBDBDB]'
            sx={{
                '&.MuiTableContainer-root': {
                    borderRadius: zeroRadius && '0 !important'
                }
            }}
        >
            <Table className='!rounded-0 !shadow-none !overflow-hidden'>
                <TableHead>
                    <TableRow
                        className='!bg-[#EFEFEF]'
                    >
                        {tableHead.map((item, idx) => (
                            <TableCell
                                key={idx}
                                className={`
                                !text-[#616161] !text-[14px] !font-normal !py-[10px] !px-[18px]
                                ${centerTable.includes(idx) ? '!text-center' : '!text-start'}
                            `}
                            >
                                {item}
                            </TableCell>
                        ))}
                    </TableRow>
                </TableHead>
                <TableBody>
                    {children}
                </TableBody>
            </Table>
        </TableContainer>
    )
}

export default CustomTable