/ mobile / app / _layout.tsx
_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  }