import { FC } from 'react';

import Box from '@material-hu/mui/Box';
import Typography from '@material-hu/mui/Typography';

export type ModuleHeaderProps = {
  title: string;
};

export const ModuleHeader: FC<ModuleHeaderProps> = props => {
  const { title } = props;

  return (
    <Box
      sx={{
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'space-between',
        px: 1,
      }}
    >
      <Typography
        color="textPrimary"
        variant="h5"
        component="h1"
      >
        {title}
      </Typography>
    </Box>
  );
};

export default ModuleHeader;
