[i18n][system upgrade] Upgrade Intl Packages from v2 to v6 #179506

Bamieh · 2024-03-27T05:08:36Z

Summary

Upgrading intl packages from v2 to v6

Packages upgrade:

Todo list:

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 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.

packages/core/i18n/core-i18n-server-internal/src/init_translations.ts

packages/kbn-i18n-react/src/compatiblity_layer.tsx

packages/kbn-i18n-react/src/inject.tsx

packages/kbn-i18n/src/core/formats.ts

packages/kbn-i18n/src/translation.ts

packages/kbn-i18n/src/core/i18n.ts

src/dev/i18n/utils/verify_icu_message.ts

src/plugins/vis_types/timeseries/server/ui_settings.ts

src/plugins/home/server/tutorials/instructions/functionbeat_instructions.ts

src/dev/i18n/utils/utils.js

packages/kbn-i18n/src/loader.ts

packages/kbn-i18n-react/src/provider.tsx

packages/kbn-i18n/src/core/error_handler.ts

Oscurz · 2024-05-27T13:36:18Z

I would like my Data but back how it was before all an not made public access. Dan Hibbitts

…

On Fri, May 24, 2024, 6:09 AM Jan Monschke ***@***.***> wrote: ***@***.**** commented on this pull request. ------------------------------ In x-pack/plugins/security_solution/server/ui_settings.ts <#179506 (comment)>: > @@ -77,6 +77,7 @@ export const initUiSettings = ( { defaultMessage: '<p>Default refresh interval for the Security time filter, in milliseconds.</p>', + values: { p: (chunks) => `<p>${chunks}</p>` }, @Bamieh <https://github.com/Bamieh> Could you explain what this does? — Reply to this email directly, view it on GitHub <#179506 (review)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AWSXWJF75EKRWRQSLPHU34TZD43Z3AVCNFSM6AAAAABFKFVL6KVHI2DSMVQWIX3LMV43YUDVNRWFEZLROVSXG5CSMV3GSZLXHMZDANZWHA4DQMRZHA> . You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>

Bamieh · 2024-05-27T14:16:57Z

@elasticmachine merge upstream

…l_pack_upgrade

Bamieh · 2024-05-28T09:05:10Z

@elasticmachine merge upstream

Bamieh · 2024-05-28T16:17:17Z

@elasticmachine merge upstream

kibanamachine · 2024-05-28T16:17:29Z

expected head sha didn’t match current head ref.

Bamieh · 2024-05-28T16:28:06Z

@elasticmachine merge upstream

x-pack/plugins/observability_solution/infra/public/alerting/inventory/index.ts

kibana-ci · 2024-06-02T13:16:42Z

💛 Build succeeded, but was flaky

Buildkite Build
Commit: b080cf2
Storybooks Preview
Kibana Serverless Image: docker.elastic.co/kibana-ci/kibana-serverless:pr-179506-b080cf243b65
Observability Deployment

Failed CI Steps

Synthetics @elastic/synthetics Tests

Metrics [docs]

Public APIs missing comments

Total count of every public API that lacks a comment. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats comments for more detailed information.

id	before	after	diff
`@kbn/content-management-table-list-view-table`	31	32	+1
`@kbn/i18n`	48	29	-19
`@kbn/i18n-react`	1	7	+6
`@kbn/test-jest-helpers`	103	98	-5
total			-17

Any counts in public APIs

Total count of every any typed public API. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats any for more detailed information.

id	before	after	diff
`@kbn/test-jest-helpers`	5	3	-2

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`alerting`	91.4KB	91.4KB	+10.0B
`apm`	3.3MB	3.3MB	+93.0B
`canvas`	1.1MB	1.1MB	+42.0B
`cloudSecurityPosture`	450.5KB	450.5KB	-2.0B
`crossClusterReplication`	148.7KB	148.8KB	+64.0B
`dashboard`	495.5KB	495.5KB	+2.0B
`data`	46.7KB	46.7KB	+4.0B
`dataViewEditor`	48.6KB	48.6KB	+2.0B
`dataViewFieldEditor`	176.3KB	176.3KB	+6.0B
`dataViewManagement`	136.4KB	136.5KB	+49.0B
`dataVisualizer`	757.6KB	757.6KB	+4.0B
`discover`	811.0KB	811.0KB	+14.0B
`enterpriseSearch`	2.7MB	2.7MB	+113.0B
`exploratoryView`	182.0KB	182.0KB	+13.0B
`fileUpload`	951.8KB	951.8KB	+2.0B
`fleet`	1.3MB	1.3MB	+362.0B
`indexLifecycleManagement`	148.8KB	148.8KB	+2.0B
`indexManagement`	664.8KB	664.8KB	+44.0B
`infra`	1.5MB	1.5MB	+4.0B
`ingestPipelines`	368.9KB	368.9KB	+10.0B
`inputControlVis`	52.0KB	52.0KB	+2.0B
`kubernetesSecurity`	213.9KB	213.9KB	-5.0B
`lens`	1.5MB	1.5MB	+2.0B
`logsShared`	54.9KB	54.9KB	-6.0B
`logstash`	33.3KB	33.3KB	+2.0B
`maps`	3.0MB	3.0MB	+40.0B
`ml`	4.1MB	4.1MB	-335.0B
`remoteClusters`	78.8KB	78.8KB	+18.0B
`rollup`	114.3KB	114.4KB	+12.0B
`savedObjectsManagement`	84.3KB	84.4KB	+136.0B
`savedObjectsTagging`	132.6KB	132.6KB	+4.0B
`security`	587.1KB	587.2KB	+60.0B
`securitySolution`	15.2MB	15.2MB	+452.0B
`slo`	866.2KB	866.2KB	+2.0B
`snapshotRestore`	262.0KB	262.1KB	+60.0B
`spaces`	175.1KB	175.1KB	+22.0B
`stackAlerts`	86.5KB	86.5KB	+4.0B
`transform`	479.4KB	479.4KB	+18.0B
`triggersActionsUi`	1.6MB	1.6MB	+10.0B
`uiActionsEnhanced`	135.8KB	135.8KB	-12.0B
`visualizations`	285.8KB	285.8KB	+6.0B
`watcher`	165.9KB	166.0KB	+16.0B
total			+1.3KB

