When I am trying to use React Big Calendar on mobile browser, I can't use the onSelectSlot function. I can click the events but can't click the timeslots for open a new event modal. No error on console too.
Here is my code. I used longPressThreshold but didn't work.
<DragAndDropCalendar
date={defaultDate}
onNavigate={(date) => setDefaultDate(date)}
onEventDrop={moveEvent}
selectable={true}
formats={formats}
messages = {{week: 'Hafta', day: 'Gün', month: 'Ay', previous: 'Geri', next: 'İleri', today: 'Bugün', showMore: function(e) {return '+' + e + ' daha'}}}
events={eventsList}
onSelecting={slot => false}
localizer={localizer}
view={view}
showMultiDayTimes={false}
onView={(e) => setView(e)}
views={['day', 'week', 'month']}
step={calendarTimeCell}
culture={'tr'}
min={new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate(), 7, 0)}
max={new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate(), 21, 0)}
onSelectEvent={event => {
let endDate = moment(event.endDate);
let startDate = moment(event.startDate)
openEditAppointmentModal(event, customerData, moment.duration(endDate.diff(startDate)).asMinutes())
}}
longPressThreshold={10}
onSelectSlot={openNewAppointmentModal}
tooltipAccessor={(event) => appointmentTooltip(event, resourceIdAccessor)}
resources={view === 'week' ? null : resources}
resourceAccessor={view === 'week' ? null : (event) => resourceIdAccessor === 'serviceId' ? event.serviceId : event.teammateId}
resourceIdAccessor={view === 'week' ? null : resourceIdAccessor}
resourceTitleAccessor={view === 'week' ? null : 'resource_name'}
titleAccessor={(event) => appointmentTitleAccessor(event, view)}
startAccessor={(event) => new Date(event.startDate)}
endAccessor={(event) => new Date(event.endDate)}
eventPropGetter={(event, start, end, isSelected) => eventStyleGetter(event, start, end, isSelected)}
/>
EDIT: I can click the timeslots clearly in MONTH VIEW. But Week and Day View is not working for onSelectSlot.
