Infinite loader & indexing error in Tabs when layout is RTL

[hachem-benamor]

Description

I'm having an issue where i can get an infinite loader when the tabs are set to lazy and the app is RTL. If I remove the RTL it works correctly with the lazy prop.

EDIT: i'm using custom TabBar and I think that the issue is related to indexing misscalcul when RTL is activated.

Related to

• Components
• Demo
• Docs
• Typingsents

Expected behavior

Loader shouldn't be infinite, it must respect the initial lazyLoadTime.

Actual behavior

Infinite loader occuring when RTL is on, even when I change the Tab it works but it's pointing on a wrong tab index.

More Info

Code snippet

Custom TabBar:

<TabBar
        currentTabIndex={currentTabIndex}
        onPress={nextTabIndex => {
          setTabIndex(nextTabIndex);
        }}
        items={items}
        tabBarStyle={tabBarStyle}
      />

TabPage:

  <TabController.TabPage
              key={index}
              index={index}
              lazy
              renderLoading={() => <Loader fullScreenLoader />}>

Environment

• React Native version: 0.75.4
• React Native UI Lib version: 7.34.6

Affected platforms

• Android
• iOS
• Web