zcash-grant-system/frontend/client/components/AuthFlow/providers/Address.tsx

53 lines
1.2 KiB
TypeScript

import React from 'react';
import { Form, Button } from 'antd';
import { isValidEthAddress } from 'utils/validators';
import AddressInput from 'components/AddressInput';
import './Address.less';
interface Props {
onSelectAddress(addr: string): void;
}
interface State {
address: string;
}
export default class AddressProvider extends React.Component<Props, State> {
state: State = {
address: '',
};
render() {
const { address } = this.state;
return (
<Form className="AddressProvider" onSubmit={this.handleSubmit}>
<AddressInput
className="AddressProvider-address"
value={address}
onChange={this.handleChange}
inputProps={{ size: 'large' }}
/>
<Button
type="primary"
htmlType="submit"
size="large"
disabled={!isValidEthAddress(address)}
block
>
Continue
</Button>
</Form>
);
}
private handleChange = (ev: React.ChangeEvent<HTMLInputElement>) => {
this.setState({ address: ev.currentTarget.value });
};
private handleSubmit = (ev: React.FormEvent<HTMLFormElement>) => {
ev.preventDefault();
this.props.onSelectAddress(this.state.address);
};
}