import cx from "../../../../utils/css/cx.js";
import useDateFormat from "../../../../hooks/useDateFormat/index.js";
import classes from './styles.module.scss';
const cls = cx.merge(classes);
export default function PageDate({
  date,
  endDate
}) {
  const day = useDateFormat(date, {
    format: '{D}',
    timeZone: 'UTC'
  });
  const apDate = useDateFormat(date, {
    format: '{apdate}',
    timeZone: 'UTC'
  });
  const month = apDate.split(' ')[0];
  const endDay = useDateFormat(endDate, {
    format: '{D}',
    timeZone: 'UTC'
  });
  return <div className={cls('page-date', 'shadow-100')}>
      <span className={cls('month', 'p-2')}>{month.replace('.', '')}</span>
      <div className={cls('day', 'py-2')}>
        {day}
        {endDate && `-${endDate && endDay}`}
      </div>
    </div>;
}