extend TextField to support submit errors

This commit is contained in:
fernandomg 2020-05-29 21:43:37 -03:00
parent 71dd7539f4
commit 4de3308069
1 changed files with 5 additions and 3 deletions

View File

@ -33,13 +33,15 @@ class TextField extends React.PureComponent<any> {
} = this.props } = this.props
const helperText = value ? text : undefined const helperText = value ? text : undefined
const showError = (meta.touched || !meta.pristine) && !meta.valid const showError = (meta.touched || !meta.pristine) && !meta.valid
const hasError = !!meta.error || (!meta.modifiedSinceLastSubmit && !!meta.submitError)
const errorMessage = meta.error || meta.submitError
const isInactiveAndPristineOrUntouched = !meta.active && (meta.pristine || !meta.touched) const isInactiveAndPristineOrUntouched = !meta.active && (meta.pristine || !meta.touched)
const isInvalidAndUntouched = typeof meta.error === 'undefined' ? true : !meta.touched const isInvalidAndUntouched = typeof meta.error === 'undefined' ? true : !meta.touched
const disableUnderline = isInactiveAndPristineOrUntouched && isInvalidAndUntouched const disableUnderline = isInactiveAndPristineOrUntouched && isInvalidAndUntouched
const inputRoot = helperText ? classes.root : '' const inputRoot = helperText ? classes.root : ''
const statusClasses = meta.valid ? 'isValid' : meta.error && (meta.dirty || meta.touched) ? 'isInvalid' : '' const statusClasses = meta.valid ? 'isValid' : hasError && showError ? 'isInvalid' : ''
const inputProps = { const inputProps = {
...restInput, ...restInput,
autoComplete: 'off', autoComplete: 'off',
@ -53,8 +55,8 @@ class TextField extends React.PureComponent<any> {
return ( return (
<MuiTextField <MuiTextField
error={meta.error && (meta.touched || !meta.pristine)} error={hasError && showError}
helperText={showError ? meta.error : helperText || ' '} helperText={hasError && showError ? errorMessage : helperText || ' '}
inputProps={inputProps} // blank in order to force to have helper text inputProps={inputProps} // blank in order to force to have helper text
InputProps={inputRootProps} InputProps={inputRootProps}
multiline={multiline} multiline={multiline}