This commit is contained in:
Louis Mazin 2026-09-25 16:13:12 +02:00
parent 0cb8747e09
commit cd3214960e

View File

@ -1,5 +1,6 @@
import React, {
useEffect,
useLayoutEffect,
useMemo,
useRef,
useState,
@ -112,6 +113,8 @@ const CalendarPage = () => {
);
const [isMobile, setIsMobile] =
useState(false);
const [calendarViewportHeight, setCalendarViewportHeight] =
useState(null);
const [events, setEvents] =
useState([]);
const [loadingEvents, setLoadingEvents] =
@ -159,6 +162,7 @@ const CalendarPage = () => {
end_time: '',
color: DEFAULT_EVENT_COLOR,
});
const calendarViewportRef = useRef(null);
/* SÉLECTION D'UNE PÉRIODE */
const [selectionStart, setSelectionStart] = useState(null);
const [selectionEnd, setSelectionEnd] = useState(null);
@ -430,6 +434,22 @@ const CalendarPage = () => {
useEffect(() => {
if (isMobile) clearSelection();
}, [isMobile]);
useLayoutEffect(() => {
if (loadingEvents || !calendarViewportRef.current) return;
const viewport = calendarViewportRef.current;
const updateHeight = () => {
const height = viewport.getBoundingClientRect().height;
setCalendarViewportHeight((previous) =>
previous === height ? previous : height,
);
};
updateHeight();
const observer = new ResizeObserver(updateHeight);
observer.observe(viewport);
return () => observer.disconnect();
}, [loadingEvents]);
/*
* ============================================================
* ANNÉE
@ -1386,6 +1406,7 @@ const CalendarPage = () => {
)}
<Card className="flex min-h-0 flex-1 flex-col overflow-hidden p-0">
<div
ref={calendarViewportRef}
className="relative min-h-0 flex-1 overflow-auto md:overflow-hidden p-0"
style={{
WebkitOverflowScrolling:
@ -1395,8 +1416,11 @@ const CalendarPage = () => {
}}
>
<div
className="grid h-full w-full min-w-0 border-l border-t border-border"
className="grid w-full min-w-0 border-l border-t border-border"
style={{
height: calendarViewportHeight === null
? '100%'
: `${Math.max(calendarViewportHeight, HEADER_HEIGHT + rowCount * MIN_ROW_HEIGHT)}px`,
minHeight: `${HEADER_HEIGHT + rowCount * MIN_ROW_HEIGHT}px`,
minWidth: isMobile
? '100%'