Attempt to make chat more reliable (#391)

duolicious · Sep 1, 2024 · 57bbb53 · 57bbb53
1 parent 3e2c881
commit 57bbb53
Show file tree

Hide file tree

Showing 4 changed files with 295 additions and 66 deletions.
diff --git a/App.tsx b/App.tsx
@@ -222,8 +222,12 @@ const App = () => {
   }, []);
 
   const fetchServerStatusState = useCallback(async () => {
-    const response = await fetch(STATUS_URL, {cache: 'no-cache'});
-    if (!response.ok) {
+    let response: Response | null = null
+    try {
+      response = await fetch(STATUS_URL, {cache: 'no-cache'});
+    } catch (e) {};
+
+    if (response === null || !response.ok) {
       // If even the status server is down, things are *very* not-okay. But odds
       // are it can't be contacted because the user has a crappy internet
       // connection. The "You're offline" notice should still provide some

diff --git a/components/inbox-tab.tsx b/components/inbox-tab.tsx
@@ -27,7 +27,7 @@ import { TopNavBarButton } from './top-nav-bar-button';
 import { inboxOrder, inboxSection } from '../kv-storage/inbox';
 import { signedInUser } from '../App';
 import { Notice } from './notice';
-import { listen } from '../events/events';
+import { listen, lastEvent } from '../events/events';
 
 const Stack = createNativeStackNavigator();
 
@@ -311,21 +311,10 @@ const InboxTab_ = ({navigation}) => {
 
   return (
     <SafeAreaView style={styles.safeAreaView}>
-      <TopNavBar>
-        <DefaultText
-          style={{
-            fontWeight: '700',
-            fontSize: 20,
-          }}
-        >
-          {'Inbox' + (showArchive ? ' (Archive)' : '')}
-        </DefaultText>
-        <TopNavBarButton
-          onPress={onPressArchiveButton}
-          iconName={showArchive ? 'chatbubbles-outline' : 'file-tray-full-outline'}
-          style={{right: 15}}
-        />
-      </TopNavBar>
+      <InboxTabNavBar
+        showArchive={showArchive}
+        onPressArchiveButton={onPressArchiveButton}
+      />
       {inbox === null &&
         <View style={{height: '100%', justifyContent: 'center', alignItems: 'center'}}>
           <ActivityIndicator size="large" color="#70f" />
@@ -349,6 +338,48 @@ const InboxTab_ = ({navigation}) => {
   );
 };
 
+const InboxTabNavBar = ({
+  showArchive,
+  onPressArchiveButton,
+}) => {
+  const [isOnline, setIsOnline] = useState(lastEvent('xmpp-is-online') ?? false);
+
+  useEffect(() => {
+    return listen('xmpp-is-online', setIsOnline);
+  }, []);
+
+  return (
+      <TopNavBar>
+        <View>
+          <DefaultText
+            style={{
+              fontWeight: '700',
+              fontSize: 20,
+            }}
+          >
+            {'Inbox' + (showArchive ? ' (Archive)' : '')}
+          </DefaultText>
+          {!isOnline &&
+            <ActivityIndicator
+              size="small"
+              color="#70f"
+              style={{
+                position: 'absolute',
+                right: -40,
+                top: 3,
+              }}
+            />
+          }
+        </View>
+        <TopNavBarButton
+          onPress={onPressArchiveButton}
+          iconName={showArchive ? 'chatbubbles-outline' : 'file-tray-full-outline'}
+          style={{right: 15}}
+        />
+      </TopNavBar>
+  );
+};
+
 const styles = StyleSheet.create({
   safeAreaView: {
     flex: 1

diff --git a/components/stream-error-modal.tsx b/components/stream-error-modal.tsx
@@ -1,4 +1,5 @@
 import {
+  Platform,
   Text,
   View,
 } from 'react-native';
@@ -18,6 +19,10 @@ const StreamErrorModal = () => {
     return <></>;
   };
 
+  if (Platform.OS !== 'web') {
+    return <></>;
+  }
+
   return (
     <View
       style={{