WeekCalendar: scrollToIndex fails after data regeneration, causing calendar to jump to wrong dates when scrolling backwards

Author: amebarkiCreated Feb 10, 2026Updated Mar 25, 2026

Description

When using WeekCalendar in an ExpandableCalendar and scrolling backwards (towards the past), the calendar jumps to the wrong date after regenerating the data array. The scrollToIndex call after data regeneration doesn't work as expected, causing the FlatList to display index 0 instead of the intended index.

https://github.com/user-attachments/assets/92abf7b7-9f8e-47c5-b30c-4c0125a0b99f

Steps to Reproduce

  1. Use ExpandableCalendar with WeekCalendar enabled
  2. Swipe left repeatedly to scroll backwards towards the past
  3. When reaching the first item (index 0), observe the calendar jump to a completely different month

Additional Context

After the jump, the pattern repeats - scrolling to October triggers another regeneration that jumps to July, creating an unusable backward scrolling experience.

Expected Behavior

When scrolling backwards and reaching the edge of the list:

  1. User continues scrolling backwards seamlessly

Observed Behavior

The calendar jumps several weeks/months backwards instead of staying at the current date.

Detailed flow from logs:

  1. User scrolls to 2025-12-29 (index 0)
  2. onEndReached fires with direction: start
  3. New dates generated: ["2025-10-06", ..., "2025-12-29"] (index 12)
  4. Code calls scrollToIndex({index: 12}) to show 2025-12-29
  5. BUG: FlatList shows 2025-10-06 (index 0) instead of index 12
  6. Calendar jumps from December to October (skipping November)

Full logs showing the issue: LOG onViewableItemsChanged LOG {"viewableItems": [{"index": 0, "isViewable": true, "item": "2025-12-29", "key": "2025-12-29-0"}, {"index": 1, "isViewable": true, "item": "2026-01-05", "key": "2026-01-05-1"}]} LOG onViewableItemsChanged - newDate: 2025-12-29 visibleWeek.current: 2026-01-05 LOG currItems[0]: 2025-12-29 currItems.length: 13 LOG Updated visibleWeek.current to: 2025-12-29 currentIndex: 0 LOG Calling onEndReached - reached first item (currItems[0]: 2025-12-29 ) LOG End reached - direction: start visibleWeek.current: 2025-12-29 LOG End reached - currentIndex.current: 0 LOG End reached - baseDate: 2025-11-17 new items: ["2025-10-06", "2025-10-13", "2025-10-20", "2025-10-27", "2025-11-03", "2025-11-10", "2025-11-17", "2025-11-24", "2025-12-01", "2025-12-08", "2025-12-15", "2025-12-22", "2025-12-29"] LOG End reached - scrolling to index: 12 LOG onViewableItemsChanged LOG {"viewableItems": [{"index": 0, "isViewable": true, "item": "2025-10-06", "key": "2025-10-06-0"}, {"index": 1, "isViewable": true, "item": "2025-10-13", "key": "2025-10-13-1"}]} LOG onViewableItemsChanged LOG {"viewableItems": [{"index": 0, "isViewable": true, "item": "2025-10-06", "key": "2025-10-06-0"}]} LOG onViewableItemsChanged - newDate: 2025-10-06 visibleWeek.current: 2025-12-29 LOG currItems[0]: 2025-10-06 currItems.length: 13 LOG Updated visibleWeek.current to: 2025-10-06 currentIndex: 0 LOG Calling onEndReached - reached first item (currItems[0]: 2025-10-06 ) LOG End reached - direction: start visibleWeek.current: 2025-10-06 LOG End reached - currentIndex.current: 0 LOG End reached - baseDate: 2025-08-25 new items: ["2025-07-14", "2025-07-21", "2025-07-28", "2025-08-04", "2025-08-11", "2025-08-18", "2025-08-25", "2025-09-01", "2025-09-08", "2025-09-15", "2025-09-22", "2025-09-29", "2025-10-06"] LOG End reached - scrolling to index: 12 LOG onViewableItemsChanged LOG {"viewableItems": [{"index": 0, "isViewable": true, "item": "2025-07-14", "key": "2025-07-14-0"}]} LOG onViewableItemsChanged LOG {"viewableItems": []} LOG onViewableItemsChanged LOG {"viewableItems": [{"index": 12, "isViewable": true, "item": "2025-10-06", "key": "2025-10-06-12"}]} LOG onViewableItemsChanged - newDate: 2025-10-06 visibleWeek.current: 2025-10-06 LOG currItems[0]: 2025-07-14 currItems.length: 13

Environment

react-native-calendars version: 1.22.0 react-native version: 0.73.11 Platform: Android/iOS (both affected)

Source: wix/react-native-calendars