New API to localize next generation components

vaadin / web-components

A set of high-quality standards based web components for enterprise web applications. Part of Vaadin 20+

https://vaadin.com/docs/latest/components

469 stars 83 forks source link

New API to localize next generation components #78

Open web-padawan opened 4 years ago

web-padawan commented 4 years ago

Current generation has a serious problem described at vaadin/vaadin-upload#346

The example should show how you define the generic translations for all Upload components, who wants to translate a single upload dynamically?

We should provide a new API that would cover at least the following components:

[ ] vaadin-crud
[ ] vaadin-date-picker
[ ] vaadin-date-time-picker
[ ] vaadin-upload
[ ] vaadin-time-picker
[ ] vaadin-rich-text-editor

Take a look at https://github.com/ing-bank/lion/tree/master/packages/localize for inspiration:

get locale from lang attribute on <html>, same as we currently do for dir (example)
use Intl where possible, e.g. use Intl.DateTimeFormat to get weekdays / month names

jouni commented 4 years ago

Probably obvious, but whatever we implement, it should be usable in custom components as well. Also, developers should be able to “extend” the localization messages, so that they can use the same message easily across an app for example.

This might also be trivial/irrelevant to point out, but remember components like Confirm Dialog and CRUD, which should also offer some default UI texts. Some of those might be generic enough that developers could use them in some other places in their apps (e.g. “Are you sure you want to delete {item}?”). The idea I’ve had in my personal notes is “Packaged localized ui texts / microcopy: share i18n texts across components”.

web-padawan commented 4 years ago

developers should be able to “extend” the localization messages, so that they can use the same message easily across an app for example

Yes that's part of the idea. In particular, clear button is used in many components and should only have a single localization string.

We can look at LocalizeMixin from Lion for a solution.

web-padawan commented 4 years ago

One more use case for new API would be to allow re-using translations across components.

See https://github.com/vaadin/vaadin-combo-box/issues/868 and https://github.com/vaadin/vaadin-select/issues/218 as an example.