diff --git a/res/css/views/dialogs/keybackup/_RestoreKeyBackupDialog.scss b/res/css/views/dialogs/keybackup/_RestoreKeyBackupDialog.scss
index 9cba8e0da9..5689d84bc5 100644
--- a/res/css/views/dialogs/keybackup/_RestoreKeyBackupDialog.scss
+++ b/res/css/views/dialogs/keybackup/_RestoreKeyBackupDialog.scss
@@ -32,3 +32,9 @@ limitations under the License.
padding: 10px;
}
+.mx_RestoreKeyBackupDialog_content > div {
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ min-height: 110px; /* Empirically measured */
+}
diff --git a/src/components/views/dialogs/keybackup/RestoreKeyBackupDialog.js b/src/components/views/dialogs/keybackup/RestoreKeyBackupDialog.js
index dc82a71713..f1008dfcb0 100644
--- a/src/components/views/dialogs/keybackup/RestoreKeyBackupDialog.js
+++ b/src/components/views/dialogs/keybackup/RestoreKeyBackupDialog.js
@@ -59,6 +59,7 @@ export default class RestoreKeyBackupDialog extends React.PureComponent {
forceRecoveryKey: false,
passPhrase: '',
restoreType: null,
+ progress: { stage: "prefetch" },
};
}
@@ -80,6 +81,12 @@ export default class RestoreKeyBackupDialog extends React.PureComponent {
});
}
+ _progressCallback = (data) => {
+ this.setState({
+ progress: data,
+ });
+ }
+
_onResetRecoveryClick = () => {
this.props.onFinished(false);
Modal.createTrackedDialogAsync('Key Backup', 'Key Backup',
@@ -110,6 +117,7 @@ export default class RestoreKeyBackupDialog extends React.PureComponent {
// is the right one and restoring it is currently the only way we can do this.
const recoverInfo = await MatrixClientPeg.get().restoreKeyBackupWithPassword(
this.state.passPhrase, undefined, undefined, this.state.backupInfo,
+ { progressCallback: this._progressCallback },
);
if (this.props.keyCallback) {
const key = await MatrixClientPeg.get().keyBackupKeyFromPassword(
@@ -146,6 +154,7 @@ export default class RestoreKeyBackupDialog extends React.PureComponent {
try {
const recoverInfo = await MatrixClientPeg.get().restoreKeyBackupWithRecoveryKey(
this.state.recoveryKey, undefined, undefined, this.state.backupInfo,
+ { progressCallback: this._progressCallback },
);
if (this.props.keyCallback) {
const key = MatrixClientPeg.get().keyBackupKeyFromRecoveryKey(this.state.recoveryKey);
@@ -185,6 +194,7 @@ export default class RestoreKeyBackupDialog extends React.PureComponent {
const recoverInfo = await accessSecretStorage(async () => {
return MatrixClientPeg.get().restoreKeyBackupWithSecretStorage(
this.state.backupInfo,
+ { progressCallback: this._progressCallback },
);
});
this.setState({
@@ -207,6 +217,7 @@ export default class RestoreKeyBackupDialog extends React.PureComponent {
undefined, /* targetRoomId */
undefined, /* targetSessionId */
backupInfo,
+ { progressCallback: this._progressCallback },
);
this.setState({
recoverInfo,
@@ -272,8 +283,20 @@ export default class RestoreKeyBackupDialog extends React.PureComponent {
let content;
let title;
if (this.state.loading) {
- title = _t("Loading...");
- content =
{_t( @@ -314,7 +337,7 @@ export default class RestoreKeyBackupDialog extends React.PureComponent { )}
; } content ={_t("Restored %(sessionCount)s session keys", {sessionCount: this.state.recoverInfo.imported})}
+{_t("Successfully restored %(sessionCount)s keys", {sessionCount: this.state.recoverInfo.imported})}
{failedToDecrypt}