-
Notifications
You must be signed in to change notification settings - Fork 1
/
App.js
80 lines (69 loc) · 1.96 KB
/
App.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
import { useEffect, useState, useContext } from 'react'
import { StyleSheet, View } from 'react-native'
import { NavigationContainer } from '@react-navigation/native'
import { setCustomText } from 'react-native-global-props'
import { QueryClient, QueryClientProvider } from 'react-query'
import * as SplashScreen from 'expo-splash-screen'
import { useFonts } from './hooks/useFonts'
import { UserContext, UserProvider } from './contexts/UserContext'
import { AuthenticatedStack } from './stacks/AuthenticatedStack'
import { UnauthenticatedStack } from './stacks/UnauthenticatedStack'
import { COLORS, customTextProps } from './GlobalStyles'
const queryClient = new QueryClient()
SplashScreen.preventAutoHideAsync()
const Root = () => {
const { authenticated, currentUser } = useContext(UserContext)
return (
<View style={styles.app}>
<NavigationContainer
theme={{
colors: {
background: COLORS.primary800,
},
}}>
{authenticated && currentUser ? (
<AuthenticatedStack currentUser={currentUser} />
) : (
<UnauthenticatedStack />
)}
</NavigationContainer>
</View>
)
}
export default function App() {
const [appReady, setAppReady] = useState(false)
useEffect(() => {
const loadFonts = async () => {
await useFonts()
setAppReady(true)
}
loadFonts()
}, [])
useEffect(() => {
const prepare = async () => {
// simulate longer loading by waiting 1 second
await new Promise(resolve => setTimeout(resolve, 1000))
await SplashScreen.hideAsync()
}
if (appReady) {
prepare()
setCustomText(customTextProps)
}
}, [appReady])
if (!appReady) {
return null
}
return (
<QueryClientProvider client={queryClient}>
<UserProvider>
<Root />
</UserProvider>
</QueryClientProvider>
)
}
const styles = StyleSheet.create({
app: {
flex: 1,
backgroundColor: COLORS.primary800,
},
})