[lib] Add timeout to useWaitForConnection() hook

Summary:
As per discussion here: https://phab.comm.dev/D14167 added a timeout when waiting for connection. If timeout is hit, an error is thrown.

Depends on D14167

Test Plan:
1. Have mobile and web clients that do not know each other
2. Put a sleep() call before connecting to tunnelbroker socket (for example 20s)
3. Close web client
4. Send a DM on mobile to web. Make sure it's sent (checkmark)
5. Open web client
6. Quickly (before sleep from step 2 ends) add mobile to friends (with Settings -> friends -> add friends)
If we do it quickly enough the 5s timeout should trigger.

Reviewers: tomek, kamil

Reviewed By: tomek

Subscribers: ashoat

Differential Revision: https://phab.comm.dev/D14184

lib/hooks/wait-for-connection.js

@@ -7,16 +7,18 @@ import { useTunnelbroker } from '../tunnelbroker/tunnelbroker-context.js';
 import { authoritativeKeyserverID } from '../utils/authoritative-keyserver.js';
 import { useSelector } from '../utils/redux-utils.js';
 
+const WAITING_TIMEOUT = 5 * 1000; // 5 seconds
+
 function useWaitForConnection(): () => Promise<void> {
   const { socketState } = useTunnelbroker();
 
   const connection = useSelector(
     connectionSelector(authoritativeKeyserverID()),
   );
 
-  const resolveConnectionPromisesCallbacks = React.useRef<Array<() => void>>(
-    [],
-  );
+  const resolveConnectionPromisesCallbacks = React.useRef<
+    Array<{ +callback: () => void, +timeoutID: TimeoutID }>,
+  >([]);
 
   const isConnectedOrUnreachable = React.useMemo(() => {
     return (
@@ -27,7 +29,12 @@ function useWaitForConnection(): () => Promise<void> {
 
   React.useEffect(() => {
     if (isConnectedOrUnreachable) {
-      resolveConnectionPromisesCallbacks.current.forEach(cb => cb());
+      resolveConnectionPromisesCallbacks.current.forEach(({ timeoutID }) =>
+        clearTimeout(timeoutID),
+      );
+      resolveConnectionPromisesCallbacks.current.forEach(({ callback }) =>
+        callback(),
+      );
       resolveConnectionPromisesCallbacks.current = [];
     }
   }, [isConnectedOrUnreachable]);
@@ -36,8 +43,18 @@ function useWaitForConnection(): () => Promise<void> {
     if (isConnectedOrUnreachable) {
       return Promise.resolve();
     }
-    return new Promise(resolve => {
-      resolveConnectionPromisesCallbacks.current.push(resolve);
+    return new Promise((resolve, reject) => {
+      const timeoutID = setTimeout(() => {
+        resolveConnectionPromisesCallbacks.current =
+          resolveConnectionPromisesCallbacks.current.filter(
+            ({ callback }) => callback !== resolve,
+          );
+        reject(new Error('Timeout while waiting for connection'));
+      }, WAITING_TIMEOUT);
+      resolveConnectionPromisesCallbacks.current.push({
+        callback: resolve,
+        timeoutID,
+      });
     });
   }, [isConnectedOrUnreachable]);