1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-12-27 09:28:19 +00:00

Added touched option for inputs

This commit is contained in:
Vladimir Volek 2018-11-21 16:36:53 +01:00
parent 9437cb25e8
commit 93000adf9e

View File

@ -50,7 +50,8 @@ type State = {
signMessage: string, signMessage: string,
verifyAddress: string, verifyAddress: string,
verifyMessage: string, verifyMessage: string,
verifySignature: string verifySignature: string,
touched: Array<string>
} }
class SignVerify extends Component<Props, State> { class SignVerify extends Component<Props, State> {
@ -61,10 +62,22 @@ class SignVerify extends Component<Props, State> {
verifyAddress: '', verifyAddress: '',
verifyMessage: '', verifyMessage: '',
verifySignature: '', verifySignature: '',
touched: [],
}; };
} }
setTouchedInput = (inputName: string) => {
if (!this.state.touched.includes(inputName)) {
this.setState(prevState => ({
touched: [...prevState.touched, inputName],
}));
}
}
shouldValidate = (inputName: string) => this.state.touched.includes(inputName)
handleInputChange = (event: SyntheticInputEvent<Text>) => { handleInputChange = (event: SyntheticInputEvent<Text>) => {
this.setTouchedInput(event.target.name);
this.setState({ [event.target.name]: event.target.value }); this.setState({ [event.target.name]: event.target.value });
} }
@ -155,8 +168,8 @@ class SignVerify extends Component<Props, State> {
value={this.state.verifyAddress} value={this.state.verifyAddress}
onChange={this.handleInputChange} onChange={this.handleInputChange}
type="text" type="text"
state={(this.state.verifyAddress && validateAddress(this.state.verifyAddress)) ? 'error' : null} state={(this.shouldValidate('verifyAddress') && validateAddress(this.state.verifyAddress)) ? 'error' : null}
bottomText={this.state.verifyAddress !== '' ? validateAddress(this.state.verifyAddress) : null} bottomText={this.shouldValidate('verifyAddress') ? validateAddress(this.state.verifyAddress) : null}
isSmallText isSmallText
/> />
</Row> </Row>