Custom translations

Introduction

All UI components can be translated into any language. The translated texts can be managed via ROQ Console or your existing translation system. Please refer to the translations feature guide for more information and instructions.

Loading translations in code

Locales are defined as a prop of <RoqProvider>. If no locale is defined, then en-US will be used as the default locale.

<RoqProvider locale="de-DE">
  <Component />
</RoqProvider>

The <RoqProvider> fetches translations from ROQ Platform every five minutes. The data is cached in the user's browser.

Custom translation provider

If you are already using a translation system, you can pass a function that takes over the translation.

return (
  <RoqProvider translation={myTranslation}>
    <Component />
  </RoqProvider>
);