traintrape-moi/client/app/_layout.tsx

70 lines
2.8 KiB
TypeScript

import { useReactNavigationDevTools } from '@dev-plugins/react-navigation'
import { useReactQueryDevTools } from '@dev-plugins/react-query'
import AsyncStorage from '@react-native-async-storage/async-storage'
import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native'
import { QueryClient } from '@tanstack/react-query'
import { createAsyncStoragePersister } from '@tanstack/query-async-storage-persister'
import { PersistQueryClientProvider } from '@tanstack/react-query-persist-client'
import { Stack, useNavigationContainerRef } from 'expo-router'
import { ShareIntentProvider } from 'expo-share-intent'
import { StatusBar } from 'expo-status-bar'
import { MD3DarkTheme, MD3LightTheme, PaperProvider } from 'react-native-paper'
import { Provider as StoreProvider } from 'react-redux'
import GameProvider from '@/components/providers/GameProvider'
import GeolocationProvider from '@/components/providers/GeolocationProvider'
import LoginProvider from '@/components/providers/LoginProvider'
import { useColorScheme } from '@/hooks/useColorScheme'
import store from '@/utils/store'
const queryClient = new QueryClient({
defaultOptions: {
queries: {
gcTime: 24 * 60 * 60 * 1000, // 24h
staleTime: 2000,
retry: 5,
}
}
})
export default function RootLayout() {
const colorScheme = useColorScheme()
const navigationRef = useNavigationContainerRef()
useReactNavigationDevTools(navigationRef)
useReactQueryDevTools(queryClient)
const asyncStoragePersister = createAsyncStoragePersister({
storage: AsyncStorage,
})
return (
<StoreProvider store={store}>
<PersistQueryClientProvider
client={queryClient}
persistOptions={{ persister: asyncStoragePersister }}
onSuccess={() => queryClient.resumePausedMutations().then(() => queryClient.invalidateQueries())}>
<ShareIntentProvider>
<LoginProvider loginRedirect={'/login'}>
<GeolocationProvider>
<GameProvider>
<PaperProvider
theme={colorScheme === 'dark' ? MD3DarkTheme : MD3LightTheme} >
<ThemeProvider value={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
<Stack>
<Stack.Screen name="(tabs)" options={{ headerShown: false }} />
<Stack.Screen name="login" options={{ headerShown: false }} />
<Stack.Screen name="challenges-list" options={{ headerShown: false }} />
<Stack.Screen name="+not-found" />
</Stack>
<StatusBar style="auto" />
</ThemeProvider>
</PaperProvider>
</GameProvider>
</GeolocationProvider>
</LoginProvider>
</ShareIntentProvider>
</PersistQueryClientProvider>
</StoreProvider>
)
}