mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-22 17:25:50 +03:00
Code Issues Projects Releases Packages Wiki Activity

Add recovery key download button

Browse source
This commit is contained in:
David Baker 2018-11-21 13:57:31 +00:00
parent 6fe2c9c2bb
commit ed5d87e797
2 changed files with 36 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
src/components/views/dialogs/keybackup/CreateKeyBackupDialog.js
View file

@ -18,6 +18,8 @@ import React from 'react';
import sdk from '../../../../index';
import MatrixClientPeg from '../../../../MatrixClientPeg';
import FileSaver from 'file-saver';
import { _t, _td } from '../../../../languageHandler';
const PHASE_PASSPHRASE = 0;
@ -49,6 +51,7 @@ export default React.createClass({
passPhrase: '',
passPhraseConfirm: '',
copied: false,
downloaded: false,
};
},
@ -72,6 +75,18 @@ export default React.createClass({
}
},
_onDownloadClick: function() {
const blob = new Blob([this._keyBackupInfo.recovery_key], {
type: 'text/plain;charset=us-ascii',
});
FileSaver.saveAs(blob, 'recovery-key.txt');
this.setState({
downloaded: true,
phase: PHASE_KEEPITSAFE,
});
},
_createBackup: function() {
this.setState({
phase: PHASE_BACKINGUP,
@ -278,13 +293,21 @@ export default React.createClass({
<div>{_t("Your Recovery Key")}</div>
<div className="mx_CreateKeyBackupDialog_recoveryKeyButtons">
<button onClick={this._onCopyClick}>
{this.state.copied ? _t("Copied!") : _t("Copy to clipboard")}
{_t("Copy to clipboard")}
</button>
{
// FIXME REDESIGN: buttons should be adjacent but insufficient room in current design
}
<br /><br />
<button onClick={this._onDownloadClick}>
{_t("Download")}
</button>
</div>
<div className="mx_CreateKeyBackupDialog_recoveryKey">
<code ref={this._collectRecoveryKeyNode}>{this._keyBackupInfo.recovery_key}</code>
</div>
</p>
<br />
<DialogButtons primaryButton={_t("I've made a copy")}
onPrimaryButtonClick={this._createBackup}
hasCancel={false}
@ -296,7 +319,15 @@ export default React.createClass({
_renderPhaseKeepItSafe: function() {
let introText;
if (this.state.copied) {
introText = _t("Your Recovery Key has been copied to your clipboard, paste it to:");
introText = _t(
"Your Recovery Key has been <b>copied to your clipboard</b>, paste it to:",
{}, {b: s => <b>{s}</b>},
);
} else if (this.state.downloaded) {
introText = _t(
"Your Recovery Key is in your <b>Downloads</b> folder.",
{}, {b: s => <b>{s}</b>},
);
}
const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
return <div>

4
src/i18n/strings/en_EN.json
View file

@ -986,8 +986,10 @@
"As a safety net, you can use it to restore your encrypted message history if you forget your Recovery Passphrase.": "As a safety net, you can use it to restore your encrypted message history if you forget your Recovery Passphrase.",
"Your Recovery Key": "Your Recovery Key",
"Copy to clipboard": "Copy to clipboard",
"Download": "Download",
"I've made a copy": "I've made a copy",
"Your Recovery Key has been copied to your clipboard, paste it to:": "Your Recovery Key has been copied to your clipboard, paste it to:",
"Your Recovery Key has been <b>copied to your clipboard</b>, paste it to:": "Your Recovery Key has been <b>copied to your clipboard</b>, paste it to:",
"Your Recovery Key is in your <b>Downloads</b> folder.": "Your Recovery Key is in your <b>Downloads</b> folder.",
"<b>Print it</b> and store it somewhere safe": "<b>Print it</b> and store it somewhere safe",
"<b>Save it</b> on a USB key or backup drive": "<b>Save it</b> on a USB key or backup drive",
"<b>Copy it</b> to your personal cloud storage": "<b>Copy it</b> to your personal cloud storage",