imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

await request promise inside encryption panel to show spinner

Browse source
This commit is contained in:
Bruno Windels 2020-03-05 17:44:35 +01:00
parent 3c2f4a5c42
commit 7d051d6a1d
3 changed files with 18 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/structures/RightPanel.js
View file

@ -182,6 +182,7 @@ export default class RightPanel extends React.Component {
member: payload.member, member: payload.member,
event: payload.event, event: payload.event,
verificationRequest: payload.verificationRequest, verificationRequest: payload.verificationRequest,
verificationRequestPromise: payload.verificationRequestPromise,
}); });
} }
} }
@ -231,6 +232,7 @@ export default class RightPanel extends React.Component {
onClose={onClose} onClose={onClose}
phase={this.state.phase} phase={this.state.phase}
verificationRequest={this.state.verificationRequest} verificationRequest={this.state.verificationRequest}
verificationRequestPromise={this.state.verificationRequestPromise}
/>; />;
} else { } else {
panel = <MemberInfo panel = <MemberInfo

15
src/components/views/right_panel/EncryptionPanel.js
View file

@ -30,7 +30,7 @@ import {_t} from "../../../languageHandler";
// cancellation codes which constitute a key mismatch // cancellation codes which constitute a key mismatch
const MISMATCHES = ["m.key_mismatch", "m.user_error", "m.mismatched_sas"]; const MISMATCHES = ["m.key_mismatch", "m.user_error", "m.mismatched_sas"];
const EncryptionPanel = ({verificationRequest, member, onClose, layout}) => { const EncryptionPanel = ({verificationRequest, verificationRequestPromise, member, onClose, layout}) => {
const [request, setRequest] = useState(verificationRequest); const [request, setRequest] = useState(verificationRequest);
// state to show a spinner immediately after clicking "start verification", // state to show a spinner immediately after clicking "start verification",
// before we have a request // before we have a request
@ -43,6 +43,19 @@ const EncryptionPanel = ({verificationRequest, member, onClose, layout}) => {
setPhase(verificationRequest.phase); setPhase(verificationRequest.phase);
} }
}, [verificationRequest]); }, [verificationRequest]);
useEffect(() => {
async function awaitPromise() {
setRequesting(true);
const request = await verificationRequestPromise;
setRequesting(false);
setRequest(request);
setPhase(request.phase);
}
if (verificationRequestPromise) {
awaitPromise();
}
}, [verificationRequestPromise]);
const changeHandler = useCallback(() => { const changeHandler = useCallback(() => {
// handle transitions -> cancelled for mismatches which fire a modal instead of showing a card // handle transitions -> cancelled for mismatches which fire a modal instead of showing a card
if (request && request.cancelled && MISMATCHES.includes(request.cancellationCode)) { if (request && request.cancelled && MISMATCHES.includes(request.cancellationCode)) {

4
src/components/views/right_panel/UserInfo.js
View file

@ -171,14 +171,14 @@ async function verifyDevice(userId, device) {
return; return;
} }
const cli = MatrixClientPeg.get(); const cli = MatrixClientPeg.get();
const verificationRequest = await cli.requestVerification( const verificationRequestPromise = cli.requestVerification(
userId, userId,
[device.deviceId], [device.deviceId],
); );
dis.dispatch({ dis.dispatch({
action: "set_right_panel_phase", action: "set_right_panel_phase",
phase: RIGHT_PANEL_PHASES.EncryptionPanel, phase: RIGHT_PANEL_PHASES.EncryptionPanel,
refireParams: {member, verificationRequest}, refireParams: {member, verificationRequestPromise},
}); });
}, },
primaryButton: _t("Done"), primaryButton: _t("Done"),