From 5656ad13ada9960c7da7c1367d47be521e7df5b2 Mon Sep 17 00:00:00 2001 From: Kilian Date: Wed, 13 May 2026 16:40:55 +0100 Subject: [PATCH] fix: pintar reservas que cruzan el borde del mes visible MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit findIndex devolvía -1 si start_date o end_date caían fuera del rango visible, descartando la reserva entera. Ahora se clampa al rango del calendario conservando la clasificación single/multi-día por las fechas reales. Co-Authored-By: Claude Opus 4.7 (1M context) --- apps/web/src/components/CalendarGrid.tsx | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/apps/web/src/components/CalendarGrid.tsx b/apps/web/src/components/CalendarGrid.tsx index 70f0cd2..db5188e 100644 --- a/apps/web/src/components/CalendarGrid.tsx +++ b/apps/web/src/components/CalendarGrid.tsx @@ -223,13 +223,21 @@ export function CalendarGrid({ // misma celda, esa celda concreta se divide en N franjas horizontales (sin afectar // al resto de la fila). Las reservas multi-día se siguen renderizando como bandas // que abarcan varios días a altura completa. - type ResRange = { res: Reservation; startIdx: number; endIdx: number }; + type ResRange = { res: Reservation; startIdx: number; endIdx: number; isSingleDay: boolean }; + const calFirst = calendarDays[0]; + const calLast = calendarDays[calendarDays.length - 1]; const resRanges: ResRange[] = reservations .map(res => { - const startIdx = calendarDays.findIndex(day => isSameDay(day, parseISO(res.start_date))); - const endIdx = calendarDays.findIndex(day => isSameDay(day, parseISO(res.end_date))); + const s = parseISO(res.start_date); + const e = parseISO(res.end_date); + // Descartar reservas totalmente fuera de la vista + if (e < calFirst || s > calLast) return null; + const clampedStart = s < calFirst ? calFirst : s; + const clampedEnd = e > calLast ? calLast : e; + const startIdx = calendarDays.findIndex(day => isSameDay(day, clampedStart)); + const endIdx = calendarDays.findIndex(day => isSameDay(day, clampedEnd)); if (startIdx === -1 || endIdx === -1) return null; - return { res, startIdx, endIdx }; + return { res, startIdx, endIdx, isSingleDay: isSameDay(s, e) }; }) .filter((x): x is ResRange => x !== null); @@ -237,7 +245,7 @@ export function CalendarGrid({ const singleDayByCell = new Map(); const multiDayRanges: ResRange[] = []; for (const r of resRanges) { - if (r.startIdx === r.endIdx) { + if (r.isSingleDay) { const arr = singleDayByCell.get(r.startIdx) ?? []; arr.push(r.res); singleDayByCell.set(r.startIdx, arr);