From 3b55fcaf2c052c1035ce4c2d0bfa53c5706d5f89 Mon Sep 17 00:00:00 2001
From: byGalax <dennis@landmann.dev>
Date: Sat, 16 May 2026 17:11:05 +0200
Subject: [PATCH] feat(mobile): (app) layout routes by userKeyState

---
 apps/mobile/app/(app)/_layout.tsx | 37 +++++++++++++++++++++++++------
 apps/mobile/app/index.tsx         |  4 ++--
 2 files changed, 32 insertions(+), 9 deletions(-)

diff --git a/apps/mobile/app/(app)/_layout.tsx b/apps/mobile/app/(app)/_layout.tsx
index e3670eb..f865e18 100644
--- a/apps/mobile/app/(app)/_layout.tsx
+++ b/apps/mobile/app/(app)/_layout.tsx
@@ -1,19 +1,42 @@
 import { Redirect, Stack } from 'expo-router';
+import { ActivityIndicator, StyleSheet, View } from 'react-native';
 
 import { useAuth } from '../../lib/authContext';
+import { colors } from '../../theme/colors';
 
 export default function AppLayout() {
-  const { session, loading } = useAuth();
-  if (loading) return null;
+  const { ready, session, userKeyState } = useAuth();
+
+  if (!ready) {
+    return (
+      <View style={styles.center}>
+        <ActivityIndicator color={colors.accent} />
+      </View>
+    );
+  }
   if (!session) return <Redirect href="/" />;
+  if (userKeyState.status === 'loading') {
+    return (
+      <View style={styles.center}>
+        <ActivityIndicator color={colors.accent} />
+      </View>
+    );
+  }
+  if (userKeyState.status === 'needs-setup') return <Redirect href="/(app)/setup" />;
+  if (userKeyState.status === 'needs-unlock') return <Redirect href="/(app)/unlock" />;
+
   return (
-    <Stack screenOptions={{ headerShown: true }}>
+    <Stack screenOptions={{ headerStyle: { backgroundColor: colors.bg } }}>
       <Stack.Screen name="chats" />
       <Stack.Screen name="conversations/[id]" />
-      <Stack.Screen
-        name="call"
-        options={{ headerShown: false, presentation: 'fullScreenModal' }}
-      />
+      <Stack.Screen name="call" options={{ presentation: 'fullScreenModal' }} />
+      <Stack.Screen name="settings" options={{ presentation: 'card' }} />
+      <Stack.Screen name="setup" options={{ headerShown: false }} />
+      <Stack.Screen name="unlock" options={{ headerShown: false }} />
     </Stack>
   );
 }
+
+const styles = StyleSheet.create({
+  center: { flex: 1, alignItems: 'center', justifyContent: 'center', backgroundColor: colors.bg },
+});
diff --git a/apps/mobile/app/index.tsx b/apps/mobile/app/index.tsx
index 9d6c432..c908b57 100644
--- a/apps/mobile/app/index.tsx
+++ b/apps/mobile/app/index.tsx
@@ -21,13 +21,13 @@ import { colors } from '../theme/colors';
 // they tap the email link and Expo Router routes the deep link to
 // app/auth/callback.tsx.
 export default function Landing() {
-  const { session, loading } = useAuth();
+  const { session, ready } = useAuth();
   const [email, setEmail] = useState('');
   const [submitting, setSubmitting] = useState(false);
   const [sent, setSent] = useState(false);
   const [error, setError] = useState<string | null>(null);
 
-  if (loading) return null;
+  if (!ready) return null;
   if (session) return <Redirect href="/(app)/chats" />;
 
   async function handleSubmit() {