Canvas Sharable Runtime

The Canvas "shareable runtime" is an bundle produced to enable running Canvas workpads outside of Kibana. This bundle is included in third-party webpages that embed canvas and therefor should be as slim as possible.

id	before	after	diff
`module count`	-	5499	+5499
`total size`	-	8.9MB	+8.9MB

Public APIs missing exports

Total count of every type that is part of your API that should be exported but is not. This will cause broken links in the API documentation system. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats exports for more detailed information.

id	before	after	diff
`@kbn/i18n`	0	2	+2

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
`alerting`	25.0KB	25.0KB	+6.0B
`apm`	35.4KB	35.0KB	-420.0B
`core`	417.0KB	416.9KB	-152.0B
`dashboard`	43.4KB	43.4KB	+4.0B
`dataViewFieldEditor`	26.3KB	26.3KB	+4.0B
`expressionRevealImage`	8.5KB	8.5KB	+4.0B
`expressions`	99.5KB	99.5KB	+6.0B
`expressionShape`	23.2KB	23.2KB	+8.0B
`infra`	101.9KB	101.7KB	-278.0B
`kbnUiSharedDeps-srcJs`	3.2MB	3.1MB	-6.8KB
`lens`	49.3KB	49.3KB	+2.0B
`observability`	122.6KB	122.6KB	-30.0B
`reporting`	52.8KB	52.8KB	+8.0B
`savedObjects`	25.5KB	25.5KB	+4.0B
`security`	69.0KB	69.0KB	-18.0B
`slo`	23.0KB	22.9KB	-110.0B
`stackAlerts`	24.9KB	24.8KB	-92.0B
`transform`	18.8KB	18.6KB	-232.0B
`triggersActionsUi`	115.5KB	115.5KB	-18.0B
total			-8.0KB

Unknown metric groups

API count

id	before	after	diff
`@kbn/content-management-table-list-view-table`	47	48	+1
`@kbn/i18n`	51	39	-12
`@kbn/i18n-react`	61	36	-25
`@kbn/test-jest-helpers`	133	131	-2
total			-38

ESLint disabled in files

id	before	after	diff
`@kbn/i18n`	2	0	-2

ESLint disabled line counts

id	before	after	diff
`@kbn/core-i18n-browser-mocks`	1	0	-1
`@kbn/i18n`	1	2	+1
`@kbn/i18n-react`	4	0	-4
total			-4

Total ESLint disabled count

id	before	after	diff
`@kbn/core-i18n-browser-mocks`	1	0	-1
`@kbn/i18n`	3	2	-1
`@kbn/i18n-react`	4	0	-4
total			-6

History

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

## Summary Address two cases where single quotes needed to be doubled up to prevent escaping of string interpolation. Also addressed some doc examples. Verify confirm toasts after saving field in discover and creating a scripted field in data view management. Follow up to #179506 --------- Co-authored-by: Julia Rechkunova <julia.rechkunova@gmail.com>

upgrade packages

0791354

Bamieh added Team:Core Core services & architecture: plugins, logging, config, saved objects, http, ES client, i18n, etc Project:i18n 8.14 candidate labels Mar 27, 2024

Bamieh requested a review from gsoldevila March 27, 2024 05:10

Bamieh added 7 commits April 8, 2024 15:43

progress so far

57b3392

fix kbn-i18n test cases

f0af2c1

merge main

37d2665

more i18n fixes

ef3f2b6

mock Provider to init i18n at jest level

f269303

remove init

f51d59c

code review changes

196ce7d

gsoldevila reviewed Apr 11, 2024

View reviewed changes

packages/core/i18n/core-i18n-server-internal/src/init_translations.ts Outdated Show resolved Hide resolved

gsoldevila reviewed Apr 11, 2024

View reviewed changes

packages/kbn-i18n-react/src/compatiblity_layer.tsx Outdated Show resolved Hide resolved

gsoldevila reviewed Apr 11, 2024

View reviewed changes

packages/kbn-i18n-react/src/inject.tsx Show resolved Hide resolved

Bamieh mentioned this pull request Apr 11, 2024

[i18n][system upgrade] Upgrade i18n tooling #180617

Closed