This set of tools uses the i18n-js library and expands it to support react components and other features.
It's main offerings are the translate function and the Translate react component. Both offer access to
translation strings with multiple lookups, pluralization and interpolation.
translate(scope, { lookup, fallback, pluralFor, values } )
<Translate scope lookup fallback pluralFor values />
A scope string references a specific value in the translation files managed by i18n-js for the current locale.
This string is a dot-separated list of names such as example.messages.label or errors.access.not_allowed that
is used to search in the locale data managed by a rails application as YAML files inside config/locale.
If scope matches a set of translations instead of a single string, keyed with one, other and zero, then the
value of pluralFor is used to select the appropriate variation to pluralize that particular number.
The default value for pluralFor is 1 to make it easier to expand our translation trees.
This comes handy when we start with a simple scope such as example.units.boards, matched
with a translation value of example.units.boards = 'Board'.
If/when we decide we need another subscope, such as example.units.boards.withQuantity,
we can update the translation values so that example.units.boards becomes example.units.boards.one
without having to change existing code that uses example.units.boards as a scope.
Otherwise, adding subkeys to translation values at example.units.boards would cause errors.
The translation string matched by scope can include interpolation placeholders using ${name} or {{name}},
which get replaced with the value for the given name included in values.
The given scope can include placeholders using [name] --the scope, not the resulting translation string--
which get replaced with values for the given name included in lookup. Values are also retrieved from the
"global translation lookups" described below.
These values are "normalized" to use only underscores and lowercase alphanumeric characters.
If name corresponds to an array instead of a single value, then the scope will be used to search
under those possible values.
This means for example: a scope of "example.[type].[level].label"
with lookup = {type: 'Name', level: ['Specific', 'Generic']}
will search for translation strings under example.name.specific.label first,
and if not found, under example.name.generic.label.
If a scope has multiple parts that map into arrays, all combinations will be searched.
If no matching string is found, then the optional fallback will be used instead.
The library provides a setLocale method to set the current locale (an identifier for language and
regional variations such as "en-US" for American English or "es" for Spanish). There is also
a getLocale if you need to retrieve the current locale.
You can also define "global translation lookup values" with addGlobalTranslationLookup(key, value)
and can be reset with resetGlobalTranslationLookups().
These values are used along with explicit lookup values for all calls to translate.
This library was originally developed at Artemis by Sebastián Delmont.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent