I18n - custom error message with interpolation

General
1

Hello There :slight_smile:

I want to customize error messages with i18n, but I have no idea how to deal with interpolation. Is something like that {{minLength}} based on property’s schema value possible?

  const translate = (key: string, defaultMessage: string, args: any) => {
    const translations = {
      error: {
        required: 'is required',
        minLength: `should have at least {{minLength}} characters`,
      },
    };

    return get(translations, key) ?? defaultMessage;
  };

  return (
      <JsonForms
        schema={schema}
        uischema={uiSchema}
        data={data}
        renderers={renderers}
        cells={cells}
        onChange={handleOnChange}
        ajv={ajv}
        i18n={{ translate }}
      />

Or is there other way to handle this kind of error messages customization?
Thanks for help in advance :slight_smile:

2

Hi @pegu,

There is no built-in templating support in JSON Forms. This is the responsibility of the translators.

Note that specifically for errors you can instead also hand over a translateError method, see here for the docs. This method is called on all errors and has full access to the AJV ErrorObject, so you can for example determine the minLength.