Merge pull request #631 from RoboSats/android-webview-audio

* Bump all the things

Seems to work :)

* Remove v8

* Bump Android SDK to 33

* Update setup.md ; delete deprecated maven repos

* Enable ProGuard and add rules

* Remove v8

* Fix android sound notifications

* Sync package-lock

---------

Co-authored-by: +shyfire131 <shyfire131@shyfire131.net>

.gitignore

@@ -649,5 +649,7 @@ docs/.jekyll-cache*
 docs/_site*
 node
 
-# mobile frontend js
+# mobile frontend statics
 mobile/html/Web.bundle/js*
+mobile/html/Web.bundle/css*
+mobile/html/Web.bundle/assets*

frontend/src/components/Notifications/index.tsx

@@ -31,11 +31,15 @@ interface NotificationMessage {
   pageTitle: string;
 }
 
+const path =
+  window.NativeRobosats === undefined
+    ? '/static/assets/sounds'
+    : 'file:///android_asset/Web.bundle/assets/sounds';
 const audio = {
-  chat: new Audio(`/static/assets/sounds/chat-open.mp3`),
+  chat: new Audio(`${path}/chat-open.mp3`),
-  takerFound: new Audio(`/static/assets/sounds/taker-found.mp3`),
+  takerFound: new Audio(`${path}/taker-found.mp3`),
-  ding: new Audio(`/static/assets/sounds/locked-invoice.mp3`),
+  ding: new Audio(`${path}/locked-invoice.mp3`),
-  successful: new Audio(`/static/assets/sounds/successful.mp3`),
+  successful: new Audio(`${path}/successful.mp3`),
 };
 
 const emptyNotificationMessage: NotificationMessage = {

frontend/webpack.config.ts

@@ -154,6 +154,10 @@ const configMobile: Configuration = {
           from: path.resolve(__dirname, 'static/css'),
           to: path.resolve(__dirname, '../mobile/html/Web.bundle/css'),
         },
+        {
+          from: path.resolve(__dirname, 'static/assets/sounds'),
+          to: path.resolve(__dirname, '../mobile/html/Web.bundle/assets/sounds'),
+        },
       ],
     }),
   ],

mobile/App.tsx

