RN upgrade: Fixing Android app

ReactNativeClient/android/app/build.gradle

@@ -65,6 +65,11 @@ import com.android.build.OutputFile
  * ]
  */
 
+project.ext.react = [
+    entryFile: "index.android.js",
+    enableHermes: false,  // clean and rebuild if changing
+]
+
 apply from: "../../node_modules/react-native/react.gradle"
 
 /**
@@ -82,6 +87,27 @@ def enableSeparateBuildPerCPUArchitecture = false
  */
 def enableProguardInReleaseBuilds = false
 
+/**
+ * The preferred build flavor of JavaScriptCore.
+ *
+ * For example, to use the international variant, you can use:
+ * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
+ *
+ * The international variant includes ICU i18n library and necessary data
+ * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
+ * give correct results when using with locales other than en-US.  Note that
+ * this variant is about 6MiB larger per architecture than default.
+ */
+def jscFlavor = 'org.webkit:android-jsc:+'
+/**
+ * Whether to enable the Hermes VM.
+ *
+ * This should be set on project.ext.react and mirrored here.  If it is not set
+ * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode
+ * and the benefits of using Hermes will therefore be sharply reduced.
+ */
+def enableHermes = project.ext.react.get("enableHermes", false);
+
 android {
     compileSdkVersion rootProject.ext.compileSdkVersion
 
@@ -110,6 +136,12 @@ android {
 		}
 	}
 	signingConfigs {
+		debug {
+            storeFile file('debug.keystore')
+            storePassword 'android'
+            keyAlias 'androiddebugkey'
+            keyPassword 'android'
+        }
 		release {
 			if (project.hasProperty('JOPLIN_RELEASE_STORE_FILE')) {
 				storeFile file(JOPLIN_RELEASE_STORE_FILE)
@@ -120,18 +152,23 @@ android {
 		}
 	}
 	buildTypes {
+		debug {
+            signingConfig signingConfigs.debug
+        }
 		release {
+			// Caution! In production, you need to generate your own keystore file.
+            // see https://facebook.github.io/react-native/docs/signed-apk-android.
+			signingConfig signingConfigs.release
 			minifyEnabled enableProguardInReleaseBuilds
 			proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
-			signingConfig signingConfigs.release
 		}
 	}
 	// applicationVariants are e.g. debug, release
 	applicationVariants.all { variant ->
 		variant.outputs.each { output ->
 			// For each separate APK per architecture, set a unique version code as described here:
-			// http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
-			def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]
+			// https://developer.android.com/studio/build/configure-apk-splits.html
+            def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
 			def abi = output.getFilter(OutputFile.ABI)
 			if (abi != null) {  // null for the universal-debug, universal-release variants
 				output.versionCodeOverride =
@@ -140,9 +177,13 @@ android {
 		}
 	}
 	packagingOptions {
-		pickFirst '**/libjsc.so'
-		pickFirst '**/libc++_shared.so'
-	}
+        pickFirst '**/armeabi-v7a/libc++_shared.so'
+        pickFirst '**/x86/libc++_shared.so'
+        pickFirst '**/arm64-v8a/libc++_shared.so'
+        pickFirst '**/x86_64/libc++_shared.so'
+        pickFirst '**/x86/libjsc.so'
+        pickFirst '**/armeabi-v7a/libjsc.so'
+    }
 }
 
 dependencies {
@@ -168,6 +209,15 @@ dependencies {
     implementation fileTree(dir: "libs", include: ["*.jar"])
     implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
     implementation "com.facebook.react:react-native:+"  // From node_modules
+
+    if (enableHermes) {
+		def hermesPath = "../../node_modules/hermesvm/android/";
+		debugImplementation files(hermesPath + "hermes-debug.aar")
+		releaseImplementation files(hermesPath + "hermes-release.aar")
+    } else {
+		implementation jscFlavor
+    }
+
 	implementation project(':react-native-sqlite-storage')
 	implementation project(':rn-fetch-blob')
 	implementation project(':react-native-document-picker')
@@ -206,4 +256,5 @@ task copyDownloadableDepsToLibs(type: Copy) {
 	into 'libs'
 }
 
+apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
 apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

ReactNativeClient/android/app/src/main/java/net/cozic/joplin/MainApplication.java

@@ -31,30 +31,11 @@ protected List<ReactPackage> getPackages() {
 
 			// Was added in RN 60.x:
 			//
-			// @SuppressWarnings("UnnecessaryLocalVariable")
-			// List<ReactPackage> packages = new PackageList(this).getPackages();
-			// // Packages that cannot be autolinked yet can be added manually here, for example:
-			// // packages.add(new MyReactNativePackage());
-			// return packages;
-
-			return Arrays.<ReactPackage>asList(
-				new MainReactPackage(),
-				new ReactSliderPackage(),
-				new RNCWebViewPackage(),
-				new ReactNativePushNotificationPackage(),
-				new ImageResizerPackage(),
-				new RNFileViewerPackage(),
-				new RNSecureRandomPackage(),
-				new ImagePickerPackage(),
-				new ReactNativeDocumentPicker(),
-				new RNFetchBlobPackage(),
-				new RNFSPackage(),
-				new SQLitePluginPackage(),
-				new VectorIconsPackage(),
-				// new SharePackage(),
-				new RNCameraPackage(),
-				new RNVersionInfoPackage()
-			);
+			@SuppressWarnings("UnnecessaryLocalVariable")
+			List<ReactPackage> packages = new PackageList(this).getPackages();
+			// Packages that cannot be autolinked yet can be added manually here, for example:
+			// packages.add(new MyReactNativePackage());
+			return packages;
 		}
 	};
 

ReactNativeClient/lib/components/SafeAreaView.js

@@ -1,11 +1,31 @@
 const React = require('react');
-import { Platform, SafeAreaView } from 'react-native';
+import { View, Platform, SafeAreaView, StyleSheet, StatusBar } from 'react-native';
+import DeviceInfo from 'react-native-device-info';
+
+// Untested! This should check if the device has a notch and, if it does, apply
+// an extra padding on top of the screen.
+const styles = StyleSheet.create({
+	AndroidSafeArea: {
+		paddingTop: Platform.OS === 'android' && DeviceInfo.hasNotch() ? StatusBar.currentHeight : 0,
+	},
+});
 
 function JoplinSafeAreaView(props) {
 	if (Platform.OS === 'ios') {
 		return <SafeAreaView {...props}>{props.children}</SafeAreaView>;
 	} else {
-		throw new Error('Not done');
+		const viewProps = Object.assign({}, props);
+
+		const style = [];
+
+		if (viewProps.style) {
+			style.push(viewProps.style);
+			delete viewProps.style;
+		}
+
+		style.push(styles.AndroidSafeArea);
+
+		return <View style={style} {...viewProps}>{props.children}</View>;
 	}
 }
 

ReactNativeClient/package.json

@@ -51,6 +51,7 @@
     "react-native-action-button": "^2.6.9",
     "react-native-camera": "^2.10.2",
     "react-native-datepicker": "^1.6.0",
+    "react-native-device-info": "^5.5.1",
     "react-native-dialogbox": "^0.6.10",
     "react-native-document-picker": "^2.3.0",
     "react-native-dropdownalert": "^3.1.2",
@@ -65,7 +66,7 @@
     "react-native-push-notification": "git+https://github.com/laurent22/react-native-push-notification.git",
     "react-native-securerandom": "^1.0.0-rc.0",
     "react-native-side-menu": "^1.1.3",
-    "react-native-sqlite-storage": "^3.3.11",
+    "react-native-sqlite-storage": "^4.1.0",
     "react-native-vector-icons": "^6.6.0",
     "react-native-version-info": "^0.5.1",
     "react-native-webview": "^5.12.0",