Entire Navigation Tree
Bogata69unknown
typescript
a year ago
2.9 kB
4
Indexable
const HomeStack = createBottomTabNavigator<HomeParams>(); const RootStack = createStackNavigator(); const SetupStack = createStackNavigator<AccountSetupParams>(); const EditorStack = createNativeStackNavigator<EditorParams>(); const screenOptions: StackNavigationOptions = { headerShown: false, gestureEnabled: true, }; type TabbarProps = { [P in keyof BottomTabBarProps]: BottomTabBarProps[P]; }; function SetupScreenStackNavigator() { return ( <SetupStack.Navigator initialRouteName={NavScreenNames.OnBoardScreen} screenOptions={screenOptions}> <SetupStack.Screen component={OnBoardScreen} name={NavScreenNames.OnBoardScreen} /> <SetupStack.Screen name={NavScreenNames.AuthScreen} component={AuthScreen} /> <SetupStack.Screen name={NavScreenNames.AccountSetupScreen} component={AccountSetupScreen} /> </SetupStack.Navigator> ); } function EditorStackNavigator() { return ( <EditorStack.Navigator screenOptions={{ headerShown: false, }} initialRouteName={NavScreenNames.FileSelectScreen}> <EditorStack.Screen options={{}} component={FileSelectScreen} name={NavScreenNames.FileSelectScreen} /> <EditorStack.Screen options={{}} component={Editor} name={NavScreenNames.EditorScreen} /> </EditorStack.Navigator> ); } function HomeStackNavigator() { return ( <HomeStack.Navigator detachInactiveScreens={false} tabBar={props => <Tabbar {...props} />} screenOptions={{ headerShown: false, freezeOnBlur: true, }} initialRouteName={NavScreenNames.HomeScreen}> <HomeStack.Screen component={HomeScreen} name={NavScreenNames.HomeScreen} /> <HomeStack.Screen component={ProfileScreen} name={NavScreenNames.ProfileScreen} /> </HomeStack.Navigator> ); } type Props = { initialRoute: string; }; export default function Navigation({initialRoute}: Props) { const me = useLocalProfile(); return ( <PaperProvider> <RootStack.Navigator screenOptions={{...screenOptions}} initialRouteName={initialRoute}> {me.user?.user_id ? ( <RootStack.Screen options={{detachPreviousScreen: false}} name={RootNavNames.HomeStack} component={HomeStackNavigator} /> ) : ( <RootStack.Screen name={RootNavNames.SetupStack} component={SetupScreenStackNavigator} /> )} <RootStack.Screen options={{...screenOptions, detachPreviousScreen: false}} name={RootNavNames.EditorStack} component={EditorStackNavigator} /> </RootStack.Navigator> </PaperProvider> ); }
Editor is loading...
Leave a Comment