RTL breaks the scrolling in the WeekCalendar component

[InkAndSteel]

Description

Our App supports Arabic. To do that, we use ReactNatives RTL feature. When RTL is activated, selecting a date in a week that is different from the week of the selected date, causes the FlatList to scroll in the opposite direction. The responsible code is here:

// node_modules/react-native-calendars/src/expandableCalendar/WeekCalendar/new.js
useEffect(() => {
if (updateSource !== UpdateSources.WEEK_SCROLL) {
const pageIndex = items.findIndex(item => sameWeek(item, date, firstDay));
// @ts-expect-error
list.current?.scrollToOffset?.(pageIndex * containerWidth, 0, false);
}
}, [date]);

If I remove this, everything works as expected.

Expected Behavior

When I select a date in the week calendar, the WeekCalendar component should not scroll at all (because the date I selected is already in View).

Observed Behavior

The Week calendar scrolls in the opposite direction.

Environment

Please run these commands in the project folder and fill in their results:

• npm ls react-native-calendars:
• [email protected]
• npm ls react-native
• ├─┬ @expo/[email protected]
  │ └── [email protected] deduped
  ├─┬ @miblanchard/[email protected]
  │ └── [email protected] deduped
  ├─┬ @react-native-async-storage/[email protected]
  │ └── [email protected] deduped
  ├─┬ @react-native-community/[email protected]
  │ └── [email protected] deduped
  ├─┬ @react-native-masked-view/[email protected]
  │ └── [email protected] deduped
  ├─┬ @react-navigation/[email protected]
  │ └── [email protected] deduped
  ├─┬ @react-navigation/[email protected]
  │ └── [email protected] deduped
  ├─┬ @react-navigation/[email protected]
  │ └── [email protected] deduped
  ├─┬ @react-navigation/[email protected]
  │ └── [email protected] deduped
  ├─┬ @react-navigation/[email protected]
  │ └── [email protected] deduped
  ├─┬ @sharcoux/[email protected]
  │ └── [email protected] deduped
  ├─┬ @testing-library/[email protected]
  │ └── [email protected] deduped
  ├─┬ @testing-library/[email protected]
  │ └── [email protected] deduped
  ├─┬ @types/[email protected]
  │ ├─┬ [email protected]
  │ │ └── [email protected] deduped
  │ └─┬ [email protected]
  │ └─┬ @react-native/[email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ ├─┬ [email protected]
  │ │ └── [email protected] deduped
  │ └─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ ├─┬ [email protected]
  │ │ └── [email protected] deduped
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected] invalid: "^6.2.1||^7.0.3" from node_modules/react-native-svg-charts
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └─┬ @react-native/[email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  ├─┬ [email protected]
  │ └── [email protected] deduped
  └─┬ [email protected]
  └── [email protected] deduped

Also specify:

I am on Android, physical device

Screen_Recording_20240815_171921_Nia.Dev.mp4