import shallow from "zustand/shallow"; import { useCalendarStore } from "../../state/store"; import type { GridCellToDateProps } from "../../utils"; import { gridCellToDateTime } from "../../utils"; export function EmptyCell(props: GridCellToDateProps) { const { onEmptyCellClick, hoverEventDuration } = useCalendarStore( (state) => ({ onEmptyCellClick: state.onEmptyCellClick, hoverEventDuration: state.hoverEventDuration, }), shallow ); const cellToDate = gridCellToDateTime({ day: props.day, gridCellIdx: props.gridCellIdx, totalGridCells: props.totalGridCells, selectionLength: props.selectionLength, startHour: props.startHour, }); return (
onEmptyCellClick && onEmptyCellClick(cellToDate.toDate())}> {hoverEventDuration !== 0 && (
{cellToDate.format("HH:mm")}
)}
); }