From 5e483368ecfe25bc87e87572af62d7c46cf87a14 Mon Sep 17 00:00:00 2001
From: byGalax <dennis@landmann.dev>
Date: Wed, 13 May 2026 23:35:51 +0200
Subject: [PATCH] feat(mobile): wrap root layout in GestureHandler + SafeArea +
 ErrorBoundary

---
 apps/mobile/app/_layout.tsx | 39 ++++++++++++++++++++++++++-----------
 1 file changed, 28 insertions(+), 11 deletions(-)

diff --git a/apps/mobile/app/_layout.tsx b/apps/mobile/app/_layout.tsx
index c21200a..c4c0969 100644
--- a/apps/mobile/app/_layout.tsx
+++ b/apps/mobile/app/_layout.tsx
@@ -1,18 +1,35 @@
-// Root layout for Expo Router.
-// Wraps every screen. Place global providers here (Theme, Supabase/Auth context,
-// SafeAreaProvider, GestureHandlerRootView, etc.) once they exist.
-
 import { Stack } from 'expo-router';
 import { StatusBar } from 'expo-status-bar';
+import { GestureHandlerRootView } from 'react-native-gesture-handler';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
 
+import { ErrorBoundary } from '../components/ErrorBoundary';
+
+// Force-resolve @chat-app/shared at boot so Metro packaging issues
+// surface during the very first dev-client load instead of mid-Phase-1.
+// Reference the export so tree-shaking can't drop it.
+import { sharedSmoke } from '../lib/sharedSmoke';
+void sharedSmoke;
+
+// Root layout for every Expo Router screen. Provider stack order:
+//   GestureHandlerRootView  — required by gesture-driven libs (BottomSheet,
+//                             swipeable rows, drawer nav). Must be the
+//                             outermost so gesture state is global.
+//   SafeAreaProvider        — feeds notch / status-bar insets to children.
+//   ErrorBoundary           — last line of defence for render errors.
+//   Stack                   — Expo Router's screen registry.
 export default function RootLayout() {
   return (
-    <>
-      <StatusBar style="auto" />
-      <Stack screenOptions={{ headerShown: false }}>
-        <Stack.Screen name="index" />
-        <Stack.Screen name="(app)" />
-      </Stack>
-    </>
+    <GestureHandlerRootView style={{ flex: 1 }}>
+      <SafeAreaProvider>
+        <ErrorBoundary>
+          <StatusBar style="auto" />
+          <Stack screenOptions={{ headerShown: false }}>
+            <Stack.Screen name="index" />
+            <Stack.Screen name="(app)" />
+          </Stack>
+        </ErrorBoundary>
+      </SafeAreaProvider>
+    </GestureHandlerRootView>
   );
 }