From 5ae33e4ef520ebf2f63e49eee2042889ff465ead Mon Sep 17 00:00:00 2001 From: hurali97 Date: Tue, 19 Mar 2024 15:16:01 +0500 Subject: [PATCH 1/7] perf: remove not needed Intl polyfills by separating iOS and android --- src/libs/IntlPolyfill/index.android.ts | 17 +++++++++++++++++ src/libs/IntlPolyfill/index.ios.ts | 23 +++++++++++++++++++++++ 2 files changed, 40 insertions(+) create mode 100644 src/libs/IntlPolyfill/index.android.ts create mode 100644 src/libs/IntlPolyfill/index.ios.ts diff --git a/src/libs/IntlPolyfill/index.android.ts b/src/libs/IntlPolyfill/index.android.ts new file mode 100644 index 000000000000..7a21ae26bfa4 --- /dev/null +++ b/src/libs/IntlPolyfill/index.android.ts @@ -0,0 +1,17 @@ +import polyfillListFormat from './polyfillListFormat'; +import type IntlPolyfill from './types'; + +/** + * Polyfill the Intl API, always performed for native devices. + */ +const intlPolyfill: IntlPolyfill = () => { + // Native devices require extra polyfills which are + // not yet implemented in hermes. + // see support: https://hermesengine.dev/docs/intl/ + + require('@formatjs/intl-locale/polyfill'); + + polyfillListFormat(); +}; + +export default intlPolyfill; diff --git a/src/libs/IntlPolyfill/index.ios.ts b/src/libs/IntlPolyfill/index.ios.ts new file mode 100644 index 000000000000..0660dfbc3fa3 --- /dev/null +++ b/src/libs/IntlPolyfill/index.ios.ts @@ -0,0 +1,23 @@ +import polyfillListFormat from './polyfillListFormat'; +import polyfillNumberFormat from './polyfillNumberFormat'; +import type IntlPolyfill from './types'; + +/** + * Polyfill the Intl API, always performed for native devices. + */ +const intlPolyfill: IntlPolyfill = () => { + // Native devices require extra polyfills which are + // not yet implemented in hermes. + // see support: https://hermesengine.dev/docs/intl/ + + require('@formatjs/intl-locale/polyfill'); + + // Required to polyfill NumberFormat on iOS + // see: https://github.com/facebook/hermes/issues/1172#issuecomment-1776156538 + require('@formatjs/intl-pluralrules/polyfill'); + polyfillNumberFormat(); + + polyfillListFormat(); +}; + +export default intlPolyfill; From f18cd852e1d94fef6884c26a736c5d4559973d0a Mon Sep 17 00:00:00 2001 From: hurali97 Date: Wed, 20 Mar 2024 13:02:43 +0500 Subject: [PATCH 2/7] refactor: remove index.native.ts from IntlPolyfill --- src/libs/IntlPolyfill/index.native.ts | 19 ------------------- 1 file changed, 19 deletions(-) delete mode 100644 src/libs/IntlPolyfill/index.native.ts diff --git a/src/libs/IntlPolyfill/index.native.ts b/src/libs/IntlPolyfill/index.native.ts deleted file mode 100644 index ca1c8f4c250e..000000000000 --- a/src/libs/IntlPolyfill/index.native.ts +++ /dev/null @@ -1,19 +0,0 @@ -import polyfillDateTimeFormat from './polyfillDateTimeFormat'; -import polyfillListFormat from './polyfillListFormat'; -import polyfillNumberFormat from './polyfillNumberFormat'; -import type IntlPolyfill from './types'; - -/** - * Polyfill the Intl API, always performed for native devices. - */ -const intlPolyfill: IntlPolyfill = () => { - // Native devices require extra polyfills - require('@formatjs/intl-getcanonicallocales/polyfill'); - require('@formatjs/intl-locale/polyfill'); - require('@formatjs/intl-pluralrules/polyfill'); - polyfillNumberFormat(); - polyfillDateTimeFormat(); - polyfillListFormat(); -}; - -export default intlPolyfill; From 91e40a3599cfd18bc5677e32801190c9fad10175 Mon Sep 17 00:00:00 2001 From: hurali97 Date: Wed, 20 Mar 2024 13:12:24 +0500 Subject: [PATCH 3/7] fix: add DateTimeFormat polyfill --- src/libs/IntlPolyfill/index.ios.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/libs/IntlPolyfill/index.ios.ts b/src/libs/IntlPolyfill/index.ios.ts index 0660dfbc3fa3..569b666eb434 100644 --- a/src/libs/IntlPolyfill/index.ios.ts +++ b/src/libs/IntlPolyfill/index.ios.ts @@ -1,3 +1,4 @@ +import polyfillDateTimeFormat from './polyfillDateTimeFormat'; import polyfillListFormat from './polyfillListFormat'; import polyfillNumberFormat from './polyfillNumberFormat'; import type IntlPolyfill from './types'; @@ -17,6 +18,10 @@ const intlPolyfill: IntlPolyfill = () => { require('@formatjs/intl-pluralrules/polyfill'); polyfillNumberFormat(); + // Required to polyfill DateTimeFormat on iOS + // see: https://github.com/facebook/hermes/issues/1172#issuecomment-1776156538 + polyfillDateTimeFormat(); + polyfillListFormat(); }; From 9029258c83ecc1b9c317160eee4bfd926739ffe8 Mon Sep 17 00:00:00 2001 From: hurali97 Date: Mon, 25 Mar 2024 13:55:56 +0500 Subject: [PATCH 4/7] fix: use correct whitespace character --- src/CONST.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/CONST.ts b/src/CONST.ts index 132b49c16ef7..ebf6ced94798 100755 --- a/src/CONST.ts +++ b/src/CONST.ts @@ -2922,7 +2922,7 @@ const CONST = { CURRENCY: 'XAF', FORMAT: 'symbol', SAMPLE_INPUT: '123456.789', - EXPECTED_OUTPUT: 'FCFA 123,457', + EXPECTED_OUTPUT: 'FCFA 123,457', }, PATHS_TO_TREAT_AS_EXTERNAL: ['NewExpensify.dmg', 'docs/index.html'], From 2f5a5cc9deb8c51b505dec69eb34d6f84374456c Mon Sep 17 00:00:00 2001 From: hurali97 Date: Mon, 25 Mar 2024 13:56:28 +0500 Subject: [PATCH 5/7] feat: check for formatToParts in Intl.NumberFormat API --- src/libs/IntlPolyfill/polyfillNumberFormat.ts | 25 +++++++++++++------ 1 file changed, 17 insertions(+), 8 deletions(-) diff --git a/src/libs/IntlPolyfill/polyfillNumberFormat.ts b/src/libs/IntlPolyfill/polyfillNumberFormat.ts index 1fac01958f05..8b4ac19b7678 100644 --- a/src/libs/IntlPolyfill/polyfillNumberFormat.ts +++ b/src/libs/IntlPolyfill/polyfillNumberFormat.ts @@ -1,21 +1,30 @@ import CONST from '@src/CONST'; +const numberFormat = new Intl.NumberFormat(CONST.LOCALES.DEFAULT, { + style: CONST.POLYFILL_TEST.STYLE, + currency: CONST.POLYFILL_TEST.CURRENCY, + currencyDisplay: CONST.POLYFILL_TEST.FORMAT, +}); + /** * Check if the locale data is as expected on the device. * Ensures that the currency data is consistent across devices. */ function hasOldCurrencyData(): boolean { - return ( - new Intl.NumberFormat(CONST.LOCALES.DEFAULT, { - style: CONST.POLYFILL_TEST.STYLE, - currency: CONST.POLYFILL_TEST.CURRENCY, - currencyDisplay: CONST.POLYFILL_TEST.FORMAT, - }).format(Number(CONST.POLYFILL_TEST.SAMPLE_INPUT)) !== CONST.POLYFILL_TEST.EXPECTED_OUTPUT - ); + return numberFormat.format(Number(CONST.POLYFILL_TEST.SAMPLE_INPUT)) !== CONST.POLYFILL_TEST.EXPECTED_OUTPUT; +} + +/** + * Checks if the formatToParts function is available on the + * Intl.NumberFormat object. + * @returns boolean + */ +function hasFormatToParts(): boolean { + return typeof numberFormat.formatToParts === 'function'; } export default function () { - if (Intl && 'NumberFormat' in Intl && !hasOldCurrencyData()) { + if (Intl && 'NumberFormat' in Intl && !hasOldCurrencyData() && hasFormatToParts()) { return; } From dae726a66e6117fc50dc64a2698213bf00d7047f Mon Sep 17 00:00:00 2001 From: hurali97 Date: Tue, 26 Mar 2024 13:07:16 +0500 Subject: [PATCH 6/7] refactor: remove not needed getCanonicalLocales Intl polyfill --- package-lock.json | 1 - package.json | 3 +-- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/package-lock.json b/package-lock.json index ba15feeacae6..cfaf942936e8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,7 +14,6 @@ "@expensify/react-native-live-markdown": "0.1.5", "@expo/metro-runtime": "~3.1.1", "@formatjs/intl-datetimeformat": "^6.10.0", - "@formatjs/intl-getcanonicallocales": "^2.2.0", "@formatjs/intl-listformat": "^7.2.2", "@formatjs/intl-locale": "^3.3.0", "@formatjs/intl-numberformat": "^8.5.0", diff --git a/package.json b/package.json index d1974b99b91e..9d4782ca0d7a 100644 --- a/package.json +++ b/package.json @@ -65,7 +65,6 @@ "@expensify/react-native-live-markdown": "0.1.5", "@expo/metro-runtime": "~3.1.1", "@formatjs/intl-datetimeformat": "^6.10.0", - "@formatjs/intl-getcanonicallocales": "^2.2.0", "@formatjs/intl-listformat": "^7.2.2", "@formatjs/intl-locale": "^3.3.0", "@formatjs/intl-numberformat": "^8.5.0", @@ -154,8 +153,8 @@ "react-native-plaid-link-sdk": "10.8.0", "react-native-qrcode-svg": "^6.2.0", "react-native-quick-sqlite": "^8.0.0-beta.2", - "react-native-release-profiler": "^0.1.6", "react-native-reanimated": "^3.7.2", + "react-native-release-profiler": "^0.1.6", "react-native-render-html": "6.3.1", "react-native-safe-area-context": "4.8.2", "react-native-screens": "3.29.0", From 05cc46b2cb88aa7b3c1d626e9861da22faba0527 Mon Sep 17 00:00:00 2001 From: hurali97 Date: Tue, 26 Mar 2024 13:07:31 +0500 Subject: [PATCH 7/7] refactor: adjust comments --- src/libs/IntlPolyfill/polyfillNumberFormat.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/libs/IntlPolyfill/polyfillNumberFormat.ts b/src/libs/IntlPolyfill/polyfillNumberFormat.ts index 8b4ac19b7678..58d8adf1b761 100644 --- a/src/libs/IntlPolyfill/polyfillNumberFormat.ts +++ b/src/libs/IntlPolyfill/polyfillNumberFormat.ts @@ -17,7 +17,6 @@ function hasOldCurrencyData(): boolean { /** * Checks if the formatToParts function is available on the * Intl.NumberFormat object. - * @returns boolean */ function hasFormatToParts(): boolean { return typeof numberFormat.formatToParts === 'function';