refactor: simplify RTL handling in tab controller components (#3456)

* refactor: simplify RTL handling in tab controller components

* Move to FIX_RTL const

---------

Co-authored-by: M-i-k-e-l <[email protected]>

Author: adids1221

src/components/tabController/PageCarousel.tsx

@@ -10,7 +10,7 @@ import Reanimated, {
 } from 'react-native-reanimated';
 import {Constants} from '../../commons/new';
 
-const FIX_RTL = Constants.isRTL && Constants.isAndroid;
+const FIX_RTL = Constants.isRTL;
 
 /**
  * @description: TabController's Page Carousel

src/components/tabController/TabBar.tsx

@@ -18,7 +18,6 @@ import {FaderProps} from '../fader';
 import useScrollToItem from './useScrollToItem';
 import {useDidUpdate} from 'hooks';
 
-const FIX_RTL = Constants.isRTL && Constants.isAndroid;
 const DEFAULT_HEIGHT = 48;
 
 const DEFAULT_LABEL_STYLE = {
@@ -187,7 +186,7 @@ const TabBar = (props: Props) => {
     // @ts-expect-error TODO: typing bug
     scrollViewRef: tabBar,
     itemsCount,
-    selectedIndex: FIX_RTL ? itemsCount - currentPage.value - 1 : currentPage.value,
+    selectedIndex: currentPage.value,
     containerWidth,
     offsetType: centerSelected ? useScrollToItem.offsetType.CENTER : useScrollToItem.offsetType.DYNAMIC
   });

src/components/tabController/useScrollToItem.ts

@@ -3,6 +3,9 @@ import {useState, useCallback, useEffect, useRef, RefObject} from 'react';
 import {LayoutChangeEvent} from 'react-native';
 import {useSharedValue} from 'react-native-reanimated';
 import {useScrollTo, ScrollToSupportedViews, ScrollToResultProps} from 'hooks';
+import {Constants} from '../../commons/new';
+
+const FIX_RTL = Constants.isRTL && Constants.isIOS;
 
 export enum OffsetType {
   CENTER = 'CENTER',
@@ -177,12 +180,13 @@ const useScrollToItem = <T extends ScrollToSupportedViews>(props: ScrollToItemPr
 
   const focusIndex = useCallback((index: number, animated = true) => {
     if (index >= 0 && offsets.CENTER.length > index) {
+      const rtlIndex = FIX_RTL ? itemsCount - index - 1 : index;
       if (offsetType !== OffsetType.DYNAMIC) {
-        scrollTo(offsets[offsetType][index], animated);
+        scrollTo(offsets[offsetType][rtlIndex], animated);
       } else {
         const movingLeft = index < currentIndex.current;
-        currentIndex.current = index;
-        scrollTo(movingLeft ? offsets[OffsetType.RIGHT][index] : offsets[OffsetType.LEFT][index], animated);
+        currentIndex.current = rtlIndex;
+        scrollTo(movingLeft ? offsets[OffsetType.RIGHT][rtlIndex] : offsets[OffsetType.LEFT][rtlIndex], animated);
       }
     }
   },