diff --git a/ui/v2.5/package.json b/ui/v2.5/package.json index 048b55846..8f4ad36a3 100644 --- a/ui/v2.5/package.json +++ b/ui/v2.5/package.json @@ -26,7 +26,10 @@ ], "dependencies": { "@apollo/client": "^3.3.7", + "@formatjs/intl-getcanonicallocales": "^1.5.3", + "@formatjs/intl-locale": "^2.4.14", "@formatjs/intl-numberformat": "^6.1.3", + "@formatjs/intl-pluralrules": "^4.0.6", "@fortawesome/fontawesome-svg-core": "^1.2.34", "@fortawesome/free-regular-svg-icons": "^5.15.2", "@fortawesome/free-solid-svg-icons": "^5.15.2", diff --git a/ui/v2.5/src/App.tsx b/ui/v2.5/src/App.tsx index 9fcb99f66..5be2b0268 100755 --- a/ui/v2.5/src/App.tsx +++ b/ui/v2.5/src/App.tsx @@ -5,10 +5,7 @@ import { ToastProvider } from "src/hooks/Toast"; import LightboxProvider from "src/hooks/Lightbox/context"; import { library } from "@fortawesome/fontawesome-svg-core"; import { fas } from "@fortawesome/free-solid-svg-icons"; -import "@formatjs/intl-numberformat/polyfill"; -import "@formatjs/intl-numberformat/locale-data/en"; -import "@formatjs/intl-numberformat/locale-data/en-GB"; -import replaceAll from "string.prototype.replaceall"; +import { initPolyfills } from "src/polyfills"; import locales from "src/locale"; import { useConfiguration } from "src/core/StashService"; @@ -29,10 +26,9 @@ import Movies from "./components/Movies/Movies"; import Tags from "./components/Tags/Tags"; import Images from "./components/Images/Images"; -MousetrapPause(Mousetrap); +initPolyfills(); -// Required for browsers older than August 2020ish. Can be removed at some point. -replaceAll.shim(); +MousetrapPause(Mousetrap); // Set fontawesome/free-solid-svg as default fontawesome icons library.add(fas); diff --git a/ui/v2.5/src/globals.d.ts b/ui/v2.5/src/globals.d.ts index dc0144b95..08dbb94ad 100644 --- a/ui/v2.5/src/globals.d.ts +++ b/ui/v2.5/src/globals.d.ts @@ -1,3 +1,6 @@ declare module "*.md"; declare module "string.prototype.replaceall"; declare module "mousetrap-pause"; +declare module "@formatjs/intl-pluralrules/locale-data/en"; +declare module "@formatjs/intl-numberformat/locale-data/en"; +declare module "@formatjs/intl-numberformat/locale-data/en-GB"; diff --git a/ui/v2.5/src/polyfills.ts b/ui/v2.5/src/polyfills.ts new file mode 100644 index 000000000..6105f3881 --- /dev/null +++ b/ui/v2.5/src/polyfills.ts @@ -0,0 +1,30 @@ +import replaceAll from "string.prototype.replaceall"; +import { shouldPolyfill as shouldPolyfillCanonicalLocales } from "@formatjs/intl-getcanonicallocales/should-polyfill"; +import { shouldPolyfill as shouldPolyfillLocale } from "@formatjs/intl-locale/should-polyfill"; +import { shouldPolyfill as shouldPolyfillNumberformat } from "@formatjs/intl-numberformat/should-polyfill"; +import { shouldPolyfill as shouldPolyfillPluralRules } from "@formatjs/intl-pluralrules/should-polyfill"; + +// Required for browsers older than August 2020ish. Can be removed at some point. +replaceAll.shim(); + +async function checkPolyfills() { + if (shouldPolyfillCanonicalLocales()) { + await import("@formatjs/intl-getcanonicallocales/polyfill"); + } + if (shouldPolyfillLocale()) { + await import("@formatjs/intl-locale/polyfill"); + } + if (shouldPolyfillNumberformat()) { + await import("@formatjs/intl-numberformat/polyfill"); + await import("@formatjs/intl-numberformat/locale-data/en"); + await import("@formatjs/intl-numberformat/locale-data/en-GB"); + } + if (shouldPolyfillPluralRules()) { + await import("@formatjs/intl-pluralrules/polyfill"); + await import("@formatjs/intl-pluralrules/locale-data/en"); + } +} + +export const initPolyfills = async () => { + await checkPolyfills(); +}; diff --git a/ui/v2.5/yarn.lock b/ui/v2.5/yarn.lock index e950044de..acfe251a7 100644 --- a/ui/v2.5/yarn.lock +++ b/ui/v2.5/yarn.lock @@ -1247,6 +1247,13 @@ dependencies: tslib "^2.0.1" +"@formatjs/ecma402-abstract@1.5.2": + version "1.5.2" + resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-1.5.2.tgz#6c20c24f814ebf8e9dd46e34310a67895853a931" + integrity sha512-rscxoLyIwH2x+l15Z4eD580ioO3CkFVoWDLgDtgiOnWzDzpL5EigDRg9V4mINb8W6bQRT1xnCxiRwvw3bgvqrA== + dependencies: + tslib "^2.0.1" + "@formatjs/ecma402-abstract@^1.2.6": version "1.2.6" resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-1.2.6.tgz#8929525dcb49af31f348fcb4789263743872b57f" @@ -1270,6 +1277,14 @@ "@formatjs/ecma402-abstract" "1.5.1" tslib "^2.0.1" +"@formatjs/intl-getcanonicallocales@1.5.3", "@formatjs/intl-getcanonicallocales@^1.5.3": + version "1.5.3" + resolved "https://registry.yarnpkg.com/@formatjs/intl-getcanonicallocales/-/intl-getcanonicallocales-1.5.3.tgz#b5978462340da1502502c3fde1c4abccff8f3b8e" + integrity sha512-QVBnSPZ32Y80wkXbf36hP9VbyklbOb8edppxFcgO9Lbd47zagllw65Y81QOHEn/j11JcTn2OhW0vea95LHvQmA== + dependencies: + cldr-core "38" + tslib "^2.0.1" + "@formatjs/intl-listformat@5.0.4": version "5.0.4" resolved "https://registry.yarnpkg.com/@formatjs/intl-listformat/-/intl-listformat-5.0.4.tgz#32b43257a4757ceab93d469c94f0fd067b302668" @@ -1278,6 +1293,16 @@ "@formatjs/ecma402-abstract" "1.5.1" tslib "^2.0.1" +"@formatjs/intl-locale@^2.4.14": + version "2.4.14" + resolved "https://registry.yarnpkg.com/@formatjs/intl-locale/-/intl-locale-2.4.14.tgz#9852678ee1ba3214e75f2e21fd0010d06e998d93" + integrity sha512-BWjAx+1kiN2VvQvx2L41cv8gr40mBDA78PKhVKLq+cPeAp8lwMmnGWUYr1sUXNew31N1acb6fqNJUD5sBGB/wQ== + dependencies: + "@formatjs/ecma402-abstract" "1.5.2" + "@formatjs/intl-getcanonicallocales" "1.5.3" + cldr-core "38" + tslib "^2.0.1" + "@formatjs/intl-numberformat@^5.5.2": version "5.7.1" resolved "https://registry.yarnpkg.com/@formatjs/intl-numberformat/-/intl-numberformat-5.7.1.tgz#9f0ad165ee8f9aa4aaec6a0268dd4523922a6fc0" @@ -1294,6 +1319,14 @@ "@formatjs/ecma402-abstract" "1.5.1" tslib "^2.0.1" +"@formatjs/intl-pluralrules@^4.0.6": + version "4.0.6" + resolved "https://registry.yarnpkg.com/@formatjs/intl-pluralrules/-/intl-pluralrules-4.0.6.tgz#bab69e68b122089daa39f57072978a560f955176" + integrity sha512-/7Hjg/7EiHuZq4zwd406UoX2w5KtUrLRj9SI8mPOkUpHHqruSskYuJYahKWW7rNytPRaoCLfsigoFS0CDHBjlg== + dependencies: + "@formatjs/ecma402-abstract" "1.5.2" + tslib "^2.0.1" + "@formatjs/intl-relativetimeformat@8.0.3": version "8.0.3" resolved "https://registry.yarnpkg.com/@formatjs/intl-relativetimeformat/-/intl-relativetimeformat-8.0.3.tgz#614c681b64f90d7000f1bfddc86c1a9c3447ecc3" @@ -4689,6 +4722,11 @@ classnames@^2.2.6: resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.2.6.tgz#43935bffdd291f326dad0a205309b38d00f650ce" integrity sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q== +cldr-core@38: + version "38.1.0" + resolved "https://registry.yarnpkg.com/cldr-core/-/cldr-core-38.1.0.tgz#3c400436b89110e2c0584469d51b7479ef0fa70c" + integrity sha512-Da9xKjDp4qGGIX0VDsBqTan09iR5nuYD2a/KkfEaUyqKhu6wFVNRiCpPDXeRbpVwPBY6PgemV8WiHatMhcpy4A== + clean-css@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.3.tgz#507b5de7d97b48ee53d84adb0160ff6216380f78"