diff --git a/openmetadata-docs/content/how-to-guides/how-to-add-language-support.md b/openmetadata-docs/content/how-to-guides/how-to-add-language-support.md new file mode 100644 index 00000000000..0f67fb3417c --- /dev/null +++ b/openmetadata-docs/content/how-to-guides/how-to-add-language-support.md @@ -0,0 +1,62 @@ +--- +title: How to Add Language Support +slug: /how-to-guides/how-to-add-language-support +--- + +# How to Add Language Support + +To add support for a new language in our internationalization setup using `react-i18next` and `i18next`, please follow the steps below: + +## Create a Language JSON File + +First, create a new JSON file for the language you want to add in the `openmetadata-ui/src/main/resources/ui/src/locale/languages` directory. + +For example, if you want to add support for the `French` language, you can create a file called `fr-fr.json` in the languages directory: + +```shell +# Navigate to the ui/src/locale/languages directory +cd openmetadata-ui/src/main/resources/ui/src/locale/languages + +# Create the French language file +touch fr-fr.json + +``` + +## Sync the Language File with the Primary Language + +Since we use `en-us` as our primary language, if you have added a new language file, you need to sync the newly added language file with the primary language. You can use the `i18n` script to achieve this. + +```shell +yarn run i18n +``` + +## Update the `i18nextUtil.ts` + +Now add the newly added language in `i18nextUtil.ts` , so that `i18next` can have the translation resource available. + +```diff +import { InitOptions } from 'i18next'; +import { map } from 'lodash'; +import enUS from '../../locale/languages/en-us.json'; ++ import frFR from '../../locale/languages/fr-fr.json'; + +export const getInitOptions = (): InitOptions => { + return { ++ supportedLngs: ['en-US', 'fr-FR'], + resources: { + 'en-US': { translation: enUS }, ++ 'fr-FR': { translation: frFR }, + }, + fallbackLng: ['en-US'], +``` + +## Test the language translation + +To check the language translation functionality, please follow the steps outlined below: + +1. Click on the language selection dropdown, and a list of available languages will appear. +2. Choose the language you wish to test, and the translation will be applied. + +Please refer to the image below for assistance: + +language-support diff --git a/openmetadata-docs/content/menu.md b/openmetadata-docs/content/menu.md index 16801e1b7e0..85a0c860aaa 100644 --- a/openmetadata-docs/content/menu.md +++ b/openmetadata-docs/content/menu.md @@ -165,7 +165,7 @@ site_menu: url: /deployment/upgrade/versions/011-to-012 - category: Deployment / Upgrade OpenMetadata / Upgrade Version Instructions / 0.12 to 0.13 url: /deployment/upgrade/versions/012-to-013 - + - category: Deployment / Backup & Restore Metadata url: /deployment/backup-restore-metadata @@ -579,6 +579,8 @@ site_menu: url: /how-to-guides/how-to-add-custom-property-to-an-entity - category: How to guides / How to add Custom Logo url: /how-to-guides/custom-logo/how-to-add-custom-logo + - category: How to guides / How to Add Language Support + url: /how-to-guides/how-to-add-language-support - category: Features url: /openmetadata diff --git a/openmetadata-docs/images/how-to-guides/language-support.png b/openmetadata-docs/images/how-to-guides/language-support.png new file mode 100644 index 00000000000..4423aad9023 Binary files /dev/null and b/openmetadata-docs/images/how-to-guides/language-support.png differ