Skip to content
Permalink
Browse files

Merge pull request #249 from GoodDollar/fix-enable-next-button-after-…

…error-fixed

better error handling in signup
  • Loading branch information...
dminones committed Jul 11, 2019
2 parents 02f96f8 + 2b76419 commit 3c5a731375c28aa469fc5091532593ef87f27000
@@ -1,7 +1,7 @@
// @flow
import React from 'react'
import { HelperText, TextInput } from 'react-native-paper'

import debounce from 'lodash/debounce'
import { userModelValidations } from '../../lib/gundb/UserModel'
import userStorage from '../../lib/gundb/UserStorage'
import Config from '../../config/config'
@@ -30,9 +30,7 @@ class EmailForm extends React.Component<Props, State> {
}

handleChange = (email: string) => {
if (this.state.errorMessage !== '') {
this.setState({ errorMessage: undefined })
}
this.checkErrorsSlow()

this.setState({ email })
}
@@ -59,6 +57,8 @@ class EmailForm extends React.Component<Props, State> {
return errorMessage === ''
}

checkErrorsSlow = debounce(this.checkErrors, 500)

render() {
const errorMessage = this.state.errorMessage || this.props.screenProps.error
this.props.screenProps.error = undefined
@@ -75,7 +75,6 @@ class EmailForm extends React.Component<Props, State> {
id={key + '_input'}
value={this.state.email}
onChangeText={this.handleChange}
onBlur={this.checkErrors}
keyboardType="email-address"
error={errorMessage !== ''}
onKeyPress={this.handleEnter}
@@ -1,6 +1,7 @@
// @flow
import React from 'react'
import PhoneInput from 'react-phone-number-input'
import debounce from 'lodash/debounce'
import './PhoneForm.css'
import { userModelValidations } from '../../lib/gundb/UserModel'
import userStorage from '../../lib/gundb/UserStorage'
@@ -48,9 +49,7 @@ class PhoneForm extends React.Component<Props, State> {
}

handleChange = (mobile: string) => {
if (this.state.errorMessage !== '') {
this.setState({ errorMessage: '' })
}
this.checkErrorsSlow()

this.setState({ mobile })
}
@@ -74,10 +73,12 @@ class PhoneForm extends React.Component<Props, State> {
Config.skipMobileVerification || (await userStorage.isValidValue('mobile', this.state.mobile))
const errorMessage = modelErrorMessage || (isValidIndexValue ? '' : 'Unavailable mobile')
log.debug({ modelErrorMessage, isValidIndexValue, errorMessage, Config })
this.setState({ errorMessage }, () => this.setState({ isValid: this.state.errorMessage === '' }))
this.setState({ errorMessage, isValid: errorMessage === '' })
return errorMessage === ''
}

checkErrorsSlow = debounce(this.checkErrors, 500)

render() {
const errorMessage = this.state.errorMessage || this.props.screenProps.error
this.props.screenProps.error = undefined
@@ -91,7 +92,6 @@ class PhoneForm extends React.Component<Props, State> {
id={key + '_input'}
value={this.state.mobile}
onChange={this.handleChange}
onBlur={this.checkErrors}
error={errorMessage}
onKeyDown={this.handleEnter}
country={this.state.countryCode}
@@ -36,7 +36,6 @@ export default class SmsForm extends React.Component<Props, State> {
state = {
smsValidated: false,
sentSMS: false,
valid: false,
errorMessage: '',
sendingCode: false,
renderButton: false,
@@ -70,16 +69,17 @@ export default class SmsForm extends React.Component<Props, State> {
try {
await this.verifyOTP(otpValue)
this.setState({
valid: true,
loading: false
valid: true
})
this.handleSubmit()
} catch (e) {
log.error({ e })

this.setState({
errorMessage: e.response.data.message,
loading: false
errorMessage: e.message || e.response.data.message
})
} finally {
this.setState({ loading: false })
}
} else {
this.setState({
@@ -105,15 +105,18 @@ export default class SmsForm extends React.Component<Props, State> {
await API.sendOTP({ ...this.props.screenProps.data })
} catch (e) {
log.error(e)
this.setState({
errorMessage: e.message || e.response.data.message
})
}
this.setState({ sendingCode: false, renderButton: false }, this.displayDelayedRenderButton)
}

render() {
const { valid, errorMessage, sendingCode, renderButton, loading, otp } = this.state
const { errorMessage, sendingCode, renderButton, loading, otp } = this.state

return (
<Wrapper valid={valid} handleSubmit={this.handleSubmit} footerComponent={() => <React.Fragment />}>
<Wrapper handleSubmit={this.handleSubmit} footerComponent={() => <React.Fragment />}>
<Title>{'Enter the verification code \n sent to your phone'}</Title>
<OtpInput
containerStyle={{

0 comments on commit 3c5a731

Please sign in to comment.
You can’t perform that action at this time.