192 lines
5.6 KiB
TypeScript
192 lines
5.6 KiB
TypeScript
import { NavigationContainer } from '@react-navigation/native'
|
|
import {
|
|
Child as ChildType,
|
|
NewsItem as NewsItemType,
|
|
} from '@skolplattformen/api-skolplattformen'
|
|
import { useApi } from '@skolplattformen/hooks'
|
|
import { useTheme } from '@ui-kitten/components'
|
|
import { Library } from 'libraries.json'
|
|
import React, { useEffect } from 'react'
|
|
import { StatusBar, useColorScheme } from 'react-native'
|
|
import { createNativeStackNavigator } from 'react-native-screens/native-stack'
|
|
import { schema } from '../app.json'
|
|
import {
|
|
darkNavigationTheme,
|
|
lightNavigationTheme,
|
|
} from '../design/navigationThemes'
|
|
import { useAppState } from '../hooks/useAppState'
|
|
import { useLangCode } from '../hooks/useLangCode'
|
|
import useSettingsStorage, {
|
|
initializeSettingsState,
|
|
} from '../hooks/useSettingsStorage'
|
|
import { isRTL } from '../services/languageService'
|
|
import Absence, { absenceRouteOptions } from './absence.component'
|
|
import { Auth, authRouteOptions } from './auth.component'
|
|
import { Child, childRouteOptions } from './child.component'
|
|
import { childenRouteOptions, Children } from './children.component'
|
|
import { libraryRouteOptions, LibraryScreen } from './library.component'
|
|
import { NewsItem, newsItemRouteOptions } from './newsItem.component'
|
|
import { SetLanguage, setLanguageRouteOptions } from './setLanguage.component'
|
|
import { settingsRouteOptions, SettingsScreen } from './settings.component'
|
|
import {
|
|
settingsAppearanceRouteOptions,
|
|
SettingsAppearanceScreen,
|
|
} from './settingsAppearance.component'
|
|
import {
|
|
settingsAppearanceThemeRouteOptions,
|
|
SettingsAppearanceThemeScreen,
|
|
} from './settingsAppearanceTheme.component'
|
|
import {
|
|
settingsLicensesRouteOptions,
|
|
SettingsLicensesScreen,
|
|
} from './settingsLicenses.component'
|
|
|
|
export type RootStackParamList = {
|
|
Login: undefined
|
|
Children: undefined
|
|
Settings: undefined
|
|
SettingsAppearance: undefined
|
|
SettingsAppearanceTheme: undefined
|
|
SettingsLicenses: undefined
|
|
Library: {
|
|
library: Library
|
|
}
|
|
Child: {
|
|
child: ChildType
|
|
color: string
|
|
initialRouteName?: string
|
|
}
|
|
NewsItem: { newsItem: NewsItemType; child: ChildType }
|
|
Absence: { child: ChildType }
|
|
SetLanguage: undefined
|
|
}
|
|
|
|
const { Navigator, Screen } = createNativeStackNavigator<RootStackParamList>()
|
|
|
|
const linking = {
|
|
prefixes: [schema],
|
|
config: {
|
|
screens: {
|
|
Login: 'login',
|
|
},
|
|
},
|
|
}
|
|
|
|
export const AppNavigator = () => {
|
|
const { isLoggedIn, api } = useApi()
|
|
|
|
const [usingSystemTheme] = useSettingsStorage('usingSystemTheme')
|
|
const [theme] = useSettingsStorage('theme')
|
|
const systemTheme = useColorScheme()
|
|
const colorScheme = usingSystemTheme ? systemTheme : theme
|
|
const langCode = useLangCode()
|
|
|
|
const colors = useTheme()
|
|
|
|
const currentAppState = useAppState()
|
|
|
|
useEffect(() => {
|
|
initializeSettingsState()
|
|
}, [])
|
|
|
|
useEffect(() => {
|
|
const checkUser = async () => {
|
|
if (currentAppState === 'active' && isLoggedIn) {
|
|
const { isAuthenticated } = await api.getUser()
|
|
|
|
if (!isAuthenticated) {
|
|
await api.logout()
|
|
}
|
|
}
|
|
}
|
|
checkUser()
|
|
}, [currentAppState, isLoggedIn, api])
|
|
|
|
return (
|
|
<NavigationContainer
|
|
linking={linking}
|
|
theme={
|
|
colorScheme === 'dark' ? darkNavigationTheme : lightNavigationTheme
|
|
}
|
|
>
|
|
<StatusBar />
|
|
<Navigator
|
|
screenOptions={() => ({
|
|
headerLargeTitle: false,
|
|
headerLargeTitleHideShadow: true,
|
|
direction: isRTL(langCode) ? 'rtl' : 'ltr',
|
|
headerStyle: {
|
|
backgroundColor:
|
|
colorScheme === 'dark'
|
|
? colors['background-basic-color-2']
|
|
: colors['background-basic-color-1'],
|
|
},
|
|
headerLargeStyle: {
|
|
backgroundColor: colors['background-basic-color-2'],
|
|
},
|
|
headerLargeTitleStyle: {
|
|
fontFamily: 'Poppins-ExtraBold',
|
|
},
|
|
})}
|
|
>
|
|
{isLoggedIn ? (
|
|
<>
|
|
<Screen
|
|
name="Children"
|
|
component={Children}
|
|
options={childenRouteOptions(colorScheme === 'dark')}
|
|
/>
|
|
<Screen
|
|
name="Child"
|
|
component={Child}
|
|
options={childRouteOptions(colorScheme === 'dark')}
|
|
/>
|
|
<Screen
|
|
name="NewsItem"
|
|
component={NewsItem}
|
|
options={newsItemRouteOptions(colorScheme === 'dark')}
|
|
/>
|
|
<Screen
|
|
name="Absence"
|
|
component={Absence}
|
|
options={absenceRouteOptions(colorScheme === 'dark')}
|
|
/>
|
|
</>
|
|
) : (
|
|
<Screen name="Login" component={Auth} options={authRouteOptions} />
|
|
)}
|
|
<Screen
|
|
name="SetLanguage"
|
|
component={SetLanguage}
|
|
options={setLanguageRouteOptions}
|
|
/>
|
|
<Screen
|
|
name="Settings"
|
|
component={SettingsScreen}
|
|
options={settingsRouteOptions}
|
|
/>
|
|
<Screen
|
|
name="SettingsAppearance"
|
|
component={SettingsAppearanceScreen}
|
|
options={settingsAppearanceRouteOptions}
|
|
/>
|
|
<Screen
|
|
name="SettingsAppearanceTheme"
|
|
component={SettingsAppearanceThemeScreen}
|
|
options={settingsAppearanceThemeRouteOptions}
|
|
/>
|
|
<Screen
|
|
name="SettingsLicenses"
|
|
component={SettingsLicensesScreen}
|
|
options={settingsLicensesRouteOptions}
|
|
/>
|
|
<Screen
|
|
name="Library"
|
|
component={LibraryScreen}
|
|
options={libraryRouteOptions}
|
|
/>
|
|
</Navigator>
|
|
</NavigationContainer>
|
|
)
|
|
}
|