support manual conversation resync

app/mobile/src/context/useConversationContext.hook.js

@@ -223,7 +223,7 @@ export function useConversationContext() {
               else {
                 channel.actions.setReadRevision(channelId, revision.current);
               }
-              updateState({ topics: topics.current, init: true });
+              updateState({ topics: topics.current, init: true, error: false });
             }
 
             syncing.current = false;
@@ -232,7 +232,7 @@ export function useConversationContext() {
           catch(err) {
             console.log(err);
             syncing.current = false;
-            //TODO set to unsynced state
+            updateState({ error: true });
           }
         }
       }
@@ -491,7 +491,13 @@ export function useConversationContext() {
           }
         }
       }
+    },
+    resync: () => {
+      if (conversationId.current) {
+        force.current = true;
+        sync();
       }
+    },
   }
 
   return { state, actions }

app/mobile/src/session/conversation/Conversation.jsx

@@ -24,9 +24,15 @@ export function ConversationHeader({ closeConversation, openDetails }) {
 
   return (
     <View style={styles.title}>
-      <View style={styles.subject}>
+      <TouchableOpacity style={styles.subject} activeOpacity={1} onPress={actions.resync}>
+        <View style={styles.icon} />
         <Text style={styles.subjectText} numberOfLines={1} ellipsizeMode={'tail'}>{ state.subject }</Text>
+        <View style={styles.icon}>
+          { state.error && (
+            <Ionicons name="exclamationcircleo" size={16} color={Colors.alert} />
+          )}
         </View>
+      </TouchableOpacity>
       <TouchableOpacity style={styles.action} onPress={setDetails}>
         <Ionicons name="setting" size={26} color={Colors.primary} />
       </TouchableOpacity>

app/mobile/src/session/conversation/Conversation.styled.js

@@ -35,6 +35,14 @@ export const styles = StyleSheet.create({
     flexShrink: 1,
     textAlign: 'center',
     paddingLeft: 16,
+    display: 'flex',
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  icon: {
+    paddingLeft: 4,
+    width: 32,
   },
   subjectText: {
     fontSize: 18,

app/mobile/src/session/conversation/useConversation.hook.js

@@ -16,6 +16,7 @@ export function useConversation() {
     editData: null,
     editMessage: null,
     init: false,
+    error: false,
   });
 
   const delay = useRef(null);
@@ -26,7 +27,7 @@ export function useConversation() {
   }
 
   useEffect(() => {
-    const { subject, logo, topics, host, init } = conversation.state;
+    const { error, subject, logo, topics, host, init } = conversation.state;
     const items = Array.from(topics.values());
     const sorted = items.sort((a, b) => {
       const aTimestamp = a?.detail?.created;
@@ -40,7 +41,7 @@ export function useConversation() {
       return -1;
     });
     const filtered = sorted.filter(item => !(item.blocked === 1));
-    updateState({ topics, subject, logo, host, topics: filtered });
+    updateState({ topics, subject, logo, host, error, topics: filtered });
     if (init) {
       clearTimeout(delay.current);
       updateState({ init: true });
@@ -87,7 +88,10 @@ export function useConversation() {
     },
     blockTopic: async (topicId) => {
       await conversation.actions.blockTopic(topicId);
-    }
+    },
+    resync: () => {
+      conversation.actions.resync();
+    },
   };
 
   return { state, actions };