Upgraded RN, React Navigation

haison8x · Feb 20, 2019 · 20b6cc0 · 20b6cc0
1 parent da0efe9
commit 20b6cc0
Show file tree

Hide file tree

Showing 37 changed files with 436 additions and 984 deletions.
diff --git a/android/app/build.gradle b/android/app/build.gradle
@@ -134,6 +134,7 @@ android {
 }
 
 dependencies {
+    implementation project(':react-native-gesture-handler')
     implementation fileTree(dir: "libs", include: ["*.jar"])
     implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
     implementation "com.facebook.react:react-native:+"  // From node_modules

diff --git a/android/app/src/main/java/com/nativebasekitchensink/MainApplication.java b/android/app/src/main/java/com/nativebasekitchensink/MainApplication.java
@@ -3,6 +3,7 @@
 import android.app.Application;
 
 import com.facebook.react.ReactApplication;
+import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
 import com.facebook.react.ReactNativeHost;
 import com.facebook.react.ReactPackage;
 import com.facebook.react.shell.MainReactPackage;
@@ -22,7 +23,8 @@ public boolean getUseDeveloperSupport() {
     @Override
     protected List<ReactPackage> getPackages() {
       return Arrays.<ReactPackage>asList(
-          new MainReactPackage()
+          new MainReactPackage(),
+            new RNGestureHandlerPackage()
       );
     }
 

diff --git a/android/settings.gradle b/android/settings.gradle
@@ -1,3 +1,5 @@
 rootProject.name = 'NativebaseKitchenSink'
+include ':react-native-gesture-handler'
+project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
 
 include ':app'
diff --git a/ios/NativebaseKitchenSink.xcodeproj/project.pbxproj b/ios/NativebaseKitchenSink.xcodeproj/project.pbxproj
diff --git a/package.json b/package.json
@@ -35,10 +35,11 @@
     "moment": "2.13.0",
     "native-base": "2.11.0",
     "prop-types": "^15.6.2",
-    "react": "16.5.0",
-    "react-native": "0.58.3",
-    "react-navigation": "1.5.0",
+    "react": "16.6.3",
+    "react-native": "0.58.4",
+    "react-native-gesture-handler": "^1.0.15",
+    "react-navigation": "3.3.0",
     "scheduler": "^0.12.0",
     "styled-components": "^3.4.5"
   }
-}
+}
diff --git a/src/App.js b/src/App.js
@@ -1,6 +1,7 @@
 import React from "react";
 import { Root } from "native-base";
-import { StackNavigator, DrawerNavigator } from "react-navigation";
+// import { StackNavigator, DrawerNavigator } from "react-navigation";
+import { createDrawerNavigator, createStackNavigator, createAppContainer } from "react-navigation";
 
 import Header from "./screens/Header/";
 import Header1 from "./screens/Header/1";
@@ -137,7 +138,7 @@ import Actionsheet from "./screens/actionsheet";
 import NHAccordion from "./screens/accordion/";
 import NHDatePicker from "./screens/datepicker/";
 
