import { FC } from 'react';

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

export type SignDescriptionProps = {
  label: string;
  date?: string;
};

const SignDescription: FC<SignDescriptionProps> = props => {
  const { label, date } = props;

  return (
    <Stack
      sx={{
        flexDirection: 'row',
        alignItems: 'center',
        gap: 0.5,
      }}
    >
      <Typography variant="globalXS">{label}</Typography>
      {date && <Typography variant="globalXS">{date}</Typography>}
    </Stack>
  );
};

export default SignDescription;