Import members from @edx/frontend-platform/i18n
The i18n module relies on react-intl and re-exports all of that package's exports.
For each locale we want to support, react-intl needs 1) the locale-data, which includes information about how to format numbers, handle plurals, etc., and 2) the translations, as an object holding message id / translated string pairs. A locale string and the messages object are passed into the IntlProvider element that wraps your element hierarchy.
Note that react-intl has no way of checking if the translations you give it actually have anything to do with the locale you pass it; it will happily use whatever messages object you pass in. However, if the locale data for the locale you passed into the IntlProvider was not correctly installed with addLocaleData, all of your translations will fall back to the default (in our case English), even if you gave IntlProvider the correct messages object for that locale.
Messages are provided to this module via the configure() function below.
- Source:
- See:
-
- {@link https://github.com/openedx/frontend-platform/blob/master/docs/how_tos/i18n.rst}
- {@link https://formatjs.io/docs/react-intl/components/ Intl} for components exported from this module.
Classes
- FormattedDate
- FormattedMessage
- FormattedNumber
- FormattedPlural
- FormattedRelativeTime
- FormattedTime
- IntlProvider
Members
(static, constant) LOCALE_CHANGED
- Source:
(static, constant) LOCALE_TOPIC
- Source:
Methods
(static) configure(options)
Configures the i18n library with messages for your application.
Logs a warning if it detects a locale it doesn't expect (as defined by the supportedLocales list above), or if an expected locale is not provided.
Parameters:
| Name | Type | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
options |
Object |
Properties
|
- Source:
(static) findSupportedLocale(locale) → {string}
Finds the closest supported locale to the one provided. This is done in three steps:
- Returning the locale itself if its exact language code is supported.
- Returning the primary language subtag of the language code if it is supported (ar for ar-eg, for instance).
- Returning 'en' if neither of the above produce a supported locale.
Parameters:
| Name | Type | Description |
|---|---|---|
locale |
string |
- Source:
Returns:
- Type
- string
(static) getCookies() → {Cookies}
- Source:
Returns:
- Type
- Cookies
(static) getLocale(locale) → {string}
Get the locale from the cookie or, failing that, the browser setting. Gracefully fall back to a more general primary language subtag or to English (en) if we don't support that language.
Parameters:
| Name | Type | Description |
|---|---|---|
locale |
string | If a locale is provided, returns the closest supported locale. Optional. |
- Source:
Throws:
An error if i18n has not yet been configured.
Returns:
- Type
- string
(static) getMessages(localeopt)
Returns messages for the provided locale, or the user's preferred locale if no argument is provided.
Parameters:
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
locale |
string |
<optional> |
getLocale() |
- Source:
(static) getPrimaryLanguageSubtag(code)
Some of our dependencies function on primary language subtags, rather than full locales. This function strips a locale down to that first subtag. Depending on the code, this may be 2 or more characters.
Parameters:
| Name | Type | Description |
|---|---|---|
code |
string |
- Source:
(static) handleRtl()
Handles applying the RTL stylesheet and "dir=rtl" attribute to the html tag if the current locale is a RTL language.
- Source:
(static) isRtl(locale)
Determines if the provided locale is a right-to-left language.
Parameters:
| Name | Type | Description |
|---|---|---|
locale |
string |
- Source:
(static) mergeMessages(newMessages) → {Object}
Parameters:
| Name | Type | Description |
|---|---|---|
newMessages |
Object |
- Source:
Returns:
- Type
- Object
(inner) createIntl()
- Source:
- See:
-
- {@link https://formatjs.io/docs/react-intl/api#createIntl Intl}
(inner) defineMessages()
- Source:
- See:
-
- {@link https://formatjs.io/docs/react-intl/api#definemessagesdefinemessage Intl}
(inner) useIntl()
- Source:
- See:
-
- {@link https://formatjs.io/docs/react-intl/api#useIntl Intl}