MyCrypto/common/components/WalletDecrypt/ViewOnly.tsx

61 lines
1.6 KiB
TypeScript

import React, { Component } from 'react';
import translate from 'translations';
import { donationAddressMap } from 'config/data';
import { isValidETHAddress } from 'libs/validators';
import { AddressOnlyWallet } from 'libs/wallet';
interface Props {
onUnlock(param: any): void;
}
interface State {
address: string;
}
export default class ViewOnlyDecrypt extends Component<Props, State> {
public state = {
address: ''
};
public render() {
const { address } = this.state;
const isValid = isValidETHAddress(address);
return (
<section className="col-md-4 col-sm-6">
<div id="selectedUploadKey">
<h4>{translate('MYWAL_Address')}</h4>
<form className="form-group" onSubmit={this.openWallet}>
<input
className={`form-control
${isValid ? 'is-valid' : 'is-invalid'}
`}
onChange={this.changeAddress}
value={address}
placeholder={donationAddressMap.ETH}
/>
<button className="btn btn-primary btn-block" disabled={!isValid}>
{translate('NAV_ViewWallet')}
</button>
</form>
</div>
</section>
);
}
private changeAddress = (ev: React.FormEvent<HTMLInputElement>) => {
this.setState({ address: ev.currentTarget.value });
};
private openWallet = (ev: React.SyntheticEvent<HTMLFormElement>) => {
const { address } = this.state;
ev.preventDefault();
if (isValidETHAddress(address)) {
const wallet = new AddressOnlyWallet(address);
this.props.onUnlock(wallet);
}
};
}