message: Restore key backup in Complete Security dialog
  Fixes
diff: @@ -22,8 +22,9 @@ import { MatrixClientPeg } from '../../../MatrixClientPeg';
  import { accessSecretStorage } from '../../../CrossSigningManager';
  const PHASE_INTRO = 0;
  -const PHASE_DONE = 1;
  -const PHASE_CONFIRM_SKIP = 2;
  +const PHASE_BUSY = 1;
  +const PHASE_DONE = 2;
  +const PHASE_CONFIRM_SKIP = 3;
  export default class CompleteSecurity extends React.Component {
  static propTypes = {
  @@ -39,6 +40,7 @@ export default class CompleteSecurity extends React.Component {
  // the presence of it insidicating that we're in 'verify mode'.
  // Because of the latter, it lives in the state.
  verificationRequest: null,
  + backupInfo: null,
  };
  MatrixClientPeg.get().on("crypto.verification.request", this.onVerificationRequest);
  }
  @@ -53,10 +55,16 @@ export default class CompleteSecurity extends React.Component {
  }
  onStartClick = async () => {
  + this.setState({
  + phase: PHASE_BUSY,
  + });
  const cli = MatrixClientPeg.get();
  + const backupInfo = await cli.getKeyBackupVersion();
  + this.setState({backupInfo});
  try {
  await accessSecretStorage(async () => {
  await cli.checkOwnCrossSigningTrust();
  + if (backupInfo) await cli.restoreKeyBackupWithSecretStorage(backupInfo);
  });
  if (cli.getCrossSigningId()) {
  @@ -66,6 +74,9 @@ export default class CompleteSecurity extends React.Component {
  }
  } catch (e) {
  // this will throw if the user hits cancel, so ignore
  + this.setState({
  + phase: PHASE_INTRO,
  + });
  }
  }
  @@ -155,13 +166,21 @@ export default class CompleteSecurity extends React.Component {
  } else if (phase === PHASE_DONE) {
  icon = <span className="mx_CompleteSecurity_headerIcon mx_E2EIcon_verified"></span>;
  title = _t("Session verified");
  + let message;
  + if (this.state.backupInfo) {
  + message = <p>{_t(
  + "Your new session is now verified. It has access to your " +
  + "encrypted messages, and other users will see it as trusted.",
  + )}</p>;
  + } else {
  + message = <p>{_t(
  + "Your new session is now verified. Other users will see it as trusted.",
  + )}</p>;
  + }
  body = (
  <div>
  <div className="mx_CompleteSecurity_heroIcon mx_E2EIcon_verified"></div>
  - <p>{_t(
  - "Your new session is now verified. It has access to your " +
  - "encrypted messages, and other users will see it as trusted.",
  - )}</p>
  + {message}
  <div className="mx_CompleteSecurity_actionRow">
  <AccessibleButton
  kind="primary"
  @@ -198,6 +217,11 @@ export default class CompleteSecurity extends React.Component {
  </div>
  </div>
  );
  + } else if (phase === PHASE_BUSY) {
  + const Spinner = sdk.getComponent('views.elements.Spinner');
  + icon = <span className="mx_CompleteSecurity_headerIcon mx_E2EIcon_warning"></span>;
  + title = '';
  + body = <Spinner />;
  } else {
  throw new Error(`Unknown phase ${phase}`);
  }
  