[RFC] Support for multi-language

[efernandezleon]

Target Use Case

In PS we are facing the project Telus Insight which has a requirement to support widgets and UI components in both English and French.

Implementation Proposal

The default behavior for UI labels could be as is working right now, but we can add the ability to switch to another language just by putting a properties file with the translation in the root folder.

[alasarr]

+1 to this. As we've multiple ways for this implementation, as next steps, would be great if you can share how the API will be for a user that want to add multi-languague.

I'd keep the API as it's right now for users who don't need multi language.

[efernandezleon]

We can use a specific library to do that, there are some of them out there [1] and it seems react-intl is the most used.

It allows to include non-intrusive code to translate text and use different files for each supported language. The unique change is to change the current messages to message ids to be referenced from the language files.

[1] https://lokalise.com/blog/react-i18n-intl/

[aaranadev]

I guess C4R exports a props interface to change the texts, so the responsibility is derived from the app and the multi-language is out.

An example:

<CategoryWidgetUI
 ...
  texts={{
    unlock: 'Unlock',
    lock: 'Lock',
    clear: 'Clear',
    allSelected: (data) => `${data.length ? data.length : 'All'} selected`,
  }}
/>

The CategoryWidgetUI has a prop texts (the name maybe change) where you pass the text or a function if the text dependent on a variable.

react-intl is an excellent library to use from an external app.