adding stack navigator for each drawer

This commit is contained in:
balzack 2024-10-21 07:33:45 -07:00
parent 77d8853df3
commit 717274f91b
4 changed files with 10329 additions and 7185 deletions

View File

@ -1611,7 +1611,7 @@ SPEC CHECKSUMS:
RNVectorIcons: 845eda5c7819bd29699cafd0fc98c9d4afe28c96 RNVectorIcons: 845eda5c7819bd29699cafd0fc98c9d4afe28c96
SocketRocket: abac6f5de4d4d62d24e11868d7a2f427e0ef940d SocketRocket: abac6f5de4d4d62d24e11868d7a2f427e0ef940d
TOCropViewController: 80b8985ad794298fb69d3341de183f33d1853654 TOCropViewController: 80b8985ad794298fb69d3341de183f33d1853654
Yoga: 88480008ccacea6301ff7bf58726e27a72931c8d Yoga: 04f1db30bb810187397fa4c37dd1868a27af229c
PODFILE CHECKSUM: 8461018d8deceb200962c829584af7c2eb345c80 PODFILE CHECKSUM: 8461018d8deceb200962c829584af7c2eb345c80

View File

@ -16,6 +16,7 @@
"@react-navigation/drawer": "^6.7.2", "@react-navigation/drawer": "^6.7.2",
"@react-navigation/native": "^6.1.18", "@react-navigation/native": "^6.1.18",
"@react-navigation/native-stack": "^6.11.0", "@react-navigation/native-stack": "^6.11.0",
"@react-navigation/stack": "^6.4.1",
"@types/crypto-js": "^4.2.2", "@types/crypto-js": "^4.2.2",
"crypto-js": "^4.2.0", "crypto-js": "^4.2.0",
"databag-client-sdk": "^0.0.22", "databag-client-sdk": "^0.0.22",

View File

@ -1,5 +1,5 @@
import React, {useState} from 'react'; import React, {useState} from 'react';
import {View, useColorScheme} from 'react-native'; import {SafeAreaView, View, useColorScheme} from 'react-native';
import {styles} from './Session.styled'; import {styles} from './Session.styled';
import {BottomNavigation, Surface, Text} from 'react-native-paper'; import {BottomNavigation, Surface, Text} from 'react-native-paper';
import {Settings} from '../settings/Settings'; import {Settings} from '../settings/Settings';
@ -17,6 +17,7 @@ import {
DarkTheme, DarkTheme,
} from '@react-navigation/native'; } from '@react-navigation/native';
import {createDrawerNavigator} from '@react-navigation/drawer'; import {createDrawerNavigator} from '@react-navigation/drawer';
import { createStackNavigator } from '@react-navigation/stack';
const SettingsDrawer = createDrawerNavigator(); const SettingsDrawer = createDrawerNavigator();
const ContactsDrawer = createDrawerNavigator(); const ContactsDrawer = createDrawerNavigator();
@ -24,6 +25,9 @@ const RegistryDrawer = createDrawerNavigator();
const ProfileDrawer = createDrawerNavigator(); const ProfileDrawer = createDrawerNavigator();
const DetailsDrawer = createDrawerNavigator(); const DetailsDrawer = createDrawerNavigator();
const ContactStack = createStackNavigator();
const TopicStack = createStackNavigator();
export function Session() { export function Session() {
const {state} = useSession(); const {state} = useSession();
const scheme = useColorScheme(); const scheme = useColorScheme();
@ -51,7 +55,7 @@ export function Session() {
const sessionNav = {strings: state.strings}; const sessionNav = {strings: state.strings};
const ChannelsRoute = () => <Channels />; const ChannelsRoute = () => <Channels />;
const ContactsRoute = () => <Contacts openRegistry={()=>{console.log('openreg')}} openContact={(params: ContactParams)=>{console.log('opencon', params)}} />; const ContactsRoute = () => <ContactTab />;
const SettingsRoute = () => <Settings showLogout={true} />; const SettingsRoute = () => <Settings showLogout={true} />;
const renderScene = BottomNavigation.SceneMap({ const renderScene = BottomNavigation.SceneMap({
@ -63,13 +67,20 @@ export function Session() {
return ( return (
<View style={styles.screen}> <View style={styles.screen}>
{state.layout !== 'large' && ( {state.layout !== 'large' && (
<BottomNavigation <Surface elevation={2}>
barStyle={{ height: 92 }} <SafeAreaView style={{ width: '100%', height: '100%' }}>
labeled={false} <NavigationContainer
navigationState={{index, routes}} theme={scheme === 'dark' ? DarkTheme : DefaultTheme}>
onIndexChange={setIndex} <BottomNavigation
renderScene={renderScene} barStyle={{ height: 64 }}
/> labeled={false}
navigationState={{index, routes}}
onIndexChange={setIndex}
renderScene={renderScene}
/>
</NavigationContainer>
</SafeAreaView>
</Surface>
)} )}
{state.layout === 'large' && ( {state.layout === 'large' && (
<NavigationContainer <NavigationContainer
@ -81,6 +92,16 @@ export function Session() {
); );
} }
function ContactTab() {
return (
<ContactStack.Navigator initialRouteName="contacts" screenOptions={{ headerShown: false }}>
<ContactStack.Screen name="contacts" options={{ headerBackTitleVisible: false }}>
{(props) => <Contacts openRegistry={()=>{console.log('openreg')}} openContact={(params: ContactParams)=>{console.log('opencon', params)}} />}
</ContactStack.Screen>
</ContactStack.Navigator>
);
}
function DetailsScreen({nav}) { function DetailsScreen({nav}) {
return ( return (
<DetailsDrawer.Navigator <DetailsDrawer.Navigator

File diff suppressed because it is too large Load Diff