-
Notifications
You must be signed in to change notification settings - Fork 8.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[i18n][system upgrade] Change pseudolocale implementation #180244
Labels
Project:i18n
Team:Core
Core services & architecture: plugins, logging, config, saved objects, http, ES client, i18n, etc
Comments
Bamieh
added
Team:Core
Core services & architecture: plugins, logging, config, saved objects, http, ES client, i18n, etc
Project:i18n
labels
Apr 7, 2024
Pinging @elastic/kibana-core (Team:Core) |
18 tasks
Bamieh
added a commit
that referenced
this issue
Jun 2, 2024
## Summary Upgrading intl packages from v2 to v6 ### Packages upgrade: - [x] Add @formatjs packages - [x] `react-intl` Upgraded - [x] `intl-messageformat` Upgraded - [x] `intl-format-cache` removed - [x] `intl-relativeformat` removed - [x] `intl-messageformat-parser` removed ### Todo list: - [x] Refactor HTML tags - [x] Refactor Upgrade tags - [x] Refactor `kbn-i18n` - [x] Refactor `kbn-i18n-react` - [x] Refactor `FormattedRelative` to `FormattedRelativeTime` - [x] Refactor polyfills - [x] Refactor IntlShape types - [x] Rewrite Providers - [x] Rewrite tests using i18n - [x] Removed current pseudolocale implementation (tracker: #180244) - [x] Fix jest tests using rendered `Provider` - [x] Remove no longer valid i18n packages documentation (tracker: #180259) Closes #178968 Closes #38642 ## Notes to code reviewers For team other than the core team, please review your plugins code changes by filtering files by codeowners. ### Test Snapshot updates Most of the changes are refactors of renamed functions and changed ICU syntax. The main updates are snapshot changes where `FormattedMessage` is now memoized so snapshots capturing the html tree needed to be updated to use `<Memo(MemoizedFormattedMessage)` instead of `<FormattedMessage` ### ICU now supports HTML tags: before: ``` <FormattedMessage defaultMessage="To buy a shoe, { link } and { cta }" values={{ link: ( <a class="external_link" target="_blank" href="https://www.shoe.com/"> visit our website </a> ), cta: <strong class="important">eat a shoe</strong>, }} /> ``` after: ``` <FormattedMessage defaultMessage="To buy a shoe, <a>visit our website</a> and <cta>eat a shoe</cta>" values={{ a: msg => ( <a class="external_link" target="_blank" href="https://www.shoe.com/"> {msg} </a> ), cta: msg => <strong class="important">{msg}</strong>, }} /> ``` ### Escape character to prevent ICU parsing changed from double slashes to single quotes: before: `\\{escaped\\}` after: `'{escaped}'` ### No need for Intl Shape the new packages under formatJS are written in typescript and come with types support out of the box so no need to set types when using i18n. Renamed `InjectedIntlProps` with `WrappedComponentProps`. Removed `prop-types` and `intlShape` in favor of `IntlShape`. ### FormattedRelative has been renamed to FormattedRelativeTime and its API has changed significantly. See [FormattedRelativeTime](https://formatjs.io/docs/react-intl/upgrade-guide-3x#formattedrelativetime) for more details. ### All tags specified must have corresponding values and will throw error if it's missing All tags are now parsed and expected to be formatted properly (all opened tags must be closed). To skip this check you can use the `ignoreTag: true` property ``` i18n.translate('xpack.apm.agentConfig.captureJmxMetrics.description', { defaultMessage: 'This is not an HTML tag <JMX object name pattern>' + ignoreTag: true, }), ``` **When do I use ignore tags?** If your message has HTML tags, it is preferred not to ignore the Tag to have some string verification that the html tags you are adding are properly formatted and closed. If it the text between brackets is not an HTML tag and it is just a fomat preference then using `ignoreTag` makes sense. --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Tiago Costa <tiago.costa@elastic.co>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Labels
Project:i18n
Team:Core
Core services & architecture: plugins, logging, config, saved objects, http, ES client, i18n, etc
With the i18n packages upgrade, our current pseudo locale implementation is very limited and has obvious drawbacks:
en-xa
is supported from the psuedo locale suite.Provider
level checking if the language isen-xa
The new formatJS library support psuedo localization at 'compile' time. Where a new psuedo localized translation file is generated and supplied to kibana like other languages.
If we switch from switching alphabets at runtime to this static file we gain multiple benefits:
The new work flow runs as follows:
node scripts/i18n_pseudo --pseudo-locale <pseudoLocale>
yarn start --i18n.locale="en-xa"
Note that the extracted psuedo locales are git ignored and must be generated when needed, this is to guarantee that we are have full messages coverage everytime.
We can also run this script when
yarn start
is called and the locale is set to a pseudo locale so people who need this will not need to run the new extra step.The text was updated successfully, but these errors were encountered: