fix(mobile): fix some mobile warning after expo 54 upgrade

6 files changed, 15 insertions, 8 deletions

diff --git a/apps/mobile/app/_layout.tsx b/apps/mobile/app/_layout.tsx
index 3f9e5575..ab0f9c52 100644
--- a/apps/mobile/app/_layout.tsx
+++ b/apps/mobile/app/_layout.tsx
@@ -2,13 +2,16 @@ import "@/globals.css";
 import "expo-dev-client";
 
 import { useEffect } from "react";
+import { Platform } from "react-native";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import { KeyboardProvider } from "react-native-keyboard-controller";
+import { SafeAreaProvider } from "react-native-safe-area-context";
 import { useRouter } from "expo-router";
 import { Stack } from "expo-router/stack";
 import { ShareIntentProvider, useShareIntent } from "expo-share-intent";
 import { StatusBar } from "expo-status-bar";
 import { StyledStack } from "@/components/navigation/stack";
+import SplashScreenController from "@/components/SplashScreenController";
 import { Providers } from "@/lib/providers";
 import { useColorScheme, useInitialAndroidBarSync } from "@/lib/useColorScheme";
 import { cn } from "@/lib/utils";
@@ -30,9 +33,13 @@ export default function RootLayout() {
   }, [hasShareIntent]);
 
   return (
-    <>
-      <KeyboardProvider statusBarTranslucent navigationBarTranslucent>
+    <SafeAreaProvider>
+      <KeyboardProvider
+        statusBarTranslucent={Platform.OS !== "android" ? true : undefined}
+        navigationBarTranslucent={Platform.OS !== "android" ? true : undefined}
+      >
         <NavThemeProvider value={NAV_THEME[colorScheme]}>
+          <SplashScreenController />
           <StyledStack
             layout={(props) => {
               return (
@@ -86,6 +93,6 @@ export default function RootLayout() {
         key={`root-status-bar-${isDarkColorScheme ? "light" : "dark"}`}
         style={isDarkColorScheme ? "light" : "dark"}
       />
-    </>
+    </SafeAreaProvider>
   );
 }
diff --git a/apps/mobile/app/dashboard/(tabs)/highlights.tsx b/apps/mobile/app/dashboard/(tabs)/highlights.tsx
index 8a0a8ae3..8d6e37a4 100644
--- a/apps/mobile/app/dashboard/(tabs)/highlights.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/highlights.tsx
@@ -42,7 +42,7 @@ export default function Highlights() {
   };
 
   return (
-    <CustomSafeAreaView>
+    <CustomSafeAreaView edges={["top"]}>
       <HighlightList
         highlights={data.pages.flatMap((p) => p.highlights)}
         header={
diff --git a/apps/mobile/app/dashboard/(tabs)/index.tsx b/apps/mobile/app/dashboard/(tabs)/index.tsx
index 0a51b817..3e49e6f2 100644
--- a/apps/mobile/app/dashboard/(tabs)/index.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/index.tsx
@@ -76,7 +76,7 @@ function HeaderRight({
 
 export default function Home() {
   return (
-    <CustomSafeAreaView>
+    <CustomSafeAreaView edges={["top"]}>
       <UpdatingBookmarkList
         query={{ archived: false }}
         header={
diff --git a/apps/mobile/app/dashboard/(tabs)/lists.tsx b/apps/mobile/app/dashboard/(tabs)/lists.tsx
index a5d4ebc8..3f81a36e 100644
--- a/apps/mobile/app/dashboard/(tabs)/lists.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/lists.tsx
@@ -186,7 +186,7 @@ export default function Lists() {
   });
 
   return (
-    <CustomSafeAreaView>
+    <CustomSafeAreaView edges={["top"]}>
       <FlatList
         className="h-full"
         ListHeaderComponent={
diff --git a/apps/mobile/app/dashboard/(tabs)/settings.tsx b/apps/mobile/app/dashboard/(tabs)/settings.tsx
index 079afab2..ba38d9e6 100644
--- a/apps/mobile/app/dashboard/(tabs)/settings.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/settings.tsx
@@ -46,7 +46,7 @@ export default function Dashboard() {
   }
 
   return (
-    <CustomSafeAreaView>
+    <CustomSafeAreaView edges={["top"]}>
       <UserProfileHeader
         image={data?.image}
         name={data?.name}
diff --git a/apps/mobile/app/dashboard/(tabs)/tags.tsx b/apps/mobile/app/dashboard/(tabs)/tags.tsx
index b05095ac..8a629305 100644
--- a/apps/mobile/app/dashboard/(tabs)/tags.tsx
+++ b/apps/mobile/app/dashboard/(tabs)/tags.tsx
@@ -75,7 +75,7 @@ export default function Tags() {
   };
 
   return (
-    <CustomSafeAreaView>
+    <CustomSafeAreaView edges={["top"]}>
       <FlatList
         className="h-full"
         ListHeaderComponent={