_layout.tsx
1 import { useEffect } from 'react' 2 import { Stack } from 'expo-router' 3 import { StatusBar } from 'expo-status-bar' 4 import { QueryClient, QueryClientProvider } from '@tanstack/react-query' 5 import { useAuthStore } from '../src/store/auth' 6 import { ThemeProvider, useTheme } from '../src/context/ThemeContext' 7 8 const queryClient = new QueryClient({ 9 defaultOptions: { 10 queries: { 11 staleTime: 30 * 1000, // 30 seconds 12 retry: 2, 13 }, 14 }, 15 }) 16 17 export default function RootLayout() { 18 return ( 19 <QueryClientProvider client={queryClient}> 20 <ThemeProvider> 21 <RootNavigator /> 22 </ThemeProvider> 23 </QueryClientProvider> 24 ) 25 } 26 27 function RootNavigator() { 28 const { colors, isDark } = useTheme() 29 const { hydrate } = useAuthStore() 30 31 // Hydrate auth state from secure storage 32 useEffect(() => { 33 hydrate() 34 }, [hydrate]) 35 36 return ( 37 <> 38 <StatusBar style={isDark ? 'light' : 'dark'} /> 39 <Stack 40 screenOptions={{ 41 headerStyle: { 42 backgroundColor: colors.background, 43 }, 44 headerTintColor: colors.text, 45 headerTitleStyle: { 46 fontWeight: '600', 47 }, 48 contentStyle: { 49 backgroundColor: colors.background, 50 }, 51 }} 52 > 53 <Stack.Screen 54 name="(tabs)" 55 options={{ headerShown: false }} 56 /> 57 <Stack.Screen 58 name="auth/connect" 59 options={{ 60 title: 'Connect Wallet', 61 presentation: 'modal', 62 }} 63 /> 64 <Stack.Screen 65 name="repo/[id]" 66 options={{ 67 title: 'Repository', 68 }} 69 /> 70 <Stack.Screen 71 name="pr/[id]" 72 options={{ 73 title: 'Pull Request', 74 }} 75 /> 76 <Stack.Screen 77 name="vote/[id]" 78 options={{ 79 title: 'Vote', 80 }} 81 /> 82 <Stack.Screen 83 name="scan" 84 options={{ 85 title: 'Scan QR', 86 presentation: 'modal', 87 }} 88 /> 89 </Stack> 90 </> 91 ) 92 }