@@ -176,7 +176,7 @@ const App = () => {
         allowingReadAccessToURL={uri}
         allowFileAccess={true}
         allowsBackForwardNavigationGestures={true}
-        mediaPlaybackRequiresUserAction={false}
+        mediaPlaybackRequiresUserAction={false} // Allow autoplay
         allowsLinkPreview={false}
         renderLoading={() => <Text></Text>}
         onError={(syntheticEvent) => <Text>{syntheticEvent.type}</Text>}

mobile/android/app/build.gradle

@@ -1,4 +1,5 @@
 apply plugin: "com.android.application"
+apply plugin: "com.facebook.react"
 
 import com.android.build.OutputFile
 
@@ -81,8 +82,6 @@ project.ext.react = [
     enableHermes: false,  // clean and rebuild if changing
 ]
 
-apply from: "../../node_modules/react-native/react.gradle"
-
 /**
  * Set this to true to create two separate APKs instead of one:
  *   - An APK that only works on ARM devices
@@ -96,7 +95,7 @@ def enableSeparateBuildPerCPUArchitecture = true
 /**
  * Run Proguard to shrink the Java bytecode in release builds.
  */
-def enableProguardInReleaseBuilds = false
+def enableProguardInReleaseBuilds = true
 
 /**
  * The preferred build flavor of JavaScriptCore.
@@ -129,6 +128,10 @@ def reactNativeArchitectures() {
 }
 
 android {
+    configurations {
+        all*.exclude group: 'com.facebook.fbjni', module: 'fbjni-java-only'
+    }
+
     ndkVersion rootProject.ext.ndkVersion
 
     compileSdkVersion rootProject.ext.compileSdkVersion

mobile/android/app/proguard-rules.pro

@@ -8,3 +8,8 @@
 #   http://developer.android.com/guide/developing/tools/proguard.html
 
 # Add any project specific keep options here:
+
+# Keep some of the react-native-tor classes
+-keep class com.sifir.tor.TorServiceParam { *; }
+-keep class com.sifir.tor.TcpSocksStream { *; }
+-keep class com.sifir.tor.OwnedTorService { *; }

mobile/android/app/src/main/java/com/robosats/MainApplication.java

@@ -9,13 +9,10 @@ import com.facebook.react.ReactNativeHost;
 import com.facebook.react.ReactPackage;
 import com.facebook.react.config.ReactFeatureFlags;
 import com.facebook.soloader.SoLoader;
-import com.facebook.react.bridge.JavaScriptExecutorFactory;
-import com.facebook.react.modules.systeminfo.AndroidInfoHelpers;
 import android.webkit.WebView;
 import com.robosats.newarchitecture.MainApplicationReactNativeHost;
 import java.lang.reflect.InvocationTargetException;
 import java.util.List;
-import io.csie.kudo.reactnative.v8.executor.V8ExecutorFactory;
 
 public class MainApplication extends Application implements ReactApplication {
 
@@ -39,15 +36,6 @@ public class MainApplication extends Application implements ReactApplication {
         protected String getJSMainModuleName() {
           return "index";
         }
-
-        @Override
-        protected JavaScriptExecutorFactory getJavaScriptExecutorFactory() {
-          return new V8ExecutorFactory(
-              getApplicationContext(),
-              getPackageName(),
-              AndroidInfoHelpers.getFriendlyDeviceName(),
-              getUseDeveloperSupport());
-        }
       };
 
   private final ReactNativeHost mNewArchitectureNativeHost =

mobile/android/build.gradle

@@ -4,11 +4,12 @@ import org.apache.tools.ant.taskdefs.condition.Os
 
 buildscript {
     ext {
-        buildToolsVersion = "31.0.0"
+        buildToolsVersion = "33.0.0"
         minSdkVersion = 26
-        compileSdkVersion = 31
+        compileSdkVersion = 33
-        targetSdkVersion = 31
+        targetSdkVersion = 33
-        kotlin_version = "1.7.10"
+        kotlin_version = "1.8.21"
+        kotlinVersion = "1.8.21" //for react-native-tor
 
         if (System.properties['os.arch'] == "aarch64") {
             // For M1 Users we need to use the NDK 24 which added support for aarch64
@@ -19,12 +20,20 @@ buildscript {
         }
     }
     repositories {
+        maven {
+            // Replace AAR from original RN with AAR from react-native-v8
+            url("$rootDir/../node_modules/react-native-v8/dist")
+        }
+        maven {
+            // prebuilt libv8android.so
+            url("$rootDir/../node_modules/v8-android/dist")
+         }
         google()
         mavenCentral()
     }
     dependencies {
-        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:1.7.10"
+        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
-        classpath("com.android.tools.build:gradle:7.1.1")
+        classpath('com.android.tools.build:gradle:7.3.1')
         classpath("com.facebook.react:react-native-gradle-plugin")
         classpath("de.undercouch:gradle-download-task:5.0.1")
         // NOTE: Do not place your application dependencies here; they belong
@@ -34,22 +43,21 @@ buildscript {
 
 allprojects {
     repositories {
-        maven {
-            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
-            url("$rootDir/../node_modules/react-native/android")
-        }
         maven {
             // Android JSC is installed from npm
             url("$rootDir/../node_modules/jsc-android/dist")
         }
-        mavenCentral {
+        mavenCentral()
-            // We don't want to fetch react-native from Maven Central as there are
-            // older versions over there.
-            content {
-                excludeGroup "com.facebook.react"
-            }
-        }
         google()
         maven { url 'https://www.jitpack.io' }
     }
+
+    configurations.all {
+        resolutionStrategy.eachDependency { DependencyResolveDetails details ->
+            if (details.requested.group == 'org.jetbrains.kotlin' &&
+                    details.requested.name.startsWith("kotlin-stdlib")) {
+                details.useVersion "1.8.21"
+            }
+        }
+    }
 }

mobile/android/gradle.properties

@@ -35,3 +35,4 @@ reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
 # to write custom TurboModules/Fabric components OR use libraries that
 # are providing them.
 newArchEnabled=false
+hermesEnabled=false

mobile/android/gradle/wrapper/gradle-wrapper.properties

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

mobile/android/gradlew

@@ -205,6 +205,12 @@ set -- \
         org.gradle.wrapper.GradleWrapperMain \
         "$@"
 
+# Stop when "xargs" is not available.
+if ! command -v xargs >/dev/null 2>&1
+then
+    die "xargs is not available"
+fi
+
 # Use "xargs" to parse quoted args.
 #
 # With -n1 it outputs one arg per line, with the quotes and backslashes removed.

mobile/android/gradlew.bat

@@ -40,7 +40,7 @@ if defined JAVA_HOME goto findJavaFromJavaHome
 
 set JAVA_EXE=java.exe
 %JAVA_EXE% -version >NUL 2>&1
-if "%ERRORLEVEL%" == "0" goto execute
+if %ERRORLEVEL% equ 0 goto execute
 
 echo.
 echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
@@ -75,13 +75,15 @@ set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
 
 :end
 @rem End local scope for the variables with windows NT shell
-if "%ERRORLEVEL%"=="0" goto mainEnd
+if %ERRORLEVEL% equ 0 goto mainEnd
 
 :fail
 rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
 rem the _cmd.exe /c_ return code!
-if  not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
+set EXIT_CODE=%ERRORLEVEL%
-exit /b 1
+if %EXIT_CODE% equ 0 set EXIT_CODE=1
+if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
+exit /b %EXIT_CODE%
 
 :mainEnd
 if "%OS%"=="Windows_NT" endlocal

mobile/package.json

@@ -13,21 +13,19 @@
   },
   "dependencies": {
     "@react-native-clipboard/clipboard": "^1.11.2",
-    "@react-native-community/netinfo": "^9.3.9",
+    "@react-native-community/netinfo": "^9.3.10",
-    "react": "^18.0.0",
+    "react": "18.2.0",
-    "react-native": "^0.69.6",
+    "react-native": "^0.71.8",
     "react-native-encrypted-storage": "^4.0.3",
     "react-native-tor": "^0.1.8",
-    "react-native-v8": "^1.5.0",
+    "react-native-webview": "^12.1.0"
-    "react-native-webview": "^12.1.0",
-    "v8-android-nointl": "^10.100.1"
   },
   "devDependencies": {
     "@babel/core": "^7.21.4",
     "@babel/runtime": "^7.12.5",
     "@react-native-community/eslint-config": "^3.2.0",
     "@types/jest": "^29.5.1",
-    "@types/react-native": "^0.69.0",
+    "@types/react-native": "^0.71.3",
     "@types/react-test-renderer": "^18.0.0",
     "@typescript-eslint/eslint-plugin": "^5.59.2",
     "@typescript-eslint/parser": "^5.59.6",
@@ -45,7 +43,7 @@
     "jest": "^29.5.0",
     "metro-react-native-babel-preset": "^0.75.1",
     "prettier": "^2.8.8",
-    "react-test-renderer": "18.0.0",
+    "react-test-renderer": "18.2.0",
     "typescript": "^5.0.4"
   },
   "resolutions": {

mobile/setup.md

@@ -44,7 +44,7 @@ reboot
 
 ## Create Emulator (or connect Android phone and install adb)
 
-Use the GUI of Android studio to create a new virtual devide. As of 23/06/2022 we are using a Pixel 5 as template and System image R API level 30 Android 11.0
+Use the GUI of Android studio to create a new virtual device. As of 26/03/2023 we are using a Pixel 5 as template and System image Tiramisu API level 33
 
 If using a phone, start the USB debugging mode.
 
@@ -63,18 +63,26 @@ Make sure you have the `main.js` file created on `robosats/mobile/html/Web.bundl
 npm run dev
 ```
 
-Point a terminal to `/robosats/mobile/`
+Launch your emulator if you are using one:
+
+```
+cd ~/Android/Sdk/tools && ./emulator -avd <DEVICE_NAME>
+```
+
+Point a terminal to `/robosats/mobile/` to start metro
 
 ```
 npm start
 ```
 
-on another temrinal also in `/robosats/mobile/`
+And on another terminal, also in `/robosats/mobile/`, build and install the debug app
 
 ```
 npx react-native run-android
 ```
 
+You can also use `react-native run-android --mode=release` to fully test the release builds of the app.
+
 # OSX
 
 ## Install JDK