@applicaster/zapp-react-dom-app 14.0.9-rc.0 → 14.0.9

package/Polyfills/QuickBrickCommunicationModule/__tests__/index.test.js

@@ -109,7 +109,7 @@ describe("QuickBrickCommunicationModule Polyfill", () => {
       });
     });
 
-    it("should fallback to default language if browser / device locale (en-UK) does not match list of supported languages", () => {
+    it("should use partial match en language when browser / device locale (en-UK) does not exactly match list of supported languages", () => {
       // localizations: ["en", "en-US", "fr", "fr-FR"], device_language: en, device_region: UK -> ui: en, language: en, region: UK
 
       global.window.navigator.language = "en-UK";
@@ -118,8 +118,22 @@ describe("QuickBrickCommunicationModule Polyfill", () => {
       expect(result).toEqual({
         uiLanguage: "en",
         languageCode: "en",
-        countryLocale: "",
-        languageLocale: "en",
+        countryLocale: "UK",
+        languageLocale: "en-UK",
+      });
+    });
+
+    it("should partial match fr language when browser / device locale (fr-CA) does not exact match list of supported languages", () => {
+      // localizations: ["en", "en-US", "fr", "fr-FR"], device_language: fr, device_region: CA -> ui: fr, language: fr, region: CA
+
+      global.window.navigator.language = "fr-CA";
+      const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+      expect(result).toEqual({
+        uiLanguage: "fr",
+        languageCode: "fr",
+        countryLocale: "CA",
+        languageLocale: "fr-CA",
       });
     });
 
@@ -190,6 +204,312 @@ describe("QuickBrickCommunicationModule Polyfill", () => {
         languageLocale: "fr-FR",
       });
     });
+
+    it("should not attempt to use user-selected language if it is improperly stored as undefined, null, or empty string", () => {
+      mockGetAppData.mockReturnValue(
+        getMockAppData({
+          languages: ["en", "es", "fr", "en-UK", "en-GB", "ar"],
+        })
+      );
+
+      global.window.navigator.language = "fr-CA";
+
+      // Test with undefined
+      window.localStorage.getItem.mockReturnValue("undefined");
+      let result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+      expect(result).toEqual({
+        uiLanguage: "fr",
+        languageCode: "fr",
+        countryLocale: "CA",
+        languageLocale: "fr-CA",
+      });
+
+      // Test with null
+      window.localStorage.getItem.mockReturnValue("null");
+      result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+      expect(result).toEqual({
+        uiLanguage: "fr",
+        languageCode: "fr",
+        countryLocale: "CA",
+        languageLocale: "fr-CA",
+      });
+
+      // Test with empty string
+      window.localStorage.getItem.mockReturnValue("");
+      result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+      expect(result).toEqual({
+        uiLanguage: "fr",
+        languageCode: "fr",
+        countryLocale: "CA",
+        languageLocale: "fr-CA",
+      });
+    });
+
+    describe("user-selected language scenarios", () => {
+      it("should use exact match user-selected language when available, ignoring browser locale", () => {
+        window.localStorage.getItem.mockReturnValue("fr-FR");
+        global.window.navigator.language = "en-US";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "fr-FR",
+          languageCode: "fr",
+          countryLocale: "FR",
+          languageLocale: "fr-FR",
+        });
+      });
+
+      it("should use base language user-selected when available (single language code)", () => {
+        window.localStorage.getItem.mockReturnValue("en");
+        global.window.navigator.language = "fr-FR";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "en",
+          languageCode: "en",
+          countryLocale: "",
+          languageLocale: "en",
+        });
+      });
+
+      it("should use base language fr user-selected when available", () => {
+        window.localStorage.getItem.mockReturnValue("fr");
+        global.window.navigator.language = "en-US";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "fr",
+          languageCode: "fr",
+          countryLocale: "",
+          languageLocale: "fr",
+        });
+      });
+
+      it("should fallback to browser exact match when user-selected language not available", () => {
+        window.localStorage.getItem.mockReturnValue("de-DE");
+        global.window.navigator.language = "fr-FR";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "fr-FR",
+          languageCode: "fr",
+          countryLocale: "FR",
+          languageLocale: "fr-FR",
+        });
+      });
+
+      it("should fallback to browser partial match when user-selected language not available", () => {
+        window.localStorage.getItem.mockReturnValue("de-DE");
+        global.window.navigator.language = "fr-CA";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "fr",
+          languageCode: "fr",
+          countryLocale: "CA",
+          languageLocale: "fr-CA",
+        });
+      });
+
+      it("should fallback to default language when both user-selected and browser locales not available", () => {
+        window.localStorage.getItem.mockReturnValue("de-DE");
+        global.window.navigator.language = "ja-JP";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "en",
+          languageCode: "en",
+          countryLocale: "",
+          languageLocale: "en",
+        });
+      });
+    });
+
+    describe("browser/device locale scenarios", () => {
+      beforeEach(() => {
+        window.localStorage.getItem.mockReturnValue(null);
+      });
+
+      it("should use exact match browser locale when no user selection", () => {
+        global.window.navigator.language = "en-US";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "en-US",
+          languageCode: "en",
+          countryLocale: "US",
+          languageLocale: "en-US",
+        });
+      });
+
+      it("should use partial match browser locale when exact match not available", () => {
+        global.window.navigator.language = "en-AU";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "en",
+          languageCode: "en",
+          countryLocale: "AU",
+          languageLocale: "en-AU",
+        });
+      });
+
+      it("should fallback to default language when browser locale not available at all", () => {
+        global.window.navigator.language = "de-DE";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "en",
+          languageCode: "en",
+          countryLocale: "",
+          languageLocale: "en",
+        });
+      });
+
+      it("should handle browser locale without country code (base language only)", () => {
+        global.window.navigator.language = "fr";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "fr",
+          languageCode: "fr",
+          countryLocale: "",
+          languageLocale: "fr",
+        });
+      });
+
+      it("should handle browser locale without country code when only regional variants available", () => {
+        mockGetAppData.mockReturnValue(
+          getMockAppData({ languages: ["en-US", "en-GB", "fr-FR", "fr-CA"] })
+        );
+
+        jest.resetModules();
+        QuickBrickModule = require("../index");
+
+        global.window.navigator.language = "fr";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "fr-FR",
+          languageCode: "fr",
+          countryLocale: "",
+          languageLocale: "fr",
+        });
+      });
+    });
+
+    describe("edge cases", () => {
+      beforeEach(() => {
+        window.localStorage.getItem.mockReturnValue(null);
+      });
+
+      it("should fallback to locale when browser language is undefined", () => {
+        global.window.navigator.language = undefined;
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "en",
+          languageCode: "en",
+          countryLocale: "",
+          languageLocale: "en",
+        });
+      });
+
+      it("should prefer exact match over partial match when both are available", () => {
+        mockGetAppData.mockReturnValue(
+          getMockAppData({ languages: ["en", "en-US", "en-GB", "fr"] })
+        );
+
+        jest.resetModules();
+        QuickBrickModule = require("../index");
+
+        global.window.navigator.language = "en-GB";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "en-GB",
+          languageCode: "en",
+          countryLocale: "GB",
+          languageLocale: "en-GB",
+        });
+      });
+
+      it("should use first partial match when multiple base languages could match", () => {
+        mockGetAppData.mockReturnValue(
+          getMockAppData({ languages: ["en-US", "en-GB", "fr-FR", "fr-CA"] })
+        );
+
+        jest.resetModules();
+        QuickBrickModule = require("../index");
+
+        global.window.navigator.language = "en-AU";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "en-US",
+          languageCode: "en",
+          countryLocale: "AU",
+          languageLocale: "en-AU",
+        });
+      });
+
+      it("should handle complex regional variants like zh-Hans-CN", () => {
+        mockGetAppData.mockReturnValue(
+          getMockAppData({ languages: ["en", "zh-CN", "zh-TW"] })
+        );
+
+        jest.resetModules();
+        QuickBrickModule = require("../index");
+
+        global.window.navigator.language = "zh-CN";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "zh-CN",
+          languageCode: "zh",
+          countryLocale: "CN",
+          languageLocale: "zh-CN",
+        });
+      });
+
+      it("should fallback to first language when supported languages list is populated but browser locale cannot be parsed", () => {
+        mockGetAppData.mockReturnValue(
+          getMockAppData({ languages: ["ar", "he", "fa"] })
+        );
+
+        jest.resetModules();
+        QuickBrickModule = require("../index");
+
+        global.window.navigator.language = "en-US";
+
+        const result = QuickBrickModule.getMatchingLanguageFromBuildData();
+
+        expect(result).toEqual({
+          uiLanguage: "ar",
+          languageCode: "ar",
+          countryLocale: "",
+          languageLocale: "ar",
+        });
+      });
+    });
   });
 
   describe("setAppLanguage", () => {

package/Polyfills/QuickBrickCommunicationModule/index.js

@@ -13,6 +13,27 @@ const { log_error, log_debug, log_warning } = createLogger({
 
 const QuickBrickEventEmitter = {};
 
+const getUserSelectedLanguage = () => {
+  const userSelectedLanguage = window.localStorage.getItem(
+    "applicaster.v2_::_uiLanguage"
+  );
+
+  if (
+    userSelectedLanguage === "null" ||
+    userSelectedLanguage === "undefined" ||
+    userSelectedLanguage === ""
+  ) {
+    log_warning(
+      "Invalid user selected language found in localStorage:",
+      userSelectedLanguage
+    );
+
+    return null;
+  }
+
+  return userSelectedLanguage;
+};
+
 export const QuickBrickEvents = (function (eventEmitter) {
   let listeners = [];
 
@@ -122,9 +143,12 @@ export const getMatchingLanguageFromBuildData = () => {
   const browserLocale = getBrowserLocale();
 
   if (!Array.isArray(languages)) {
-    log_error("Missing required 'languages' from the build time data.", {
-      buildTimeData,
-    });
+    log_error(
+      "Missing required 'languages' in build time data; using locale as UI language.",
+      {
+        buildTimeData,
+      }
+    );
 
     return {
       uiLanguage: locale,
@@ -134,9 +158,7 @@ export const getMatchingLanguageFromBuildData = () => {
     };
   }
 
-  const userSelectedLanguage = window.localStorage.getItem(
-    "applicaster.v2_::_uiLanguage"
-  );
+  const userSelectedLanguage = getUserSelectedLanguage();
 
   if (userSelectedLanguage) {
     if (languages.find((lang) => lang === userSelectedLanguage)) {
@@ -152,7 +174,6 @@ export const getMatchingLanguageFromBuildData = () => {
 
     log_debug(
       "User selected language is not present in available localizations, selecting language using browser or device locale",
-
       { userSelectedLanguage, languages }
     );
   }
@@ -172,21 +193,35 @@ export const getMatchingLanguageFromBuildData = () => {
   }
 
   // Exact match
-  const [browserLanguageCode, browserCountryLocale] = browserLocale.split("-");
+  const [browserBaseLanguage, browserCountryLocale] = browserLocale.split("-");
   const browserLocaleMatch = languages.find((lang) => lang === browserLocale);
 
   if (browserLocaleMatch) {
     return {
       uiLanguage: browserLocaleMatch,
-      languageCode: browserLanguageCode,
+      languageCode: browserBaseLanguage,
       countryLocale: browserCountryLocale || "",
       languageLocale: browserLocaleMatch,
     };
   }
 
+  // Partial match: try to match the base language (e.g., "fr" from "fr-CA")
+  const partialMatch = languages.find((language) =>
+    language.startsWith(browserBaseLanguage)
+  );
+
+  if (partialMatch) {
+    return {
+      uiLanguage: partialMatch,
+      languageCode: browserBaseLanguage,
+      countryLocale: browserCountryLocale || "",
+      languageLocale: browserLocale,
+    };
+  }
+
   // If there is no user-selected language, or the user-selected language is not found in the list of supported languages,
   // and the browser locale is also not found in the list of supported languages,
-  // then fallback to the default language from the list of supported languages, while preserving the country locale from the browser.
+  // then fallback to the first (default) language from the list of supported languages.
   const defaultLanguage = languages[0];
 
   if (defaultLanguage) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-dom-app",
-  "version": "14.0.9-rc.0",
+  "version": "14.0.9",
   "description": "Zapp App Component for Applicaster's Quick Brick React Native App",
   "main": "index.js",
   "scripts": {
@@ -22,11 +22,11 @@
   },
   "homepage": "https://github.com/applicaster/zapp-react-dom-app#readme",
   "dependencies": {
-    "@applicaster/zapp-react-dom-ui-components": "14.0.9-rc.0",
-    "@applicaster/zapp-react-native-bridge": "14.0.9-rc.0",
-    "@applicaster/zapp-react-native-redux": "14.0.9-rc.0",
-    "@applicaster/zapp-react-native-ui-components": "14.0.9-rc.0",
-    "@applicaster/zapp-react-native-utils": "14.0.9-rc.0",
+    "@applicaster/zapp-react-dom-ui-components": "14.0.9",
+    "@applicaster/zapp-react-native-bridge": "14.0.9",
+    "@applicaster/zapp-react-native-redux": "14.0.9",
+    "@applicaster/zapp-react-native-ui-components": "14.0.9",
+    "@applicaster/zapp-react-native-utils": "14.0.9",
     "abortcontroller-polyfill": "^1.7.5",
     "typeface-montserrat": "^0.0.54",
     "video.js": "7.14.3",