1.1.48 • Published 3 years ago
i18n1998 v1.1.48
WSO2 Identity Server - Internationalization (i18n) module for Identity apps.
This module contains the configs, helpers and translations required to make an identity app available in multiple languages.
Implemented on top of i18next library.
Install
Add following dependency in your package.json file.
"@wso2is/i18n": "<VERSION>"
Build
npm run build
Running Tests
npm run test
Usage
Initialize the module.
import { I18n } from "@wso2is/i18n";
I18n.init(options, override, true, true)
.then(() => {
// On successful init.
})
.catch((error) => {
// On error.
});
Init function arguments:
Parameter | Type | Default | Description |
---|---|---|---|
options | i18next.InitOptions | undefined | Passed in init options. |
override | boolean | false | Should the passed in options replace the default. |
autoDetect | boolean | false | If autodetect plugin should be used or not. |
useBackend | boolean | false | If XHR back end plugin should be used or not. |
debug | boolean | false | If debug is enabled. |
framework | SupportedI18nFrameworks | SupportedI18nFrameworks.REACT | The framework to use. |
plugins | i18next.Module[] | undefined | Other i18next plugins to use. |
Get the instance.
import { I18n } from "@wso2is/i18n";
const i18n = I18n.instance;
Use in the provider
import { I18nextProvider } from "react-i18next";
import { I18n } from "@wso2is/i18n";
return (
<I18nextProvider i18n={ I18n.instance }>
...
</I18nextProvider>
)
Adding a new language to the module.
- Create a folder with the language's ISO code inside
src/translations
. ex:en-GB
- Create a
portals
folder and implement the common, user portal, dev portal, etc. namespaces. - Create other folders such as
docs
, etc. and place the necessary translations. - Create a
meta.ts
file and add all the necessary metadata regarding the language bundle.
import { LocaleMeta } from "../../models";
export const meta: LocaleMeta = {
code: "en-GB",
flag: "gb",
name: "English (United Kingdom)",
namespaces: [ "common", "devPortal", "myAccount" ]
};
- Export the bundle from the index.
import * as portals from "./portals";
import { LocaleBundle } from "../../models";
import { meta } from "./meta";
export const EN_GB: LocaleBundle = {
meta,
resources: {
portals
}
};
Adding a new language during runtime.
- Create a folder with the language's ISO code inside the distribution directory. ex: For Dev Portal, the i18n bundle will be saved under
resources/i18n
. Create a folderfr
to store french language the translations. - Copy the translated JSON files.
- Update the
meta.json
file.
{
"fr": {
"code": "fr",
"flag": "fr",
"name": "French (France)",
"namespaces": ["common", "devPortal"],
"paths": {
"devPortal": "fr/portals/devPortal.json",
"common": "fr/portals/common.json"
}
}
}
License
Licenses this source under the Apache License, Version 2.0 (LICENSE), You may not use this file except in compliance with the License.
1.1.48
3 years ago