From fac0fd5f32f45f901cde24ac9501c128f5bb17bf Mon Sep 17 00:00:00 2001
From: Leendert de Borst <ldeborst@xivisoft.com>
Date: Thu, 29 May 2025 16:05:42 +0200
Subject: [PATCH] Add android edge-to-edge module to fix menu bar height issues
 (#846)

---
 apps/mobile-app/android/app/build.gradle      |  7 ---
 .../app/src/main/res/values-night/styles.xml  |  2 +-
 .../app/src/main/res/values/styles.xml        |  2 +-
 apps/mobile-app/app.json                      | 11 +++-
 apps/mobile-app/app/_layout.tsx               |  2 -
 apps/mobile-app/ios/Podfile.lock              | 56 +++++++++++++++----
 apps/mobile-app/package-lock.json             | 24 ++++++--
 apps/mobile-app/package.json                  | 11 ++--
 8 files changed, 80 insertions(+), 35 deletions(-)

diff --git a/apps/mobile-app/android/app/build.gradle b/apps/mobile-app/android/app/build.gradle
index 4631c281a..7f2987933 100644
--- a/apps/mobile-app/android/app/build.gradle
+++ b/apps/mobile-app/android/app/build.gradle
@@ -238,13 +238,6 @@ task lintCheck {
     dependsOn 'detekt'
 }
 
-// Fix for expo-dev-menu lint model generation
-afterEvaluate {
-    tasks.withType(com.android.build.gradle.internal.lint.LintModelWriterTask).configureEach {
-        dependsOn(':expo-dev-menu:copyAssets')
-    }
-}
-
 // Add a task dependency to make ktlint run before build
 tasks.named("preBuild") {
     dependsOn("ktlintCheck")
diff --git a/apps/mobile-app/android/app/src/main/res/values-night/styles.xml b/apps/mobile-app/android/app/src/main/res/values-night/styles.xml
index 3058fc690..2e9da3ae7 100644
--- a/apps/mobile-app/android/app/src/main/res/values-night/styles.xml
+++ b/apps/mobile-app/android/app/src/main/res/values-night/styles.xml
@@ -1,5 +1,5 @@
 <resources xmlns:tools="http://schemas.android.com/tools">
-  <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
+  <style name="AppTheme" parent="Theme.EdgeToEdge">
     <item name="android:textColor">@android:color/white</item>
     <item name="android:editTextStyle">@style/ResetEditText</item>
     <item name="colorPrimary">@color/colorPrimary</item>
diff --git a/apps/mobile-app/android/app/src/main/res/values/styles.xml b/apps/mobile-app/android/app/src/main/res/values/styles.xml
index 6edd09984..7830ed292 100644
--- a/apps/mobile-app/android/app/src/main/res/values/styles.xml
+++ b/apps/mobile-app/android/app/src/main/res/values/styles.xml
@@ -1,5 +1,5 @@
 <resources xmlns:tools="http://schemas.android.com/tools">
-  <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
+  <style name="AppTheme" parent="Theme.EdgeToEdge.Light">
     <item name="android:textColor">@android:color/black</item>
     <item name="android:editTextStyle">@style/ResetEditText</item>
     <item name="colorPrimary">@color/colorPrimary</item>
diff --git a/apps/mobile-app/app.json b/apps/mobile-app/app.json
index 97bde1e1e..707f77e70 100644
--- a/apps/mobile-app/app.json
+++ b/apps/mobile-app/app.json
@@ -33,6 +33,7 @@
     },
     "plugins": [
       "expo-router",
+      "expo-sqlite",
       [
         "expo-splash-screen",
         {
@@ -42,7 +43,15 @@
           "backgroundColor": "#ffffff"
         }
       ],
-      "expo-sqlite"
+      [
+        "react-native-edge-to-edge",
+        {
+          "android": {
+            "parentTheme": "Default",
+            "enforceNavigationBarContrast": false
+          }
+        }
+      ]
     ],
     "experiments": {
       "typedRoutes": true
diff --git a/apps/mobile-app/app/_layout.tsx b/apps/mobile-app/app/_layout.tsx
index 2a439310c..52b5ea14b 100644
--- a/apps/mobile-app/app/_layout.tsx
+++ b/apps/mobile-app/app/_layout.tsx
@@ -4,7 +4,6 @@ import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native
 import { useFonts } from 'expo-font';
 import { Href, Stack, useRouter } from 'expo-router';
 import * as SplashScreen from 'expo-splash-screen';
-import { StatusBar } from 'expo-status-bar';
 import 'react-native-reanimated';
 import 'react-native-get-random-values';
 import { install } from 'react-native-quick-crypto';
@@ -265,7 +264,6 @@ function RootLayoutNav() : React.ReactNode {
         <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
         <Stack.Screen name="+not-found" options={{ title: 'Not Found' }} />
       </Stack>
-      <StatusBar style="auto" />
       <AliasVaultToast />
     </ThemeProvider>
   );
diff --git a/apps/mobile-app/ios/Podfile.lock b/apps/mobile-app/ios/Podfile.lock
index 232a57ed1..ee3d24298 100644
--- a/apps/mobile-app/ios/Podfile.lock
+++ b/apps/mobile-app/ios/Podfile.lock
@@ -1994,7 +1994,7 @@ PODS:
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
     - Yoga
-  - RNReanimated (3.16.7):
+  - RNReanimated (3.18.0):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2006,7 +2006,9 @@ PODS:
     - React-Fabric
     - React-featureflags
     - React-graphics
+    - React-hermes
     - React-ImageManager
+    - React-jsi
     - React-NativeModulesApple
     - React-RCTFabric
     - React-rendererdebug
@@ -2014,10 +2016,10 @@ PODS:
     - ReactCodegen
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
-    - RNReanimated/reanimated (= 3.16.7)
-    - RNReanimated/worklets (= 3.16.7)
+    - RNReanimated/reanimated (= 3.18.0)
+    - RNReanimated/worklets (= 3.18.0)
     - Yoga
-  - RNReanimated/reanimated (3.16.7):
+  - RNReanimated/reanimated (3.18.0):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2029,7 +2031,9 @@ PODS:
     - React-Fabric
     - React-featureflags
     - React-graphics
+    - React-hermes
     - React-ImageManager
+    - React-jsi
     - React-NativeModulesApple
     - React-RCTFabric
     - React-rendererdebug
@@ -2037,9 +2041,9 @@ PODS:
     - ReactCodegen
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
-    - RNReanimated/reanimated/apple (= 3.16.7)
+    - RNReanimated/reanimated/apple (= 3.18.0)
     - Yoga
-  - RNReanimated/reanimated/apple (3.16.7):
+  - RNReanimated/reanimated/apple (3.18.0):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2051,7 +2055,9 @@ PODS:
     - React-Fabric
     - React-featureflags
     - React-graphics
+    - React-hermes
     - React-ImageManager
+    - React-jsi
     - React-NativeModulesApple
     - React-RCTFabric
     - React-rendererdebug
@@ -2060,7 +2066,7 @@ PODS:
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
     - Yoga
-  - RNReanimated/worklets (3.16.7):
+  - RNReanimated/worklets (3.18.0):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2072,7 +2078,33 @@ PODS:
     - React-Fabric
     - React-featureflags
     - React-graphics
+    - React-hermes
     - React-ImageManager
+    - React-jsi
+    - React-NativeModulesApple
+    - React-RCTFabric
+    - React-rendererdebug
+    - React-utils
+    - ReactCodegen
+    - ReactCommon/turbomodule/bridging
+    - ReactCommon/turbomodule/core
+    - RNReanimated/worklets/apple (= 3.18.0)
+    - Yoga
+  - RNReanimated/worklets/apple (3.18.0):
+    - DoubleConversion
+    - glog
+    - hermes-engine
+    - RCT-Folly (= 2024.10.14.00)
+    - RCTRequired
+    - RCTTypeSafety
+    - React-Core
+    - React-debug
+    - React-Fabric
+    - React-featureflags
+    - React-graphics
+    - React-hermes
+    - React-ImageManager
+    - React-jsi
     - React-NativeModulesApple
     - React-RCTFabric
     - React-rendererdebug
@@ -2081,7 +2113,7 @@ PODS:
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
     - Yoga
-  - RNScreens (4.4.0):
+  - RNScreens (4.11.1):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2102,9 +2134,9 @@ PODS:
     - ReactCodegen
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
-    - RNScreens/common (= 4.4.0)
+    - RNScreens/common (= 4.11.1)
     - Yoga
-  - RNScreens/common (4.4.0):
+  - RNScreens/common (4.11.1):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2605,8 +2637,8 @@ SPEC CHECKSUMS:
   RNArgon2: 708e188b7a4d4ec8baf62463927c47abef453a94
   RNCAsyncStorage: 66991bb6672ed988a8c56289a08bf4fc3a29d4b3
   RNGestureHandler: fffddeb8af59709c6d8de11b6461a6af63cad532
-  RNReanimated: 2e5069649cbab2c946652d3b97589b2ae0526220
-  RNScreens: 362f4c861dd155f898908d5035d97b07a3f1a9d1
+  RNReanimated: 6b9d5b5919acb1900ce0d36ef95906026c517674
+  RNScreens: da08089f1b06c3e0a459545ee2e0eb94ea18a80b
   RNSVG: b889dc9c1948eeea0576a16cc405c91c37a12c19
   SocketRocket: d4aabe649be1e368d1318fdf28a022d714d65748
   SQLite.swift: 2992550ebf3c5b268bf4352603e3df87d2a4ed72
diff --git a/apps/mobile-app/package-lock.json b/apps/mobile-app/package-lock.json
index 3a734999f..9e19fa3f6 100644
--- a/apps/mobile-app/package-lock.json
+++ b/apps/mobile-app/package-lock.json
@@ -40,11 +40,12 @@
         "react-native": "0.76.9",
         "react-native-aes-gcm-crypto": "^0.2.2",
         "react-native-argon2": "^2.0.1",
+        "react-native-edge-to-edge": "^1.6.0",
         "react-native-gesture-handler": "~2.20.2",
         "react-native-get-random-values": "^1.11.0",
         "react-native-keyboard-aware-scroll-view": "^0.9.5",
         "react-native-quick-crypto": "^0.7.13",
-        "react-native-reanimated": "~3.16.1",
+        "react-native-reanimated": "~3.18.0",
         "react-native-safe-area-context": "4.12.0",
         "react-native-screens": "~4.11.1",
         "react-native-svg": "15.8.0",
@@ -17848,6 +17849,16 @@
       "integrity": "sha512-/iOi0S+VVgS1gQGtQgL4ZxUVS4gz6Lav3bgIbtNmr9KbOunnBYzP6/yBe/XxkbpXvasHDwdQnuppOH/nuOBn7w==",
       "license": "MIT"
     },
+    "node_modules/react-native-edge-to-edge": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/react-native-edge-to-edge/-/react-native-edge-to-edge-1.6.0.tgz",
+      "integrity": "sha512-2WCNdE3Qd6Fwg9+4BpbATUxCLcouF6YRY7K+J36KJ4l3y+tWN6XCqAC4DuoGblAAbb2sLkhEDp4FOlbOIot2Og==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "*",
+        "react-native": "*"
+      }
+    },
     "node_modules/react-native-gesture-handler": {
       "version": "2.20.2",
       "resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.20.2.tgz",
@@ -17953,9 +17964,9 @@
       }
     },
     "node_modules/react-native-reanimated": {
-      "version": "3.16.7",
-      "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-3.16.7.tgz",
-      "integrity": "sha512-qoUUQOwE1pHlmQ9cXTJ2MX9FQ9eHllopCLiWOkDkp6CER95ZWeXhJCP4cSm6AD4jigL5jHcZf/SkWrg8ttZUsw==",
+      "version": "3.18.0",
+      "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-3.18.0.tgz",
+      "integrity": "sha512-eVcNcqeOkMW+BUWAHdtvN3FKgC8J8wiEJkX6bNGGQaLS7m7e4amTfjIcqf/Ta+lerZLurmDaQ0lICI1CKPrb1Q==",
       "license": "MIT",
       "dependencies": {
         "@babel/plugin-transform-arrow-functions": "^7.0.0-0",
@@ -17968,7 +17979,8 @@
         "@babel/plugin-transform-unicode-regex": "^7.0.0-0",
         "@babel/preset-typescript": "^7.16.7",
         "convert-source-map": "^2.0.0",
-        "invariant": "^2.2.4"
+        "invariant": "^2.2.4",
+        "react-native-is-edge-to-edge": "1.1.7"
       },
       "peerDependencies": {
         "@babel/core": "^7.0.0-0",
@@ -20622,7 +20634,7 @@
       "version": "5.8.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
       "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
-      "dev": true,
+      "devOptional": true,
       "license": "Apache-2.0",
       "bin": {
         "tsc": "bin/tsc",
diff --git a/apps/mobile-app/package.json b/apps/mobile-app/package.json
index 5af965813..ea1104fea 100644
--- a/apps/mobile-app/package.json
+++ b/apps/mobile-app/package.json
@@ -42,6 +42,7 @@
     "expo-dev-client": "~5.0.19",
     "expo-font": "~13.0.4",
     "expo-haptics": "~14.0.1",
+    "expo-linear-gradient": "~14.0.2",
     "expo-linking": "~7.0.5",
     "expo-local-authentication": "~15.0.2",
     "expo-router": "~4.0.20",
@@ -60,11 +61,12 @@
     "react-native": "0.76.9",
     "react-native-aes-gcm-crypto": "^0.2.2",
     "react-native-argon2": "^2.0.1",
+    "react-native-edge-to-edge": "^1.6.0",
     "react-native-gesture-handler": "~2.20.2",
     "react-native-get-random-values": "^1.11.0",
     "react-native-keyboard-aware-scroll-view": "^0.9.5",
     "react-native-quick-crypto": "^0.7.13",
-    "react-native-reanimated": "~3.16.1",
+    "react-native-reanimated": "~3.18.0",
     "react-native-safe-area-context": "4.12.0",
     "react-native-screens": "~4.11.1",
     "react-native-svg": "15.8.0",
@@ -72,11 +74,11 @@
     "react-native-web": "~0.19.13",
     "react-native-webview": "13.12.5",
     "secure-remote-password": "github:LinusU/secure-remote-password#73e5f732b6ca0cdbdc19da1a0c5f48cdbad2cbf0",
-    "yup": "^1.6.1",
-    "expo-linear-gradient": "~14.0.2"
+    "yup": "^1.6.1"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
+    "@react-native-community/cli": "latest",
     "@types/argon2-browser": "^1.18.4",
     "@types/fbemitter": "^2.0.35",
     "@types/jest": "^29.5.12",
@@ -93,8 +95,7 @@
     "jest-expo": "~52.0.6",
     "react-native-svg-transformer": "^1.5.0",
     "react-test-renderer": "18.3.1",
-    "typescript": "^5.3.3",
-    "@react-native-community/cli": "latest"
+    "typescript": "^5.3.3"
   },
   "private": true
 }