Merge pull request 'fix(status): show a strip when the homeserver hangs, not 110 s later (#317)' (#380) from fix/stall-watchdog into lotus

src/app/pages/client/SyncStatus.tsx

@@ -6,6 +6,7 @@ import { useSyncState } from '../../hooks/useSyncState';
 import { ContainerColor } from '../../styles/ContainerColor.css';
 import { serverStatusAtom } from '../../state/serverStatus';
 import { serverConfirmedUpSince } from '../../utils/kumaStatus';
+import { homeserverStalledAtom } from '../../hooks/useHomeserverStall';
 
 type StateData = {
   current: SyncState | null;
@@ -17,6 +18,7 @@ type SyncStatusProps = {
 };
 export function SyncStatus({ mx }: SyncStatusProps) {
   const serverStatus = useAtomValue(serverStatusAtom);
+  const stalled = useAtomValue(homeserverStalledAtom);
   const [stateData, setStateData] = useState<StateData>({
     current: null,
     previous: undefined,
@@ -34,6 +36,35 @@ export function SyncStatus({ mx }: SyncStatusProps) {
     }, []),
   );
 
+  // [Gitea #124] When Kuma confirms the homeserver is down, the status banner
+  // says so ("Lotus Chat's server is down…") instead of "Connection Lost!".
+  const serverDown = serverStatus.status?.homeserver === 'down';
+  // Only blame the user's connection when Kuma has checked the server since
+  // the drop and it was fine (a stale "up" from before proves nothing).
+  const serverUp = serverConfirmedUpSince(serverStatus.status, serverStatus.lostAt);
+
+  // [Gitea #317] Sync still says SYNCING, but the server has stopped answering.
+  if (stalled && stateData.current === SyncState.Syncing && !serverDown) {
+    return (
+      <Box direction="Column" shrink="No">
+        <Box
+          className={ContainerColor({ variant: 'Warning' })}
+          style={{ padding: `${config.space.S100} 0` }}
+          alignItems="Center"
+          justifyContent="Center"
+          role="status"
+          aria-live="polite"
+        >
+          <Text size="L400">
+            Lotus Chat&apos;s server isn&apos;t responding. Messages will send when it&apos;s back.
+            Still trying…
+          </Text>
+        </Box>
+        <Line variant="Warning" size="300" />
+      </Box>
+    );
+  }
+
   if (
     (stateData.current === SyncState.Prepared ||
       stateData.current === SyncState.Syncing ||
@@ -57,13 +88,6 @@ export function SyncStatus({ mx }: SyncStatusProps) {
     );
   }
 
-  // [Gitea #124] When Kuma confirms the homeserver is down, the status banner
-  // says so ("Lotus Chat's server is down…") instead of "Connection Lost!".
-  const serverDown = serverStatus.status?.homeserver === 'down';
-  // Only blame the user's connection when Kuma has checked the server since
-  // the drop and it was fine (a stale "up" from before proves nothing).
-  const serverUp = serverConfirmedUpSince(serverStatus.status, serverStatus.lostAt);
-
   if (stateData.current === SyncState.Reconnecting && !serverDown) {
     return (
       <Box direction="Column" shrink="No">