This guide will help you add a new locale to the i18n
setup.
- An up-to-date branch with the
main
branch. - Familiarity with
i18n
,react-i18next
, andnext-i18next
libraries is beneficial.
- Determine the language and country codes using
ISO 639-1
. For example,en
for English. - Create a new directory within the
public/locales
directory using the language and country codes as the name, for exampleen
. - Copy all the files from the
en
directory into the newly created directory. - Edit the copied the text in the copied files with the desired language.
- Add the new language to the list in
next-i18next.config.js
if it does not already exist. - Follow the instructions in Website README to run and test the new language by changing the active locale in the application and verifying that all translated keys are properly displayed.
- Commit your changes and open a pull request against the
main
branch for review.
When editing existing translations, follow these rules:
- English translations are required, and other locales fall back to them.
- Keep translation keys in alphabetical order.
- Add all translations for higher-level components (e.g.
Layout.ts
) incommon.json
to prevent hydration issues. - Add reused translation keys in
common.json
. - Split translation files into separate files by feature or route.
A script can be used to find missing and potentially untranslated locale files. Run the script from the root dir using
python scripts/frontend-development/find-missing-locales.py
.
If you have any questions or need further assistance, please reach out.