diff --git a/lib/hooks/wait-for-connection.js b/lib/hooks/wait-for-connection.js --- a/lib/hooks/wait-for-connection.js +++ b/lib/hooks/wait-for-connection.js @@ -18,7 +18,7 @@ connectionSelector(authoritativeKeyserverID()), ); - const resolveConnectionPromisesCallbacks = React.useRef< + const [connectionPromises, setConnectionPromises] = React.useState< Array<{ +callback: () => void, +timeoutID: TimeoutID }>, >([]); @@ -39,16 +39,15 @@ ]); React.useEffect(() => { + if (connectionPromises.length === 0) { + return; + } if (isConnectedOrUnreachable) { - resolveConnectionPromisesCallbacks.current.forEach(({ timeoutID }) => - clearTimeout(timeoutID), - ); - resolveConnectionPromisesCallbacks.current.forEach(({ callback }) => - callback(), - ); - resolveConnectionPromisesCallbacks.current = []; + connectionPromises.forEach(({ timeoutID }) => clearTimeout(timeoutID)); + connectionPromises.forEach(({ callback }) => callback()); + setConnectionPromises([]); } - }, [isConnectedOrUnreachable]); + }, [isConnectedOrUnreachable, connectionPromises]); const waitForConnection = React.useCallback((): Promise => { if (isConnectedOrUnreachable) { @@ -56,16 +55,16 @@ } return new Promise((resolve, reject) => { const timeoutID = setTimeout(() => { - resolveConnectionPromisesCallbacks.current = - resolveConnectionPromisesCallbacks.current.filter( - ({ callback }) => callback !== resolve, - ); + setConnectionPromises(currentPromises => + currentPromises.filter(({ callback }) => callback !== resolve), + ); reject(new Error('Timeout while waiting for connection')); }, WAITING_TIMEOUT); - resolveConnectionPromisesCallbacks.current.push({ - callback: resolve, - timeoutID, - }); + + setConnectionPromises(currentPromises => [ + ...currentPromises, + { callback: resolve, timeoutID }, + ]); }); }, [isConnectedOrUnreachable]);