Tweak app layout margins for iOS 26+ (#1319)

apps/mobile-app/app/(tabs)/credentials/add-edit.tsx

@@ -496,10 +496,22 @@ export default function AddEditCredentialScreen() : React.ReactNode {
     );
   };
 
+  /**
+   * Get the top padding for the container.
+   */
+  const getTopPadding = (): number => {
+    if (Platform.OS !== 'ios') {
+      return 0;
+    }
+
+    const iosVersion = parseInt(Platform.Version as string, 10);
+    return iosVersion >= 26 ? 72 : 52;
+  };
+
   const styles = StyleSheet.create({
     container: {
       flex: 1,
-      paddingTop: Platform.OS === 'ios' ? 52 : 0,
+      paddingTop: getTopPadding(),
     },
     contentContainer: {
       paddingBottom: 40,

apps/mobile-app/components/themed/ThemedContainer.tsx

@@ -12,11 +12,18 @@ export type ThemedContainerProps = ViewProps;
 export function ThemedContainer({ style, ...otherProps }: ThemedContainerProps): React.ReactNode {
   const insets = useSafeAreaInsets();
 
+  const getTopPadding = () => {
+    if (Platform.OS !== 'ios') return 0;
+
+    const iosVersion = parseInt(Platform.Version as string, 10);
+    return iosVersion >= 26 ? insets.top + 14 : insets.top;
+  };
+
   const styles = StyleSheet.create({
     container: {
       flex: 1,
       paddingHorizontal: 14,
-      paddingTop: Platform.OS === 'ios' ? insets.top : 0,
+      paddingTop: getTopPadding(),
     },
   });
   return <ThemedView style={[styles.container, style]} {...otherProps} />;

apps/mobile-app/package-lock.json

@@ -52,7 +52,7 @@
         "react-native-keyboard-controller": "^1.18.6",
         "react-native-quick-crypto": "^0.7.13",
         "react-native-reanimated": "~3.17.4",
-        "react-native-safe-area-context": "5.4.0",
+        "react-native-safe-area-context": "5.6.1",
         "react-native-screens": "~4.15.4",
         "react-native-svg": "15.11.2",
         "react-native-toast-message": "^2.2.1",
@@ -14897,9 +14897,9 @@
       }
     },
     "node_modules/react-native-safe-area-context": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-5.4.0.tgz",
-      "integrity": "sha512-JaEThVyJcLhA+vU0NU8bZ0a1ih6GiF4faZ+ArZLqpYbL6j7R3caRqj+mE3lEtKCuHgwjLg3bCxLL1GPUJZVqUA==",
+      "version": "5.6.1",
+      "resolved": "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-5.6.1.tgz",
+      "integrity": "sha512-/wJE58HLEAkATzhhX1xSr+fostLsK8Q97EfpfMDKo8jlOc1QKESSX/FQrhk7HhQH/2uSaox4Y86sNaI02kteiA==",
       "license": "MIT",
       "peerDependencies": {
         "react": "*",

apps/mobile-app/package.json

@@ -73,7 +73,7 @@
     "react-native-keyboard-controller": "^1.18.6",
     "react-native-quick-crypto": "^0.7.13",
     "react-native-reanimated": "~3.17.4",
-    "react-native-safe-area-context": "5.4.0",
+    "react-native-safe-area-context": "5.6.1",
     "react-native-screens": "~4.15.4",
     "react-native-svg": "15.11.2",
     "react-native-toast-message": "^2.2.1",