Open
Description
Current usage:
<MyInput
error={formData.name.error}
helperText={formData.name.error ? 'Field \'Name\' is required.' : ''}
... />
Which is fine when we have one validation on field. But when there is more than one validator, it would be nice to show user which one is failing eg. have validation message/text.
Proposed new format:
t
is translator function here
<MyInput
error={formData.name.error}
helperText={formData.name.errorMessages.map(t).join('. ')}
... />
{value: "", error: false, errorMessages: ["required"], onChange: ƒ, onBlur: ƒ, validate: ƒ, reset: f}
Each validator would correspond to different message in "keyed" format so it can be passed forward to localization functions.
Validation function could return the errorMessages
item as string. Validation needs to be changed. When returned value is typeof string
there is error (like current false
value), and when there is no error typeof boolean && === true
is expected. For validators that are not updated (for backward compatibility) default error message would be used when they return false
.