120 lines
3.8 KiB
JavaScript
120 lines
3.8 KiB
JavaScript
import React, {Component} from 'react';
|
|
import translate from 'translations';
|
|
import KeystoreDecrypt from './KeystoreDecrypt';
|
|
import PrivateKeyDecrypt from './PrivateKeyDecrypt';
|
|
import MnemonicDecrypt from './MnemonicDecrypt';
|
|
import LedgerNanoSDecrypt from './LedgerNanoSDecrypt';
|
|
import TrezorDecrypt from './TrezorDecrypt';
|
|
import ViewOnlyDecrypt from './ViewOnlyDecrypt';
|
|
|
|
const decryptionChoices = [
|
|
{
|
|
name: 'keystore-file',
|
|
lid: 'x_Keystore2',
|
|
component: KeystoreDecrypt
|
|
},
|
|
{
|
|
name: 'private-key',
|
|
lid: 'x_PrivKey2',
|
|
component: PrivateKeyDecrypt
|
|
},
|
|
{
|
|
name: 'mnemonic-phrase',
|
|
lid: 'x_Mnemonic',
|
|
component: MnemonicDecrypt
|
|
},
|
|
{
|
|
name: 'ledger-nano-s',
|
|
lid: 'x_Ledger',
|
|
component: LedgerNanoSDecrypt
|
|
},
|
|
{
|
|
name: 'trezor',
|
|
lid: 'x_Trezor',
|
|
component: TrezorDecrypt
|
|
},
|
|
{
|
|
name: 'view-only',
|
|
lid: 'View with Address Only',
|
|
component: ViewOnlyDecrypt
|
|
}
|
|
];
|
|
|
|
export default class WalletDecrypt extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
// functions called by things like onChange need to be bound in this way.
|
|
// https://github.com/goatslacker/alt/issues/283#issuecomment-107463147
|
|
this.handleDecryptionChoiceChange = this.handleDecryptionChoiceChange.bind(this);
|
|
|
|
this.state = {
|
|
decryptionComponent: null
|
|
};
|
|
}
|
|
|
|
buildDecryptionChoices() {
|
|
return decryptionChoices.map((decryptionChoice, idx) => {
|
|
return (
|
|
<label className="radio" key={decryptionChoice.name}>
|
|
<input
|
|
aria-flowto={`aria${idx}`}
|
|
aria-labelledby={`${decryptionChoice.name}-label`}
|
|
type="radio"
|
|
name="decryption-choice-radio-group"
|
|
value={decryptionChoice.name}
|
|
onChange={this.handleDecryptionChoiceChange}
|
|
/>
|
|
<span id={`${decryptionChoice.name}-label`}>
|
|
{translate(decryptionChoice.lid)}
|
|
</span>
|
|
</label>
|
|
);
|
|
});
|
|
}
|
|
|
|
handleDecryptionChoiceChange(event)
|
|
{
|
|
const choiceObject = decryptionChoices.find(decryptionChoice => {
|
|
return (decryptionChoice.name === event.target.value) ? decryptionChoice.component : false;
|
|
});
|
|
const decryptionComponent = choiceObject.component;
|
|
|
|
this.setState({
|
|
decryptionComponent
|
|
});
|
|
}
|
|
|
|
render() {
|
|
const decryptionComponent = this.state.decryptionComponent ?
|
|
<this.state.decryptionComponent /> :
|
|
null;
|
|
|
|
return (
|
|
<section className="container">
|
|
<div className="tab-content">
|
|
<article className="tab-pane active">
|
|
<article className="collapse-container">
|
|
<div>
|
|
<h1>View Wallet Info</h1>
|
|
</div>
|
|
<div>
|
|
<p>{translate('VIEWWALLET_Subtitle')}</p>
|
|
<article className="well decrypt-drtv row">
|
|
<section className="col-md-4 col-sm-6">
|
|
<h4>{translate('decrypt_Access')}</h4>
|
|
|
|
{this.buildDecryptionChoices()}
|
|
|
|
</section>
|
|
|
|
{decryptionComponent}
|
|
</article>
|
|
</div>
|
|
</article>
|
|
</article>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|
|
} |