From ae668fc608b669c0179918bdb7e70615c00734ac Mon Sep 17 00:00:00 2001 From: Jake Haenchen Date: Mon, 22 Oct 2018 15:43:30 -0500 Subject: [PATCH 1/4] Add support for fallback locale --- README.md | 1 + src/index.js | 19 +++++++++++++++---- 2 files changed, 16 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 382a68c..460bf40 100644 --- a/README.md +++ b/README.md @@ -277,6 +277,7 @@ require('intl/locale-data/jsonp/ja.js'); * @param {Object} options.locales App locale data like {"en-US":{"key1":"value1"},"zh-CN":{"key1":"值1"}} * @param {Object} options.commonLocaleDataUrls Custom common locale urls. See https://github.com/alibaba/react-intl-universal/releases/tag/1.12.0 * @param {Object} options.warningHandler Ability to accumulate missing messages using third party services. See https://github.com/alibaba/react-intl-universal/releases/tag/1.11.1 + * @param {string} options.fallbackLocale One locale from options.locales to use if a key is not found in the current locale * @returns {Promise} */ init(options) diff --git a/src/index.js b/src/index.js index e66501a..0092cb6 100644 --- a/src/index.js +++ b/src/index.js @@ -47,6 +47,7 @@ class ReactIntlUniversal { locales: {}, // app locale data like {"en-US":{"key1":"value1"},"zh-CN":{"key1":"值1"}} warningHandler: console.warn, // ability to accumulate missing messages using third party services like Sentry commonLocaleDataUrls: COMMON_LOCALE_DATA_URLS, + fallbackLocale: '', // Locale to use if a key is not found in the current locale }; } @@ -68,10 +69,20 @@ class ReactIntlUniversal { } let msg = this.getDescendantProp(locales[currentLocale], key); if (msg == null) { - this.options.warningHandler( - `react-intl-universal key "${key}" not defined in ${currentLocale}` - ); - return ""; + if (this.options.fallbackLocale) { + msg = this.getDescendantProp(locales[this.options.fallbackLocale], key); + if (msg === null) { + this.options.warningHandler( + `react-intl-universal key "${key}" not defined in ${currentLocale} or the fallback locale, ${this.options.fallbackLocale}` + ); + return ""; + } + } else { + this.options.warningHandler( + `react-intl-universal key "${key}" not defined in ${currentLocale}` + ); + return ""; + } } if (variables) { variables = Object.assign({}, variables); From 27eed32ca543e6e83a0cc04ef986f6b77da1b355 Mon Sep 17 00:00:00 2001 From: Jake Haenchen Date: Tue, 23 Oct 2018 13:27:46 -0500 Subject: [PATCH 2/4] Add new fallbackLocale option to type declaration --- typings/index.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/typings/index.d.ts b/typings/index.d.ts index 0695c28..508be22 100644 --- a/typings/index.d.ts +++ b/typings/index.d.ts @@ -70,6 +70,7 @@ declare module "react-intl-universal" { * @param {string} options.currentLocale Current locale such as 'en-US' * @param {Object} options.locales App locale data like {"en-US":{"key1":"value1"},"zh-CN":{"key1":"值1"}} * @param {Object} options.warningHandler Ability to accumulate missing messages using third party services like Sentry + * @param {string} options.fallbackLocale One locale from options.locales to use if a key is not found in the current locale * @returns {Promise} */ export function init(options: ReactIntlUniversalOptions): Promise; From c91bff004249bd0f015f98cb097ae3af6ba9d255 Mon Sep 17 00:00:00 2001 From: Jake Haenchen Date: Tue, 23 Oct 2018 13:35:58 -0500 Subject: [PATCH 3/4] Add tests --- test/index.js | 5 +++++ test/locales/en-US.js | 1 + 2 files changed, 6 insertions(+) diff --git a/test/index.js b/test/index.js index 109cd07..50bdf68 100644 --- a/test/index.js +++ b/test/index.js @@ -284,3 +284,8 @@ test("load mutiple locale data without overriding existing one", () => { expect(intl.get("SIMPLE")).toBe("Simple"); expect(intl.get("MORE")).toBe("More data"); }); + +test("Uses fallback locale if key not found", () => { + intl.init({ locales, currentLocale: "zh-CN", fallbackLocale: "en-US" }); + expect(intl.get("ONLY_IN_ENGLISH")).toBe("ONLY_IN_ENGLISH"); +}); diff --git a/test/locales/en-US.js b/test/locales/en-US.js index da207fe..623beee 100644 --- a/test/locales/en-US.js +++ b/test/locales/en-US.js @@ -15,4 +15,5 @@ module.exports = ({ "DOT.HELLO": "Hello World", "BRACE1": "The format is {var}", "BRACE2": "The format is ${var}", + "ONLY_IN_ENGLISH": "ONLY_IN_ENGLISH" }); From 96c9123fe11fd48450d9368d68bb599d2a3543bd Mon Sep 17 00:00:00 2001 From: "chiawei.tcw" Date: Tue, 30 Oct 2018 23:34:52 +0800 Subject: [PATCH 4/4] Uses default message if key not found in fallbackLocale --- README.md | 2 +- package.json | 2 +- src/index.js | 4 ++-- test/index.js | 14 ++++++++++---- typings/index.d.ts | 2 +- 5 files changed, 15 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index d2b8570..3e9d12a 100644 --- a/README.md +++ b/README.md @@ -278,7 +278,7 @@ require('intl/locale-data/jsonp/ja.js'); * @param {Object} options.locales App locale data like {"en-US":{"key1":"value1"},"zh-CN":{"key1":"值1"}} * @param {Object} options.commonLocaleDataUrls Custom common locale urls. See https://github.com/alibaba/react-intl-universal/releases/tag/1.12.0 * @param {Object} options.warningHandler Ability to accumulate missing messages using third party services. See https://github.com/alibaba/react-intl-universal/releases/tag/1.11.1 - * @param {string} options.fallbackLocale One locale from options.locales to use if a key is not found in the current locale + * @param {string} options.fallbackLocale Fallback locale such as 'zh-CN' to use if a key is not found in the current locale * @returns {Promise} */ init(options) diff --git a/package.json b/package.json index 4cf6b7a..20c602f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-intl-universal", - "version": "1.14.3", + "version": "1.15.0", "description": "Internationalize React apps. Not only for React.Component but also for Vanilla JS.", "keywords": [ "intl", diff --git a/src/index.js b/src/index.js index df7aeba..dbd50ff 100644 --- a/src/index.js +++ b/src/index.js @@ -48,7 +48,7 @@ class ReactIntlUniversal { warningHandler: console.warn, // ability to accumulate missing messages using third party services like Sentry escapeHtml: true, // disable escape html in variable mode commonLocaleDataUrls: COMMON_LOCALE_DATA_URLS, - fallbackLocale: '', // Locale to use if a key is not found in the current locale + fallbackLocale: null, // Locale to use if a key is not found in the current locale }; } @@ -72,7 +72,7 @@ class ReactIntlUniversal { if (msg == null) { if (this.options.fallbackLocale) { msg = this.getDescendantProp(locales[this.options.fallbackLocale], key); - if (msg === null) { + if (msg == null) { this.options.warningHandler( `react-intl-universal key "${key}" not defined in ${currentLocale} or the fallback locale, ${this.options.fallbackLocale}` ); diff --git a/test/index.js b/test/index.js index 9cbc148..41f4677 100644 --- a/test/index.js +++ b/test/index.js @@ -69,7 +69,7 @@ test("react-intl mirror API formatHTMLMessage:defaultMessage", () => { intl.init({ locales, currentLocale: "en-US" }); let reactEl = intl.formatHTMLMessage({ id: "not-exist-key", - defaultMessage: React.createElement("div", {className: 'test'}) + defaultMessage: React.createElement("div", { className: 'test' }) }); expect(reactEl.type).toBe('div'); @@ -211,7 +211,7 @@ test("Without default message, just return empty string", () => { test("Should call handler when message is not defined", () => { const warningHandler = jest.fn(); - intl.init({ + intl.init({ locales, currentLocale: "en-US", warningHandler }); @@ -290,12 +290,18 @@ test("load mutiple locale data without overriding existing one", () => { const localesMore = { "en-US": enUSMore, }; - intl.load(localesMore); + intl.load(localesMore); expect(intl.get("SIMPLE")).toBe("Simple"); expect(intl.get("MORE")).toBe("More data"); }); -test("Uses fallback locale if key not found", () => { +test("Uses fallback locale if key not found in currentLocale", () => { intl.init({ locales, currentLocale: "zh-CN", fallbackLocale: "en-US" }); expect(intl.get("ONLY_IN_ENGLISH")).toBe("ONLY_IN_ENGLISH"); }); + +test("Uses default message if key not found in fallbackLocale", () => { + intl.init({ locales, currentLocale: "zh-CN", fallbackLocale: "en-US" }); + expect(intl.get("not-exist-key").defaultMessage("this is default msg")).toBe("this is default msg"); +}); + diff --git a/typings/index.d.ts b/typings/index.d.ts index c158fe1..b244d06 100644 --- a/typings/index.d.ts +++ b/typings/index.d.ts @@ -70,7 +70,7 @@ declare module "react-intl-universal" { * @param {string} options.currentLocale Current locale such as 'en-US' * @param {Object} options.locales App locale data like {"en-US":{"key1":"value1"},"zh-CN":{"key1":"值1"}} * @param {Object} options.warningHandler Ability to accumulate missing messages using third party services like Sentry - * @param {string} options.fallbackLocale One locale from options.locales to use if a key is not found in the current locale + * @param {string} options.fallbackLocale Fallback locale such as 'zh-CN' to use if a key is not found in the current locale * @param {boolean} options.escapeHtml To escape html. Default value is true. * @returns {Promise} */