revalidate
revalidate copied to clipboard
Ability to translate error messages
Hi! Thanks for this great library, validation becomes really enjoyable.
Is it possible to change default error messages (to support different languages for example) without copy-paste all validator or passing custom message on every use?
+1
Hi, @texodont!
Currently, there isn't a way to change the default message, but it should be trivial to update createValidator
to allow this. We could always attach the default message creator as a property on the validator and then easily update it that way. However, I think adding in a clone/duplicate feature would be nice. That way, there could eventually be defaults for different languages exposed in nested libs like revalidate/validators/es
as an example for Spanish.
Basically, changing createValidator
to do something like this should work
export default function createValidator(curriedDefinition, defaultMessageCreator) {
// ...
function validator(config, value, allValues) {
// ...
}
function clone(newDefaultMessageCreator) {
return createValidator(curriedDefinition, newDefaultMessageCreator);
}
validator.clone = clone;
return validator;
}
// Later on
const esNecesario = isRequired.clone(field => `${field} es necesario`);
isRequired('Foo')(); // Foo is required
esNecesario('Foo')(); // Foo es necesario
Would you find something like that to be useful? Thanks for the idea!
@jfairbank I like the simplicity of your solution above, but it has the downside of needing to pre-define the language-translated-validators and know which one to reference in code. In my experience that's not how i18n typically works - at least not on my projects.
I'm trying to figure out a way to swap in a library like react-intl
. The key characteristics here are:
-
Messages are an object such as:
const messages = defineMessages({ isRequired: { id: "validation:isRequired", defaultMessage: "{field} is required", description: "Error message when required information is missing" } });
-
You can get a locale-aware translation function that will apply the translation for the current locale. This function has to be used at time of validation to ensure the correct locale is referenced -- it can't be baked in when the validator is first defined.
formatMessage(messages.isRequired, {field: "MyField"})
I'm having trouble thinking about how to tie these together. It's easy enough to set up a validator to use a message object, but I can't figure out where/how I'd pass in the formatMessage function:
const i18nIsRequired = isRequired.clone((field, {formatMessage}) => {
// 1. Not clear how formatMessage actually gets passed in here...
// 2. Translate the message
return formatMessage(messages.isRequired, {field});
})
Any ideas or thoughts? Am I missing part of the API that would make this easier?
Definitely needed, english-only messages are not good. :/
One simple approach could be to overrides the default messages when calling combineValidators
, which seems to be the most common use-case of using this library. @boxfoot @jfairbank
const locales = {
isRequired: 'Obligatoire',
isAlphabetic: (field, value) => `"${value}" est incorrect`
};
const dogValidator = combineValidators({
name: composeValidators(
isRequired,
isAlphabetic
)('Name'),
age: isNumeric('Age')
}, { locales: locales ); // Give locales as additional options
This is assuming there is only one error message per validator. If that's not the case (several possible errors) it would be a bit harder but still doable.
@Vadorequest @boxfoot You could give this library a try: https://github.com/madcat23/simple-object-validation It has a standard mechanism for translated error messages and the syntax is quite similar to revalidate.