diff --git a/app/mobile/src/constants/Colors.js b/app/mobile/src/constants/Colors.js
index c19185f7..ca846ce3 100644
--- a/app/mobile/src/constants/Colors.js
+++ b/app/mobile/src/constants/Colors.js
@@ -17,6 +17,7 @@ const LightColors = {
   descriptionText: '#888888',
   text: '#444444',
   screenBase: '#dddddd',
+  drawerBase: '#eeeeee',
   areaBase: '#ffffff',
   modalBase: '#ffffff',
   modalOverlay: 'rgba(52,52,52,0.8)',
@@ -69,6 +70,7 @@ const DarkColors = {
   descriptionText: '#bbbbbb',
   text: '#ffffff',
   screenBase: '#222222',
+  drawerBase: '#333333',
   areaBase: '#444444',
   modalBase: '#111111',
   modalOverlay: 'rgba(88,88,88,0.8)',
@@ -124,6 +126,7 @@ export const Colors = {
   descriptionText: getColor('descriptionText'),
   text: getColor('text'),
   screenBase: getColor('screenBase'),
+  drawerBase: getColor('drawerBase'),
   areaBase: getColor('areaBase'),
   modalOverlay: getColor('modalOverlay'),
   modalBase: getColor('modalBase'),
diff --git a/app/mobile/src/session/Session.jsx b/app/mobile/src/session/Session.jsx
index 1a4a3170..034fd836 100644
--- a/app/mobile/src/session/Session.jsx
+++ b/app/mobile/src/session/Session.jsx
@@ -11,6 +11,7 @@ import { useSession } from './useSession.hook';
 import { styles } from './Session.styled';
 import Colors from 'constants/Colors';
 import { Profile } from './profile/Profile';
+import { ProfileSettings } from './profileSettings/ProfileSettings';
 import { CardsHeader, CardsBody, Cards } from './cards/Cards';
 import { RegistryHeader, RegistryBody, Registry } from './registry/Registry';
 import { ContactHeader, ContactBody, Contact } from './contact/Contact';
@@ -433,7 +434,7 @@ export function Session({ sharing, clearSharing }) {
           <View style={styles.container}>
             { state.tabbed === false && (
               <ProfileDrawer.Navigator screenOptions={{ ...drawerParams, drawerStyle: { width: '45%' } }} drawerContent={(props) => (
-                  <ScrollView style={styles.drawer}><SafeAreaView edges={['top', 'bottom', 'right']}><Profile /></SafeAreaView></ScrollView>
+                  <ProfileSettings />
                 )}>
                 <ProfileDrawer.Screen name="detail">
                   {(props) => <DetailDrawerScreen navParams={{ profileNav: props.navigation, state, actions, addChannel, dmChannel, shareChannel, shareIntent, setShareIntent }} />}
diff --git a/app/mobile/src/session/Session.styled.js b/app/mobile/src/session/Session.styled.js
index d6b2dbe6..ff1ad439 100644
--- a/app/mobile/src/session/Session.styled.js
+++ b/app/mobile/src/session/Session.styled.js
@@ -95,7 +95,7 @@ export const styles = StyleSheet.create({
     paddingTop: 8,
     paddingLeft: 8,
     paddingRight: 8,
-    backgroundColor: Colors.formBackground,
+    backgroundColor: Colors.drawerBase,
   },
   options: {
     display: 'flex',
diff --git a/app/mobile/src/session/profile/Profile.jsx b/app/mobile/src/session/profile/Profile.jsx
index 1b6e93a9..4c7b67d1 100644
--- a/app/mobile/src/session/profile/Profile.jsx
+++ b/app/mobile/src/session/profile/Profile.jsx
@@ -13,7 +13,7 @@ import { useProfile } from './useProfile.hook';
 import { styles } from './Profile.styled';
 import avatar from 'images/avatar.png';
 
-export function Profile() {
+export function Profile({ drawer }) {
 
   const [busyDetail, setBusyDetail] = useState(false);
   const { state, actions } = useProfile();
@@ -71,79 +71,87 @@ export function Profile() {
   }
 
   return (
-    <View style={styles.container}>
-      <Image source={state.imageSource} style={{ ...styles.logo, width: state.imageWidth, height: state.imageHeight }} resizeMode={'contain'} />
-
-    <View style={styles.content}>
-      <View style={{ width: state.imageWidth, height: state.imageHeight - OVERLAP }} />
-
-        <View style={styles.control}>
-          <Menu>
-            <MenuTrigger customStyles={styles.trigger}>
-              <View style={styles.edit}>
-                <Text style={styles.editLabel}>{ state.strings.edit }</Text>
-                <MatIcons name="square-edit-outline" size={14} color={Colors.linkText} />
-              </View>
-            </MenuTrigger>
-            <MenuOptions optionsContainerStyle={{ width: 'auto' }} style={styles.options}>
-              <MenuOption onSelect={onGallery}>
-                <Text style={styles.option}>{ state.strings.editImage }</Text>
-              </MenuOption>
-              <MenuOption onSelect={actions.showDetails}>
-                <Text style={styles.option}>{ state.strings.editDetails }</Text>
-              </MenuOption>
-            </MenuOptions>
-          </Menu>
-        </View>
-
-
-      <View style={{ ...styles.details, width: state.detailWidth }}>
-
-        { state.name && (
-          <Text style={styles.nameSet} numberOfLines={1} adjustsFontSizeToFit={true}>{ state.name }</Text>
-        )}
-        { !state.name && (
-          <Text style={styles.nameUnset}>{ state.strings.name }</Text>
-        )}
-
-        <Text style={styles.username} numberOfLines={1}>{ state.username }</Text>
-
-        <View style={styles.attributes}>
-          <View style={styles.entry}>
-            <AntIcons name="enviromento" style={styles.icon} size={20} color={Colors.text} />
-            { state.location && (
-              <Text style={styles.locationSet}>{ state.location }</Text>
-            )}
-            { !state.location && (
-              <Text style={styles.locationUnset}>Location</Text>
-            )}
-          </View>
-          <View style={styles.divider} />
-          <ScrollView style={styles.description}>
-            <View style={styles.entry}>
-            <MatIcons name="book-open-outline" style={styles.descriptionIcon} size={20} color={Colors.text} />
-            { state.description && (
-              <Text style={styles.descriptionSet}>{ state.description }</Text>
-            )}
-            { !state.description && (
-              <Text style={styles.descriptionUnset}>Description</Text>
-            )}
+    <>
+      { drawer && (
+        <View style={styles.drawerContainer}>
+          <Text style={styles.drawerHeader} adjustsFontSizeToFit={true}>{ state.username }</Text>
+          <View style={styles.drawerFrame}>
+            <Image source={state.imageSource} style={styles.drawerLogo} resizeMode={'contain'} />
+            <View style={styles.drawerLogoEdit}>
+              <Text style={styles.editLabel}>{ state.strings.edit }</Text>
+              <MatIcons name="square-edit-outline" size={14} color={Colors.linkText} />
             </View>
-          </ScrollView>
+          </View>
         </View>
-
-        <View style={styles.group}>
-          <TouchableOpacity style={styles.entry} activeOpacity={1}>
-            <MatIcons name="eye-outline" style={styles.icon} size={20} color={Colors.text} />
-            <TouchableOpacity activeOpacity={1} onPress={() => setVisible(!state.searchable)}>
-              <Text style={styles.visibleLabel}>{ state.strings.visibleRegistry }</Text>
-            </TouchableOpacity>
-            <Switch value={state.searchable} style={Platform.OS==='ios' ? styles.visibleSwitch : {}} thumbColor={Colors.sliderGrip} ios_backgroundColor={Colors.disabledIndicator}
-                trackColor={styles.track} onValueChange={setVisible} />
-          </TouchableOpacity>
+      )}
+      { !drawer && (
+        <View style={styles.container}>
+          <Image source={state.imageSource} style={{ ...styles.logo, width: state.imageWidth, height: state.imageHeight }} resizeMode={'contain'} />
+          <View style={styles.content}>
+            <View style={{ width: state.imageWidth, height: state.imageHeight - OVERLAP }} />
+            <View style={styles.control}>
+              <Menu>
+                <MenuTrigger customStyles={styles.trigger}>
+                  <View style={styles.edit}>
+                    <Text style={styles.editLabel}>{ state.strings.edit }</Text>
+                    <MatIcons name="square-edit-outline" size={14} color={Colors.linkText} />
+                  </View>
+                </MenuTrigger>
+                <MenuOptions optionsContainerStyle={{ width: 'auto' }} style={styles.options}>
+                  <MenuOption onSelect={onGallery}>
+                    <Text style={styles.option}>{ state.strings.editImage }</Text>
+                  </MenuOption>
+                  <MenuOption onSelect={actions.showDetails}>
+                    <Text style={styles.option}>{ state.strings.editDetails }</Text>
+                  </MenuOption>
+                </MenuOptions>
+              </Menu>
+            </View>
+            <View style={{ ...styles.details, width: state.detailWidth }}>
+              { state.name && (
+                <Text style={styles.nameSet} numberOfLines={1} adjustsFontSizeToFit={true}>{ state.name }</Text>
+              )}
+              { !state.name && (
+                <Text style={styles.nameUnset}>{ state.strings.name }</Text>
+              )}
+              <Text style={styles.username} numberOfLines={1}>{ state.username }</Text>
+              <View style={styles.attributes}>
+                <View style={styles.entry}>
+                  <AntIcons name="enviromento" style={styles.icon} size={20} color={Colors.text} />
+                  { state.location && (
+                    <Text style={styles.locationSet}>{ state.location }</Text>
+                  )}
+                  { !state.location && (
+                    <Text style={styles.locationUnset}>Location</Text>
+                  )}
+                </View>
+                <View style={styles.divider} />
+                <ScrollView style={styles.description}>
+                  <View style={styles.entry}>
+                  <MatIcons name="book-open-outline" style={styles.descriptionIcon} size={20} color={Colors.text} />
+                  { state.description && (
+                    <Text style={styles.descriptionSet}>{ state.description }</Text>
+                  )}
+                  { !state.description && (
+                    <Text style={styles.descriptionUnset}>Description</Text>
+                  )}
+                  </View>
+                </ScrollView>
+              </View>
+              <View style={styles.group}>
+                <TouchableOpacity style={styles.entry} activeOpacity={1}>
+                  <MatIcons name="eye-outline" style={styles.icon} size={20} color={Colors.text} />
+                  <TouchableOpacity activeOpacity={1} onPress={() => setVisible(!state.searchable)}>
+                    <Text style={styles.visibleLabel}>{ state.strings.visibleRegistry }</Text>
+                  </TouchableOpacity>
+                  <Switch value={state.searchable} style={Platform.OS==='ios' ? styles.visibleSwitch : {}} thumbColor={Colors.sliderGrip} ios_backgroundColor={Colors.disabledIndicator}
+                      trackColor={styles.track} onValueChange={setVisible} />
+                </TouchableOpacity>
+              </View>
+            </View>
+          </View>
         </View>
-
-      </View>
+      )}
 
       <Modal
         animationType="fade"
@@ -212,8 +220,7 @@ export function Profile() {
         </View>
       </Modal>
 
-    </View>
-    </View>
+    </>
   );
 }
 
diff --git a/app/mobile/src/session/profile/Profile.styled.js b/app/mobile/src/session/profile/Profile.styled.js
index aa923585..94cccb58 100644
--- a/app/mobile/src/session/profile/Profile.styled.js
+++ b/app/mobile/src/session/profile/Profile.styled.js
@@ -2,6 +2,43 @@ import { StyleSheet } from 'react-native';
 import { Colors } from 'constants/Colors';
 
 export const styles = StyleSheet.create({
+  drawerContainer: {
+    width: '100%',
+    display: 'flex',
+    alignItems: 'center',
+  },
+  drawerHeader: {
+    fontFamily: 'roboto',
+    color: Colors.text,
+    fontSize: 20,
+    padding: 16,
+  },
+  drawerFrame: {
+    width: '50%',
+    maxWidth: 400,
+    paddingBottom: 16,
+  },
+  drawerLogo: {
+    aspectRatio: 1,
+    resizeMode: 'contain',
+    borderRadius: 8,
+    width: null,
+    height: null,
+  },
+  drawerLogoEdit: {
+    position: 'absolute',
+    top: 0,
+    display: 'flex',
+    flexDirection: 'row',
+    alignItems: 'center',
+    alignSelf: 'center',
+    backgroundColor: 'rgba(255,255,255,0.6)',
+    paddingLeft: 8,
+    paddingRight: 8,
+    borderBottomLeftRadius: 6,
+    borderBottomRightRadius: 6,
+  },
+
   container: {
     width: '100%',
     height: '100%',
diff --git a/app/mobile/src/session/profile/blockedContacts/BlockedContacts.jsx b/app/mobile/src/session/profile/blockedContacts/BlockedContacts.jsx
deleted file mode 100644
index e8c0df4b..00000000
--- a/app/mobile/src/session/profile/blockedContacts/BlockedContacts.jsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import { FlatList, View, Alert, TouchableOpacity, Text } from 'react-native';
-import { styles } from './BlockedContacts.styled';
-import { useBlockedContacts } from './useBlockedContacts.hook';
-import { Logo } from 'utils/Logo';
-
-export function BlockedContacts() {
-
-  const { state, actions } = useBlockedContacts();
-
-  const unblock = (cardId) => {
-    Alert.alert(
-      'Unblocking Contact',
-      'Confirm?',
-      [
-        { text: "Cancel", onPress: () => {}, },
-        { text: "Unblock", onPress: () => actions.unblock(cardId) },
-      ],
-    );
-  };
-
-  const BlockedItem = ({ item }) => {
-    return (
-      <TouchableOpacity style={styles.item} onPress={() => unblock(item.cardId)}>
-        <Logo src={item.logo} width={32} height={32} radius={6} />
-        <View style={styles.detail}>
-          <Text style={styles.name} numberOfLines={1} ellipsizeMode={'tail'}>{ item.name }</Text>
-          <Text style={styles.handle} numberOfLines={1} ellipsizeMode={'tail'}>{ item.handle }</Text>
-        </View>
-      </TouchableOpacity>
-    )
-  }
-
-  return (
-    <View style={styles.container}>
-      { state.cards.length === 0 && (
-        <Text style={styles.default}>No Blocked Contacts</Text>
-      )}
-      { state.cards.length !== 0 && (
-        <FlatList 
-          data={state.cards}
-          renderItem={({item}) => <BlockedItem item={item} />}
-          keyExtractor={item => item.cardId}
-        />
-      )}
-    </View>
-  );
-}
-
diff --git a/app/mobile/src/session/profile/blockedContacts/BlockedContacts.styled.js b/app/mobile/src/session/profile/blockedContacts/BlockedContacts.styled.js
deleted file mode 100644
index 18a5c33d..00000000
--- a/app/mobile/src/session/profile/blockedContacts/BlockedContacts.styled.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import { StyleSheet } from 'react-native';
-import { Colors } from 'constants/Colors';
-
-export const styles = StyleSheet.create({
-  container: {
-    backgroundColor: Colors.white,
-    display: 'flex',
-    width: '100%',
-    justifyContent: 'center',
-    fontSize: 14,
-    height: 200,
-  },
-  default: {
-    textAlign: 'center',
-    color: Colors.grey,
-  },
-  item: {
-    width: '100%',
-    display: 'flex',
-    flexDirection: 'row',
-    height: 48,
-    paddingLeft: 16,
-    alignItems: 'center',
-    borderBottomWidth: 1,
-    borderColor: Colors.itemDivider,
-  },
-  detail: {
-    paddingLeft: 12,
-    display: 'flex',
-    flexDirection: 'column',
-    justifyContent: 'center',
-    flexGrow: 1,
-    flexShrink: 1,
-  },
-  name: {
-    color: Colors.text,
-    fontSize: 14,
-  },
-  handle: {
-    color: Colors.text,
-    fontSize: 12,
-  },
-});
diff --git a/app/mobile/src/session/profile/blockedContacts/useBlockedContacts.hook.js b/app/mobile/src/session/profile/blockedContacts/useBlockedContacts.hook.js
deleted file mode 100644
index cd860c10..00000000
--- a/app/mobile/src/session/profile/blockedContacts/useBlockedContacts.hook.js
+++ /dev/null
@@ -1,53 +0,0 @@
-import { useState, useEffect, useContext } from 'react';
-import { CardContext } from 'context/CardContext';
-
-export function useBlockedContacts() {
-
-  const [state, setState] = useState({
-    cards: [],
-  });
-
-  const card = useContext(CardContext);
-
-  const updateState = (value) => {
-    setState((s) => ({ ...s, ...value }));
-  }
-
-  const setCardItem = (item) => {
-    const { profile } = item;
-    return {
-      cardId: item.cardId,
-      name: profile?.name,
-      handle: `${profile?.handle}@${profile?.node}`,
-      blocked: item.blocked,
-      logo: profile?.imageSet ? card.actions.getCardImageUrl(item.cardId) : 'avatar',
-    }
-  };
-
-  useEffect(() => {
-    const cards = Array.from(card.state.cards.values());
-    const items = cards.map(setCardItem);
-    const filtered = items.filter(item => {
-      return item.blocked;
-    });
-    filtered.sort((a, b) => {
-      if (a.name === b.name) {
-        return 0;
-      }
-      if (!a.name || (a.name < b.name)) {
-        return -1;
-      }
-      return 1;
-    });
-    updateState({ cards: filtered });
-  }, [card.state]);
-
-  const actions = {
-    unblock: async (cardId) => {
-      await card.actions.clearCardFlag(cardId);
-    }
-  };
-
-  return { state, actions };
-}
-
diff --git a/app/mobile/src/session/profile/blockedMessages/BlockedMessages.jsx b/app/mobile/src/session/profile/blockedMessages/BlockedMessages.jsx
deleted file mode 100644
index 4160eaf4..00000000
--- a/app/mobile/src/session/profile/blockedMessages/BlockedMessages.jsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import { FlatList, View, Alert, TouchableOpacity, Text } from 'react-native';
-import { styles } from './BlockedMessages.styled';
-import { useBlockedMessages } from './useBlockedMessages.hook';
-import { Logo } from 'utils/Logo';
-
-export function BlockedMessages() {
-
-  const { state, actions } = useBlockedMessages();
-
-  const unblock = (cardId, channelId, topicId) => {
-    Alert.alert(
-      'Unblocking Message',
-      'Confirm?',
-      [
-        { text: "Cancel", onPress: () => {}, },
-        { text: "Unblock", onPress: () => actions.unblock(cardId, channelId, topicId) },
-      ],
-    );
-  };
-
-  const BlockedItem = ({ item }) => {
-    return (
-      <TouchableOpacity style={styles.item} onPress={() => unblock(item.cardId, item.channelId, item.topicId)}>
-        <View style={styles.detail}>
-          <Text style={styles.name} numberOfLines={1} ellipsizeMode={'tail'}>{ item.name }</Text>
-          <Text style={styles.created} numberOfLines={1} ellipsizeMode={'tail'}>{ item.timestamp }</Text>
-        </View>
-      </TouchableOpacity>
-    )
-  }
-
-  return (
-    <View style={styles.container}>
-      { state.messages.length === 0 && (
-        <Text style={styles.default}>No Blocked Messages</Text>
-      )}
-      { state.messages.length !== 0 && (
-        <FlatList 
-          data={state.messages}
-          renderItem={({item}) => <BlockedItem item={item} />}
-          keyExtractor={item => item.id}
-        />
-      )}
-    </View>
-  );
-}
-
diff --git a/app/mobile/src/session/profile/blockedMessages/BlockedMessages.styled.js b/app/mobile/src/session/profile/blockedMessages/BlockedMessages.styled.js
deleted file mode 100644
index c29efdcb..00000000
--- a/app/mobile/src/session/profile/blockedMessages/BlockedMessages.styled.js
+++ /dev/null
@@ -1,46 +0,0 @@
-import { StyleSheet } from 'react-native';
-import { Colors } from 'constants/Colors';
-
-export const styles = StyleSheet.create({
-  container: {
-    backgroundColor: Colors.white,
-    display: 'flex',
-    width: '100%',
-    justifyContent: 'center',
-    fontSize: 14,
-    height: 200,
-  },
-  default: {
-    textAlign: 'center',
-    color: Colors.grey,
-  },
-  item: {
-    width: '100%',
-    display: 'flex',
-    flexDirection: 'row',
-    height: 32,
-    paddingLeft: 16,
-    alignItems: 'center',
-    borderBottomWidth: 1,
-    borderColor: Colors.itemDivider,
-  },
-  detail: {
-    paddingLeft: 12,
-    display: 'flex',
-    flexDirection: 'row',
-    justifyContent: 'center',
-    width: '100%',
-  },
-  name: {
-    color: Colors.text,
-    fontSize: 14,
-    flexGrow: 1,
-    flexShrink: 1,
-    minWidth: 0,
-  },
-  created: {
-    color: Colors.text,
-    fontSize: 12,
-    paddingRight: 16,
-  },
-});
diff --git a/app/mobile/src/session/profile/blockedMessages/useBlockedMessages.hook.js b/app/mobile/src/session/profile/blockedMessages/useBlockedMessages.hook.js
deleted file mode 100644
index 23893bf5..00000000
--- a/app/mobile/src/session/profile/blockedMessages/useBlockedMessages.hook.js
+++ /dev/null
@@ -1,121 +0,0 @@
-import { useState, useEffect, useContext } from 'react';
-import { StoreContext } from 'context/StoreContext';
-import { ChannelContext } from 'context/ChannelContext';
-import { CardContext } from 'context/CardContext';
-import { ProfileContext } from 'context/ProfileContext';
-import { getCardByGuid } from 'context/cardUtil'; 
-import moment from 'moment';
-
-export function useBlockedMessages() {
-
-  const [state, setState] = useState({
-    messages: []
-  });
-
-  const store = useContext(StoreContext);
-  const card = useContext(CardContext);
-  const channel = useContext(ChannelContext);
-  const profile = useContext(ProfileContext);
-
-  const updateState = (value) => {
-    setState((s) => ({ ...s, ...value }));
-  }
-
-  const setTopicItem = (cardId, channelId, topic) => {
-    let name, nameSet
-    if (topic.detail.guid === profile.state.identity.guid) {
-      const identity = profile.state.identity;
-      if (identity.name) {
-        name = identity.name;
-      }
-      else {
-        name = `${identity.handle}@${identity.node}`;
-      }
-      nameSet = true;
-    }
-    else {
-      const contact = getCardByGuid(card.state.cards, topic.detail.guid);
-      if (contact) {
-        if (contact?.card?.profile?.name) {
-          name = contact.card.profile.name;
-        }
-        else {
-          name = `${contact.card.profile.handle}@${contact.card.profile.node}`;
-        }
-        nameSet = true;
-      }
-      else {
-        name = 'unknown';
-        nameSet = false;
-      }
-    }
-    
-    let timestamp;
-    const date = new Date(topic.detail.created * 1000);
-    const now = new Date();
-    const offset = now.getTime() - date.getTime();
-    if(offset < 86400000) {
-      timestamp = moment(date).format('h:mma');
-    }
-    else if (offset < 31449600000) {
-      timestamp = moment(date).format('M/DD');
-    }
-    else {
-      timestamp = moment(date).format('M/DD/YYYY');
-    }
-
-    const { topicId } = topic;
-    return { name, nameSet, timestamp, cardId, channelId, topicId, id: `${cardId}:${channelId}:${topicId}` };
-  };
-
-  const loadBlocked = async () => {
-    const channels = [];
-    channel.state.channels.forEach((channelItem, channelId, map) => {
-      channels.push({ channelId });
-    });
-    card.state.cards.forEach((cardItem, cardId, map) => {
-      cardItem.channels.forEach((channelItem, channelId, map) => {
-        channels.push({ cardId, channelId });
-      });
-    });
-
-    const merged = [];
-    for(let i = 0; i < channels.length; i++) {
-      let topics;
-      const { cardId, channelId } = channels[i];
-      if (cardId) {
-        topics = await card.actions.getTopicItems(cardId, channelId);
-      }
-      else {
-        topics = await channel.actions.getTopicItems(channelId);
-      }
-      topics.forEach((topic) => {
-        if (topic.blocked) {
-          merged.push(setTopicItem(cardId, channelId, topic));
-        }
-      });
-    }
-
-    updateState({ messages: merged });
-  };
-
-  useEffect(() => {
-    loadBlocked(); 
-  }, []);
-
-  const actions = {
-    unblock: async (cardId, channelId, topicId) => {
-      const id = `${cardId}:${channelId}:${topicId}`;
-      if (cardId) {
-        card.actions.clearTopicFlag(cardId, channelId, topicId);
-      }
-      else {
-        channel.actions.clearTopicFlag(channelId, topicId);
-      }
-      updateState({ messages: state.messages.filter(item => item.id !== id) });
-    }
-  };
-
-  return { state, actions };
-}
-
diff --git a/app/mobile/src/session/profile/blockedTopics/BlockedTopics.jsx b/app/mobile/src/session/profile/blockedTopics/BlockedTopics.jsx
deleted file mode 100644
index cb788d41..00000000
--- a/app/mobile/src/session/profile/blockedTopics/BlockedTopics.jsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import { FlatList, View, Alert, TouchableOpacity, Text } from 'react-native';
-import { styles } from './BlockedTopics.styled';
-import { useBlockedTopics } from './useBlockedTopics.hook';
-import { Logo } from 'utils/Logo';
-
-export function BlockedTopics() {
-
-  const { state, actions } = useBlockedTopics();
-
-  const unblock = (cardId, channelId) => {
-    Alert.alert(
-      'Unblocking Contact',
-      'Confirm?',
-      [
-        { text: "Cancel", onPress: () => {}, },
-        { text: "Unblock", onPress: () => actions.unblock(cardId, channelId) },
-      ],
-    );
-  };
-
-  const BlockedItem = ({ item }) => {
-    return (
-      <TouchableOpacity style={styles.item} onPress={() => unblock(item.cardId, item.channelId)}>
-        <View style={styles.detail}>
-          <Text style={styles.name} numberOfLines={1} ellipsizeMode={'tail'}>{ item.name }</Text>
-          <Text style={styles.created} numberOfLines={1} ellipsizeMode={'tail'}>{ item.created }</Text>
-        </View>
-      </TouchableOpacity>
-    )
-  }
-
-  return (
-    <View style={styles.container}>
-      { state.channels.length === 0 && (
-        <Text style={styles.default}>No Blocked Topics</Text>
-      )}
-      { state.channels.length !== 0 && (
-        <FlatList 
-          data={state.channels}
-          renderItem={({item}) => <BlockedItem item={item} />}
-          keyExtractor={item => item.id}
-        />
-      )}
-    </View>
-  );
-}
-
diff --git a/app/mobile/src/session/profile/blockedTopics/BlockedTopics.styled.js b/app/mobile/src/session/profile/blockedTopics/BlockedTopics.styled.js
deleted file mode 100644
index c29efdcb..00000000
--- a/app/mobile/src/session/profile/blockedTopics/BlockedTopics.styled.js
+++ /dev/null
@@ -1,46 +0,0 @@
-import { StyleSheet } from 'react-native';
-import { Colors } from 'constants/Colors';
-
-export const styles = StyleSheet.create({
-  container: {
-    backgroundColor: Colors.white,
-    display: 'flex',
-    width: '100%',
-    justifyContent: 'center',
-    fontSize: 14,
-    height: 200,
-  },
-  default: {
-    textAlign: 'center',
-    color: Colors.grey,
-  },
-  item: {
-    width: '100%',
-    display: 'flex',
-    flexDirection: 'row',
-    height: 32,
-    paddingLeft: 16,
-    alignItems: 'center',
-    borderBottomWidth: 1,
-    borderColor: Colors.itemDivider,
-  },
-  detail: {
-    paddingLeft: 12,
-    display: 'flex',
-    flexDirection: 'row',
-    justifyContent: 'center',
-    width: '100%',
-  },
-  name: {
-    color: Colors.text,
-    fontSize: 14,
-    flexGrow: 1,
-    flexShrink: 1,
-    minWidth: 0,
-  },
-  created: {
-    color: Colors.text,
-    fontSize: 12,
-    paddingRight: 16,
-  },
-});
diff --git a/app/mobile/src/session/profile/blockedTopics/useBlockedTopics.hook.js b/app/mobile/src/session/profile/blockedTopics/useBlockedTopics.hook.js
deleted file mode 100644
index 8f4ace38..00000000
--- a/app/mobile/src/session/profile/blockedTopics/useBlockedTopics.hook.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import { useState, useEffect, useContext } from 'react';
-import { CardContext } from 'context/CardContext';
-import { ChannelContext } from 'context/ChannelContext';
-import { ProfileContext } from 'context/ProfileContext';
-import { getCardByGuid } from 'context/cardUtil';
-import { getChannelSubjectLogo } from 'context/channelUtil';
-import moment from 'moment';
-
-export function useBlockedTopics() {
-
-  const [state, setState] = useState({
-    channels: []
-  });
-
-  const profile = useContext(ProfileContext);
-  const card = useContext(CardContext);
-  const channel = useContext(ChannelContext);
-
-  const updateState = (value) => {
-    setState((s) => ({ ...s, ...value }));
-  }
-
-  const getCard = (guid) => {
-    let contact = null
-    card.state.cards.forEach((card, cardId, map) => {
-      if (card?.profile?.guid === guid) {
-        contact = card;
-      }
-    });
-    return contact;
-  }
-
-  const setChannelItem = (item) => {
-    let timestamp;
-    const date = new Date(item.channel.detail.created * 1000);
-    const now = new Date();
-    const offset = now.getTime() - date.getTime();
-    if(offset < 86400000) {
-      timestamp = moment(date).format('h:mma');
-    }
-    else if (offset < 31449600000) {
-      timestamp = moment(date).format('M/DD');
-    }
-    else {
-      timestamp = moment(date).format('M/DD/YYYY');
-    }
-
-
-    const profileGuid = profile.state?.identity?.guid;
-    const { logo, subject } = getChannelSubjectLogo(item.cardId, profileGuid, item.channel, card.state.cards, card.actions.getCardImageUrl);
-
-    return {
-      id: `${item.cardId}:${item.channel.channelId}`,
-      cardId: item.cardId,
-      channelId: item.channel.channelId,
-      name: subject,
-      created: timestamp,
-    }
-  };
-
-  useEffect(() => {
-    let merged = [];
-    card.state.cards.forEach((cardItem, cardId, map) => {
-      cardItem.channels.forEach((channelItem) => {
-        if (channelItem.blocked) {
-          merged.push({ cardId, channel: channelItem });
-        }
-      });
-    });
-    channel.state.channels.forEach((channelItem, channelId, map) => {
-      if (channelItem.blocked) {
-        merged.push({ channel: channelItem });
-      }
-    });
-    const items = merged.map(setChannelItem);
-    updateState({ channels: items });
-  }, [card.state, channel.state]);
-
-  const actions = {
-    unblock: async (cardId, channelId) => {
-      if (cardId) {
-        await card.actions.clearChannelFlag(cardId, channelId);
-      }
-      else {
-        await channel.actions.clearChannelFlag(channelId);
-      } 
-    }
-  };
-
-  return { state, actions };
-}
-
diff --git a/app/mobile/src/session/profile/useProfile.hook.js b/app/mobile/src/session/profile/useProfile.hook.js
index ebe952bd..ff549d22 100644
--- a/app/mobile/src/session/profile/useProfile.hook.js
+++ b/app/mobile/src/session/profile/useProfile.hook.js
@@ -49,7 +49,7 @@ export function useProfile() {
   useEffect(() => {
     const { name, handle, node, location, description, image } = profile.state.identity;
     const imageSource = image ? { uri: profile.state.imageUrl } : avatar;
-    const username = `${handle} / ${node}`
+    const username = `${handle}/${node}`
     updateState({ name, username, location, description, imageSource });
   }, [profile.state]);
 
diff --git a/app/mobile/src/session/profileSettings/ProfileSettings.jsx b/app/mobile/src/session/profileSettings/ProfileSettings.jsx
new file mode 100644
index 00000000..570a9d48
--- /dev/null
+++ b/app/mobile/src/session/profileSettings/ProfileSettings.jsx
@@ -0,0 +1,18 @@
+import { ScrollView, View } from 'react-native';
+import { Profile } from '../profile/Profile';
+import { Settings } from '../settings/Settings';
+import { styles } from './ProfileSettings.styled';
+import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
+
+export function ProfileSettings() {
+
+  return (
+    <ScrollView style={styles.drawer}>
+      <SafeAreaView style={styles.container} edges={['top', 'right']}>
+        <Profile drawer={true} />
+        <Settings drawer={true} />
+      </SafeAreaView>
+    </ScrollView>
+  );
+}
+
diff --git a/app/mobile/src/session/profileSettings/ProfileSettings.styled.js b/app/mobile/src/session/profileSettings/ProfileSettings.styled.js
new file mode 100644
index 00000000..e5a3030b
--- /dev/null
+++ b/app/mobile/src/session/profileSettings/ProfileSettings.styled.js
@@ -0,0 +1,15 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from 'constants/Colors';
+
+export const styles = StyleSheet.create({
+  drawer: {
+    width: '100%',
+    height: '100%',
+    backgroundColor: Colors.drawerBase,
+  },
+  container: {
+    display: 'flex',
+    alignItems: 'center',
+  },
+});
+
diff --git a/app/mobile/src/session/settings/Settings.jsx b/app/mobile/src/session/settings/Settings.jsx
index ec10d24b..4e24603a 100644
--- a/app/mobile/src/session/settings/Settings.jsx
+++ b/app/mobile/src/session/settings/Settings.jsx
@@ -10,7 +10,7 @@ import { BlurView } from "@react-native-community/blur";
 import { InputField } from 'utils/InputField';
 import { Logo } from 'utils/Logo';
 
-export function Settings() {
+export function Settings({ drawer }) {
 
   const navigate = useNavigate();
   const [ busy, setBusy ] = useState(false);
@@ -161,585 +161,592 @@ export function Settings() {
   };
 
   return (
-    <ScrollView style={styles.content}>
-      <SafeAreaView edges={['top']}>
+    <>
+      { drawer && (
+        <Text>SETTINGS DRAWER</Text>
+      )}
+      { !drawer && (
+        <ScrollView style={styles.content}>
+          <SafeAreaView edges={['top']}>
 
-        <Text style={styles.label}>{ state.strings.messaging }</Text>
-        <View style={styles.group}>
-          <TouchableOpacity style={styles.entry} activeOpacity={1}>
-            <View style={styles.icon}>
-              <MatIcons name="bell-outline" size={20} color={Colors.linkText} />
-            </View>
-            <View style={styles.optionControl}>
-              <TouchableOpacity activeOpacity={1} onPress={() => setNotifications(!state.pushEnabled)}>
-                <Text style={styles.optionLink}>{ state.strings.enableNotifications }</Text>
+            <Text style={styles.label}>{ state.strings.messaging }</Text>
+            <View style={styles.group}>
+              <TouchableOpacity style={styles.entry} activeOpacity={1}>
+                <View style={styles.icon}>
+                  <MatIcons name="bell-outline" size={20} color={Colors.linkText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <TouchableOpacity activeOpacity={1} onPress={() => setNotifications(!state.pushEnabled)}>
+                    <Text style={styles.optionLink}>{ state.strings.enableNotifications }</Text>
+                  </TouchableOpacity>
+                  <Switch value={state.pushEnabled} style={Platform.OS==='ios' ? styles.notifications : {}} thumbColor={Colors.sliderGrip} ios_backgroundColor={Colors.disabledIndicator}
+                      trackColor={styles.track} onValueChange={setNotifications} />
+                </View>
               </TouchableOpacity>
-              <Switch value={state.pushEnabled} style={Platform.OS==='ios' ? styles.notifications : {}} thumbColor={Colors.sliderGrip} ios_backgroundColor={Colors.disabledIndicator}
-                  trackColor={styles.track} onValueChange={setNotifications} />
-            </View>
-          </TouchableOpacity>
-          <View style={styles.divider} />
-          <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showEditSeal}>
-            <View style={styles.icon}>
-              <MatIcons name="lock-outline" size={20} color={Colors.linkText} />
-            </View>
-            <View style={styles.optionControl}>
-              { state.sealEnabled && (
-                <Text style={styles.optionLink}>{ state.strings.manageTopics }</Text>
-              )}
-              { !state.sealEnabled && (
-                <Text style={styles.optionLink}>{ state.strings.enableTopics }</Text>
-              )}
-            </View>
-          </TouchableOpacity>
-        </View>
-
-        <Text style={styles.label}>{ state.strings.display }</Text>
-        <View style={styles.group}>
-          <View style={styles.entry}>
-            <View style={styles.icon}>
-              <MatIcons name="progress-clock" size={20} color={Colors.labelText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.labelText}>{ state.strings.hourMode }</Text>
-              <TouchableOpacity style={styles.radio} activeOpacity={1} onPress={() => actions.setTimeFull(false)}>
-                { !state.timeFull && (
-                  <View style={styles.activeRadioCircle} />
-                )}
-                { state.timeFull && (
-                  <View style={styles.idleRadioCircle} />
-                )}
-                <Text style={styles.radioLabel}>{ state.strings.timeHalf }</Text>
-              </TouchableOpacity>
-              <TouchableOpacity style={styles.radio} activeOpacity={1} onPress={() => actions.setTimeFull(true)}>
-                { state.timeFull && (
-                  <View style={styles.activeRadioCircle} />
-                )}
-                { !state.timeFull && (
-                  <View style={styles.idleRadioCircle} />
-                )}
-                <Text style={styles.radioLabel}>{ state.strings.timeFull }</Text>
+              <View style={styles.divider} />
+              <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showEditSeal}>
+                <View style={styles.icon}>
+                  <MatIcons name="lock-outline" size={20} color={Colors.linkText} />
+                </View>
+                <View style={styles.optionControl}>
+                  { state.sealEnabled && (
+                    <Text style={styles.optionLink}>{ state.strings.manageTopics }</Text>
+                  )}
+                  { !state.sealEnabled && (
+                    <Text style={styles.optionLink}>{ state.strings.enableTopics }</Text>
+                  )}
+                </View>
               </TouchableOpacity>
             </View>
-          </View>
-          <View style={styles.divider} />
-          <TouchableOpacity style={styles.entry} activeOpacity={1}>
-            <View style={styles.icon}>
-              <MatIcons name="calendar-month-outline" size={20} color={Colors.labelText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.labelText}>{ state.strings.dateMode }</Text>
-              <TouchableOpacity style={styles.radio} activeOpacity={1} onPress={() => actions.setMonthLast(false)}>
-                { !state.monthLast && (
-                  <View style={styles.activeRadioCircle} />
-                )}
-                { state.monthLast && (
-                  <View style={styles.idleRadioCircle} />
-                )}
-                <Text style={styles.radioLabel}>{ state.strings.monthStart }</Text>
-              </TouchableOpacity>
-              <TouchableOpacity style={styles.radio} activeOpacity={1} onPress={() => actions.setMonthLast(true)}>
-                { state.monthLast && (
-                  <View style={styles.activeRadioCircle} />
-                )}
-                { !state.monthLast && (
-                  <View style={styles.idleRadioCircle} />
-                )}
-                <Text style={styles.radioLabel}>{ state.strings.monthEnd }</Text>
-              </TouchableOpacity>
-            </View>
-          </TouchableOpacity>
- 
-        </View>
 
-        <Text style={styles.label}>{ state.strings.account }</Text>
-        <View style={styles.group}>
-          <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.promptLogout}>
-            <View style={styles.icon}>
-              <MatIcons name="logout" size={20} color={Colors.linkText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.optionLink}>{ state.strings.logout }</Text>
-            </View>
-          </TouchableOpacity>
-          <View style={styles.divider} />
-          <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showLogin}>
-            <View style={styles.icon}>
-              <MatIcons name="login" size={20} color={Colors.linkText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.optionLink}>{ state.strings.changeLogin }</Text>
-            </View>
-          </TouchableOpacity>
-          <View style={styles.divider} />
-          <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showDelete}>
-            <View style={styles.icon}>
-              <MatIcons name="trash-can-outline" size={20} color={Colors.dangerText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.dangerLink}>{ state.strings.deleteAccount }</Text>
-            </View>
-          </TouchableOpacity>
-        </View>
-
-        <Text style={styles.label}>{ state.strings.blocked }</Text>
-        <View style={styles.group}>
-          <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showBlockedContacts}>
-            <View style={styles.icon}>
-              <MatIcons name="account-multiple-outline" size={20} color={Colors.linkText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.optionLink}>{ state.strings.contacts }</Text>
-            </View>
-          </TouchableOpacity>
-          <View style={styles.divider} />
-          <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showBlockedTopics}>
-            <View style={styles.icon}>
-              <MatIcons name="book-open-outline" size={20} color={Colors.linkText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.optionLink}>{ state.strings.topics }</Text>
-            </View>
-          </TouchableOpacity>
-          <View style={styles.divider} />
-          <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showBlockedMessages}>
-            <View style={styles.icon}>
-              <MatIcons name="comment-text-multiple-outline" size={20} color={Colors.linkText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.optionLink}>{ state.strings.messages }</Text>
-            </View>
-          </TouchableOpacity>
-        </View>
-
-        <Text style={styles.label}>{ state.strings.support }</Text>
-        <View style={styles.group}>
-          <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={() => Linking.openURL('https://github.com/balzack/databag/discussions')}>
-            <View style={styles.icon}>
-              <MatIcons name="help-network-outline" size={20} color={Colors.linkText} />
-            </View>
-            <View style={styles.optionControl}>
-              <Text style={styles.optionLink}>github.com/balzack/databag</Text>
-            </View>
-          </TouchableOpacity>
-        </View>
-
-        <View style={styles.verticalPad} />
-
-        <Modal
-          animationType="fade"
-          transparent={true}
-          visible={state.editSeal}
-          supportedOrientations={['portrait', 'landscape']}
-          onRequestClose={actions.hideEditSeal}
-        >
-          <View style={styles.modalOverlay}>
-            <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
-            <KeyboardAvoidingView style={styles.modalBase} behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
-              <View style={styles.modalContainer}>
-                <View style={styles.modalClose}>
-                  <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideEditSeal}>
-                    <MatIcons name="close" size={20} color={Colors.descriptionText} />
+            <Text style={styles.label}>{ state.strings.display }</Text>
+            <View style={styles.group}>
+              <View style={styles.entry}>
+                <View style={styles.icon}>
+                  <MatIcons name="progress-clock" size={20} color={Colors.labelText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.labelText}>{ state.strings.hourMode }</Text>
+                  <TouchableOpacity style={styles.radio} activeOpacity={1} onPress={() => actions.setTimeFull(false)}>
+                    { !state.timeFull && (
+                      <View style={styles.activeRadioCircle} />
+                    )}
+                    { state.timeFull && (
+                      <View style={styles.idleRadioCircle} />
+                    )}
+                    <Text style={styles.radioLabel}>{ state.strings.timeHalf }</Text>
+                  </TouchableOpacity>
+                  <TouchableOpacity style={styles.radio} activeOpacity={1} onPress={() => actions.setTimeFull(true)}>
+                    { state.timeFull && (
+                      <View style={styles.activeRadioCircle} />
+                    )}
+                    { !state.timeFull && (
+                      <View style={styles.idleRadioCircle} />
+                    )}
+                    <Text style={styles.radioLabel}>{ state.strings.timeFull }</Text>
                   </TouchableOpacity>
                 </View>
-                <Text style={styles.modalHeader}>{ state.strings.sealedTopics }</Text>
-                { !state.sealEnabled && (
-                  <>
-                    <Text style={styles.modalDescription}>{ state.strings.sealUnset }</Text>
+              </View>
+              <View style={styles.divider} />
+              <TouchableOpacity style={styles.entry} activeOpacity={1}>
+                <View style={styles.icon}>
+                  <MatIcons name="calendar-month-outline" size={20} color={Colors.labelText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.labelText}>{ state.strings.dateMode }</Text>
+                  <TouchableOpacity style={styles.radio} activeOpacity={1} onPress={() => actions.setMonthLast(false)}>
+                    { !state.monthLast && (
+                      <View style={styles.activeRadioCircle} />
+                    )}
+                    { state.monthLast && (
+                      <View style={styles.idleRadioCircle} />
+                    )}
+                    <Text style={styles.radioLabel}>{ state.strings.monthStart }</Text>
+                  </TouchableOpacity>
+                  <TouchableOpacity style={styles.radio} activeOpacity={1} onPress={() => actions.setMonthLast(true)}>
+                    { state.monthLast && (
+                      <View style={styles.activeRadioCircle} />
+                    )}
+                    { !state.monthLast && (
+                      <View style={styles.idleRadioCircle} />
+                    )}
+                    <Text style={styles.radioLabel}>{ state.strings.monthEnd }</Text>
+                  </TouchableOpacity>
+                </View>
+              </TouchableOpacity>
+     
+            </View>
 
-                    <InputField style={styles.field}
-                      label={state.strings.password}
-                      secret={true}
-                      value={state.sealPassword}
-                      autoCapitalize={'none'} 
-                      spellCheck={false}
-                      onChangeText={actions.setSealPassword}
-                    />
-       
-                    { state.sealPassword && (
-                      <TouchableOpacity style={styles.enabledButton} activeOpacity={1} onPress={() => sealAction(actions.generateKey)}>
-                        { busy && (
-                          <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
-                        )}
-                        { !busy && (
-                          <Text style={styles.enabledButtonText}>{ state.strings.generate }</Text>
-                        )}
-                      </TouchableOpacity>
-                    )}
-                    { !state.sealPassword && (
-                      <View style={styles.disabledButton}>
-                        <Text style={styles.disabledButtonText}>{ state.strings.generate }</Text>
-                      </View>
-                    )}
-                    <Text style={styles.delayMessage}>{ state.strings.delayMessage }</Text>
-                  </>
-                )}
-                { state.sealEnabled && !state.sealUnlocked && !state.sealRemove && (
-                  <>
-                    <Text style={styles.modalDescription}>{ state.strings.sealLocked }</Text>
+            <Text style={styles.label}>{ state.strings.account }</Text>
+            <View style={styles.group}>
+              <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.promptLogout}>
+                <View style={styles.icon}>
+                  <MatIcons name="logout" size={20} color={Colors.linkText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.optionLink}>{ state.strings.logout }</Text>
+                </View>
+              </TouchableOpacity>
+              <View style={styles.divider} />
+              <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showLogin}>
+                <View style={styles.icon}>
+                  <MatIcons name="login" size={20} color={Colors.linkText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.optionLink}>{ state.strings.changeLogin }</Text>
+                </View>
+              </TouchableOpacity>
+              <View style={styles.divider} />
+              <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showDelete}>
+                <View style={styles.icon}>
+                  <MatIcons name="trash-can-outline" size={20} color={Colors.dangerText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.dangerLink}>{ state.strings.deleteAccount }</Text>
+                </View>
+              </TouchableOpacity>
+            </View>
 
-                    <InputField style={styles.field}
-                      label={state.strings.password}
-                      secret={true}
-                      value={state.sealPassword}
-                      autoCapitalize={'none'}
-                      spellCheck={false}
-                      onChangeText={actions.setSealPassword}
-                    />
+            <Text style={styles.label}>{ state.strings.blocked }</Text>
+            <View style={styles.group}>
+              <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showBlockedContacts}>
+                <View style={styles.icon}>
+                  <MatIcons name="account-multiple-outline" size={20} color={Colors.linkText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.optionLink}>{ state.strings.contacts }</Text>
+                </View>
+              </TouchableOpacity>
+              <View style={styles.divider} />
+              <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showBlockedTopics}>
+                <View style={styles.icon}>
+                  <MatIcons name="book-open-outline" size={20} color={Colors.linkText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.optionLink}>{ state.strings.topics }</Text>
+                </View>
+              </TouchableOpacity>
+              <View style={styles.divider} />
+              <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={actions.showBlockedMessages}>
+                <View style={styles.icon}>
+                  <MatIcons name="comment-text-multiple-outline" size={20} color={Colors.linkText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.optionLink}>{ state.strings.messages }</Text>
+                </View>
+              </TouchableOpacity>
+            </View>
 
-                    { state.sealPassword && (
-                      <TouchableOpacity style={styles.enabledButton} activeOpacity={1} onPress={() => sealAction(actions.unlockKey)}>
-                        { busy && (
-                          <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
-                        )}
-                        { !busy && (
-                          <Text style={styles.enabledButtonText}>{ state.strings.unlock }</Text>
-                        )}
-                      </TouchableOpacity>
-                    )}
-                    { !state.sealPassword && (
-                      <View style={styles.disabledButton}>
-                        <Text style={styles.disabledButtonText}>{ state.strings.unlock }</Text>
-                      </View>
-                    )}
-                    <TouchableOpacity activeOpacity={1} onPress={actions.showSealRemove}>
-                      <Text style={styles.dangerText}>{ state.strings.removeSeal }</Text>
-                    </TouchableOpacity>
-                  </>
-                )}
-                { state.sealEnabled && state.sealUnlocked && !state.sealRemove && !state.sealUpdate && (
-                  <>
-                    <Text style={styles.modalDescription}>{ state.strings.sealUnlocked }</Text>
-                    <TouchableOpacity style={styles.enabledButton} activeOpacity={1} onPress={() => sealAction(actions.disableKey)}>
+            <Text style={styles.label}>{ state.strings.support }</Text>
+            <View style={styles.group}>
+              <TouchableOpacity style={styles.entry} activeOpacity={1} onPress={() => Linking.openURL('https://github.com/balzack/databag/discussions')}>
+                <View style={styles.icon}>
+                  <MatIcons name="help-network-outline" size={20} color={Colors.linkText} />
+                </View>
+                <View style={styles.optionControl}>
+                  <Text style={styles.optionLink}>github.com/balzack/databag</Text>
+                </View>
+              </TouchableOpacity>
+            </View>
+
+            <View style={styles.verticalPad} />
+          </SafeAreaView>
+        </ScrollView>
+      )}
+
+      <Modal
+        animationType="fade"
+        transparent={true}
+        visible={state.editSeal}
+        supportedOrientations={['portrait', 'landscape']}
+        onRequestClose={actions.hideEditSeal}
+      >
+        <View style={styles.modalOverlay}>
+          <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
+          <KeyboardAvoidingView style={styles.modalBase} behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
+            <View style={styles.modalContainer}>
+              <View style={styles.modalClose}>
+                <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideEditSeal}>
+                  <MatIcons name="close" size={20} color={Colors.descriptionText} />
+                </TouchableOpacity>
+              </View>
+              <Text style={styles.modalHeader}>{ state.strings.sealedTopics }</Text>
+              { !state.sealEnabled && (
+                <>
+                  <Text style={styles.modalDescription}>{ state.strings.sealUnset }</Text>
+
+                  <InputField style={styles.field}
+                    label={state.strings.password}
+                    secret={true}
+                    value={state.sealPassword}
+                    autoCapitalize={'none'} 
+                    spellCheck={false}
+                    onChangeText={actions.setSealPassword}
+                  />
+     
+                  { state.sealPassword && (
+                    <TouchableOpacity style={styles.enabledButton} activeOpacity={1} onPress={() => sealAction(actions.generateKey)}>
                       { busy && (
                         <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
                       )}
                       { !busy && (
-                        <Text style={styles.enabledButtonText}>{ state.strings.disable }</Text>
+                        <Text style={styles.enabledButtonText}>{ state.strings.generate }</Text>
                       )}
                     </TouchableOpacity>
-                    <TouchableOpacity activeOpacity={1} onPress={actions.showSealUpdate}>
-                      <Text style={styles.modeText}>{ state.strings.changeKey }</Text>
-                    </TouchableOpacity>
-                    <TouchableOpacity activeOpacity={1} onPress={actions.showSealRemove}>
-                      <Text style={styles.dangerText}>{ state.strings.removeSeal }</Text>
-                    </TouchableOpacity>
-                  </>
-                )}
-                { state.sealEnabled && state.sealRemove && (
-                  <>
-                    <Text style={styles.modalDescription}>{ state.strings.sealDelete }</Text>
-                    <InputField style={styles.field}
-                      label={state.strings.typeDelete}
-                      value={state.sealDelete}
-                      autoCapitalize={'none'}
-                      spellCheck={false}
-                      onChangeText={actions.setSealDelete}
-                    />
-                    { state.sealDelete === state.strings.deleteKey && (
-                      <TouchableOpacity style={styles.dangerButton} activeOpacity={1} onPress={() => sealAction(actions.removeKey)}>
-                        { busy && (
-                          <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
-                        )}
-                        { !busy && (
-                          <Text style={styles.dangerButtonText}>{ state.strings.delete }</Text>
-                        )}
-                      </TouchableOpacity>
-                    )}
-                    { state.sealDelete !== state.strings.deleteKey && (
-                      <View style={styles.disabledButton}>
-                        <Text style={styles.disabledButtonText}>{ state.strings.delete }</Text>
-                      </View>
-                    )}
-                    <TouchableOpacity activeOpacity={1} onPress={actions.hideSealRemove}>
-                      { state.sealUnlocked && (
-                        <Text style={styles.modeText}>{ state.strings.disableSeal }</Text>
-                      )}
-                      { !state.sealUnlocked && (
-                        <Text style={styles.modeText}>{ state.strings.unlockSeal }</Text>
-                      )}
-                    </TouchableOpacity>
-                  </>
-                )}
-                { state.sealEnabled && state.sealUnlocked && state.sealUpdate && (
-                  <>
-                    <Text style={styles.modalDescription}>{ state.strings.changePassword }</Text>
-
-                    <InputField style={styles.field}
-                      label={state.strings.password}
-                      isPassword={true}
-                      value={state.sealPassword}
-                      autoCapitalize={'none'} 
-                      spellCheck={false}
-                      onChangeText={actions.setSealPassword}
-                    />
-
-                    { state.sealPassword && (
-                      <TouchableOpacity style={styles.enabledButton} activeOpacity={1} onPress={() => sealAction(actions.updateKey)}>
-                        { busy && (
-                          <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
-                        )}
-                        { !busy && (
-                          <Text style={styles.enabledButtonText}>{ state.strings.update }</Text>
-                        )}
-                      </TouchableOpacity>
-                    )}
-                    { !state.sealPassword && (
-                      <View style={styles.disabledButton}>
-                        <Text style={styles.disabledButtonText}>{ state.strings.update }</Text>
-                      </View>
-                    )}
-                    <TouchableOpacity activeOpacity={1} onPress={actions.hideSealUpdate}>
-                      { state.sealUnlocked && (
-                        <Text style={styles.modeText}>{ state.strings.disableSeal }</Text>
-                      )}
-                      { !state.sealUnlocked && (
-                        <Text style={styles.modeText}>{ state.strings.unlockSeal }</Text>
-                      )}
-                    </TouchableOpacity>
-                  </>
-                )}
-              </View>
-            </KeyboardAvoidingView>
-          </View>
-        </Modal>
-
-        <Modal
-          animationType="fade"
-          transparent={true}
-          visible={state.login}
-          supportedOrientations={['portrait', 'landscape']}
-          onRequestClose={actions.hideLogin}
-        >
-          <View style={styles.modalOverlay}>
-            <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
-            <KeyboardAvoidingView style={styles.modalBase} behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
-              <View style={styles.modalContainer}>
-                <View style={styles.modalClose}>
-                  <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideLogin}>
-                    <MatIcons name="close" size={20} color={Colors.descriptionText} />
-                  </TouchableOpacity>
-                </View>
-                <Text style={styles.modalHeader}>{ state.strings.changeLogin }</Text>
-                <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
-
-                <Text textAlign={'center'} style={styles.modalDescription}>{ state.strings.changeMessage }</Text>
-
-                <InputField
-                  label={state.strings.username}
-                  value={state.username}
-                  autoCapitalize={'none'}
-                  spellCheck={false}
-                  style={styles.field}
-                  onChangeText={actions.setUsername}
-                /> 
-
-                <InputField
-                  label={state.strings.password}
-                  value={state.password}
-                  autoCapitalize={'none'}
-                  spellCheck={false}
-                  style={styles.field}
-                  onChangeText={actions.setPassword}
-                  secret={true}
-                /> 
-
-                <View style={styles.availableStatus}>
-                  { state.validated && !state.available && (
-                    <Text style={styles.notAvailable}>{ state.strings.notAvailable }</Text>
                   )}
-                </View>
-                <View style={styles.hintButtons}>
-                  <TouchableOpacity style={styles.cancelButton} activeOpacity={1} onPress={actions.hideLogin}>
-                    <Text style={styles.cancelButtonText}>{ state.strings.cancel }</Text>
-                  </TouchableOpacity>
-                  { (!state.available || !state.password || !state.validated || !state.username) && (
+                  { !state.sealPassword && (
                     <View style={styles.disabledButton}>
-                      <Text style={styles.disabledButtonText}>{ state.strings.update }</Text>
+                      <Text style={styles.disabledButtonText}>{ state.strings.generate }</Text>
                     </View>
                   )}
-                  { state.available && state.password && state.validated && state.username && (
-                    <TouchableOpacity style={styles.promptButton} activeOpacity={1} onPress={changeLogin}>
-                      <Text style={styles.enabledButtonText}>{ state.strings.update }</Text>
-                    </TouchableOpacity>
-                  )}
-                </View>
-              </View>
-            </KeyboardAvoidingView>
-          </View>
-        </Modal>
- 
-        <Modal
-          animationType="fade"
-          transparent={true}
-          visible={state.delete}
-          supportedOrientations={['portrait', 'landscape']}
-          onRequestClose={actions.hideDelete}
-        >
-          <View style={styles.modalOverlay}>
-            <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
-            <KeyboardAvoidingView style={styles.modalBase} behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
-              <View style={styles.modalContainer}>
-                <View style={styles.modalClose}>
-                  <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideDelete}>
-                    <MatIcons name="close" size={20} color={Colors.descriptionText} />
-                  </TouchableOpacity>
-                </View>
-                <Text style={styles.modalHeader}>{ state.strings.deleteAccount }</Text>
-                <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
+                  <Text style={styles.delayMessage}>{ state.strings.delayMessage }</Text>
+                </>
+              )}
+              { state.sealEnabled && !state.sealUnlocked && !state.sealRemove && (
+                <>
+                  <Text style={styles.modalDescription}>{ state.strings.sealLocked }</Text>
 
-                <InputField style={styles.field}
-                  label={state.strings.typeDelete}
-                  value={state.confirm}
-                  autoCapitalize={'none'} 
-                  spellCheck={false}
-                  onChangeText={actions.setConfirm}
-                />
-   
-                <View style={styles.buttons}>
-                  { state.confirm === state.strings.deleteKey && (
-                    <TouchableOpacity style={styles.dangerButton} activeOpacity={1} onPress={deleteAccount}>
-                      <Text style={styles.dangerButtonText}>{ state.strings.delete }</Text>
+                  <InputField style={styles.field}
+                    label={state.strings.password}
+                    secret={true}
+                    value={state.sealPassword}
+                    autoCapitalize={'none'}
+                    spellCheck={false}
+                    onChangeText={actions.setSealPassword}
+                  />
+
+                  { state.sealPassword && (
+                    <TouchableOpacity style={styles.enabledButton} activeOpacity={1} onPress={() => sealAction(actions.unlockKey)}>
+                      { busy && (
+                        <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
+                      )}
+                      { !busy && (
+                        <Text style={styles.enabledButtonText}>{ state.strings.unlock }</Text>
+                      )}
                     </TouchableOpacity>
                   )}
-                  { state.confirm !== state.strings.deleteKey && (
+                  { !state.sealPassword && (
+                    <View style={styles.disabledButton}>
+                      <Text style={styles.disabledButtonText}>{ state.strings.unlock }</Text>
+                    </View>
+                  )}
+                  <TouchableOpacity activeOpacity={1} onPress={actions.showSealRemove}>
+                    <Text style={styles.dangerText}>{ state.strings.removeSeal }</Text>
+                  </TouchableOpacity>
+                </>
+              )}
+              { state.sealEnabled && state.sealUnlocked && !state.sealRemove && !state.sealUpdate && (
+                <>
+                  <Text style={styles.modalDescription}>{ state.strings.sealUnlocked }</Text>
+                  <TouchableOpacity style={styles.enabledButton} activeOpacity={1} onPress={() => sealAction(actions.disableKey)}>
+                    { busy && (
+                      <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
+                    )}
+                    { !busy && (
+                      <Text style={styles.enabledButtonText}>{ state.strings.disable }</Text>
+                    )}
+                  </TouchableOpacity>
+                  <TouchableOpacity activeOpacity={1} onPress={actions.showSealUpdate}>
+                    <Text style={styles.modeText}>{ state.strings.changeKey }</Text>
+                  </TouchableOpacity>
+                  <TouchableOpacity activeOpacity={1} onPress={actions.showSealRemove}>
+                    <Text style={styles.dangerText}>{ state.strings.removeSeal }</Text>
+                  </TouchableOpacity>
+                </>
+              )}
+              { state.sealEnabled && state.sealRemove && (
+                <>
+                  <Text style={styles.modalDescription}>{ state.strings.sealDelete }</Text>
+                  <InputField style={styles.field}
+                    label={state.strings.typeDelete}
+                    value={state.sealDelete}
+                    autoCapitalize={'none'}
+                    spellCheck={false}
+                    onChangeText={actions.setSealDelete}
+                  />
+                  { state.sealDelete === state.strings.deleteKey && (
+                    <TouchableOpacity style={styles.dangerButton} activeOpacity={1} onPress={() => sealAction(actions.removeKey)}>
+                      { busy && (
+                        <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
+                      )}
+                      { !busy && (
+                        <Text style={styles.dangerButtonText}>{ state.strings.delete }</Text>
+                      )}
+                    </TouchableOpacity>
+                  )}
+                  { state.sealDelete !== state.strings.deleteKey && (
                     <View style={styles.disabledButton}>
                       <Text style={styles.disabledButtonText}>{ state.strings.delete }</Text>
                     </View>
                   )}
-                </View>
-              </View>
-            </KeyboardAvoidingView>
-          </View>
-        </Modal>
-  
-        <Modal
-          animationType="fade"
-          transparent={true}
-          visible={state.blockedContacts}
-          supportedOrientations={['portrait', 'landscape']}
-          onRequestClose={state.hideBlockedContacts}
-        >
-          <View style={styles.modalOverlay}>
-            <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
-            <View style={styles.modalBase}>
-              <View style={styles.modalContainer}>
-                <View style={styles.modalClose}>
-                  <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedContacts}>
-                    <MatIcons name="close" size={20} color={Colors.descriptionText} />
+                  <TouchableOpacity activeOpacity={1} onPress={actions.hideSealRemove}>
+                    { state.sealUnlocked && (
+                      <Text style={styles.modeText}>{ state.strings.disableSeal }</Text>
+                    )}
+                    { !state.sealUnlocked && (
+                      <Text style={styles.modeText}>{ state.strings.unlockSeal }</Text>
+                    )}
                   </TouchableOpacity>
-                </View>
-                <Text style={styles.modalHeader}>{ state.strings.blockedContacts }</Text>
-                <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
-                <View style={styles.modalList}>
-                  { state.contacts.length === 0 && (
-                    <View style={styles.emptyLabel}>
-                      <Text style={styles.emptyLabelText}>{ state.strings.noBlockedContacts }</Text>
+                </>
+              )}
+              { state.sealEnabled && state.sealUnlocked && state.sealUpdate && (
+                <>
+                  <Text style={styles.modalDescription}>{ state.strings.changePassword }</Text>
+
+                  <InputField style={styles.field}
+                    label={state.strings.password}
+                    isPassword={true}
+                    value={state.sealPassword}
+                    autoCapitalize={'none'} 
+                    spellCheck={false}
+                    onChangeText={actions.setSealPassword}
+                  />
+
+                  { state.sealPassword && (
+                    <TouchableOpacity style={styles.enabledButton} activeOpacity={1} onPress={() => sealAction(actions.updateKey)}>
+                      { busy && (
+                        <ActivityIndicator style={styles.modalBusy} animating={true} color={Colors.primaryButtonText} />
+                      )}
+                      { !busy && (
+                        <Text style={styles.enabledButtonText}>{ state.strings.update }</Text>
+                      )}
+                    </TouchableOpacity>
+                  )}
+                  { !state.sealPassword && (
+                    <View style={styles.disabledButton}>
+                      <Text style={styles.disabledButtonText}>{ state.strings.update }</Text>
                     </View>
                   )}
-                  { state.contacts.length !== 0 && (
-                    <FlatList
-                      data={state.contacts}
-                      renderItem={BlockedContact}
-                      keyExtractor={item => item.cardId}
-                    />
-                  )}
-                </View>
-                <View style={styles.rightButton}>
-                  <TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedContacts}>
-                    <Text style={styles.closeButtonText}>{ state.strings.close }</Text>
+                  <TouchableOpacity activeOpacity={1} onPress={actions.hideSealUpdate}>
+                    { state.sealUnlocked && (
+                      <Text style={styles.modeText}>{ state.strings.disableSeal }</Text>
+                    )}
+                    { !state.sealUnlocked && (
+                      <Text style={styles.modeText}>{ state.strings.unlockSeal }</Text>
+                    )}
                   </TouchableOpacity>
-                </View>
+                </>
+              )}
+            </View>
+          </KeyboardAvoidingView>
+        </View>
+      </Modal>
+
+      <Modal
+        animationType="fade"
+        transparent={true}
+        visible={state.login}
+        supportedOrientations={['portrait', 'landscape']}
+        onRequestClose={actions.hideLogin}
+      >
+        <View style={styles.modalOverlay}>
+          <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
+          <KeyboardAvoidingView style={styles.modalBase} behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
+            <View style={styles.modalContainer}>
+              <View style={styles.modalClose}>
+                <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideLogin}>
+                  <MatIcons name="close" size={20} color={Colors.descriptionText} />
+                </TouchableOpacity>
+              </View>
+              <Text style={styles.modalHeader}>{ state.strings.changeLogin }</Text>
+              <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
+
+              <Text textAlign={'center'} style={styles.modalDescription}>{ state.strings.changeMessage }</Text>
+
+              <InputField
+                label={state.strings.username}
+                value={state.username}
+                autoCapitalize={'none'}
+                spellCheck={false}
+                style={styles.field}
+                onChangeText={actions.setUsername}
+              /> 
+
+              <InputField
+                label={state.strings.password}
+                value={state.password}
+                autoCapitalize={'none'}
+                spellCheck={false}
+                style={styles.field}
+                onChangeText={actions.setPassword}
+                secret={true}
+              /> 
+
+              <View style={styles.availableStatus}>
+                { state.validated && !state.available && (
+                  <Text style={styles.notAvailable}>{ state.strings.notAvailable }</Text>
+                )}
+              </View>
+              <View style={styles.hintButtons}>
+                <TouchableOpacity style={styles.cancelButton} activeOpacity={1} onPress={actions.hideLogin}>
+                  <Text style={styles.cancelButtonText}>{ state.strings.cancel }</Text>
+                </TouchableOpacity>
+                { (!state.available || !state.password || !state.validated || !state.username) && (
+                  <View style={styles.disabledButton}>
+                    <Text style={styles.disabledButtonText}>{ state.strings.update }</Text>
+                  </View>
+                )}
+                { state.available && state.password && state.validated && state.username && (
+                  <TouchableOpacity style={styles.promptButton} activeOpacity={1} onPress={changeLogin}>
+                    <Text style={styles.enabledButtonText}>{ state.strings.update }</Text>
+                  </TouchableOpacity>
+                )}
+              </View>
+            </View>
+          </KeyboardAvoidingView>
+        </View>
+      </Modal>
+
+      <Modal
+        animationType="fade"
+        transparent={true}
+        visible={state.delete}
+        supportedOrientations={['portrait', 'landscape']}
+        onRequestClose={actions.hideDelete}
+      >
+        <View style={styles.modalOverlay}>
+          <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
+          <KeyboardAvoidingView style={styles.modalBase} behavior={Platform.OS === 'ios' ? 'padding' : 'height'}>
+            <View style={styles.modalContainer}>
+              <View style={styles.modalClose}>
+                <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideDelete}>
+                  <MatIcons name="close" size={20} color={Colors.descriptionText} />
+                </TouchableOpacity>
+              </View>
+              <Text style={styles.modalHeader}>{ state.strings.deleteAccount }</Text>
+              <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
+
+              <InputField style={styles.field}
+                label={state.strings.typeDelete}
+                value={state.confirm}
+                autoCapitalize={'none'} 
+                spellCheck={false}
+                onChangeText={actions.setConfirm}
+              />
+
+              <View style={styles.buttons}>
+                { state.confirm === state.strings.deleteKey && (
+                  <TouchableOpacity style={styles.dangerButton} activeOpacity={1} onPress={deleteAccount}>
+                    <Text style={styles.dangerButtonText}>{ state.strings.delete }</Text>
+                  </TouchableOpacity>
+                )}
+                { state.confirm !== state.strings.deleteKey && (
+                  <View style={styles.disabledButton}>
+                    <Text style={styles.disabledButtonText}>{ state.strings.delete }</Text>
+                  </View>
+                )}
+              </View>
+            </View>
+          </KeyboardAvoidingView>
+        </View>
+      </Modal>
+
+      <Modal
+        animationType="fade"
+        transparent={true}
+        visible={state.blockedContacts}
+        supportedOrientations={['portrait', 'landscape']}
+        onRequestClose={state.hideBlockedContacts}
+      >
+        <View style={styles.modalOverlay}>
+          <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
+          <View style={styles.modalBase}>
+            <View style={styles.modalContainer}>
+              <View style={styles.modalClose}>
+                <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedContacts}>
+                  <MatIcons name="close" size={20} color={Colors.descriptionText} />
+                </TouchableOpacity>
+              </View>
+              <Text style={styles.modalHeader}>{ state.strings.blockedContacts }</Text>
+              <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
+              <View style={styles.modalList}>
+                { state.contacts.length === 0 && (
+                  <View style={styles.emptyLabel}>
+                    <Text style={styles.emptyLabelText}>{ state.strings.noBlockedContacts }</Text>
+                  </View>
+                )}
+                { state.contacts.length !== 0 && (
+                  <FlatList
+                    data={state.contacts}
+                    renderItem={BlockedContact}
+                    keyExtractor={item => item.cardId}
+                  />
+                )}
+              </View>
+              <View style={styles.rightButton}>
+                <TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedContacts}>
+                  <Text style={styles.closeButtonText}>{ state.strings.close }</Text>
+                </TouchableOpacity>
               </View>
             </View>
           </View>
-        </Modal>
-   
-        <Modal
-          animationType="fade"
-          transparent={true}
-          visible={state.blockedTopics}
-          supportedOrientations={['portrait', 'landscape']}
-          onRequestClose={state.hideBlockedTopics}
-        >
-          <View style={styles.modalOverlay}>
-            <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
-            <View style={styles.modalBase}>
-              <View style={styles.modalContainer}>
-                <View style={styles.modalClose}>
-                  <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedTopics}>
-                    <MatIcons name="close" size={20} color={Colors.descriptionText} />
-                  </TouchableOpacity>
-                </View>
-                <Text style={styles.modalHeader}>{ state.strings.blockedTopics }</Text>
-                <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
-                <View style={styles.modalList}>
-                  { state.topics.length === 0 && (
-                    <View style={styles.emptyLabel}>
-                      <Text style={styles.emptyLabelText}>{ state.strings.noBlockedTopics }</Text>
-                    </View>
-                  )}
-                  { state.topics.length !== 0 && (
-                    <FlatList
-                      data={state.topics}
-                      renderItem={BlockedTopic}
-                      keyExtractor={item => `${item.cardId}.${item.channelId}`}
-                    />
-                  )}
-                </View>
-                <View style={styles.rightButton}>
-                  <TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedTopics}>
-                    <Text style={styles.closeButtonText}>{ state.strings.close }</Text>
-                  </TouchableOpacity>
-                </View>
+        </View>
+      </Modal>
+
+      <Modal
+        animationType="fade"
+        transparent={true}
+        visible={state.blockedTopics}
+        supportedOrientations={['portrait', 'landscape']}
+        onRequestClose={state.hideBlockedTopics}
+      >
+        <View style={styles.modalOverlay}>
+          <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
+          <View style={styles.modalBase}>
+            <View style={styles.modalContainer}>
+              <View style={styles.modalClose}>
+                <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedTopics}>
+                  <MatIcons name="close" size={20} color={Colors.descriptionText} />
+                </TouchableOpacity>
+              </View>
+              <Text style={styles.modalHeader}>{ state.strings.blockedTopics }</Text>
+              <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
+              <View style={styles.modalList}>
+                { state.topics.length === 0 && (
+                  <View style={styles.emptyLabel}>
+                    <Text style={styles.emptyLabelText}>{ state.strings.noBlockedTopics }</Text>
+                  </View>
+                )}
+                { state.topics.length !== 0 && (
+                  <FlatList
+                    data={state.topics}
+                    renderItem={BlockedTopic}
+                    keyExtractor={item => `${item.cardId}.${item.channelId}`}
+                  />
+                )}
+              </View>
+              <View style={styles.rightButton}>
+                <TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedTopics}>
+                  <Text style={styles.closeButtonText}>{ state.strings.close }</Text>
+                </TouchableOpacity>
               </View>
             </View>
           </View>
-        </Modal>
-    
-        <Modal
-          animationType="fade"
-          transparent={true}
-          visible={state.blockedMessages}
-          supportedOrientations={['portrait', 'landscape']}
-          onRequestClose={actions.hideBlockedMessages}
-        >
-          <View style={styles.modalOverlay}>
-            <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
-            <View style={styles.modalBase}>
-              <View style={styles.modalContainer}>
-                <View style={styles.modalClose}>
-                  <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedMessages}>
-                    <MatIcons name="close" size={20} color={Colors.descriptionText} />
-                  </TouchableOpacity>
-                </View>
-                <Text style={styles.modalHeader}>{ state.strings.blockedMessages }</Text>
-                <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
-                <View style={styles.modalList}>
-                  { state.messages.length === 0 && (
-                    <View style={styles.emptyLabel}>
-                      <Text style={styles.emptyLabelText}>{ state.strings.noBlockedMessages }</Text>
-                    </View>
-                  )}
-                  { state.messages.length !== 0 && (
-                    <FlatList
-                      data={state.messages}
-                      renderItem={BlockedMessage}
-                      keyExtractor={item => `${item.cardId}.${item.channelId}.${item.topicId}`}
-                    />
-                  )}
-                </View>
-                <View style={styles.rightButton}>
-                  <TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedMessages}>
-                    <Text style={styles.closeButtonText}>{ state.strings.close }</Text>
-                  </TouchableOpacity>
-                </View>
+        </View>
+      </Modal>
+
+      <Modal
+        animationType="fade"
+        transparent={true}
+        visible={state.blockedMessages}
+        supportedOrientations={['portrait', 'landscape']}
+        onRequestClose={actions.hideBlockedMessages}
+      >
+        <View style={styles.modalOverlay}>
+          <BlurView style={styles.modalOverlay} blurType={Colors.overlay} blurAmount={2} reducedTransparencyFallbackColor="black" />
+          <View style={styles.modalBase}>
+            <View style={styles.modalContainer}>
+              <View style={styles.modalClose}>
+                <TouchableOpacity style={styles.dismissButton} activeOpacity={1} onPress={actions.hideBlockedMessages}>
+                  <MatIcons name="close" size={20} color={Colors.descriptionText} />
+                </TouchableOpacity>
+              </View>
+              <Text style={styles.modalHeader}>{ state.strings.blockedMessages }</Text>
+              <ActivityIndicator style={styles.modalBusy} animating={busy} color={Colors.primary} />
+              <View style={styles.modalList}>
+                { state.messages.length === 0 && (
+                  <View style={styles.emptyLabel}>
+                    <Text style={styles.emptyLabelText}>{ state.strings.noBlockedMessages }</Text>
+                  </View>
+                )}
+                { state.messages.length !== 0 && (
+                  <FlatList
+                    data={state.messages}
+                    renderItem={BlockedMessage}
+                    keyExtractor={item => `${item.cardId}.${item.channelId}.${item.topicId}`}
+                  />
+                )}
+              </View>
+              <View style={styles.rightButton}>
+                <TouchableOpacity style={styles.closeButton} activeOpacity={1} onPress={actions.hideBlockedMessages}>
+                  <Text style={styles.closeButtonText}>{ state.strings.close }</Text>
+                </TouchableOpacity>
               </View>
             </View>
           </View>
-        </Modal>
-     
-      </SafeAreaView>
-    </ScrollView>
+        </View>
+      </Modal>
+
+    </>     
   );
 }