diff --git a/lib/components/secondary-device-qr-auth-context-provider.react.js b/lib/components/secondary-device-qr-auth-context-provider.react.js --- a/lib/components/secondary-device-qr-auth-context-provider.react.js +++ b/lib/components/secondary-device-qr-auth-context-provider.react.js @@ -55,6 +55,7 @@ +openSecondaryQRAuth: () => Promise, +closeSecondaryQRAuth: () => void, +canGenerateQRs: boolean, + +qrAuthInProgress: boolean, }; const SecondaryDeviceQRAuthContext: React.Context = @@ -63,6 +64,7 @@ openSecondaryQRAuth: async () => {}, closeSecondaryQRAuth: () => {}, canGenerateQRs: true, + qrAuthInProgress: false, }); function SecondaryDeviceQRAuthContextProvider(props: Props): React.Node { @@ -76,7 +78,11 @@ const [primaryDeviceID, setPrimaryDeviceID] = React.useState(); const [qrData, setQRData] = React.useState(); - const [qrAuthFinished, setQRAuthFinished] = React.useState(false); + + const [qrAuthState, setQRAuthState] = React.useState< + 'not_started' | 'started' | 'finished', + >('not_started'); + const qrAuthFinished = qrAuthState === 'finished'; const loggedIn = useSelector(isLoggedIn); const prevLoggedIn = React.useRef(loggedIn); @@ -118,7 +124,7 @@ setUnauthorizedDeviceID(ed25519); setQRData({ deviceID: ed25519, aesKey: aesKeyAsHexString }); - setQRAuthFinished(false); + setQRAuthState('not_started'); }, [generateAESKey, setUnauthorizedDeviceID]); const closeSecondaryQRAuth = React.useCallback(() => { @@ -169,7 +175,7 @@ errorMessage, ); } - setQRAuthFinished(true); + setQRAuthState('finished'); setQRData(null); })(); }, [ @@ -260,6 +266,7 @@ backupData, } = qrCodeAuthMessage; setPrimaryDeviceID(receivedPrimaryDeviceID); + setQRAuthState('started'); try { await confirmMessageToTunnelbroker(message.messageID); @@ -310,12 +317,14 @@ openSecondaryQRAuth, closeSecondaryQRAuth, canGenerateQRs: !socketState.isAuthorized, + qrAuthInProgress: qrAuthState === 'started', }), [ qrData, openSecondaryQRAuth, closeSecondaryQRAuth, socketState.isAuthorized, + qrAuthState, ], );