93 lines
2.9 KiB
TypeScript
93 lines
2.9 KiB
TypeScript
import PrintableWallet from 'components/PrintableWallet';
|
|
import { IFullWallet } from 'ethereumjs-wallet';
|
|
import { NewTabLink } from 'components/ui';
|
|
import React from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
import translate from 'translations';
|
|
import { stripHexPrefix } from 'libs/values';
|
|
import './PaperWallet.scss';
|
|
import Template from './Template';
|
|
|
|
const content = (wallet: IFullWallet) => (
|
|
<div className="GenPaper">
|
|
{/* Private Key */}
|
|
<h1 className="GenPaper-title">{translate('GEN_Label_5')}</h1>
|
|
<input
|
|
className="GenPaper-private form-control"
|
|
value={stripHexPrefix(wallet.getPrivateKeyString())}
|
|
aria-label={translate('x_PrivKey')}
|
|
aria-describedby="x_PrivKeyDesc"
|
|
type="text"
|
|
readOnly={true}
|
|
/>
|
|
|
|
{/* Download Paper Wallet */}
|
|
<h1 className="GenPaper-title">{translate('x_Print')}</h1>
|
|
<div className="GenPaper-paper">
|
|
<PrintableWallet wallet={wallet} />
|
|
</div>
|
|
|
|
{/* Warning */}
|
|
<div className="GenPaper-warning">
|
|
<p>
|
|
<strong>Do not lose it!</strong> It cannot be recovered if you lose it.
|
|
</p>
|
|
<p>
|
|
<strong>Do not share it!</strong> Your funds will be stolen if you use
|
|
this file on a malicious/phishing site.
|
|
</p>
|
|
<p>
|
|
<strong>Make a backup!</strong> Secure it like the millions of dollars
|
|
it may one day be worth.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Continue button */}
|
|
<Link className="GenPaper-continue btn btn-default" to="/view-wallet">
|
|
{translate('NAV_ViewWallet')} →
|
|
</Link>
|
|
</div>
|
|
);
|
|
|
|
const help = (
|
|
<div>
|
|
<h4>{translate('GEN_Help_4')}</h4>
|
|
<ul>
|
|
<li>
|
|
<NewTabLink href="https://myetherwallet.groovehq.com/knowledge_base/topics/how-do-i-save-slash-backup-my-wallet">
|
|
<strong>{translate('HELP_2a_Title')}</strong>
|
|
</NewTabLink>
|
|
</li>
|
|
<li>
|
|
<NewTabLink href="https://myetherwallet.groovehq.com/knowledge_base/topics/protecting-yourself-and-your-funds">
|
|
<strong>{translate('GEN_Help_15')}</strong>
|
|
</NewTabLink>
|
|
</li>
|
|
<li>
|
|
<NewTabLink href="https://myetherwallet.groovehq.com/knowledge_base/topics/what-are-the-different-formats-of-a-private-key">
|
|
<strong>{translate('GEN_Help_16')}</strong>
|
|
</NewTabLink>
|
|
</li>
|
|
</ul>
|
|
|
|
<h4>{translate('GEN_Help_17')}</h4>
|
|
<ul>
|
|
<li>{translate('GEN_Help_18')}</li>
|
|
<li>{translate('GEN_Help_19')}</li>
|
|
<li>
|
|
<NewTabLink href="https://myetherwallet.groovehq.com/knowledge_base/topics/how-do-i-safely-slash-offline-slash-cold-storage-with-myetherwallet">
|
|
{translate('GEN_Help_20')}
|
|
</NewTabLink>
|
|
</li>
|
|
</ul>
|
|
|
|
<h4>{translate('x_PrintDesc')}</h4>
|
|
</div>
|
|
);
|
|
|
|
const PaperWallet: React.SFC<{
|
|
wallet: IFullWallet;
|
|
}> = ({ wallet }) => <Template content={content(wallet)} help={help} />;
|
|
|
|
export default PaperWallet;
|