fix: replace deprecated I18nManager.isRTL with 18nManager.getConstant…

…s().isRTL (#10547) Co-authored-by: m.gharouni <mohammadgharouni77@gmail.com>
react-navigation · Aug 7, 2022 · 50b88d4 · 50b88d4
1 parent 10e5d2b
commit 50b88d4
Show file tree

Hide file tree

Showing 9 changed files with 21 additions and 19 deletions.
diff --git a/example/src/index.tsx b/example/src/index.tsx
@@ -357,9 +357,11 @@ export default function App() {
                       <SafeAreaView edges={['right', 'bottom', 'left']}>
                         <SettingsItem
                           label="Right to left"
-                          value={I18nManager.isRTL}
+                          value={I18nManager.getConstants().isRTL}
                           onValueChange={() => {
-                            I18nManager.forceRTL(!I18nManager.isRTL);
+                            I18nManager.forceRTL(
+                              !I18nManager.getConstants().isRTL
+                            );
                             restartApp();
                           }}
                         />

diff --git a/packages/drawer/src/views/DrawerContentScrollView.tsx b/packages/drawer/src/views/DrawerContentScrollView.tsx
@@ -20,7 +20,7 @@ function DrawerContentScrollView(
   const drawerPosition = React.useContext(DrawerPositionContext);
   const insets = useSafeAreaInsets();
 
-  const isRight = I18nManager.isRTL
+  const isRight = I18nManager.getConstants().isRTL
     ? drawerPosition === 'left'
     : drawerPosition === 'right';
 

diff --git a/packages/drawer/src/views/DrawerView.tsx b/packages/drawer/src/views/DrawerView.tsx
@@ -101,7 +101,7 @@ function DrawerViewBase({
   const focusedRouteKey = state.routes[state.index].key;
   const {
     drawerHideStatusBarOnOpen = false,
-    drawerPosition = I18nManager.isRTL ? 'right' : 'left',
+    drawerPosition = I18nManager.getConstants().isRTL ? 'right' : 'left',
     drawerStatusBarAnimation = 'slide',
     drawerStyle,
     drawerType = Platform.select({ ios: 'slide', default: 'front' }),

diff --git a/packages/drawer/src/views/legacy/Drawer.tsx b/packages/drawer/src/views/legacy/Drawer.tsx
@@ -502,7 +502,7 @@ export default class DrawerView extends React.Component<DrawerProps> {
 
     const drawerTranslateX =
       drawerType === 'back'
-        ? I18nManager.isRTL
+        ? I18nManager.getConstants().isRTL
           ? multiply(
               sub(this.containerWidth, this.drawerWidth),
               isRight ? 1 : -1
@@ -513,7 +513,7 @@ export default class DrawerView extends React.Component<DrawerProps> {
     const offset =
       drawerType === 'back'
         ? 0
-        : I18nManager.isRTL
+        : I18nManager.getConstants().isRTL
         ? '100%'
         : multiply(this.drawerWidth, -1);
 

diff --git a/packages/drawer/src/views/modern/Drawer.tsx b/packages/drawer/src/views/modern/Drawer.tsx
@@ -273,10 +273,10 @@ export default function Drawer({
                   // The drawer stays in place when `drawerType` is `back`
                   (drawerType === 'back' ? 0 : translateX.value) +
                   (drawerPosition === 'left'
-                    ? I18nManager.isRTL
+                    ? I18nManager.getConstants().isRTL
                       ? -distanceFromEdge
                       : 0
-                    : I18nManager.isRTL
+                    : I18nManager.getConstants().isRTL
                     ? 0
                     : distanceFromEdge),
               },

diff --git a/packages/elements/src/Header/HeaderBackButton.tsx b/packages/elements/src/Header/HeaderBackButton.tsx
@@ -204,14 +204,14 @@ const styles = StyleSheet.create({
       marginRight: 22,
       marginVertical: 12,
       resizeMode: 'contain',
-      transform: [{ scaleX: I18nManager.isRTL ? -1 : 1 }],
+      transform: [{ scaleX: I18nManager.getConstants().isRTL ? -1 : 1 }],
     },
     default: {
       height: 24,
       width: 24,
       margin: 3,
       resizeMode: 'contain',
-      transform: [{ scaleX: I18nManager.isRTL ? -1 : 1 }],
+      transform: [{ scaleX: I18nManager.getConstants().isRTL ? -1 : 1 }],
     },
   }),
   iconWithLabel:
@@ -236,6 +236,6 @@ const styles = StyleSheet.create({
     marginVertical: 12,
     alignSelf: 'center',
     resizeMode: 'contain',
-    transform: [{ scaleX: I18nManager.isRTL ? -1 : 1 }],
+    transform: [{ scaleX: I18nManager.getConstants().isRTL ? -1 : 1 }],
   },
 });
diff --git a/packages/native-stack/src/views/HeaderConfig.tsx b/packages/native-stack/src/views/HeaderConfig.tsx
@@ -174,7 +174,7 @@ export default function HeaderConfig({
         backTitleFontSize={headerBackTitleStyleFlattened.fontSize}
         blurEffect={headerBlurEffect}
         color={tintColor}
-        direction={I18nManager.isRTL ? 'rtl' : 'ltr'}
+        direction={I18nManager.getConstants().isRTL ? 'rtl' : 'ltr'}
         disableBackButtonMenu={headerBackButtonMenuEnabled === false}
         hidden={headerShown === false}
         hideBackButton={headerBackVisible === false}

diff --git a/packages/stack/src/TransitionConfigs/HeaderStyleInterpolators.tsx b/packages/stack/src/TransitionConfigs/HeaderStyleInterpolators.tsx
@@ -61,7 +61,7 @@ export function forUIKit({
         {
           translateX: progress.interpolate({
             inputRange: [0, 1, 2],
-            outputRange: I18nManager.isRTL
+            outputRange: I18nManager.getConstants().isRTL
               ? [-rightOffset, 0, leftLabelOffset]
               : [leftLabelOffset, 0, -rightOffset],
           }),
@@ -83,7 +83,7 @@ export function forUIKit({
         {
           translateX: progress.interpolate({
             inputRange: [0.5, 1, 2],
-            outputRange: I18nManager.isRTL
+            outputRange: I18nManager.getConstants().isRTL
               ? [-titleLeftOffset, 0, rightOffset]
               : [rightOffset, 0, -titleLeftOffset],
           }),
@@ -95,7 +95,7 @@ export function forUIKit({
         {
           translateX: progress.interpolate({
             inputRange: [0, 1, 2],
-            outputRange: I18nManager.isRTL
+            outputRange: I18nManager.getConstants().isRTL
               ? [-layouts.screen.width, 0, layouts.screen.width]
               : [layouts.screen.width, 0, -layouts.screen.width],
           }),
@@ -170,7 +170,7 @@ export function forSlideLeft({
 
   const translateX = progress.interpolate({
     inputRange: [0, 1, 2],
-    outputRange: I18nManager.isRTL
+    outputRange: I18nManager.getConstants().isRTL
       ? [-screen.width, 0, screen.width]
       : [screen.width, 0, -screen.width],
   });
@@ -210,7 +210,7 @@ export function forSlideRight({
 
   const translateX = progress.interpolate({
     inputRange: [0, 1, 2],
-    outputRange: I18nManager.isRTL
+    outputRange: I18nManager.getConstants().isRTL
       ? [screen.width, 0, -screen.width]
       : [-screen.width, 0, screen.width],
   });

diff --git a/packages/stack/src/utils/getInvertedMultiplier.tsx b/packages/stack/src/utils/getInvertedMultiplier.tsx
@@ -11,8 +11,8 @@ export default function getInvertedMultiplier(
     case 'vertical-inverted':
       return -1;
     case 'horizontal':
-      return I18nManager.isRTL ? -1 : 1;
+      return I18nManager.getConstants().isRTL ? -1 : 1;
     case 'horizontal-inverted':
-      return I18nManager.isRTL ? 1 : -1;
+      return I18nManager.getConstants().isRTL ? 1 : -1;
   }
 }