Language localisations

LogMan.io WebUI provides customisation of language localisations. It use i18n internalisation library. For details, refer to: https://react.i18next.com

Import and set custom localisation

LogMan.io WebUI allows to re-define text of application components and messages for every section of the application. The language localisations are stored in JSON files called translate.json.

Custom locales can be loaded into the LogMan.io WebUI application via config file. The files are loaded from e.g. external folder served by nginx, where one can store it among CSS styling and other site configuration.

Example of definition in static config file of LogMan.io WebUI:

module.exports = {
    app: {
        i18n: {
            fallbackLng: 'en',
            supportedLngs: ['en', 'cs'],
            debug: false,
            backend: {
                {% raw %}loadPath: 'path/to/external_folder/locales/{{lng}}/{{ns}}.json',{% endraw %}
                {% raw %}addPath: 'path/to/external_folder/locales/add/{{lng}}/{{ns}}',{% endraw %}
            }
        }
    }
}

Where * fallbackLng is a fallback language * suportedLngs are supported languages * debug if set to true, displays the debug messages in the console of the browser * backend is backend plugin for loading resources from the server

The path/to/external_folder/ is a path to the external folder with the locales folder served by nginx. There has to be 2 folders referencing to supported languages. Those folders are en and cs in which translate.json files are stored, as you can see in the folder structure below:

* external_folder
  * locales
    * cs
      * translation.json
    * en
      * translation.json

Custom translate.json file example

en

{
    "i18n": {
        "language": {
            "en": "English",
            "cs": "Česky"
        }
    },

    "LogConsole": {
        "Connection lost": "Connection lost, will reconnect ...",
        "Mark": "Mark",
        "Clear": "Clear"
    },

    ...
}

cs

{
    "i18n": {
        "language": {
            "en": "English",
            "cs": "Česky"
        }
    },

    "LogConsole": {
        "Connection lost": "Spojení ztraceno, připojuji se ...",
        "Mark": "Označit",
        "Clear": "Smazat"
    },

    ...
}