What does name: ' XXX |||| XXXs', mean in i18n?

user_14448025 0
Viewed 346

This code is from recat-admin demo i18n translation,

     invoices: {
        name: 'Invoice |||| Invoices',
        fields: {
            date: 'Invoice date',
            customer_id: 'Customer',
            command_id: 'Order',
            date_gte: 'Passed Since',
            date_lte: 'Passed Before',
            total_gte: 'Min amount',
            address: 'Address',
        },
    },

Could you explain me what does this row mean?

name: 'Invoice |||| Invoices'

I have never come across such a code with ||||

Thank you:)

react-i18next react-admin typescript
1 Answers

react-admin uses Polyglot as its default i18n provider. This is how you define singular and plural forms of a message:

name: 'Singular |||| Plural'

In some languages, you might need more than two variations:

name: 'WhenZero |||| WhenOne |||| WhenMoreThanOne'

In react-admin, you can call the useTranslate hook to get a translate function. This function accepts 2 arguments:

  • the translation key
  • an object of variables to interpolate in the translated message.

If you read polyglot documentation, you'll see there is a special variable you can pass in the second argument, called smart_count. This variable is used by polyglot to return the correct pluralized form of your message.

react-admin use this feature to get the correct title. In the case of the resource name, we display the pluralized version for the list page and the menu items, and the singular one for create, edit and show.

user_69084630
Related