Skip to content

[i18n] Add a "describe" or new values to the base config in the i18n issue to make it easier to implement Zod with the form. #5345

@doiya46

Description

@doiya46

Example

I have different types of inputs such as select (date picker, dropdown, etc.) and text inputs (input, textarea). I want the error messages to be displayed automatically based on the description.

For frontend validation with react-hook-form, most messages can be simplified to something like: "select" or "enter" values.

Example message

  • If the rule is “select 1 value,” the message can be:

    Please select a value.

  • If the rule defines a range [2, 5], we can override the too_big and too_small messages to show something like:

    Please select between 2 and 5 values.

This can be handled through simple logic to keep messages consistent and easy to understand.

I think we can use describe to make the i18n error simple

For example:

rpPublishedPlace: z.string().nonempty().describe('type:select')

When the form triggers a validation error, the user will see:

Please select a value.

And for an input field:

rpPublishedPlace: z.string().nonempty().describe('type:input')

When the validation fails, the user will see:

Please enter a value.

For min or max validation, we can also customize messages based on the type. For example:

  • For "type:select"Please select at least 2 values.

  • For "type:input"Please enter at least 2 characters.

So we can write your own i18n react without use the basic z.config(z.locales.en());.

return (issue: Any, NEW_OPTIONS_INCLUDE_ORIGIN_OR_JUST_OBJECT_WITH_DESCRIBE_SO_CAN_BE_ADD_MORE_MESSAGE_FOR_FUTURE_USE: any) => {

Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions