BuzzbeeSCD/ProjectE
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: calendar day view - wrapper div key remount for forced reinit

Browse Source
This commit is contained in:
Hermes
2026-08-01 12:38:55 +00:00
parent d142db40c1
commit 6613ff058e
1 changed files with 2 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/routes/_app/calendar.tsx
+2 -5
View File
@@ -162,7 +162,7 @@ function EventForm({ event, onClose }: { event?: CalendarEvent; onClose: () => v
function CalendarPage() { function CalendarPage() {
const queryClient = useQueryClient(); const queryClient = useQueryClient();
const [date, setDate] = useState(new Date()); const [date, setDate] = useState(new Date());
const [view, setView] = useState<string>("month"); const [view, setView] = useState<string>("day");
const [createOpen, setCreateOpen] = useState(false); const [createOpen, setCreateOpen] = useState(false);
const [selectedEvent, setSelectedEvent] = useState<CalendarEvent | null>(null); const [selectedEvent, setSelectedEvent] = useState<CalendarEvent | null>(null);
const [eventDetailOpen, setEventDetailOpen] = useState(false); const [eventDetailOpen, setEventDetailOpen] = useState(false);
@@ -254,17 +254,14 @@ function CalendarPage() {
</Dialog> </Dialog>
</div> </div>
<div className="rbc-calendar-container" style={{ minHeight: isMobile ? 400 : 600 }}> <div key={'cal-wrap-' + view} className="rbc-calendar-container" style={{ minHeight: isMobile ? 400 : 600 }}>
{/* Key={view} forces remount on view change (workaround for react-big-calendar DnD day view issue) */}
<Calendar <Calendar
key={'cal-' + view + '-' + (isMobile ? 'm' : 'd')}
localizer={localizer} localizer={localizer}
events={calendarEvents} events={calendarEvents}
startAccessor="start" startAccessor="start"
endAccessor="end" endAccessor="end"
date={date} date={date}
view={view} view={view}
defaultView={isMobile ? Views.AGENDA : Views.MONTH}
onNavigate={handleNavigate} onNavigate={handleNavigate}
onSelectEvent={handleSelectEvent} onSelectEvent={handleSelectEvent}
onSelectSlot={handleSelectSlot} onSelectSlot={handleSelectSlot}