Timetable - fix for group 0 was not found

Author: marcus-wishes

library/src/components/timetable/TimeTableRows.tsx

@@ -172,6 +172,20 @@ function renderGroupRows<G extends TimeTableGroup, I extends TimeSlotBooking>(
 		)
 	}
 	const groupEntriesArray = groupRowsKeys
+	// Defensive: if the index is beyond available keys, skip rendering instead of throwing
+	if (g >= groupEntriesArray.length) {
+		if (timeTableDebugLogs) {
+			console.warn(
+				"TimeTable - group index out of key bounds",
+				g,
+				groupEntriesArray.length,
+				groupRows,
+				changedGroupRowsRef,
+				renderCells,
+			)
+		}
+		return
+	}
 	const groupEntry = groupEntriesArray[g]
 	if (!groupEntry) {
 		console.warn(
@@ -184,7 +198,8 @@ function renderGroupRows<G extends TimeTableGroup, I extends TimeSlotBooking>(
 			changedGroupRowsRef,
 			renderCells,
 		)
-		throw new Error(`TimeTable - group ${g} entry not found`)
+		// Do not throw here as this can happen due to async scheduling; skip this render turn
+		return
 	}
 	const nextGroupId = groupEntriesArray[g + 1]?.id ?? null
 	const previousGroupId = groupEntriesArray[g - 1]?.id ?? null
@@ -454,7 +469,11 @@ export default function TimeTableRows<
 	}, [intersectionContainerRef.current, headerRef.current, rowHeight])
 
 	const currentGroupRowsRef = useRef(groupRows)
-	const groupRowKeys = useMemo(() => groupRows.keys().toArray(), [groupRows])
+	const previousGroupRowsForRetry = useRef(groupRows)
+	const groupRowKeys = useMemo(
+		() => Array.from(groupRows.keys()),
+		[groupRows],
+	)
 
 	const hasViewTypeChanged =
 		slotsArrayCurrent.current !== slotsArray ||
@@ -542,8 +561,6 @@ export default function TimeTableRows<
 				}
 			}
 
-			currentGroupRowsRef.current = groupRows
-
 			if (timeTableDebugLogs) {
 				console.info(
 					`TimeTable - groupRows changed, marked ${changedGroupRows.current.size} groups for re-validation`,
@@ -558,7 +575,12 @@ export default function TimeTableRows<
 		for (let i = 0; i < groupRowKeys.length; i++) {
 			const group = groupRowKeys[i]
 			if (!group) {
-				throw new Error(`TimeTable - group ${i} not found`)
+				console.warn(
+					`TimeTable - group ${i} not found in groupRowKeys`,
+					i,
+					groupRowKeys.length,
+				)
+				continue // Skip this group
 			}
 			const rows = groupRows.get(group)
 			const currentRows = currentGroupRowsRef.current.get(group)
@@ -584,6 +606,10 @@ export default function TimeTableRows<
 			}
 		}
 
+		// Store previous state for retry mechanism before updating
+		previousGroupRowsForRetry.current = currentGroupRowsRef.current
+		currentGroupRowsRef.current = groupRows
+
 		for (const changedG of changedGroupRows.current) {
 			if (changedG > groupRowKeys.length - 1) {
 				// delete obsolete change
@@ -639,6 +665,10 @@ export default function TimeTableRows<
 	const renderBatch = useCallback(() => {
 		setGroupRowsRendered((groupRowsRenderedPrev) => {
 			const groupRowsRendered = [...groupRowsRenderedPrev]
+			// Take a consistent snapshot of the current group rows and keys for this batch
+			const snapshotMap = currentGroupRowsRef.current
+			const snapshotKeys = Array.from(snapshotMap.keys()) as G[]
+			const snapshotSize = snapshotKeys.length
 			if (changedGroupRows.current.size) {
 				let counter = 0
 				if (renderGroupRangeRef.current[0] > -1) {
@@ -647,14 +677,14 @@ export default function TimeTableRows<
 						i <= renderGroupRangeRef.current[1];
 						i++
 					) {
-						if (i > currentGroupRowsRef.current.size - 1) {
+						if (i > snapshotSize - 1) {
 							changedGroupRows.current.delete(i)
 							continue
 						}
 						// make sure visible rows are rendered
 						if (changedGroupRows.current.has(i)) {
-							const groupEntryKey = groupRowKeys[i]
-							const groupItemRows = groupRows.get(groupEntryKey)
+							const groupEntryKey = snapshotKeys[i]
+							const groupItemRows = snapshotMap.get(groupEntryKey)
 							if (!groupItemRows) {
 								if (timeTableDebugLogs) {
 									console.log(
@@ -685,8 +715,8 @@ export default function TimeTableRows<
 
 							renderGroupRows(
 								renderGroupRangeRef.current,
-								currentGroupRowsRef.current,
-								groupRowKeys,
+								snapshotMap,
+								snapshotKeys,
 								i,
 								refCollection.current,
 								groupRowsRendered,
@@ -714,7 +744,7 @@ export default function TimeTableRows<
 				}
 				for (const g of changedGroupRows.current) {
 					if (
-						g > currentGroupRowsRef.current.size - 1 ||
+						g > snapshotSize - 1 ||
 						g > groupRowsRendered.length - 1
 					) {
 						changedGroupRows.current.delete(g)
@@ -723,8 +753,8 @@ export default function TimeTableRows<
 					// unrender not visible rows, but render only if the placeholders are already rendered)
 					renderGroupRows(
 						renderGroupRangeRef.current,
-						currentGroupRowsRef.current,
-						groupRowKeys,
+						snapshotMap,
+						snapshotKeys,
 						g,
 						refCollection.current,
 						groupRowsRendered,
@@ -752,13 +782,13 @@ export default function TimeTableRows<
 
 			let counter = 0
 			while (
-				groupRowsRendered.length < currentGroupRowsRef.current.size &&
+				groupRowsRendered.length < snapshotSize &&
 				counter < timeTableGroupRenderBatchSize
 			) {
 				renderGroupRows(
 					renderGroupRangeRef.current,
-					currentGroupRowsRef.current,
-					groupRowKeys,
+					snapshotMap,
+					snapshotKeys,
 					groupRowsRendered.length,
 					refCollection.current,
 					groupRowsRendered,
@@ -779,8 +809,8 @@ export default function TimeTableRows<
 				)
 				++counter
 			}
-			if (groupRowsRendered.length > currentGroupRowsRef.current.size) {
-				groupRowsRendered.length = currentGroupRowsRef.current.size
+			if (groupRowsRendered.length > snapshotSize) {
+				groupRowsRendered.length = snapshotSize
 			}
 			rateLimiterIntersection(handleIntersections)
 			return groupRowsRendered
@@ -799,8 +829,6 @@ export default function TimeTableRows<
 		rateLimiterIntersection,
 		timeStepMinutesHoursView,
 		onRenderedGroupsChanged,
-		groupRowKeys,
-		groupRows,
 		onTimeSlotClick,
 	])
 
@@ -847,7 +875,7 @@ export default function TimeTableRows<
 			const group = groupRowKeys[groupIndex]
 			if (group) {
 				const rows = groupRows.get(group)
-				const currentRows = currentGroupRowsRef.current.get(group)
+				const currentRows = previousGroupRowsForRetry.current.get(group)
 				// If we previously had null data and now have actual data, trigger re-render
 				if (currentRows === null && rows !== null) {
 					hasNewData = true