-const Drawer = DrawerNavigator(
+const Drawer = createDrawerNavigator(
   {
     Home: { screen: Home },
     Anatomy: { screen: Anatomy },
@@ -176,7 +177,7 @@ const Drawer = DrawerNavigator(
   }
 );
 
-const AppNavigator = StackNavigator(
+const AppNavigator = createStackNavigator(
   {
     Drawer: { screen: Drawer },
 
@@ -309,7 +310,9 @@ const AppNavigator = StackNavigator(
   }
 );
 
+const AppContainer = createAppContainer(AppNavigator);
+
 export default () =>
   <Root>
-    <AppNavigator />
+    <AppContainer />
   </Root>;
diff --git a/src/screens/Header/index.android.js b/src/screens/Header/index.android.js
@@ -78,7 +78,7 @@ class HeaderNB extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/Header/index.ios.js b/src/screens/Header/index.ios.js
@@ -70,7 +70,7 @@ class HeaderNB extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/accordion/index.js b/src/screens/accordion/index.js
@@ -45,7 +45,7 @@ class NHAccordion extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/actionsheet/index.android.js b/src/screens/actionsheet/index.android.js
@@ -33,7 +33,7 @@ class NHPicker extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/actionsheet/index.ios.js b/src/screens/actionsheet/index.ios.js
@@ -28,7 +28,7 @@ export default class ActionSheetNB extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="ios-menu" />
             </Button>

diff --git a/src/screens/anatomy/index.js b/src/screens/anatomy/index.js
@@ -24,7 +24,7 @@ class Anatomy extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="ios-menu" />
             </Button>

diff --git a/src/screens/badge/index.js b/src/screens/badge/index.js
@@ -22,7 +22,7 @@ class NHBadge extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/button/index.js b/src/screens/button/index.js
@@ -62,7 +62,7 @@ class NHButton extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/card/index.js b/src/screens/card/index.js
@@ -62,7 +62,7 @@ class NHCard extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/checkbox/index.js b/src/screens/checkbox/index.js
@@ -52,7 +52,7 @@ class NHCheckbox extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/datepicker/index.js b/src/screens/datepicker/index.js
@@ -31,7 +31,7 @@ class NHDatePicker extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="ios-menu" />
             </Button>

diff --git a/src/screens/deckswiper/index.js b/src/screens/deckswiper/index.js
@@ -33,7 +33,7 @@ class NHDeckSwiper extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/fab/index.js b/src/screens/fab/index.js
@@ -34,7 +34,7 @@ class NHFab extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/footer/index.js b/src/screens/footer/index.js
@@ -42,7 +42,7 @@ class NHFooter extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/form/index.js b/src/screens/form/index.js
@@ -82,7 +82,7 @@ class NHForm extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/home/index.js b/src/screens/home/index.js
@@ -31,7 +31,7 @@ class Home extends Component {
           <View style={{ marginBottom: 80 }}>
             <Button
               style={{ backgroundColor: "#6FAF98", alignSelf: "center" }}
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Text>Lets Go!</Text>
             </Button>

diff --git a/src/screens/icon/index.js b/src/screens/icon/index.js
@@ -42,7 +42,7 @@ class NHIcon extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/layout/index.js b/src/screens/layout/index.js
@@ -45,7 +45,7 @@ class NHLayout extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/list/index.js b/src/screens/list/index.js
@@ -62,7 +62,7 @@ class NHList extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/listSwipe/index.js b/src/screens/listSwipe/index.js
@@ -38,7 +38,7 @@ class ListSwipe extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/picker/index.android.js b/src/screens/picker/index.android.js
@@ -40,7 +40,7 @@ class NHPicker extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/picker/index.ios.js b/src/screens/picker/index.ios.js
@@ -62,7 +62,7 @@ class NHPicker extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/radio/index.js b/src/screens/radio/index.js
@@ -34,7 +34,7 @@ class NHRadio extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/searchbar/index.js b/src/screens/searchbar/index.js
@@ -29,7 +29,7 @@ class NHSearchbar extends Component {
         <Content padder>
           <Button
             block
-            onPress={() => this.props.navigation.navigate("DrawerOpen")}
+            onPress={() => this.props.navigation.openDrawer()}
           >
             <Text>Back</Text>
           </Button>

diff --git a/src/screens/segment/index.js b/src/screens/segment/index.js
@@ -38,7 +38,7 @@ class NBSegment extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/spinner/index.js b/src/screens/spinner/index.js
@@ -25,7 +25,7 @@ class NHSpinner extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/tab/index.js b/src/screens/tab/index.js
@@ -67,7 +67,7 @@ class NHTab extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/thumbnail/index.js b/src/screens/thumbnail/index.js
@@ -26,7 +26,7 @@ class NHThumbnail extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/toast/index.js b/src/screens/toast/index.js
@@ -50,7 +50,7 @@ class NHToast extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>

diff --git a/src/screens/typography/index.js b/src/screens/typography/index.js
@@ -24,7 +24,7 @@ class NHTypography extends Component {
           <Left>
             <Button
               transparent
-              onPress={() => this.props.navigation.navigate("DrawerOpen")}
+              onPress={() => this.props.navigation.openDrawer()}
             >
               <Icon name="menu" />
             </Button>