Make cross-signing dialog clearer and more context-aware

- Don't show loading spinners while waiting for user action
- When checking if there are other devices we can verify against, only
  look for devices that are actually cross-signed.
- Adjust displayed options depending on whether other devices and/or
  recovery keys exist, and add an option to reset cross-signing keys
  if necessary.
- Various minor clarifying adjustments to UI styling/text

Signed-off-by: Faye Duxovni <fayed@element.io>
This commit is contained in:
Faye Duxovni 2021-09-08 13:55:31 -04:00
parent 79b52f8a22
commit 9a16b4636f
9 changed files with 278 additions and 88 deletions

View file

@ -121,24 +121,24 @@ export default class VerificationShowSas extends React.Component<IProps, IState>
}
let confirm;
if (this.state.pending || this.state.cancelling) {
if (this.state.pending && this.props.isSelf) {
let text;
// device shouldn't be null in this situation but it can be, eg. if the device is
// logged out during verification
if (this.props.device) {
text = _t("Waiting for you to verify on your other session, %(deviceName)s (%(deviceId)s)…", {
deviceName: this.props.device ? this.props.device.getDisplayName() : '',
deviceId: this.props.device ? this.props.device.deviceId : '',
});
} else {
text = _t("Waiting for you to verify on your other session…");
}
confirm = <p>{ text }</p>;
} else if (this.state.pending || this.state.cancelling) {
let text;
if (this.state.pending) {
if (this.props.isSelf) {
// device shouldn't be null in this situation but it can be, eg. if the device is
// logged out during verification
if (this.props.device) {
text = _t("Waiting for your other session, %(deviceName)s (%(deviceId)s), to verify…", {
deviceName: this.props.device ? this.props.device.getDisplayName() : '',
deviceId: this.props.device ? this.props.device.deviceId : '',
});
} else {
text = _t("Waiting for your other session to verify…");
}
} else {
const { displayName } = this.props;
text = _t("Waiting for %(displayName)s to verify…", { displayName });
}
const { displayName } = this.props;
text = _t("Waiting for %(displayName)s to verify…", { displayName });
} else {
text = _t("Cancelling…");
}