Android 14

.eslintrc

@@ -12,7 +12,7 @@
     "plugin:react-hooks/recommended",
     "plugin:react/recommended",
     "plugin:@typescript-eslint/recommended",
-    "@react-native-community",
+    "@react-native",
     "plugin:prettier/recommended" // removes all eslint rules that can mess up with prettier
   ],
   "rules": {

App.js

@@ -115,7 +115,7 @@ const App = () => {
 
   useEffect(() => {
     return () => {
-      Linking.removeEventListener('url', handleOpenURL);
+      Linking.removeEventListener?.('url', handleOpenURL);
       AppState.removeEventListener('change', handleAppStateChange);
       eventEmitter?.removeAllListeners('onNotificationReceived');
       eventEmitter?.removeAllListeners('openSettings');

BlueComponents.js

@@ -433,7 +433,7 @@ export const BlueListItem = React.memo(props => {
 
   return (
     <ListItem
-      containerStyle={props.containerStyle ?? { backgroundColor: 'transparent', borderBottomColor: '#113759' }}
+      containerStyle={props.containerStyle ?? { backgroundColor: 'transparent', borderColor: '#113759' }}
       Component={props.Component ?? TouchableOpacity}
       bottomDivider={props.bottomDivider !== undefined ? props.bottomDivider : true}
       topDivider={props.topDivider !== undefined ? props.topDivider : false}

Gemfile

@@ -1,6 +1,9 @@
 source 'https://rubygems.org'
 
 # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
-File.read(File.join(__dir__, '.ruby-version')).strip
+ruby ">= 2.6.10"
 
-gem 'cocoapods', '~> 1.11', '>= 1.11.3'
+# Cocoapods 1.15 introduced a bug which break the build. We will remove the upper
+# bound in the template on Cocoapods with next React Native release.
+gem 'cocoapods', '>= 1.13', '< 1.15'
+gem 'activesupport', '>= 6.1.7.3', '< 7.1.0'

Navigation.js

@@ -1,5 +1,5 @@
 import React, { useContext } from 'react';
-import { createNativeStackNavigator } from 'react-native-screens/native-stack';
+import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { useTheme } from '@react-navigation/native';
 
 import Settings from './screen/settings/settings';
@@ -102,7 +102,7 @@ const WalletsRoot = () => {
   const theme = useTheme();
 
   return (
-    <WalletsStack.Navigator screenOptions={{ headerHideShadow: true }}>
+    <WalletsStack.Navigator screenOptions={{ headerShadowVisible: false }}>
       <WalletsStack.Screen name="WalletTransactions" component={WalletHome} options={WalletHome.navigationOptions(theme)} />
       <WalletsStack.Screen name="WalletAsset" component={Asset} options={Asset.navigationOptions(theme)} />
       <WalletsStack.Screen name="AddLightning" component={AddLightning} options={AddLightning.navigationOptions(theme)} />
@@ -192,7 +192,7 @@ const BackupSeedStack = createNativeStackNavigator();
 const BackupSeedRoot = () => {
   const theme = useTheme();
   return (
-    <BackupSeedStack.Navigator screenOptions={{ headerHideShadow: true }}>
+    <BackupSeedStack.Navigator screenOptions={{ headerShadowVisible: false }}>
       <BackupSeedStack.Screen name="BackupExplanation" component={BackupExplanation} options={BackupExplanation.navigationOptions(theme)} />
       <BackupSeedStack.Screen name="PleaseBackup" component={PleaseBackup} options={PleaseBackup.navigationOptions(theme)} />
     </BackupSeedStack.Navigator>
@@ -204,7 +204,7 @@ const AddWalletRoot = () => {
   const theme = useTheme();
 
   return (
-    <AddWalletStack.Navigator screenOptions={{ headerHideShadow: true }}>
+    <AddWalletStack.Navigator screenOptions={{ headerShadowVisible: false }}>
       <AddWalletStack.Screen name="AddWallet" component={AddWallet} options={AddWallet.navigationOptions(theme)} />
       <AddWalletStack.Screen name="ImportWallet" component={ImportWallet} options={ImportWallet.navigationOptions(theme)} />
       <AddWalletStack.Screen
@@ -241,7 +241,7 @@ const SendDetailsRoot = () => {
   const theme = useTheme();
 
   return (
-    <SendDetailsStack.Navigator screenOptions={{ headerHideShadow: true }}>
+    <SendDetailsStack.Navigator screenOptions={{ headerShadowVisible: false }}>
       <SendDetailsStack.Screen name="SendDetails" component={SendDetails} options={SendDetails.navigationOptions(theme)} />
       <SendDetailsStack.Screen name="Confirm" component={Confirm} options={Confirm.navigationOptions(theme)} />
       <SendDetailsStack.Screen
@@ -278,7 +278,7 @@ const LDKOpenChannelRoot = () => {
   const theme = useTheme();
 
   return (
-    <LDKOpenChannelStack.Navigator name="LDKOpenChannelRoot" screenOptions={{ headerHideShadow: true }} initialRouteName="SelectWallet">
+    <LDKOpenChannelStack.Navigator name="LDKOpenChannelRoot" screenOptions={{ headerShadowVisible: false }} initialRouteName="SelectWallet">
       <LDKOpenChannelStack.Screen name="SelectWallet" component={SelectWallet} options={SelectWallet.navigationOptions(theme)} />
       <LDKOpenChannelStack.Screen
         name="LDKOpenChannelSetAmount"
@@ -295,7 +295,7 @@ const AztecoRedeemRoot = () => {
   const theme = useTheme();
 
   return (
-    <AztecoRedeemStack.Navigator screenOptions={{ headerHideShadow: true }}>
+    <AztecoRedeemStack.Navigator screenOptions={{ headerShadowVisible: false }}>
       <AztecoRedeemStack.Screen name="AztecoRedeem" component={AztecoRedeem} options={AztecoRedeem.navigationOptions(theme)} />
       <AztecoRedeemStack.Screen name="SelectWallet" component={SelectWallet} />
     </AztecoRedeemStack.Navigator>
@@ -304,7 +304,7 @@ const AztecoRedeemRoot = () => {
 
 const ScanQRCodeStack = createNativeStackNavigator();
 const ScanQRCodeRoot = () => (
-  <ScanQRCodeStack.Navigator screenOptions={{ headerShown: false, stackPresentation: isDesktop ? 'containedModal' : 'fullScreenModal' }}>
+  <ScanQRCodeStack.Navigator screenOptions={{ headerShown: false, presentation: isDesktop ? 'containedModal' : 'fullScreenModal' }}>
     <ScanQRCodeStack.Screen name="ScanQRCode" component={ScanQRCode} />
   </ScanQRCodeStack.Navigator>
 );
@@ -321,7 +321,7 @@ const ReorderWalletsStackRoot = () => {
   const theme = useTheme();
 
   return (
-    <ReorderWalletsStack.Navigator name="ReorderWalletsRoot" screenOptions={{ headerHideShadow: true }}>
+    <ReorderWalletsStack.Navigator name="ReorderWalletsRoot" screenOptions={{ headerShadowVisible: false }}>
       <ReorderWalletsStack.Screen name="ReorderWallets" component={ReorderWallets} options={ReorderWallets.navigationOptions(theme)} />
     </ReorderWalletsStack.Navigator>
   );
@@ -332,7 +332,7 @@ const ReceiveDetailsStackRoot = () => {
   const theme = useTheme();
 
   return (
-    <ReceiveDetailsStack.Navigator name="ReceiveDetailsRoot" screenOptions={{ headerHideShadow: true }} initialRouteName="ReceiveDetails">
+    <ReceiveDetailsStack.Navigator name="ReceiveDetailsRoot" screenOptions={{ headerShadowVisible: false }} initialRouteName="ReceiveDetails">
       <ReceiveDetailsStack.Screen name="ReceiveDetails" component={ReceiveDetails} options={ReceiveDetails.navigationOptions(theme)} />
       <ReceiveDetailsStack.Screen
         name="LNDCreateInvoice"
@@ -365,7 +365,7 @@ const WalletXpubStackRoot = () => {
   const theme = useTheme();
 
   return (
-    <WalletXpubStack.Navigator name="WalletXpubRoot" screenOptions={{ headerHideShadow: true }} initialRouteName="WalletXpub">
+    <WalletXpubStack.Navigator name="WalletXpubRoot" screenOptions={{ headerShadowVisible: false }} initialRouteName="WalletXpub">
       <WalletXpubStack.Screen name="WalletXpub" component={WalletXpub} options={WalletXpub.navigationOptions(theme)} />
     </WalletXpubStack.Navigator>
   );
@@ -376,7 +376,7 @@ const SignVerifyStackRoot = () => {
   const theme = useTheme();
 
   return (
-    <SignVerifyStack.Navigator name="SignVerifyRoot" screenOptions={{ headerHideShadow: true }} initialRouteName="SignVerify">
+    <SignVerifyStack.Navigator name="SignVerifyRoot" screenOptions={{ headerShadowVisible: false }} initialRouteName="SignVerify">
       <SignVerifyStack.Screen name="SignVerify" component={SignVerify} options={SignVerify.navigationOptions(theme)} />
     </SignVerifyStack.Navigator>
   );
@@ -387,7 +387,7 @@ const WalletExportStackRoot = () => {
   const theme = useTheme();
 
   return (
-    <WalletExportStack.Navigator name="WalletExportRoot" screenOptions={{ headerHideShadow: true }} initialRouteName="WalletExport">
+    <WalletExportStack.Navigator name="WalletExportRoot" screenOptions={{ headerShadowVisible: false }} initialRouteName="WalletExport">
       <WalletExportStack.Screen name="WalletExport" component={WalletExport} options={WalletExport.navigationOptions(theme)} />
     </WalletExportStack.Navigator>
   );
@@ -398,7 +398,7 @@ const LappBrowserStackRoot = () => {
   const theme = useTheme();
 
   return (
-    <LappBrowserStack.Navigator name="LappBrowserRoot" screenOptions={{ headerHideShadow: true }} initialRouteName="LappBrowser">
+    <LappBrowserStack.Navigator name="LappBrowserRoot" screenOptions={{ headerShadowVisible: false }} initialRouteName="LappBrowser">
       <LappBrowserStack.Screen name="LappBrowser" component={LappBrowser} options={LappBrowser.navigationOptions(theme)} />
     </LappBrowserStack.Navigator>
   );
@@ -411,7 +411,7 @@ const InitRoot = () => (
     <InitStack.Screen
       name="ReorderWallets"
       component={ReorderWalletsStackRoot}
-      options={{ headerShown: false, gestureEnabled: false, stackPresentation: isDesktop ? 'containedModal' : 'modal' }}
+      options={{ headerShown: false, gestureEnabled: false, presentation: isDesktop ? 'containedModal' : 'modal' }}
     />
     <InitStack.Screen name="Navigation" component={Navigation} options={{ headerShown: false, replaceAnimation: 'push' }} />
   </InitStack.Navigator>
@@ -425,7 +425,7 @@ const ViewEditMultisigCosignersRoot = () => {
     <ViewEditMultisigCosignersStack.Navigator
       name="ViewEditMultisigCosignersRoot"
       initialRouteName="ViewEditMultisigCosigners"
-      screenOptions={{ headerHideShadow: true }}
+      screenOptions={{ headerShadowVisible: false }}
     >
       <ViewEditMultisigCosignersStack.Screen
         name="ViewEditMultisigCosigners"
@@ -444,7 +444,7 @@ const ExportMultisigCoordinationSetupRoot = () => {
     <ExportMultisigCoordinationSetupStack.Navigator
       name="ExportMultisigCoordinationSetupRoot"
       initialRouteName="ExportMultisigCoordinationSetup"
-      screenOptions={{ headerHideShadow: true }}
+      screenOptions={{ headerShadowVisible: false }}
     >
       <ExportMultisigCoordinationSetupStack.Screen
         name="ExportMultisigCoordinationSetup"
@@ -460,7 +460,7 @@ const DeeplinkStackRoot = () => {
   const theme = useTheme();
 
   return (
-    <DeeplinkStack.Navigator name="Deeplink" screenOptions={{ headerHideShadow: true }} initialRouteName="Sell">
+    <DeeplinkStack.Navigator name="Deeplink" screenOptions={{ headerShadowVisible: false }} initialRouteName="Sell">
       <DeeplinkStack.Screen name="Sell" component={Sell} options={Sell.navigationOptions(theme)} />
       <DeeplinkStack.Screen name="Confirm" component={Confirm} options={Confirm.navigationOptions(theme)} />
       <DeeplinkStack.Screen name="CreateTransaction" component={SendCreate} options={SendCreate.navigationOptions(theme)} />
@@ -481,7 +481,7 @@ const DeeplinkStackRoot = () => {
 const PaymentCodeStack = createNativeStackNavigator();
 const PaymentCodeStackRoot = () => {
   return (
-    <PaymentCodeStack.Navigator name="PaymentCodeRoot" screenOptions={{ headerHideShadow: true }} initialRouteName="PaymentCode">
+    <PaymentCodeStack.Navigator name="PaymentCodeRoot" screenOptions={{ headerShadowVisible: false }} initialRouteName="PaymentCode">
       <PaymentCodeStack.Screen name="PaymentCode" component={PaymentCode} options={{ headerTitle: loc.bip47.payment_code }} />
       <PaymentCodeStack.Screen
         name="PaymentCodesList"
@@ -493,13 +493,13 @@ const PaymentCodeStackRoot = () => {
 };
 
 const RootStack = createNativeStackNavigator();
-const NavigationDefaultOptions = { headerShown: false, stackPresentation: isDesktop ? 'containedModal' : 'modal' };
+const NavigationDefaultOptions = { headerShown: false, presentation: isDesktop ? 'containedModal' : 'modal' };
 const Navigation = () => {
   const { wallets } = useContext(BlueStorageContext);
   return (
     <RootStack.Navigator
       initialRouteName={wallets.length === 0 ? 'AddWalletRoot' : 'WalletsRoot'}
-      screenOptions={{ headerHideShadow: true }}
+      screenOptions={{ headerShadowVisible: false }}
     >
       {/* stacks */}
       <RootStack.Screen name="WalletsRoot" component={WalletsRoot} options={{ headerShown: false, translucent: false }} />
@@ -527,7 +527,7 @@ const Navigation = () => {
         component={ScanQRCodeRoot}
         options={{
           headerShown: false,
-          stackPresentation: isDesktop ? 'containedModal' : 'fullScreenModal',
+          presentation: isDesktop ? 'containedModal' : 'fullScreenModal',
         }}
       />
 

android/app/build.gradle

@@ -8,8 +8,6 @@ project.ext.envConfigFiles = [
 ]
 apply from: project(':react-native-config').projectDir.getPath() + "/dotenv.gradle"
 
-import com.android.build.OutputFile
-
 /**
  * This is the configuration block to customize your React Native Android app.
  * By default you don't need to apply any configuration, just uncomment the lines you need.
@@ -20,8 +18,8 @@ react {
     // root = file("../")
     //   The folder where the react-native NPM package is. Default is ../node_modules/react-native
     // reactNativeDir = file("../node_modules/react-native")
-    //   The folder where the react-native Codegen package is. Default is ../node_modules/react-native-codegen
-    // codegenDir = file("../node_modules/react-native-codegen")
+    //   The folder where the react-native Codegen package is. Default is ../node_modules/@react-native/codegen
+    // codegenDir = file("../node_modules/@react-native/codegen")
     //   The cli.js file which is the React Native CLI entrypoint. Default is ../node_modules/react-native/cli.js
     // cliFile = file("../node_modules/react-native/cli.js")
 
@@ -59,13 +57,6 @@ react {
     // hermesFlags = ["-O", "-output-source-map"]
 }
 
-/**
- * Set this to true to create four separate APKs instead of one,
- * one for each native architecture. This is useful if you don't
- * use App Bundles (https://developer.android.com/guide/app-bundle/)
- * and want to have separate APKs to upload to the Play Store.
- */
-def enableSeparateBuildPerCPUArchitecture = false
 
 /**
  * Set this to true to Run Proguard on Release builds to minify the Java bytecode.
@@ -85,15 +76,6 @@ def enableProguardInReleaseBuilds = false
  */
 def jscFlavor = 'org.webkit:android-jsc-intl:+'
 
-/**
- * Private function to get the list of Native Architectures you want to build.
- * This reads the value from reactNativeArchitectures in your gradle.properties
- * file and works together with the --active-arch-only flag of react-native run-android.
- */
-def reactNativeArchitectures() {
-    def value = project.getProperties().get("reactNativeArchitectures")
-    return value ? value.split(",") : ["armeabi-v7a", "x86", "x86_64", "arm64-v8a"]
-}
 
 android {
     ndkVersion rootProject.ext.ndkVersion
@@ -124,14 +106,6 @@ android {
         }
     }
 
-    splits {
-        abi {
-            reset()
-            enable enableSeparateBuildPerCPUArchitecture
-            universalApk false  // If true, also generate a universal APK
-            include (*reactNativeArchitectures())
-        }
-    }
     buildTypes {
         release {
             minifyEnabled enableProguardInReleaseBuilds
@@ -140,29 +114,12 @@ android {
             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:
-            // https://developer.android.com/studio/build/configure-apk-splits.html
-            // Example: versionCode 1 will generate 1001 for armeabi-v7a, 1002 for x86, etc.
-            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 =
-                        defaultConfig.versionCode * 1000 + versionCodes.get(abi)
-            }
-
-        }
-    }
 }
 
 dependencies {
     // The version of react-native is set by the React Native Gradle Plugin
     implementation("com.facebook.react:react-android")
     implementation files("../../node_modules/rn-ldk/android/libs/LDK-release.aar")
-    implementation("androidx.swiperefreshlayout:swiperefreshlayout:1.0.0")
     implementation files("../../node_modules/react-native-tor/android/libs/sifir_android.aar")
 
     if (hermesEnabled.toBoolean()) {

android/app/src/main/java/com/defichain/app/dfx/bitcoin/MainActivity.java

@@ -42,9 +42,6 @@ protected ReactActivityDelegate createReactActivityDelegate() {
 	        this,
 	        getMainComponentName(),
 	        // If you opted-in for the New Architecture, we enable the Fabric Renderer.
-	        DefaultNewArchitectureEntryPoint.getFabricEnabled(), // fabricEnabled
-	        // If you opted-in for the New Architecture, we enable Concurrent React (i.e. React 18).
-	        DefaultNewArchitectureEntryPoint.getConcurrentReactEnabled() // concurrentRootEnabled
-	        );
+	        DefaultNewArchitectureEntryPoint.getFabricEnabled());
 	  }
 }

android/build.gradle

@@ -4,9 +4,9 @@ buildscript {
     ext {
         minSdkVersion = 28
         supportLibVersion = "28.0.0"
-        buildToolsVersion = "30.0.3"
-        compileSdkVersion = 33
-        targetSdkVersion = 33
+        buildToolsVersion = "34.0.0"
+        compileSdkVersion = 34
+        targetSdkVersion = 34
         googlePlayServicesVersion = "16.+"
         googlePlayServicesIidVersion = "16.0.1"
         firebaseVersion = "17.3.4"
@@ -23,7 +23,7 @@ buildscript {
         mavenCentral()
     }
     dependencies {
-        classpath("com.android.tools.build:gradle:7.4.2")
+        classpath("com.android.tools.build:gradle")
         classpath 'com.google.gms:google-services:4.3.14'  // Google Services plugin
     	classpath("com.facebook.react:react-native-gradle-plugin")
         classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version")
@@ -78,8 +78,8 @@ subprojects {
     afterEvaluate {project ->
         if (project.hasProperty("android")) {
             android {
-                buildToolsVersion '30.0.3'
-                compileSdkVersion 31
+                buildToolsVersion '34.0.0'
+                compileSdkVersion 34
                  defaultConfig {
                     minSdkVersion 28
                 }

android/gradle.properties

@@ -24,6 +24,8 @@ android.useAndroidX=true
 # Automatically convert third-party libraries to use AndroidX
 android.enableJetifier=true
 
+FLIPPER_VERSION=0.182.0
+
 # Use this property to specify which architecture you want to build.
 # You can also override it from the CLI using
 # ./gradlew <task> -PreactNativeArchitectures=x86_64

android/gradle/wrapper/gradle-wrapper.properties

@@ -3,4 +3,5 @@ distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.6.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.0.1-all.zip
+networkTimeout=10000