135 lines
3.6 KiB
TypeScript
135 lines
3.6 KiB
TypeScript
import "../tamagui-web.css"
|
|
import { useEffect } from 'react'
|
|
import { ToastWrapper } from './../components/toastwrapper'
|
|
import { StatusBar, useColorScheme } from 'react-native'
|
|
import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native'
|
|
import { useFonts } from 'expo-font'
|
|
import { SplashScreen, Stack, Slot } from 'expo-router'
|
|
import { Provider } from './Provider'
|
|
import { useTheme, Button, Anchor, XStack } from 'tamagui'
|
|
import { ArrowLeft, ArrowRight } from '@tamagui/lucide-icons';
|
|
import {useAuth,AuthProvider} from "contexts/authcontext"
|
|
import { useRouter } from 'expo-router'
|
|
import { Platform } from 'react-native';
|
|
|
|
|
|
export {
|
|
// Catch any errors thrown by the Layout component.
|
|
ErrorBoundary,
|
|
} from 'expo-router'
|
|
|
|
|
|
export const unstable_settings = {
|
|
// Ensure that reloading on `/modal` keeps a back button present.
|
|
initialRouteName: '(tabs)',
|
|
|
|
}
|
|
|
|
// Prevent the splash screen from auto-hiding before asset loading is complete.
|
|
SplashScreen.preventAutoHideAsync()
|
|
|
|
export default function RootLayout() {
|
|
const [interLoaded, interError] = useFonts({
|
|
Inter: require('@tamagui/font-inter/otf/Inter-Medium.otf'),
|
|
InterBold: require('@tamagui/font-inter/otf/Inter-Bold.otf'),
|
|
})
|
|
|
|
useEffect(() => {
|
|
const intervalId = setInterval(() => {
|
|
console.log("test")
|
|
}, 10000)
|
|
return () => clearInterval(intervalId)
|
|
}, [])
|
|
|
|
useEffect(() => {
|
|
if (interLoaded || interError) {
|
|
// Hide the splash screen after the fonts have loaded (or an error was returned) and the UI is ready.
|
|
SplashScreen.hideAsync()
|
|
}
|
|
}, [interLoaded, interError])
|
|
|
|
if (!interLoaded && !interError) {
|
|
return null
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<AuthProvider>
|
|
<Providers>
|
|
<ToastWrapper />
|
|
<Slot/>
|
|
</Providers>
|
|
</AuthProvider>
|
|
|
|
</>
|
|
)
|
|
}
|
|
|
|
const Providers = ({ children }: { children: React.ReactNode }) => {
|
|
return <Provider>{children}</Provider>
|
|
}
|
|
|
|
function RootLayoutNav() {
|
|
const {isLoggedIn, logout,} = useAuth()
|
|
const colorScheme = useColorScheme()
|
|
const theme = useTheme()
|
|
const router = useRouter()
|
|
return (
|
|
<ThemeProvider value={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
|
|
<StatusBar barStyle={colorScheme === 'dark' ? 'light-content' : 'dark-content'} />
|
|
<Stack>
|
|
<Stack.Screen
|
|
name="(tabs)"
|
|
options={{
|
|
headerShown: false,
|
|
}}
|
|
/>
|
|
<Stack.Screen
|
|
name='(auth)'
|
|
options={{
|
|
title: "Authentication",
|
|
headerShown:true,
|
|
headerLeft: () => (
|
|
<XStack>
|
|
<Anchor href='/'>
|
|
<Button icon={ArrowLeft}></Button>
|
|
</Anchor>
|
|
</XStack>
|
|
|
|
),
|
|
headerRight: () => (
|
|
!isLoggedIn ? (
|
|
<XStack gap="$3">
|
|
|
|
<Button onPress={router.replace("/login")}>Login</Button>
|
|
|
|
<Anchor href='/signup'>
|
|
<Button>Sign-Up</Button>
|
|
</Anchor>
|
|
</XStack>
|
|
|
|
|
|
):(<Button onPress={logout}>Logout</Button>)
|
|
),
|
|
}}
|
|
>
|
|
|
|
</Stack.Screen>
|
|
<Stack.Screen
|
|
name="modal"
|
|
options={{
|
|
title: 'Tamagui + Expo',
|
|
presentation: 'modal',
|
|
animation: 'slide_from_right',
|
|
gestureEnabled: true,
|
|
gestureDirection: 'horizontal',
|
|
contentStyle: {
|
|
backgroundColor: theme.background.val,
|
|
},
|
|
}}
|
|
/>
|
|
</Stack>
|
|
</ThemeProvider>
|
|
)
|
|
}
|