Skip to content

Latest commit

 

History

History
78 lines (55 loc) · 2.56 KB

internationalization.md

File metadata and controls

78 lines (55 loc) · 2.56 KB

Internationalization

Juicebox uses Crowdin for managing translations. A GitHub workflow uploads new strings for translation to the Crowdin project whenever code using the lingui translation macros is merged into main.

Every day, translations are synced back down from Crowdin to a pull request to main. We then merge these PR's into main manually.

Marking strings for translation

Any user-facing strings that are added or modified in the source code should be marked for translation. Use the t macro or the Trans component from the @lingui/macro library. Learn more.

const myString = t`Example text`
<Trans>Example text</Trans>

You must extract strings in PRs. If your PR adds or modifies translated strings, run the following command to generate new .po files:

yarn i18n:extract

Contributing translations

For details of how to contribute as a translator, see our How to become a Juicebox translator Notion page.

Adding a language (for devs)

  1. Add the locale code, english name, and short and long alias's to src/constants/locale.ts.
export const SUPPORTED_LANGUAGES: Language = {
   en: { code: 'en', name: 'english', short: 'EN', long: 'English' },
   zh: { code: 'zh', name: 'chinese', short: '中文', long: '中文' },
+  ru: { code: 'ru', name: 'russian', short: 'RU', long: 'Pусский' },
+  es: { code: 'es', name: 'spanish', short: 'ES', long: 'Español' },
}
  1. Add the locale code to SUPPORTED_LOCALES in ./src/constants/locale.ts
- export const SUPPORTED_LOCALES = ['en', 'zh']
+ export const SUPPORTED_LOCALES = ['en', 'zh', 'ru', 'es']
  1. Import the locale plurals in src/contexts/Language/LanguageProvider.tsx.

    - import { en, zh } from 'make-plural/plurals'
    + import { en, zh, ru, es } from 'make-plural/plurals'
  2. Load the locale plurals in src/contexts/Language/LanguageProvider.tsx.

    i18n.loadLocaleData({
      en: { plurals: en },
      zh: { plurals: zh },
    + ru: { plurals: ru },
    + es: { plurals: es },
    })
  3. Add the locale code to .linguirc.json.

    - "locales": ["en", "zh"]
    + "locales": ["en", "zh", "ru", "es"]
  4. Extract and compile the strings marked for translation. This creates a directory for the locale within the ./locale/ directory:

    yarn i18n:extract && yarn i18n:compile