diff options
author | Kirill Rogovoy <[email protected]> | 2021-07-20 21:24:52 +0300 |
---|---|---|
committer | Kirill Rogovoy <[email protected]> | 2021-07-20 21:24:52 +0300 |
commit | 5f4611d65e40eae3ca6191a15f68d69ea5a1c4cb (patch) | |
tree | 273dfc086444533d86d580961c92ba8d14781a67 /app_expo/navigators/root-navigator.tsx | |
parent | f0bf4e7afdcd8b02a62be45ab3e7d047ed865a79 (diff) |
WIP
Diffstat (limited to 'app_expo/navigators/root-navigator.tsx')
-rw-r--r-- | app_expo/navigators/root-navigator.tsx | 59 |
1 files changed, 59 insertions, 0 deletions
diff --git a/app_expo/navigators/root-navigator.tsx b/app_expo/navigators/root-navigator.tsx new file mode 100644 index 0000000..ed48dd5 --- /dev/null +++ b/app_expo/navigators/root-navigator.tsx @@ -0,0 +1,59 @@ +/** + * The root navigator is used to switch between major navigation flows of your app. + * Generally speaking, it will contain an auth flow (registration, login, forgot password) + * and a "main" flow (which is contained in your MainNavigator) which the user + * will use once logged in. + */ +import React from 'react' +import { NavigationContainer, NavigationContainerRef } from '@react-navigation/native' +import { createStackNavigator } from '@react-navigation/stack' +import { MainNavigator } from './main-navigator' +import { color } from '../theme' + +/** + * This type allows TypeScript to know what routes are defined in this navigator + * as well as what properties (if any) they might take when navigating to them. + * + * We recommend using MobX-State-Tree store(s) to handle state rather than navigation params. + * + * For more information, see this documentation: + * https://reactnavigation.org/docs/params/ + * https://reactnavigation.org/docs/typescript#type-checking-the-navigator + */ +export type RootParamList = { + mainStack: undefined +} + +const Stack = createStackNavigator<RootParamList>() + +const RootStack = () => { + return ( + <Stack.Navigator + screenOptions={{ + cardStyle: { backgroundColor: color.palette.deepPurple }, + headerShown: false, + }} + > + <Stack.Screen + name="mainStack" + component={MainNavigator} + options={{ + headerShown: false, + }} + /> + </Stack.Navigator> + ) +} + +export const RootNavigator = React.forwardRef< + NavigationContainerRef, + Partial<React.ComponentProps<typeof NavigationContainer>> +>((props, ref) => { + return ( + <NavigationContainer {...props} ref={ref}> + <RootStack /> + </NavigationContainer> + ) +}) + +RootNavigator.displayName = 'RootNavigator' |