Globalization of UX web applications

Export dictionary labels from JSON files in the Messages Folder using Globalization Manager to create XLIFF translation files, then retrieve translated labels through dictionary API calls using the getTranslatedMessages method from tririga-react-components library.

Exporting the Dictionary Labels

The Globalization Manager exports labels from both UX Polymer and UX Web Applications. The Globalization Manager does this by exporting the dictionary as XLIFF files of unique translatable text. If a specific label appears in multiple views and UX Web Applications, only one unique entry will appear in the dictionary.

The difference between UX Polymer and UX Web Applications in exporting labels is:

UX Polymer Applications
UX Web Applications

Web View Metadata

Example of the Web View Designer form

For example, in the messages.json file, the following labels will be exported by the Globalization Manager:

  • HOME_HEADER: Welcome to the UX Web Application Home Page
  • CURRENT_HEADER: Current user details
  • UNAUTHORIZED_TITLE: You do not have permission to access this page.
  • UNAUTHORIZED_DESCRIPTION: Due to either a session timeout or unauthorized access, you do not have permission to access this page.

JSON File > messages.json

Example of the messages.json file

Getting the Translated Labels

The difference between UX Polymer and UX Web Applications in getting translated labels is:

  • Maximo® Real Estate and Facilities detects the language that is defined for the user. Then it automatically translates all static translatable labels that are defined inside the HTML and JS files that are requested by the browser. It does this by using the translations that are imported into the Globalization Manager dictionary. So, the browser receives the files with the labels already translated.

  • UX Web Applications: The application calls the dictionary API to get the translated labels. The tririga-react-components library exports the getTranslatedMessages method to help the application to interact with the dictionary API. For more information about the getTranslatedMessages method, including an example, see:

    https://tririga.github.io/tririga-react-components/?path=/story/javascript-library-tridictionary-gettranslatedmessages--page