refactor: upgrade react-native-tab-view

packages/tabs/package.json

@@ -43,7 +43,7 @@
     "react-lifecycles-compat": "^1.0.2",
     "react-native-paper": "^1.2.4",
     "react-native-safe-area-view": "^0.7.0",
-    "react-native-tab-view": "^0.0.74"
+    "react-native-tab-view": "~0.0.75"
   },
   "devDependencies": {
     "@expo/vector-icons": "^6.2.0",

packages/tabs/src/navigators/createBottomTabNavigator.js

@@ -70,8 +70,8 @@ class TabNavigationView extends React.PureComponent<Props, State> {
     return (
       <TabBarComponent
         {...tabBarOptions}
+        jumpTo={this._jumpTo}
         navigation={navigation}
-        jumpToIndex={onIndexChange}
         screenProps={screenProps}
         onTabPress={onTabPress}
         getLabelText={getLabelText}
@@ -80,6 +80,14 @@ class TabNavigationView extends React.PureComponent<Props, State> {
     );
   };
 
+  _jumpTo = (key: string) => {
+    const { navigation, onIndexChange } = this.props;
+
+    const index = navigation.state.routes.findIndex(route => route.key === key);
+
+    onIndexChange(index);
+  };
+
   render() {
     const { navigation, renderScene } = this.props;
     const { routes } = navigation.state;

packages/tabs/src/views/TabBarBottom.js

@@ -30,7 +30,7 @@ export type TabBarOptions = {
 type Props = TabBarOptions & {
   navigation: any,
   descriptors: any,
-  jumpToIndex: any,
+  jumpTo: any,
   onTabPress: any,
   getLabelText: ({ route: any }) => any,
   renderIcon: any,
@@ -170,7 +170,7 @@ class TabBarBottom extends React.Component<Props> {
       activeBackgroundColor,
       inactiveBackgroundColor,
       onTabPress,
-      jumpToIndex,
+      jumpTo,
       style,
       tabStyle,
     } = this.props;
@@ -202,7 +202,7 @@ class TabBarBottom extends React.Component<Props> {
             <TouchableWithoutFeedback
               key={route.key}
               onPress={() => {
-                jumpToIndex(index);
+                jumpTo(route.key);
                 onTabPress({ route });
               }}
             >

packages/tabs/src/views/TabBarTop.js

@@ -29,7 +29,7 @@ type Props = TabBarOptions & {
   }) => React.Node,
   getLabelText: (props: { route: any }) => any,
   useNativeDriver?: boolean,
-  jumpToIndex: (index: number) => any,
+  jumpTo: (key: string) => any,
 };
 
 export default class TabBarTop extends React.PureComponent<Props> {

packages/tabs/yarn.lock

@@ -4231,6 +4231,12 @@ react-native-tab-view@^0.0.74:
   dependencies:
     prop-types "^15.6.0"
 
+react-native-tab-view@^0.0.75:
+  version "0.0.75"
+  resolved "https://registry.yarnpkg.com/react-native-tab-view/-/react-native-tab-view-0.0.75.tgz#d71c24645ae1ce84a08152e212912f131906d0a4"
+  dependencies:
+    prop-types "^15.6.0"
+
 react-native-vector-icons@4.4.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/react-native-vector-icons/-/react-native-vector-icons-4.4.2.tgz#090f42ee0396c4cc4eae0ddaa518028ba8df40c7"