adding empty conversation indicator

This commit is contained in:
Roland Osborne 2022-11-01 13:53:33 -07:00
parent a44448d8c4
commit c6d996ab04
2 changed files with 31 additions and 14 deletions

View File

@ -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} />

View File

@ -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',