@applicaster/zapp-react-dom-app 16.0.0-rc.1 → 16.0.0-rc.11

package/App/InteractionManager/hoc/__tests__/withBacktoTopActionHOC.test.tsx

@@ -8,12 +8,12 @@ import {
   useCurrentScreenIsHome,
   useCurrentScreenIsRoot,
   useCurrentScreenIsTabs,
-  useIsStandaloneFullscreen,
 } from "../hooks";
 
 import {
   useCurrentScreenIsHook,
   useCurrentScreenIsStartupHook,
+  useIsStandaloneFullscreen,
 } from "@applicaster/zapp-react-native-utils/reactHooks/screen";
 
 jest.mock("@applicaster/zapp-react-native-utils/appUtils", () => ({
@@ -64,14 +64,14 @@ describe("withBackToTopActionHOC - backToTopAction", () => {
     });
   });
 
-  it("returns PLATFORM_BACK for startup hook", () => {
+  it("returns PLATFORM_TO_BACKGROUND for startup hook", () => {
     expect.assertions(1);
 
     (useCurrentScreenIsStartupHook as jest.Mock).mockReturnValue(true);
 
     render(<Wrapped />);
 
-    expect(receivedProps.backToTopAction()).toBe("PLATFORM_BACK");
+    expect(receivedProps.backToTopAction()).toBe("PLATFORM_TO_BACKGROUND");
   });
 
   it("returns GO_BACK_FROM_HOOK when isHook", () => {
@@ -94,7 +94,7 @@ describe("withBackToTopActionHOC - backToTopAction", () => {
     expect(receivedProps.backToTopAction()).toBe("GO_HOME");
   });
 
-  it("returns PLATFORM_BACK when root + menu focus + home", () => {
+  it("returns PLATFORM_TO_BACKGROUND when root + menu focus + home", () => {
     expect.assertions(1);
 
     (useCurrentScreenIsRoot as jest.Mock).mockReturnValue(true);
@@ -106,7 +106,7 @@ describe("withBackToTopActionHOC - backToTopAction", () => {
 
     render(<Wrapped />);
 
-    expect(receivedProps.backToTopAction()).toBe("PLATFORM_BACK");
+    expect(receivedProps.backToTopAction()).toBe("PLATFORM_TO_BACKGROUND");
   });
 
   it("returns GO_HOME when root + menu focus + NOT home", () => {

package/App/InteractionManager/hoc/hooks/index.ts

@@ -4,7 +4,6 @@ import {
   useRivers,
 } from "@applicaster/zapp-react-native-utils/reactHooks/state";
 import { last } from "@applicaster/zapp-react-native-utils/utils";
-import { toBooleanWithDefaultFalse } from "@applicaster/zapp-react-native-utils/booleanUtils";
 
 export const useCurrentScreenIsHome = (): boolean => {
   const navigator = useNavigation();
@@ -33,12 +32,3 @@ export const useCurrentScreenIsTabs = (): boolean => {
 
   return river?.type === "tabs_screen";
 };
-
-export const useIsStandaloneFullscreen = (): boolean => {
-  const navigator = useNavigation();
-
-  return toBooleanWithDefaultFalse(
-    !navigator?.canGoBack() &&
-      navigator?.screenData?.general?.allow_screen_plugin_presentation
-  );
-};

package/App/InteractionManager/hoc/withBackToTopAction.tsx

@@ -8,12 +8,12 @@ import {
   useCurrentScreenIsHome,
   useCurrentScreenIsRoot,
   useCurrentScreenIsTabs,
-  useIsStandaloneFullscreen,
 } from "./hooks";
 
 import {
   useCurrentScreenIsHook,
   useCurrentScreenIsStartupHook,
+  useIsStandaloneFullscreen,
 } from "@applicaster/zapp-react-native-utils/reactHooks/screen";
 
 export function withBackToTopActionHOC(Component) {
@@ -38,20 +38,20 @@ export function withBackToTopActionHOC(Component) {
 
     const backToTopAction = React.useCallback((): BackToTopAction => {
       if (isStartUpHook) {
-        return "PLATFORM_BACK";
+        return "PLATFORM_TO_BACKGROUND";
       }
 
       if (isHook) {
         return "GO_BACK_FROM_HOOK";
       }
 
-      // Handling case where is not top menu visible
+      // Handle the case where the top menu is not visible
       if (isStandaloneFullscreen) {
         return "GO_HOME";
       }
 
       if (isRoot && focusManager.isFocusOnMenu() && isHome) {
-        return "PLATFORM_BACK";
+        return "PLATFORM_TO_BACKGROUND";
       }
 
       if (isRoot && focusManager.isFocusOnMenu() && !isHome) {

package/App/InteractionManager/index.tsx

@@ -3,11 +3,6 @@ import * as R from "ramda";
 
 import { connectToStore } from "@applicaster/zapp-react-native-redux/utils/connectToStore";
 
-import {
-  QUICK_BRICK_EVENTS,
-  sendQuickBrickEvent,
-} from "@applicaster/zapp-react-native-bridge/QuickBrick";
-
 import { toBooleanWithDefaultFalse } from "@applicaster/zapp-react-native-utils/booleanUtils";
 
 import {
@@ -50,6 +45,8 @@ import {
   isVizioPlatform,
 } from "@applicaster/zapp-react-native-utils/reactUtils";
 
+import { platformToBackground as sendAppToBackground } from "@applicaster/zapp-react-native-utils/appUtils/platform";
+
 import { OnScreenKeyboard } from "@applicaster/zapp-react-dom-ui-components/Components/OnScreenKeyboard";
 import { KeyboardLongPressManager } from "@applicaster/zapp-react-dom-ui-components/Utils/KeyboardLongPressManager";
 import { KeyInputHandler } from "@applicaster/zapp-react-native-utils/appUtils/keyInputHandler/KeyInputHandler";
@@ -242,7 +239,7 @@ class InteractionManagerClass extends React.Component<Props, State> {
   performExit() {
     if (isSamsungPlatform()) {
       this.onConfirmDialogClose();
-      sendQuickBrickEvent(QUICK_BRICK_EVENTS.MOVE_APP_TO_BACKGROUND);
+      sendAppToBackground();
     }
 
     if (isLgPlatform()) {
@@ -256,7 +253,7 @@ class InteractionManagerClass extends React.Component<Props, State> {
   }
 
   handleWebOsBack() {
-    const systemBack = globalAny?.webOS?.platformBack;
+    const systemBack = globalAny?.webOS?.platformToBackground;
 
     if (systemBack) {
       systemBack();
@@ -277,7 +274,7 @@ class InteractionManagerClass extends React.Component<Props, State> {
    * WebOS behavior depends on the SDK version, WebOS 4 would pull up the launcher menu
    * following versions would show a native exit prompt
    */
-  platformBack() {
+  platformToBackground() {
     try {
       // TODO: temporary hack until this code is refactored
       if (isSamsungPlatform() || isVizioPlatform()) {
@@ -294,9 +291,11 @@ class InteractionManagerClass extends React.Component<Props, State> {
         }
       } else if (isLgPlatform()) {
         this.handleWebOsBack();
+      } else {
+        sendAppToBackground();
       }
     } catch (e) {
-      log_warning("Failed to execute platformBack", e);
+      log_warning("Failed to execute platformToBackground", e);
     }
   }
 
@@ -425,10 +424,10 @@ class InteractionManagerClass extends React.Component<Props, State> {
 
     switch (displayState) {
       case DISPLAY_STATES.DEFAULT:
-        if (action === "PLATFORM_BACK") {
+        if (action === "PLATFORM_TO_BACKGROUND") {
           log_info(action);
 
-          this.platformBack();
+          this.platformToBackground();
         }
 
         if (action === "GO_HOME") {
@@ -477,11 +476,11 @@ class InteractionManagerClass extends React.Component<Props, State> {
         } else if (navigator.canGoBack()) {
           navigator.goBack();
         } else if (this.isHomeScreen()) {
-          this.platformBack();
+          this.platformToBackground();
         } else if (navigator.currentRoute.includes("hook")) {
           // If code reaches this block navigator cant go back, it is not home,
           // and this is a login plugin that was pushed on top of the home
-          // Treat it like a home screen and run platformBack()
+          // Treat it like a home screen and run platformToBackground()
           const entryData = navigator?.data?.entry;
           const isHookInHomescreen = entryData?.payload?.home;
 
@@ -491,7 +490,7 @@ class InteractionManagerClass extends React.Component<Props, State> {
               : entryData?.hookPlugin?.module?.isFlowBlocker;
 
           if (isHookInHomescreen && isHookFlowBlocker) {
-            this.platformBack();
+            this.platformToBackground();
           } else {
             navigator.goBack(false, true);
           }
@@ -640,7 +639,7 @@ class InteractionManagerClass extends React.Component<Props, State> {
         return;
       }
 
-      this.platformBack();
+      this.platformToBackground();
     }
 
     if (keyCode(event).matchesAny(...ARROW_KEYS)) {

package/App/Layout/index.tsx

@@ -1,7 +1,8 @@
 import * as React from "react";
 import { createPortal } from "react-dom";
 
-import { Background } from "@applicaster/zapp-react-dom-ui-components/Components/Background";
+import { BackgroundImage } from "@applicaster/zapp-react-native-ui-components/Components/BackgroundImage";
+
 import { ConfirmDialog } from "@applicaster/zapp-react-dom-ui-components/Components/ConfirmDialog";
 import { NavWrapper } from "@applicaster/zapp-react-dom-ui-components/Components/NavWrapper";
 import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks/navigation";
@@ -25,7 +26,7 @@ export function Layout({ children }: Props) {
   return (
     <>
       <LayoutComponent
-        Components={{ Background, NavBar: NavWrapper }}
+        Components={{ Background: BackgroundImage, NavBar: NavWrapper }}
         ComponentsExtraProps={ComponentsExtraProps}
       >
         {children}

package/Polyfills/Storage/__tests__/contextResolverBridge.test.js

@@ -0,0 +1,104 @@
+import { getContextResolverBridge } from "../";
+
+function createStorageMock(initial = {}) {
+  const data = { ...initial };
+
+  return {
+    getItem: (key) => (key in data ? data[key] : null),
+    setItem: (key, value) => {
+      data[key] = value;
+    },
+  };
+}
+
+describe("ContextResolverBridge polyfill", () => {
+  let bridge;
+
+  beforeEach(() => {
+    global.window = {
+      sessionStorage: createStorageMock(),
+      localStorage: createStorageMock(),
+    };
+
+    bridge = getContextResolverBridge();
+  });
+
+  it("resolves a key from session storage using the web namespace separator", () => {
+    // the namespace itself contains dots, so the key must be split on the last dot
+    window.sessionStorage.setItem("applicaster.v2_::_appVersion", "1.0.0");
+
+    const result = bridge.resolveContextKeys({
+      "applicaster.v2.appVersion": false,
+    });
+
+    expect(result).toEqual({ "applicaster.v2.appVersion": "1.0.0" });
+  });
+
+  it("falls back to local storage when the key is missing in session storage", () => {
+    window.localStorage.setItem("applicaster.v2_::_appVersion", "1.0.0");
+
+    const result = bridge.resolveContextKeys({
+      "applicaster.v2.appVersion": false,
+    });
+
+    expect(result).toEqual({ "applicaster.v2.appVersion": "1.0.0" });
+  });
+
+  it("prefers the session storage value when the key exists in both", () => {
+    window.sessionStorage.setItem("applicaster.v2_::_appVersion", "session");
+    window.localStorage.setItem("applicaster.v2_::_appVersion", "local");
+
+    const result = bridge.resolveContextKeys({
+      "applicaster.v2.appVersion": false,
+    });
+
+    expect(result).toEqual({ "applicaster.v2.appVersion": "session" });
+  });
+
+  it("returns null for keys that are missing from both storages", () => {
+    const result = bridge.resolveContextKeys({
+      "applicaster.v2.missing": false,
+    });
+
+    expect(result).toEqual({ "applicaster.v2.missing": null });
+  });
+
+  it("JSON-parses stored values just like the async storage path", () => {
+    window.sessionStorage.setItem(
+      "applicaster.v2_::_profile",
+      JSON.stringify({ name: "Ada" })
+    );
+
+    window.localStorage.setItem("applicaster.v2_::_count", "42");
+
+    const result = bridge.resolveContextKeys({
+      "applicaster.v2.profile": false,
+      "applicaster.v2.count": true,
+    });
+
+    expect(result).toEqual({
+      "applicaster.v2.profile": { name: "Ada" },
+      "applicaster.v2.count": 42,
+    });
+  });
+
+  it("resolves multiple keys synchronously in a single call", () => {
+    window.sessionStorage.setItem("applicaster.v2_::_a", "valueA");
+    window.localStorage.setItem("applicaster.v2_::_b", "valueB");
+
+    const result = bridge.resolveContextKeys({
+      "applicaster.v2.a": false,
+      "applicaster.v2.b": false,
+      "applicaster.v2.c": false,
+    });
+
+    // returned object is not a promise - reads happen synchronously
+    expect(result).not.toBeInstanceOf(Promise);
+
+    expect(result).toEqual({
+      "applicaster.v2.a": "valueA",
+      "applicaster.v2.b": "valueB",
+      "applicaster.v2.c": null,
+    });
+  });
+});

package/Polyfills/Storage/index.js

@@ -200,3 +200,74 @@ export function getStorageModule(type) {
     removeItem,
   };
 }
+
+const STORAGE_READ_ORDER = ["sessionStorage", "localStorage"];
+
+/**
+ * Splits a normalized context key ("<namespace>.<key>") back into its
+ * namespace and key parts. Mirrors getNamespaceAndKey in the context keys
+ * manager: the key is everything after the last dot, since the namespace
+ * itself may contain dots (e.g. "applicaster.v2").
+ * @param {String} namespacedKey
+ * @returns {{ namespace: String, key: String }}
+ */
+function splitNamespacedKey(namespacedKey) {
+  const lastDotIndex = namespacedKey.lastIndexOf(".");
+
+  if (lastDotIndex === -1) {
+    return { namespace: DEFAULT_NAMESPACE, key: namespacedKey };
+  }
+
+  return {
+    namespace: namespacedKey.slice(0, lastDotIndex),
+    key: namespacedKey.slice(lastDotIndex + 1),
+  };
+}
+
+/**
+ * Synchronously reads a single context key from session storage, then local
+ * storage (matching the native ContextResolverBridge resolution order), and
+ * returns the parsed value, or null when the key is absent from both.
+ * @param {String} namespacedKey
+ * @returns {Any|null}
+ */
+function resolveContextKey(namespacedKey) {
+  const { namespace, key } = splitNamespacedKey(namespacedKey);
+  const storageKey = applyNamespaceToKeyName(key, namespace);
+
+  for (const type of STORAGE_READ_ORDER) {
+    const storage = window[type];
+    const value = storage ? storage.getItem(storageKey) : null;
+
+    if (value != null) {
+      return parseJsonIfNeeded(value);
+    }
+  }
+
+  return null;
+}
+
+/**
+ * Web polyfill for the native NativeModules.ContextResolverBridge module.
+ * Unlike the per-key async storage path, it resolves every requested key in a
+ * single synchronous pass over window.sessionStorage / window.localStorage.
+ * @returns {Object} bridge
+ * @returns {Function} bridge.resolveContextKeys: resolves a batch of keys
+ */
+export function getContextResolverBridge() {
+  return {
+    /**
+     * @param {Object} keys map of normalized key -> required flag
+     * @returns {Object} map of normalized key -> resolved value (or null)
+     */
+    resolveContextKeys(keys) {
+      const result = {};
+
+      for (const namespacedKey of Object.keys(keys || {})) {
+        result[namespacedKey] = resolveContextKey(namespacedKey);
+      }
+
+      return result;
+    },
+  };
+}

package/Polyfills/index.js

@@ -1,4 +1,4 @@
-import { getStorageModule } from "./Storage";
+import { getStorageModule, getContextResolverBridge } from "./Storage";
 import { DeviceEventEmitter } from "./DeviceEventEmitter";
 import { isSamsungPlatform, isLgPlatform } from "../App/Loader/utils/platform";
 
@@ -23,6 +23,7 @@ const PLATFORM_KEYS = {
 export function registerNativeModulesPolyfills(NativeModules) {
   NativeModules.LocalStorage = getStorageModule("localStorage");
   NativeModules.SessionStorage = getStorageModule("sessionStorage");
+  NativeModules.ContextResolverBridge = getContextResolverBridge();
   NativeModules.AnalyticsBridge = require("./AnalyticsBridge").AnalyticsBridge;
   NativeModules.AppLoaderBridge = require("./AppLoaderBridge").AppLoaderBridge;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-dom-app",
-  "version": "16.0.0-rc.1",
+  "version": "16.0.0-rc.11",
   "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": "16.0.0-rc.1",
-    "@applicaster/zapp-react-native-bridge": "16.0.0-rc.1",
-    "@applicaster/zapp-react-native-redux": "16.0.0-rc.1",
-    "@applicaster/zapp-react-native-ui-components": "16.0.0-rc.1",
-    "@applicaster/zapp-react-native-utils": "16.0.0-rc.1",
+    "@applicaster/zapp-react-dom-ui-components": "16.0.0-rc.11",
+    "@applicaster/zapp-react-native-bridge": "16.0.0-rc.11",
+    "@applicaster/zapp-react-native-redux": "16.0.0-rc.11",
+    "@applicaster/zapp-react-native-ui-components": "16.0.0-rc.11",
+    "@applicaster/zapp-react-native-utils": "16.0.0-rc.11",
     "abortcontroller-polyfill": "^1.7.5",
     "typeface-montserrat": "^0.0.54",
     "video.js": "7.14.3",