Internationalization

Language of the User Interface

The User Interface supports translated labels and switching languages at runtime. The ngx-translate library is used to handle all i18n aspects in GeoNetwork-UI.

The TranslateService class, provided by TranslateModule, offers several functionalities:

• reading the current language using currentLang (this gives the value at a certain time and is not an observable)
• changing the current language using the use() method

Languages in GeoNetwork-UI should always be identified by their two-character codes following the ISO-639-1 list.

Supported languages

Currently, a small amount of languages is supported, see: https://github.com/geonetwork/geonetwork-ui/blob/main/libs/util/i18n/src/lib/i18n.constants.ts

Where translations are stored

All translated labels are stored in JSON files situated in the translations folder at the root of the project.

The rules for showing the translated labels on screen are:

• if available, use the label for the current language
• if that is not available, use the label for english as fallback
• if that is unavailable as well, simply show the raw translation key on screen

How to include translated labels in GeoNetwork-UI

• use the | translate pipe or translate directive
• avoid using instant translation in the code: in case the language is switched dynamically, labels translated that way will not be updated
• if translation keys are computed dynamically, use the marker() function to declare them beforehand; translation keys should be discoverable statically by analyzing the source code!

When a contribution adds new translated labels, the npm run i18n:extract command (which relies on the ngx-translate-extract library) should be run and its results committed separately. English labels should always be provided for new keys as this is the fallback language.

How to contribute new translations

Simply open a PR modifying the translated labels as you see fit. Adding or removing keys in the translation files should only be done through the npm run i18n:extract command.

How the User Interface language is detected

The user will be able to change the language via a language switcher dropdown in the Interface.

The language:

• is stored in local storage under geonetwork-ui-language
• will use the browser language by default, if no language found
• can be changed in the local storage externally and will be taken into account after a refresh