diff --git a/app/client/mobile/src/registry/Registry.tsx b/app/client/mobile/src/registry/Registry.tsx index b5091c5e..01cf8a14 100644 --- a/app/client/mobile/src/registry/Registry.tsx +++ b/app/client/mobile/src/registry/Registry.tsx @@ -1,5 +1,7 @@ import React from 'react'; +import { IconButton } from 'react-native-paper'; +import { ContactParams } from '../profile/Profile'; -export function Registry() { - return <>; +export function Registry({ close, openContact }: { close: ()=>void, openContact: (params: ContactParams)=>void }) { + return } diff --git a/app/client/mobile/src/session/Session.styled.ts b/app/client/mobile/src/session/Session.styled.ts index 7dfed9d2..fddfae2a 100644 --- a/app/client/mobile/src/session/Session.styled.ts +++ b/app/client/mobile/src/session/Session.styled.ts @@ -1,7 +1,7 @@ import {StyleSheet} from 'react-native'; export const styles = StyleSheet.create({ - screen: { + container: { width: '100%', height: '100%', }, @@ -22,4 +22,31 @@ export const styles = StyleSheet.create({ channels: { flexGrow: 1, }, + screen: { + width: '100%', + height: '100%', + display: 'flex', + flexDirection: 'column', + }, + body: { + width: '100%', + flexGrow: 1, + flexShrink: 1, + }, + tabs: { + flexShrink: 0, + height: 64, + width: '100%', + displlay: 'flex', + flexDirection: 'row', + }, + idleTab: { + flex: 1, + backgroundColor: 'transparent', + opacity: 0.5, + }, + activeTab: { + flex: 1, + backgroundColor: 'transparent', + } }); diff --git a/app/client/mobile/src/session/Session.tsx b/app/client/mobile/src/session/Session.tsx index df10861a..d1652479 100644 --- a/app/client/mobile/src/session/Session.tsx +++ b/app/client/mobile/src/session/Session.tsx @@ -1,7 +1,7 @@ import React, {useState} from 'react'; import {SafeAreaView, View, useColorScheme} from 'react-native'; import {styles} from './Session.styled'; -import {BottomNavigation, Surface, Text} from 'react-native-paper'; +import {IconButton, Surface, Text} from 'react-native-paper'; import {Settings} from '../settings/Settings'; import {Channels} from '../channels/Channels'; import {Contacts} from '../contacts/Contacts'; @@ -26,59 +26,55 @@ const ProfileDrawer = createDrawerNavigator(); const DetailsDrawer = createDrawerNavigator(); const ContactStack = createStackNavigator(); -const TopicStack = createStackNavigator(); +const ContentStack = createStackNavigator(); export function Session() { const {state} = useSession(); const scheme = useColorScheme(); - const [index, setIndex] = useState(0); - const [routes] = useState([ - { - key: 'channels', - title: 'Channels', - focusedIcon: 'comment-multiple', - unfocusedIcon: 'comment-multiple-outline', - }, - { - key: 'contacts', - title: 'Contacts', - focusedIcon: 'contacts', - unfocusedIcon: 'contacts-outline', - }, - { - key: 'settings', - title: 'Settings', - focusedIcon: 'cog', - unfocusedIcon: 'cog-outline', - }, - ]); + const [tab, setTab] = useState('content'); + const sessionNav = {strings: state.strings}; const ChannelsRoute = () => ; const ContactsRoute = () => ; const SettingsRoute = () => ; - const renderScene = BottomNavigation.SceneMap({ - channels: ChannelsRoute, - contacts: ContactsRoute, - settings: SettingsRoute, - }); - return ( - + {state.layout !== 'large' && ( - - - + + + + + + + + + + + + { tab === 'content' && ( + {setTab('content')}} /> + )} + { tab !== 'content' && ( + {setTab('content')}} /> + )} + { tab === 'contacts' && ( + {setTab('contacts')}} /> + )} + { tab !== 'contacts' && ( + {setTab('contacts')}} /> + )} + { tab === 'settings' && ( + {setTab('settings')}} /> + )} + { tab !== 'settings' && ( + {setTab('settings')}} /> + )} + + )} @@ -92,13 +88,31 @@ export function Session() { ); } -function ContactTab() { +function ContentTab({ scheme }: { scheme: string }) { return ( + - - {(props) => {console.log('openreg')}} openContact={(params: ContactParams)=>{console.log('opencon', params)}} />} + + {(props) => CONTENT} + + ); +} + +function ContactTab({ scheme }: { scheme: string }) { + return ( + + + + {(props) => {props.navigation.navigate('registry')}} openContact={(params: ContactParams)=>{console.log('opencon', params)}} />} + + + {(props) => {console.log('opencon', params)}} />} + + + ); } diff --git a/app/client/mobile/src/settings/Settings.tsx b/app/client/mobile/src/settings/Settings.tsx index d2afbc2f..49f968f8 100644 --- a/app/client/mobile/src/settings/Settings.tsx +++ b/app/client/mobile/src/settings/Settings.tsx @@ -326,7 +326,7 @@ export function Settings({showLogout}: {showLogout: boolean}) { }; return ( - <> + - + ); }