diff --git a/app/mobile/src/session/Session.jsx b/app/mobile/src/session/Session.jsx
index 75d415c3..94f78e84 100644
--- a/app/mobile/src/session/Session.jsx
+++ b/app/mobile/src/session/Session.jsx
@@ -49,24 +49,46 @@ export function Session() {
 
   // tabbed containers
   const ConversationStackScreen = () => {
+
+    const [selected, setSelected] = useState(null);
+    const setConversation = (navigation, cardId, channelId) => {
+      setSelected({ cardId, channelId });
+      navigation.navigate('conversation');
+    }
+    const clearConversation = (navigation) => {
+      navigation.goBack();
+    }
+    const setDetail = (navigation) => {
+      navigation.navigate('details');
+    }
+    const clearDetail = (navigation) => {
+      navigation.goBack();
+    }
+
     return (
       <ConversationStack.Navigator screenOptions={({ route }) => ({ headerShown: false })}>
-        <ConversationStack.Screen name="channels" component={ChannelsTabScreen} />
-        <ConversationStack.Screen name="conversation" component={ConversationTabScreen} />
-        <ConversationStack.Screen name="details" component={DetailsTabScreen} />
+        <ConversationStack.Screen name="channels">
+          {(props) => <ChannelsTabScreen openConversation={setConversation} navigation={props.navigation} />}
+        </ConversationStack.Screen>
+        <ConversationStack.Screen name="conversation">
+          {(props) => <ConversationTabScreen channel={selected} closeConversation={clearConversation} openDetails={setDetail} navigation={props.navigation} />}
+        </ConversationStack.Screen>
+        <ConversationStack.Screen name="details">
+          {(props) => <DetailsTabScreen channel={selected} closeDetails={clearDetail} navigation={props.navigation} />}
+        </ConversationStack.Screen>
       </ConversationStack.Navigator>
     );
   }
-  const ChannelsTabScreen = ({ navigation }) => {
+  const ChannelsTabScreen = ({ navigation, openConversation }) => {
     return (
       <Channels openConversation={(cardId, channelId) => openConversation(navigation, cardId, channelId)} />
     )
   }
-  const ConversationTabScreen = ({ navigation }) => {
-    return <Conversation closeConversation={() => closeConversation(navigation)} openDetails={() => openDetails(navigation)} />
+  const ConversationTabScreen = ({ navigation, channel, closeConversation, openDetails }) => {
+    return <Conversation channel={channel} closeConversation={() => closeConversation(navigation)} openDetails={() => openDetails(navigation)} />
   }
-  const DetailsTabScreen = ({ navigation }) => {
-    return <Details closeDetails={() => closeDetails(navigation)} />
+  const DetailsTabScreen = ({ navigation, channel, closeDetails }) => {
+    return <Details channel={channel} closeDetails={() => closeDetails(navigation)} />
   }
   const ProfileStackScreen = () => {
     return (
@@ -129,10 +151,10 @@ export function Session() {
       </View>
     )
   }
-  const DetailDrawerContent = ({ navigation }) => {
+  const DetailDrawerContent = ({ channel, navigation }) => {
     return (
       <SafeAreaView>
-        <Details closeDetails={() => closeDetails(navigation)} />
+        <Details channel={channel} closeDetails={() => {}} />
       </SafeAreaView>
     )
   }
@@ -148,7 +170,16 @@ export function Session() {
     )
   }
 
-  const HomeScreen = ({ cardNav, registryNav, detailNav, contactNav, profileNav }) => {
+  const HomeScreen = ({ cardNav, registryNav, detailNav, contactNav, profileNav, setConversation, setDetail }) => {
+
+    const [channel, setChannel] = useState(null);
+    const setTopic = (cardId, channelId) => {
+      setChannel({ cardId, channelId });
+    };
+    const clearTopic = () => {
+      setChannel(null);
+    };
+
     return (
       <View style={styles.home}>
         <SafeAreaView edges={['top', 'bottom']} style={styles.sidebar}>
@@ -163,14 +194,14 @@ export function Session() {
             </TouchableOpacity>
           </SafeAreaView>
           <View style={styles.channels}>
-            <Channels openConversation={(cardId, channelId) => openConversation(null, cardId, channelId)} />
+            <Channels openConversation={setTopic} />
           </View>
         </SafeAreaView>
         <View style={styles.conversation}>
-          { state.conversationId && (
-            <Conversation closeConversation={() => closeConversation(null)} openDetails={() => openDetails(detailNav)} />
+          { channel && (
+            <Conversation channel={channel} closeConversation={clearTopic} openDetails={() => setDetail(detailNav, channel)} />
           )}
-          { !state.conversationId && (
+          { !channel && (
             <Welcome />
           )} 
         </View>
@@ -178,7 +209,7 @@ export function Session() {
     )
   }
 
-  const CardDrawerScreen = ({ registryNav, detailNav, contactNav, profileNav, setContact }) => {
+  const CardDrawerScreen = ({ registryNav, detailNav, contactNav, profileNav, setContact, setDetail }) => {
 
     const openRegistry = () => {
       registryNav.openDrawer();
@@ -188,25 +219,25 @@ export function Session() {
       <CardDrawer.Navigator screenOptions={{ drawerPosition: 'right', headerShown: false, swipeEnabled: false, drawerType: 'front', drawerStyle: { width: state.baseWidth } }}
         drawerContent={(props) => <CardDrawerContent setContact={setContact} openRegistry={openRegistry} {...props} />}>
         <CardDrawer.Screen name="home">
-          {(props) => <HomeScreen cardNav={props.navigation} registryNav={registryNav} detailNav={detailNav} contactNav={contactNav} profileNav={profileNav} setContact={setContact} />}
+          {(props) => <HomeScreen cardNav={props.navigation} registryNav={registryNav} detailNav={detailNav} contactNav={contactNav} profileNav={profileNav} setContact={setContact} setDetail={setDetail} />}
         </CardDrawer.Screen>
       </CardDrawer.Navigator>
     );
   };
 
-  const RegistryDrawerScreen = ({ detailNav, contactNav, profileNav, setContact }) => {
+  const RegistryDrawerScreen = ({ detailNav, contactNav, profileNav, setContact, setDetail }) => {
 
     return (
       <RegistryDrawer.Navigator screenOptions={{ drawerPosition: 'right', headerShown: false, swipeEnabled: false, drawerType: 'front', drawerStyle: { width: state.baseWidth } }}
         drawerContent={(props) => <RegistryDrawerContent setContact={setContact} {...props} />}>
         <RegistryDrawer.Screen name="card">
-          {(props) => <CardDrawerScreen registryNav={props.navigation} detailNav={detailNav} contactNav={contactNav} profileNav={profileNav} setContact={setContact} />}
+          {(props) => <CardDrawerScreen registryNav={props.navigation} detailNav={detailNav} contactNav={contactNav} profileNav={profileNav} setContact={setContact} setDetail={setDetail} />}
         </RegistryDrawer.Screen>
       </RegistryDrawer.Navigator>
     );
   };
 
-  const ContactDrawerScreen = ({ detailNav, profileNav }) => {
+  const ContactDrawerScreen = ({ detailNav, profileNav, setDetail }) => {
 
     const [selected, setSelected] = useState(null);
     const setContact = (navigation, contact) => {
@@ -218,32 +249,39 @@ export function Session() {
       <ContactDrawer.Navigator screenOptions={{ drawerPosition: 'right', headerShown: false, swipeEnabled: false, drawerType: 'front', drawerStyle: { width: state.subWidth } }}
         drawerContent={(props) => <ContactDrawerContent contact={selected} {...props} />}>
         <ContactDrawer.Screen name="registry">
-          {(props) => <RegistryDrawerScreen detailNav={detailNav} profileNav={profileNav} contactNav={props.navigation} setContact={(contact) => setContact(props.navigation, contact)} />}
+          {(props) => <RegistryDrawerScreen detailNav={detailNav} profileNav={profileNav} contactNav={props.navigation} setContact={(contact) => setContact(props.navigation, contact)} setDetail={setDetail} />}
         </ContactDrawer.Screen>
       </ContactDrawer.Navigator>
     );
   }
 
-  const ProfileDrawerScreen = ({ detailNav }) => {
+  const DetailDrawerScreen = ({ profileNav }) => {
+
+    const [selected, setSelected] = useState(null);
+    const setDetail = (navigation, channel) => {
+      setSelected(channel);
+      navigation.openDrawer();
+    };
+  
     return (
-      <ProfileDrawer.Navigator screenOptions={{ drawerPosition: 'right', headerShown: false, swipeEnabled: false, drawerType: 'front', drawerStyle: { width: state.subWidth } }}
-        drawerContent={(props) => <ProfileDrawerContent {...props} />}>
-        <ProfileDrawer.Screen name="contact">
-          {(props) => <ContactDrawerScreen detailNav={detailNav} profileNav={props.navigation}/>}
-        </ProfileDrawer.Screen>
-      </ProfileDrawer.Navigator>
+      <DetailDrawer.Navigator screenOptions={{ drawerPosition: 'right', headerShown: false, swipeEnabled: false, drawerType: 'front', drawerStyle: { width: state.subWidth } }}
+        drawerContent={(props) => <DetailDrawerContent channel={selected} {...props} />}>
+        <DetailDrawer.Screen name="contact">
+          {(props) => <ContactDrawerScreen profileNav={profileNav} detailNav={props.navigation} setDetail={setDetail} />}
+        </DetailDrawer.Screen>
+      </DetailDrawer.Navigator>
     );
   }
 
   return (
     <View style={styles.container}>
       { state.tabbed === false && (
-        <DetailDrawer.Navigator screenOptions={{ drawerPosition: 'right', headerShown: false, swipeEnabled: false, drawerType: 'front', drawerStyle: { width: state.subWidth } }}
-          drawerContent={(props) => <DetailDrawerContent {...props} />}>
-          <DetailDrawer.Screen name="profile">
-            {(props) => <ProfileDrawerScreen detailNav={props.navigation} />}
-          </DetailDrawer.Screen>
-        </DetailDrawer.Navigator>
+        <ProfileDrawer.Navigator screenOptions={{ drawerPosition: 'right', headerShown: false, swipeEnabled: false, drawerType: 'front', drawerStyle: { width: state.subWidth } }}
+          drawerContent={(props) => <ProfileDrawerContent {...props} />}>
+          <ProfileDrawer.Screen name="detail">
+            {(props) => <DetailDrawerScreen profileNav={props.navigation}/>}
+          </ProfileDrawer.Screen>
+        </ProfileDrawer.Navigator>
       )}
       { state.tabbed === true && (
         <Tab.Navigator
diff --git a/app/mobile/src/session/channels/Channels.jsx b/app/mobile/src/session/channels/Channels.jsx
index 58198b33..d7fa5d55 100644
--- a/app/mobile/src/session/channels/Channels.jsx
+++ b/app/mobile/src/session/channels/Channels.jsx
@@ -7,7 +7,7 @@ import { ChannelItem } from './channelItem/ChannelItem';
 import Colors from 'constants/Colors';
 import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
 
-export function Channels() {
+export function Channels({ openConversation }) {
   const { state, actions } = useChannels();
   return (
     <View style={styles.container}>
@@ -27,7 +27,7 @@ export function Channels() {
           </View>
           <FlatList style={styles.channels}
             data={state.channels}
-            renderItem={({ item }) => <ChannelItem item={item} />}
+            renderItem={({ item }) => <ChannelItem item={item} openConversation={openConversation} />}
             keyExtractor={item => (`${item.cardId}:${item.channelId}`)}
           />
         </>
@@ -45,7 +45,7 @@ export function Channels() {
           <SafeAreaView style={styles.channels} edges={['left']}>
             <FlatList 
               data={state.channels}
-              renderItem={({ item }) => <ChannelItem item={item} />}
+              renderItem={({ item }) => <ChannelItem item={item} openConversation={openConversation} />}
               keyExtractor={item => (`${item.cardId}:${item.channelId}`)}
             />
           </SafeAreaView>
diff --git a/app/mobile/src/session/channels/channelItem/ChannelItem.jsx b/app/mobile/src/session/channels/channelItem/ChannelItem.jsx
index 7ab21cd6..ea31739e 100644
--- a/app/mobile/src/session/channels/channelItem/ChannelItem.jsx
+++ b/app/mobile/src/session/channels/channelItem/ChannelItem.jsx
@@ -3,12 +3,12 @@ import { Logo } from 'utils/Logo';
 import { styles } from './ChannelItem.styled';
 import { useChannelItem } from './useChannelItem.hook';
 
-export function ChannelItem({ item }) {
+export function ChannelItem({ item, openConversation }) {
 
   const { state, actions } = useChannelItem(item);
 
   return (
-    <TouchableOpacity style={styles.container} activeOpacity={1} onPress={actions.setRead}>
+    <TouchableOpacity style={styles.container} activeOpacity={1} onPress={() => openConversation(item.cardId, item.channelId)}>
       <Logo src={item.logo} width={32} height={32} radius={6} />
       <View style={styles.detail}>
         <Text style={styles.subject} numberOfLines={1} ellipsizeMode={'tail'}>{ item.subject }</Text>
diff --git a/app/mobile/src/session/conversation/Conversation.jsx b/app/mobile/src/session/conversation/Conversation.jsx
index 469194bc..7ce87a63 100644
--- a/app/mobile/src/session/conversation/Conversation.jsx
+++ b/app/mobile/src/session/conversation/Conversation.jsx
@@ -1,4 +1,23 @@
-export function Conversation() {
-  return <></>
+import { View, TouchableOpacity, Text } from 'react-native';
+
+export function Conversation({ channel, closeConversation, openDetails }) {
+  
+  return (
+    <View>
+      <Text>CHANNEL</Text>
+      { channel && (
+        <>
+          <Text>{ channel.cardId }</Text>
+          <Text>{ channel.channelId }</Text>
+        </>
+      )}
+      <TouchableOpacity onPress={openDetails}>
+        <Text>DETAILS</Text>
+      </TouchableOpacity>
+      <TouchableOpacity onPress={closeConversation}>
+        <Text>CLOSE</Text>
+      </TouchableOpacity>
+    </View>
+  );
 }
 
diff --git a/app/mobile/src/session/details/Details.jsx b/app/mobile/src/session/details/Details.jsx
index e6c27388..8bc9c534 100644
--- a/app/mobile/src/session/details/Details.jsx
+++ b/app/mobile/src/session/details/Details.jsx
@@ -1,4 +1,19 @@
-export function Details() {
-  return <></>
+import { View, Text, TouchableOpacity } from 'react-native';
+
+export function Details({ channel, closeDetails }) {
+  return (
+    <View>
+      <Text>DETAILS</Text>
+      { channel && (
+        <>
+          <Text>{ channel.cardId }</Text>
+          <Text>{ channel.channelId }</Text>
+        </>
+      )}
+      <TouchableOpacity onPress={closeDetails}>
+        <Text>CLOSE</Text>
+      </TouchableOpacity>
+    </View>
+  )
 }
 
diff --git a/app/mobile/src/session/profile/Profile.jsx b/app/mobile/src/session/profile/Profile.jsx
index 985bf340..e00bd69a 100644
--- a/app/mobile/src/session/profile/Profile.jsx
+++ b/app/mobile/src/session/profile/Profile.jsx
@@ -133,7 +133,7 @@ export function Profile() {
           <Text style={styles.linkText}>Manage Blocked Contacts</Text>
         </TouchableOpacity>
         <TouchableOpacity style={styles.link} onPress={actions.showBlockedChannels}>
-          <Text style={styles.linkText}>Manager Blocked Topics</Text>
+          <Text style={styles.linkText}>Manage Blocked Topics</Text>
         </TouchableOpacity>
         <TouchableOpacity style={styles.logout} onPress={logout}>
           <Ionicons name="logout" size={14} color={Colors.white} />
diff --git a/app/mobile/src/session/profile/Profile.styled.js b/app/mobile/src/session/profile/Profile.styled.js
index 23b99a40..b5f2e081 100644
--- a/app/mobile/src/session/profile/Profile.styled.js
+++ b/app/mobile/src/session/profile/Profile.styled.js
@@ -23,6 +23,7 @@ export const styles = StyleSheet.create({
     fontSize: 16,
     paddingRight: 4,
     textDecorationLine: 'underline',
+    color: Colors.primary,
   },
   camera: {
     position: 'absolute',