Skip to content

Commit 65a07f9

Browse files
okwasniewskiokwasniewski
committed
chore: upgrade example to RN 0.72
1 parent 8c23dee commit 65a07f9

34 files changed

+5991
-4476
lines changed

‎.eslintrc.js

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
module.exports = {
2-
extends: '@react-native-community',
2+
root: true,
3+
extends: '@react-native',
34
env: {
4-
es6: true
5-
}
6-
}
5+
es6: true,
6+
},
7+
};

‎example/index.js

+51-58
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,7 @@
1-
import React from 'react';
1+
import React, {useEffect} from 'react';
22
import {AppRegistry, StyleSheet, Text, View, Button} from 'react-native';
3-
import {
4-
createStackNavigator,
5-
createAppContainer,
6-
NavigationEvents,
7-
} from 'react-navigation';
3+
import {NavigationContainer} from '@react-navigation/native';
4+
import {createNativeStackNavigator} from '@react-navigation/native-stack';
85
import ReactNativeBrownfield from '@callstack/react-native-brownfield';
96

107
const getRandomTheme = () => {
@@ -19,54 +16,58 @@ const getRandomTheme = () => {
1916
};
2017
};
2118

22-
class HomeScreen extends React.Component {
23-
static navigationOptions = {
24-
header: null,
25-
};
19+
function HomeScreen({navigation}) {
20+
const colors = navigation.params?.theme || getRandomTheme();
21+
22+
useEffect(() => {
23+
const unsubscribe = navigation.addListener('focus', (e) => {
24+
const isFirstRoute = !navigation.canGoBack();
25+
ReactNativeBrownfield.setNativeBackGestureAndButtonEnabled(isFirstRoute);
26+
});
27+
return unsubscribe;
28+
}, []);
2629

27-
render() {
28-
const colors = this.props.navigation.getParam('theme', getRandomTheme());
29-
const isFirstRoute = this.props.navigation.isFirstRouteInParent();
30+
return (
31+
<View style={[styles.container, {backgroundColor: colors.primary}]}>
32+
<Text style={[styles.text, {color: colors.secondary}]}>
33+
React Native Screen
34+
</Text>
3035

31-
return (
32-
<>
33-
<NavigationEvents
34-
onWillFocus={() => {
35-
ReactNativeBrownfield.setNativeBackGestureAndButtonEnabled(
36-
isFirstRoute,
37-
);
38-
}}
39-
/>
40-
<View style={[styles.container, {backgroundColor: colors.primary}]}>
41-
<Text style={[styles.text, {color: colors.secondary}]}>
42-
React Native Screen
43-
</Text>
36+
<Button
37+
onPress={() => {
38+
navigation.push('Home', {
39+
theme: getRandomTheme(),
40+
});
41+
}}
42+
color={colors.secondary}
43+
title="Push next screen"
44+
/>
45+
46+
<Button
47+
onPress={() => {
48+
if (navigation.canGoBack()) {
49+
navigation.goBack();
50+
} else {
51+
ReactNativeBrownfield.popToNative(true);
52+
}
53+
}}
54+
color={colors.secondary}
55+
title="Go back"
56+
/>
57+
</View>
58+
);
59+
}
4460

45-
<Button
46-
onPress={() => {
47-
this.props.navigation.push('Home', {
48-
theme: getRandomTheme(),
49-
});
50-
}}
51-
color={colors.secondary}
52-
title="Push next screen"
53-
/>
61+
const Stack = createNativeStackNavigator();
5462

55-
<Button
56-
onPress={() => {
57-
if (isFirstRoute) {
58-
ReactNativeBrownfield.popToNative(true);
59-
} else {
60-
this.props.navigation.goBack();
61-
}
62-
}}
63-
color={colors.secondary}
64-
title="Go back"
65-
/>
66-
</View>
67-
</>
68-
);
69-
}
63+
function App() {
64+
return (
65+
<NavigationContainer>
66+
<Stack.Navigator>
67+
<Stack.Screen name="Home" component={HomeScreen} />
68+
</Stack.Navigator>
69+
</NavigationContainer>
70+
);
7071
}
7172

7273
const styles = StyleSheet.create({
@@ -82,12 +83,4 @@ const styles = StyleSheet.create({
8283
},
8384
});
8485

85-
const AppNavigator = createStackNavigator({
86-
Home: {
87-
screen: HomeScreen,
88-
},
89-
});
90-
91-
const App = createAppContainer(AppNavigator);
92-
9386
AppRegistry.registerComponent('ReactNative', () => App);

‎example/java/app/build.gradle

+17-13
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
1-
apply plugin: 'com.android.application'
1+
apply plugin: "com.android.application"
2+
apply plugin: "com.facebook.react"
3+
4+
react {
5+
root = file("../../..")
6+
entryFile = file("example/index.js")
7+
}
28

3-
project.ext.react = [
4-
entryFile: "example/index.js",
5-
root: "../../.."
6-
]
79

8-
apply from: "../../../node_modules/react-native/react.gradle"
10+
def jscFlavor = 'org.webkit:android-jsc:+'
911

1012
android {
13+
ndkVersion rootProject.ext.ndkVersion
1114
compileSdkVersion rootProject.ext.compileSdkVersion
1215

1316
compileOptions {
@@ -32,18 +35,19 @@ android {
3235
}
3336

3437
dependencies {
38+
// The version of react-native is set by the React Native Gradle Plugin
39+
implementation("com.facebook.react:react-android")
3540
implementation fileTree(dir: 'libs', include: ['*.jar'])
36-
implementation "com.facebook.react:react-native:+"
3741
implementation 'androidx.legacy:legacy-support-v4:1.0.0'
3842
implementation 'androidx.appcompat:appcompat:1.1.0-beta01'
3943
implementation 'androidx.constraintlayout:constraintlayout:2.0.0-beta2'
40-
implementation 'org.webkit:android-jsc:+'
41-
}
4244

43-
task copyDownloadableDepsToLibs(type: Copy) {
44-
from configurations.compile
45-
into 'libs'
45+
if (hermesEnabled.toBoolean()) {
46+
implementation("com.facebook.react:hermes-android")
47+
} else {
48+
implementation jscFlavor
49+
}
4650
}
4751

4852
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
49-
applyNativeModulesAppBuildGradle(project, "../..")
53+
applyNativeModulesAppBuildGradle(project)

‎example/java/app/src/main/AndroidManifest.xml

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
android:supportsRtl="true"
1515
android:theme="@style/AppTheme">
1616
<activity android:name=".ReactNativeFragmentActivity"/>
17-
<activity android:name=".MainActivity">
17+
<activity android:name=".MainActivity" android:exported="true">
1818
<intent-filter>
1919
<action android:name="android.intent.action.MAIN"/>
2020

‎example/java/app/src/main/java/com/callstack/nativeexample/MainActivity.java

-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ public class MainActivity extends AppCompatActivity {
1111
protected void onCreate(Bundle savedInstanceState) {
1212
super.onCreate(savedInstanceState);
1313
setContentView(R.layout.activity_main);
14-
getSupportActionBar().hide();
1514
}
1615

1716
public void startReactNative(View view) {

‎example/java/app/src/main/java/com/callstack/nativeexample/ReactNativeFragmentActivity.java

-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ public void invokeDefaultOnBackPressed() {
1818
@Override
1919
public void onCreate(@Nullable Bundle savedInstanceState) {
2020
super.onCreate(savedInstanceState);
21-
getSupportActionBar().hide();
2221
setContentView(R.layout.activity_react_native_fragment);
2322

2423
if (savedInstanceState == null) {

‎example/java/app/src/main/res/values/styles.xml

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<resources>
22

33
<!-- Base application theme. -->
4-
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
4+
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
55
<!-- Customize your theme here. -->
66
<item name="colorPrimary">@color/colorPrimary</item>
77
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>

‎example/java/build.gradle

+10-22
Original file line numberDiff line numberDiff line change
@@ -2,37 +2,25 @@
22

33
buildscript {
44
ext {
5-
buildToolsVersion = "28.0.3"
5+
buildToolsVersion = "33.0.0"
66
minSdkVersion = 21
7-
compileSdkVersion = 28
8-
targetSdkVersion = 28
7+
compileSdkVersion = 33
8+
targetSdkVersion = 33
99
supportLibVersion = "28.0.0"
10-
kotlinVersion = '1.3.31'
10+
kotlinVersion = '1.9.10'
11+
12+
// We use NDK 23 which has both M1 support and is the side-by-side NDK version from AGP.
13+
ndkVersion = "23.1.7779620"
1114
}
1215
repositories {
1316
google()
1417
jcenter()
18+
mavenCentral()
1519
}
1620
dependencies {
17-
classpath 'com.android.tools.build:gradle:3.4.1'
21+
classpath "com.android.tools.build:gradle"
1822
classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlinVersion"
19-
}
20-
}
21-
22-
allprojects {
23-
repositories {
24-
mavenLocal()
25-
maven {
26-
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
27-
url("$rootDir/../../node_modules/react-native/android")
28-
}
29-
maven {
30-
// Android JSC is installed from npm
31-
url("$rootDir/../../node_modules/jsc-android/dist")
32-
}
33-
34-
google()
35-
jcenter()
23+
classpath "com.facebook.react:react-native-gradle-plugin"
3624
}
3725
}
3826

‎example/java/gradle.properties

+16
Original file line numberDiff line numberDiff line change
@@ -15,3 +15,19 @@ org.gradle.jvmargs=-Xmx1536m
1515
kotlin.code.style=official
1616
android.useAndroidX=true
1717
android.enableJetifier=true
18+
19+
# Use this property to specify which architecture you want to build.
20+
# You can also override it from the CLI using
21+
# ./gradlew <task> -PreactNativeArchitectures=x86_64
22+
reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
23+
24+
# Use this property to enable support to the new architecture.
25+
# This will allow you to use TurboModules and the Fabric render in
26+
# your application. You should enable this flag either if you want
27+
# to write custom TurboModules/Fabric components OR use libraries that
28+
# are providing them.
29+
newArchEnabled=false
30+
31+
# Use this property to enable or disable the Hermes JS engine.
32+
# If set to false, you will be using JSC instead.
33+
hermesEnabled=true

‎example/java/gradle/wrapper/gradle-wrapper.properties

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
distributionBase=GRADLE_USER_HOME
22
distributionPath=wrapper/dists
3-
distributionUrl=https\://services.gradle.org/distributions/gradle-5.4.1-all.zip
3+
distributionUrl=https\://services.gradle.org/distributions/gradle-7.5-bin.zip
44
zipStoreBase=GRADLE_USER_HOME
55
zipStorePath=wrapper/dists

‎example/java/settings.gradle

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
1+
apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
22
applyNativeModulesSettingsGradle(settings, "../..")
3-
4-
include ':app'
3+
include ':app'
4+
includeBuild('../../node_modules/@react-native/gradle-plugin')

‎example/kotlin/app/build.gradle

+16-9
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
apply plugin: 'com.android.application'
2+
apply plugin: 'com.facebook.react'
23

34
apply plugin: 'kotlin-android'
45

5-
apply plugin: 'kotlin-android-extensions'
6-
7-
project.ext.react = [
8-
entryFile: "example/index.js",
9-
root: "../../.."
10-
]
6+
react {
7+
root = file("../../..")
8+
entryFile = file("example/index.js")
9+
}
1110

12-
apply from: "../../../node_modules/react-native/react.gradle"
11+
def jscFlavor = 'org.webkit:android-jsc:+'
1312

1413
android {
14+
ndkVersion rootProject.ext.ndkVersion
1515
compileSdkVersion rootProject.ext.compileSdkVersion
1616

1717
sourceSets {
@@ -35,14 +35,21 @@ android {
3535
}
3636

3737
dependencies {
38+
// The version of react-native is set by the React Native Gradle Plugin
39+
implementation("com.facebook.react:react-android")
3840
implementation fileTree(dir: 'libs', include: ['*.jar'])
3941
implementation "com.facebook.react:react-native:+"
4042
implementation"org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlinVersion"
4143
implementation 'androidx.legacy:legacy-support-v4:1.0.0'
4244
implementation 'androidx.appcompat:appcompat:1.1.0-beta01'
4345
implementation 'androidx.constraintlayout:constraintlayout:2.0.0-beta2'
44-
implementation 'org.webkit:android-jsc:+'
46+
47+
if (hermesEnabled.toBoolean()) {
48+
implementation("com.facebook.react:hermes-android")
49+
} else {
50+
implementation jscFlavor
51+
}
4552
}
4653

4754
apply from: file("../../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
48-
applyNativeModulesAppBuildGradle(project, "../..")
55+
applyNativeModulesAppBuildGradle(project)

‎example/kotlin/app/src/main/AndroidManifest.xml

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
android:roundIcon="@mipmap/ic_launcher_round"
1515
android:supportsRtl="true"
1616
android:theme="@style/AppTheme">
17-
<activity android:name=".MainActivity">
17+
<activity android:name=".MainActivity" android:exported="true">
1818
<intent-filter>
1919
<action android:name="android.intent.action.MAIN"/>
2020
<category android:name="android.intent.category.LAUNCHER"/>

‎example/kotlin/app/src/main/java/com/callstack/kotlinexample/MainActivity.kt

-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ class MainActivity : AppCompatActivity() {
1111
override fun onCreate(savedInstanceState: Bundle?) {
1212
super.onCreate(savedInstanceState)
1313
setContentView(R.layout.activity_main)
14-
supportActionBar!!.hide()
1514
}
1615

1716
fun startReactNative(view: View) {

‎example/kotlin/app/src/main/java/com/callstack/kotlinexample/ReacNativeFragmentActivity.kt

-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ class ReactNativeFragmentActivity : AppCompatActivity(), DefaultHardwareBackBtnH
1414

1515
public override fun onCreate(savedInstanceState: Bundle?) {
1616
super.onCreate(savedInstanceState)
17-
supportActionBar!!.hide()
1817
setContentView(R.layout.activity_react_native_fragment)
1918

2019
if (savedInstanceState == null) {

‎example/kotlin/app/src/main/res/values/styles.xml

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<resources>
22

33
<!-- Base application theme. -->
4-
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
4+
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
55
<!-- Customize your theme here. -->
66
<item name="colorPrimary">@color/colorPrimary</item>
77
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>

0 commit comments

Comments
 (0)