Manage i18n/l10n for TS & TSX files

[mbenadda]

Right now all user-facing text in the frontend is written in English with no support for localization and no i18n infrastructure.

We should add some i18n management facilities and a way to tag, collect and load translatable/translated strings.

• Add a babel transpilation step so we can use react-intl's babel plugin string extractor (prerequisite)
• Define settings in a TS file so strings in there can be easily extracted
• Add react-intl and MessageDescriptors for translatable strings
• Automatically extract strings with the babel plugin
• Fetch translations to be injected in the app at runtime

🚧 Manage translations => for now we will be pulling & committing them manually into the repository.

[jmaupetit]

Do you have any third-party app in mind to achieve this?

[mbenadda]

Translation management

I think SaaS is the way to go.

Transifex seems like the most established choice if we're eligible for Transifex for Open Source.
We can also consider Crowdin. I'm familiar with Smartling but their pricing is opaque, they don't seem to have support open source, and their workflows are more geared towards marketing sites translated by third-parties than actual product string management.

Tooling

It seems there's nothing as simple as I would have hoped (and what we used to have in Angular 1) but there seems to be some adequate tools.

The most promising one is React-intl along with its very own parser.

🎉

• takes care of our translations needs
• handles dates & times (so we could get rid of moment?)
• uses standards

💩

• needs string IDs (a hassle)
• not sure there are active maintainers anymore

It would also require us to use babel to get the benefit of its parser plugin. This does complicate the build process. However, string extraction is actually one of the painful parts of handling i18n so I think it could be worth it.
As a side benefit we could get to use babel's polyfilling.

[mbenadda]

Thought on this topic @sampaccoud @jmaupetit ?

[sveetch]

Hi, for online translation tool there is also:

• https://weblate.org/
• http://pootle.translatehouse.org/

[sampaccoud]

I'm not qualified but React-intl seems to be the default choice for i18n with React.
Maybe we have more time to discuss the translation tool.

[mbenadda]

I will handle this as soon as #253 is done. I made a quick POC and string extraction is working fine with the babel-plugin extractor.

[sveetch]

When you was talking about babel i didn't catch you was talking of babel compiler. In fact i was thinking about python-babel.

I don't know if a Python solution would nicely integrate in your processes but just want to say that python-babel has some React support through JSX message extraction. I can help you with it if needed.

[jmaupetit]

IMO we should use front-end tools for front-end purpose. Particularly, if we decide to distribute front-end applications as NPM packages.

[sampaccoud]

This issue was solved in PR #566