README.md

@deriv/translations

• Extract new string translations to Crowdin
• Staging/dev branch is the source of truth for strings that should be translated.
• React i18next configuration and translation components

In this document

• Requirements
• Extracting translations
  • Setup
  • Translate
• Project translations
  • Setup
  • Usage
• FAQ

Requirements:

• Crowdin CLI: download here: https://support.crowdin.com/cli-tool/#installation
• CROWDIN_API_KEY environment variables to your ~/.bash_profile
• remote origin should be your fork
• remote upstream should be the source repository (e.g. [email protected]:binary-com/deriv-app.git)

Extracting translations

Setup

Add the Crowdin API key to your ~/.bash_profile

   $ echo "export CROWDIN_API_KEY='apikeyhere'" >> ~/.bash_profile
   $ source ~/.bash_profile

Translate

To update strings to be translated in Crowdin

   $ npm run translate

Project translations

• This project uses react-i18next

Setup

• initialize translations in root app.jsx by importing and calling initializeTranslations
• in app.jsx:

    import { initializeTranslations } from '@deriv/translations';
    ...
    initializeTranslations()

Usage

• For strings use either localize(...) or <Localize />
• <Localize /> example:

import { Localize } from '@deriv/translations';

<Localize
    i18n_default_text='You cannot use your real money account with {{website_name}} at this time.'
    values={{ website_name }}
/>;

• localize example:

import { localize } from '@deriv/translations';

<h4 className='drawer__notifications-header'>{localize('all notifications')}</h4>;

FAQ:

• This package includes all Crowdin configuration
• Crowdin source translation file --> crowdin/messages.json
• Source for the translated strings in the project --> src/translations/fr|en|id....json