chore: upgrade react-native in example to 0.63 (#210)

* chore: update example to 63

* fix ios, flow, lint

* bump flow version

* fix flow

Co-authored-by: Piotr Trocki <piotr.trocki@callstack.com>

Author: troZee

.flowconfig

@@ -81,4 +81,4 @@ untyped-import
 untyped-type-import
 
 [version]
-^0.113.0
+0.122.0

example/ViewPagerExample.js

@@ -82,13 +82,13 @@ export default class ViewPagerExample extends React.Component<*, State> {
   };
 
   addPage = () => {
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
       pages: [...prevState.pages, createPage(prevState.pages.length)],
     }));
   };
 
   removeLastPage = () => {
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
       pages: prevState.pages.slice(0, prevState.pages.length - 1),
     }));
   };
@@ -118,7 +118,7 @@ export default class ViewPagerExample extends React.Component<*, State> {
   }
 
   toggleDotsVisibility = () => {
-    this.setState(prevState => ({dotsVisible: !prevState.dotsVisible}));
+    this.setState((prevState) => ({dotsVisible: !prevState.dotsVisible}));
   };
 
   render() {
@@ -139,7 +139,7 @@ export default class ViewPagerExample extends React.Component<*, State> {
           transitionStyle="scroll"
           showPageIndicator={dotsVisible}
           ref={this.viewPager}>
-          {pages.map(p => this.renderPage(p))}
+          {pages.map((p) => this.renderPage(p))}
         </ViewPager>
         <View style={styles.buttons}>
           <Button

example/android/app/build.gradle

@@ -18,7 +18,7 @@ import com.android.build.OutputFile
  *   // the entry file for bundle generation
  *   entryFile: "index.android.js",
  *
- *   // https://facebook.github.io/react-native/docs/performance#enable-the-ram-format
+ *    // https://reactnative.dev/docs/performance#enable-the-ram-format
  *   bundleCommand: "ram-bundle",
  *
  *   // whether to bundle JS and assets in debug mode
@@ -76,7 +76,7 @@ import com.android.build.OutputFile
  */
 
 project.ext.react = [
-    enableHermes: true,  // clean and rebuild if changing
+        enableHermes: true,  // clean and rebuild if changing
 ]
 
 apply from: "../../../node_modules/react-native/react.gradle"
@@ -161,12 +161,12 @@ android {
             proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
         }
     }
-        packagingOptions {
-            pickFirst "lib/armeabi-v7a/libc++_shared.so"
-            pickFirst "lib/arm64-v8a/libc++_shared.so"
-            pickFirst "lib/x86/libc++_shared.so"
-            pickFirst "lib/x86_64/libc++_shared.so"
-        }
+    packagingOptions {
+        pickFirst "lib/armeabi-v7a/libc++_shared.so"
+        pickFirst "lib/arm64-v8a/libc++_shared.so"
+        pickFirst "lib/x86/libc++_shared.so"
+        pickFirst "lib/x86_64/libc++_shared.so"
+    }
 
     // applicationVariants are e.g. debug, release
     applicationVariants.all { variant ->
@@ -193,13 +193,14 @@ dependencies {
     implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
 
     debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
-      exclude group:'com.facebook.fbjni'
+        exclude group: 'com.facebook.fbjni'
     }
     debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
-        exclude group:'com.facebook.flipper'
+        exclude group: 'com.facebook.flipper'
+        exclude group: 'com.squareup.okhttp3', module: 'okhttp'
     }
     debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {
-        exclude group:'com.facebook.flipper'
+        exclude group: 'com.facebook.flipper'
     }
 
     if (enableHermes) {

example/android/build.gradle

@@ -2,10 +2,10 @@
 
 buildscript {
     ext {
-        buildToolsVersion = "28.0.3"
+        buildToolsVersion = "29.0.2"
         minSdkVersion = 16
-        compileSdkVersion = 28
-        targetSdkVersion = 28
+        compileSdkVersion = 29
+        targetSdkVersion = 29
         appCompatVersion = "1.0.2"
     }
     repositories {
@@ -14,7 +14,7 @@ buildscript {
         maven { url 'https://jitpack.io' }
     }
     dependencies {
-        classpath("com.android.tools.build:gradle:3.5.2")
+        classpath("com.android.tools.build:gradle:3.5.3")
 
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files

example/android/gradle.properties

@@ -25,4 +25,4 @@ android.useAndroidX=true
 android.enableJetifier=true
 
 # Version of flipper SDK to use with React Native
-FLIPPER_VERSION=0.33.1
+FLIPPER_VERSION=0.37.0

example/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,5 +1,5 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-6.0.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.2-all.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

example/android/gradlew

@@ -1,74 +1,29 @@
-platform :ios, '9.0'
 require_relative '../../node_modules/@react-native-community/cli-platform-ios/native_modules'
+require_relative 'RNPod'
 
-def add_flipper_pods!
-  version = '~> 0.33.1'
-  pod 'FlipperKit', version, :configuration => 'Debug'
-  pod 'FlipperKit/FlipperKitLayoutPlugin', version, :configuration => 'Debug'
-  pod 'FlipperKit/SKIOSNetworkPlugin', version, :configuration => 'Debug'
-  pod 'FlipperKit/FlipperKitUserDefaultsPlugin', version, :configuration => 'Debug'
-  pod 'FlipperKit/FlipperKitReactPlugin', version, :configuration => 'Debug'
-end
-# Post Install processing for Flipper
-def flipper_post_install(installer)
-  installer.pods_project.targets.each do |target|
-    if target.name == 'YogaKit'
-      target.build_configurations.each do |config|
-        config.build_settings['SWIFT_VERSION'] = '4.1'
-      end
-    end
-  end
-end
+platform :ios, '10.0'
 
 target 'ViewPagerExample' do
-  # Pods for ViewPagerExample
-  pod 'FBLazyVector', :path => "../../node_modules/react-native/Libraries/FBLazyVector"
-  pod 'FBReactNativeSpec', :path => "../../node_modules/react-native/Libraries/FBReactNativeSpec"
-  pod 'RCTRequired', :path => "../../node_modules/react-native/Libraries/RCTRequired"
-  pod 'RCTTypeSafety', :path => "../../node_modules/react-native/Libraries/TypeSafety"
-  pod 'React', :path => '../../node_modules/react-native/'
-  pod 'React-Core', :path => '../../node_modules/react-native/'
-  pod 'React-CoreModules', :path => '../../node_modules/react-native/React/CoreModules'
-  pod 'React-Core/DevSupport', :path => '../../node_modules/react-native/'
-  pod 'React-RCTActionSheet', :path => '../../node_modules/react-native/Libraries/ActionSheetIOS'
-  pod 'React-RCTAnimation', :path => '../../node_modules/react-native/Libraries/NativeAnimation'
-  pod 'React-RCTBlob', :path => '../../node_modules/react-native/Libraries/Blob'
-  pod 'React-RCTImage', :path => '../../node_modules/react-native/Libraries/Image'
-  pod 'React-RCTLinking', :path => '../../node_modules/react-native/Libraries/LinkingIOS'
-  pod 'React-RCTNetwork', :path => '../../node_modules/react-native/Libraries/Network'
-  pod 'React-RCTSettings', :path => '../../node_modules/react-native/Libraries/Settings'
-  pod 'React-RCTText', :path => '../../node_modules/react-native/Libraries/Text'
-  pod 'React-RCTVibration', :path => '../../node_modules/react-native/Libraries/Vibration'
-  pod 'React-Core/RCTWebSocket', :path => '../../node_modules/react-native/'
 
-  pod 'React-cxxreact', :path => '../../node_modules/react-native/ReactCommon/cxxreact'
-  pod 'React-jsi', :path => '../../node_modules/react-native/ReactCommon/jsi'
-  pod 'React-jsiexecutor', :path => '../../node_modules/react-native/ReactCommon/jsiexecutor'
-  pod 'React-jsinspector', :path => '../../node_modules/react-native/ReactCommon/jsinspector'
-  pod 'ReactCommon/callinvoker', :path => "../../node_modules/react-native/ReactCommon"
-  pod 'Yoga', :path => '../../node_modules/react-native/ReactCommon/yoga', :modular_headers => true
-
-  pod 'DoubleConversion', :podspec => '../../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
-  pod 'glog', :podspec => '../../node_modules/react-native/third-party-podspecs/glog.podspec'
-  pod 'Folly', :podspec => '../../node_modules/react-native/third-party-podspecs/Folly.podspec'
+  config = use_native_modules!
 
+  use_react_native!(:path => config["reactNativePath"])
   pod 'react-native-viewpager', :path => '../../react-native-viewpager.podspec'
 
   target 'ViewPagerExampleTests' do
     inherit! :complete
     # Pods for testing
   end
 
-  use_native_modules!
-
   # Enables Flipper.
   #
   # Note that if you have use_frameworks! enabled, Flipper will not work and
   # you should disable these next few lines.
-  add_flipper_pods!
+  use_flipper!
   post_install do |installer|
     flipper_post_install(installer)
   end
+
 end
 
 target 'ViewPagerExample-tvOS' do