From c6d996ab0461a2517703ac3bee14c388829ef962 Mon Sep 17 00:00:00 2001
From: Roland Osborne <roland.osborne@gmail.com>
Date: Tue, 1 Nov 2022 13:53:33 -0700
Subject: [PATCH] adding empty conversation indicator

---
 .../src/session/conversation/Conversation.jsx | 35 +++++++++++--------
 .../conversation/Conversation.styled.js       | 10 ++++++
 2 files changed, 31 insertions(+), 14 deletions(-)

diff --git a/app/mobile/src/session/conversation/Conversation.jsx b/app/mobile/src/session/conversation/Conversation.jsx
index 89612428..73195c5d 100644
--- a/app/mobile/src/session/conversation/Conversation.jsx
+++ b/app/mobile/src/session/conversation/Conversation.jsx
@@ -88,20 +88,27 @@ export function ConversationBody() {
       <KeyboardAvoidingView behavior="padding" keyboardVerticalOffset={72}
           enabled={Platform.OS === 'ios' ? state.keyboard : false}>
 <View style={styles.thread}>
-        <FlatList style={styles.conversation}
-           contentContainerStyle={styles.topics}
-           ref={ref}
-           data={state.topics}
-           onMomentumScrollEnd={ Platform.OS === 'ios' ? noop : actions.unlatch }
-           onScrollBeginDrag={ Platform.OS !== 'ios' ? noop : actions.unlatch }
-           maintainVisibleContentPosition={ state.latched ? null : { minIndexForVisibile: 2, } }
-           inverted={true}
-           renderItem={({item}) => <TopicItem item={item} focused={item.topicId === state.focus} 
-             focus={() => actions.setFocus(item.topicId)} hosting={state.host == null} 
-             remove={actions.removeTopic} update={actions.editTopic} block={actions.blockTopic}
-             report={actions.reportTopic} />}
-          keyExtractor={item => item.topicId}
-        />
+        { state.topics.length === 0 && (
+          <View style={styles.empty}>
+            <Text style={styles.emptyText}>No Messages</Text>
+          </View>
+        )}
+        { state.topics.length !== 0 && (
+          <FlatList style={styles.conversation}
+             contentContainerStyle={styles.topics}
+             ref={ref}
+             data={state.topics}
+             onMomentumScrollEnd={ Platform.OS === 'ios' ? noop : actions.unlatch }
+             onScrollBeginDrag={ Platform.OS !== 'ios' ? noop : actions.unlatch }
+             maintainVisibleContentPosition={ state.latched ? null : { minIndexForVisibile: 2, } }
+             inverted={true}
+             renderItem={({item}) => <TopicItem item={item} focused={item.topicId === state.focus} 
+               focus={() => actions.setFocus(item.topicId)} hosting={state.host == null} 
+               remove={actions.removeTopic} update={actions.editTopic} block={actions.blockTopic}
+               report={actions.reportTopic} />}
+            keyExtractor={item => item.topicId}
+          />
+        )}
         { !state.init && (
           <View style={styles.loading}>
             <ActivityIndicator size="large" color={Colors.primary} />
diff --git a/app/mobile/src/session/conversation/Conversation.styled.js b/app/mobile/src/session/conversation/Conversation.styled.js
index 6d4e4f90..33f75102 100644
--- a/app/mobile/src/session/conversation/Conversation.styled.js
+++ b/app/mobile/src/session/conversation/Conversation.styled.js
@@ -65,6 +65,16 @@ export const styles = StyleSheet.create({
     minHeight: 0,
     paddingTop: 8,
   },
+  empty: {
+    flexGrow: 1,
+    flexShrink: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  emptyText: {
+    fontSize: 16,
+    color: Colors.grey,
+  },
   close: {
     flexGrow: 1,
     justifyContent: 'flex-end',