@applicaster/quick-brick-core 15.1.4 → 16.0.0-alpha.1042942411

package/App/ActionSetters/index.ts

@@ -21,7 +21,8 @@ const warnUndefinedContext = (context) =>
   });
 
 type Subscription = {
-  [x: string]: () => any;
+  [x: string]: (() => any) | string;
+  pluginId?: string;
 };
 
 const getModuleContext = R.path(["module", "context"]);
@@ -29,7 +30,7 @@ const getModuleContext = R.path(["module", "context"]);
 const getContexts = R.compose(
   R.map((action) => {
     const item = getModuleContext(action);
-    item["pluginId"] = action.name;
+    item.pluginId = action.name;
 
     return item;
   }),
@@ -46,10 +47,10 @@ const useSubscribeToActionProviders = () => {
   }, [actionContext]);
 
   const subscriptions = getContexts(actionContext.actions).map((context) => {
-    const subscription = React.useContext<{}>(context);
+    const subscription = React.useContext<Subscription>(context);
 
     if (subscription) {
-      subscription["pluginId"] = context.pluginId;
+      subscription.pluginId = context.pluginId;
 
       return subscription;
     } else {

package/App/ActionsProvider/ActionsProvider.tsx

@@ -3,6 +3,14 @@ import * as R from "ramda";
 
 import { ActionsContext } from "@applicaster/zapp-react-native-ui-components/Contexts/ActionsContext";
 import { isNilOrEmpty } from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
+import { createLogger } from "@applicaster/zapp-react-native-utils/logger";
+
+import { LegacyActionsRegistryAdapter } from "./LegacyActionsRegistryAdapter";
+
+const { log_debug } = createLogger({
+  subsystem: "ActionsProvider",
+  category: "ActionRegistration",
+});
 
 type Props = {
   children: React.ReactNode;
@@ -36,19 +44,17 @@ const abstractIdentifier = (actionPlugins: Plugin[]): PluginsIdMap =>
  * Component returning children.
  * Can be used to create Component from children
  */
-const ChildrenWrapper = ({
-  children,
-}: {
-  children: React.ReactElement<any>;
-}) => {
-  return children;
+const ChildrenWrapper = ({ children }: { children: React.ReactNode }) => {
+  return <>{children}</>;
 };
 
 /**
  * It wraps children in multiple context providers
  * @param contexts - Array of React Context Providers
  */
-const contextComposer = (contexts: Plugin[]): React.ExoticComponent =>
+const contextComposer = (
+  contexts: Plugin[]
+): React.ComponentType<React.PropsWithChildren> =>
   R.compose(...contexts)(ChildrenWrapper);
 
 /**
@@ -69,6 +75,19 @@ export function ActionsProvider(props: Props) {
     [plugins]
   );
 
+  React.useEffect(() => {
+    const count = Object.keys(actionPlugins).length;
+
+    if (count > 0) {
+      log_debug(
+        `ActionsProvider: composed ${count} action plugin(s) into context`,
+        { identifiers: Object.keys(actionPlugins) }
+      );
+    } else {
+      log_debug("ActionsProvider: no action plugins to compose");
+    }
+  }, [actionPlugins]);
+
   const contextProviders = React.useMemo((): [Plugin] | [] => {
     try {
       const providers = R.compose(
@@ -88,7 +107,7 @@ export function ActionsProvider(props: Props) {
         ? contextComposer(contextProviders)
         : React.Fragment,
     []
-  );
+  ) as React.ComponentType<React.PropsWithChildren>;
 
   const contextValue = React.useMemo(
     () => ({ actions: actionPlugins }),
@@ -97,7 +116,10 @@ export function ActionsProvider(props: Props) {
 
   return (
     <ActionsContext.Provider value={contextValue}>
-      <Context>{children}</Context>
+      <Context>
+        <LegacyActionsRegistryAdapter actionPlugins={actionPlugins} />
+        {children}
+      </Context>
     </ActionsContext.Provider>
   );
 }

package/App/ActionsProvider/LegacyActionsRegistryAdapter.tsx

@@ -0,0 +1,107 @@
+import * as React from "react";
+import * as R from "ramda";
+
+import { uiActionsRegistry } from "@applicaster/zapp-react-native-utils/uiActionsRegistrator";
+import { createLogger } from "@applicaster/zapp-react-native-utils/logger";
+
+const { log_debug, log_warning } = createLogger({
+  subsystem: "LegacyActionsRegistryAdapter",
+  category: "ActionRegistration",
+});
+
+type LegacyActionPlugin = Record<string, any> & {
+  identifier: string;
+  module: {
+    context?: React.Context<any>;
+    [key: string]: any;
+  };
+};
+
+/**
+ * Bridges a single legacy action plugin (one that exposes `module.context`)
+ * into the `uiActionsRegistry`.
+ *
+ * Reactivity note: legacy stateful actions rely on React Context re-renders to
+ * propagate their latest value to subscribed UI (via `useActions`). We keep
+ * that mechanism intact and only *mirror* the current value into the registry
+ * through a ref, so registry-based consumers always read the freshest value at
+ * call time without changing legacy reactivity.
+ */
+function LegacyActionBridge({ plugin }: { plugin: LegacyActionPlugin }) {
+  // `plugin.module.context` is stable for the lifetime of the plugin, so this
+  // single `useContext` call is safe and rules-of-hooks compliant.
+  const value = React.useContext(plugin.module.context as React.Context<any>);
+
+  const valueRef = React.useRef(value);
+  valueRef.current = value;
+
+  React.useEffect(() => {
+    if (value == null) {
+      log_warning(
+        `LegacyActionBridge: context value for "${plugin.identifier}" is null/undefined – skipping registration`,
+        { identifier: plugin.identifier }
+      );
+    } else {
+      log_debug(
+        `LegacyActionBridge: context value ready for "${plugin.identifier}", registering in UIActionsRegistry`,
+        { identifier: plugin.identifier }
+      );
+    }
+
+    const unregister = uiActionsRegistry.registerActionProvider(
+      plugin.identifier,
+      () =>
+        valueRef.current
+          ? [{ identifier: plugin.identifier, action: valueRef.current }]
+          : []
+    );
+
+    return () => {
+      log_debug(
+        `LegacyActionBridge: unmounting bridge for "${plugin.identifier}"`,
+        { identifier: plugin.identifier }
+      );
+
+      unregister();
+    };
+  }, [plugin.identifier]);
+
+  return null;
+}
+
+type Props = {
+  actionPlugins: Record<string, LegacyActionPlugin>;
+};
+
+/**
+ * Registers every legacy action plugin's live context value into the
+ * `uiActionsRegistry`. It must be rendered *inside* the composed context
+ * providers (see `ActionsProvider`) so that each plugin's context is populated.
+ *
+ * This is the compatibility layer that lets new, registry-based consumers read
+ * actions coming from old plugins that still export `contextProvider`/`context`.
+ */
+export function LegacyActionsRegistryAdapter({ actionPlugins }: Props) {
+  const bridgedPlugins = React.useMemo(
+    () =>
+      R.values(actionPlugins).filter(
+        (plugin) => plugin?.module?.context != null
+      ),
+    [actionPlugins]
+  );
+
+  log_debug(
+    `LegacyActionsRegistryAdapter: bridging ${bridgedPlugins.length} legacy action plugin(s)`,
+    { identifiers: bridgedPlugins.map((p) => p.identifier) }
+  );
+
+  return (
+    <>
+      {bridgedPlugins.map((plugin) => (
+        <LegacyActionBridge key={plugin.identifier} plugin={plugin} />
+      ))}
+    </>
+  );
+}
+
+LegacyActionsRegistryAdapter.displayName = "LegacyActionsRegistryAdapter";

package/App/DeepLinking/URLSchemeHandler/SchemeHandlerHooks/__tests__/useOpenSchemeHandler.test.tsx

@@ -1,14 +1,13 @@
 /* eslint-disable max-len */
-import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
 import * as feedLoader from "@applicaster/zapp-react-native-utils/reactHooks/feed/useFeedLoader";
 import * as useNavigationHooks from "@applicaster/zapp-react-native-utils/reactHooks/navigation/useNavigation";
 import { waitFor, cleanup, renderHook } from "@testing-library/react-native";
 import nock from "nock";
-import * as R from "ramda";
 import React from "react";
-import { Provider } from "react-redux";
-import configureStore from "redux-mock-store";
+import { mergeDeepRight } from "ramda";
 import * as helpers from "../../../helpers";
+import { WrappedWithProviders } from "@applicaster/zapp-react-native-utils/testUtils";
+
 import {
   noTargetScreenError,
   resolveError,
@@ -24,6 +23,7 @@ const rivers: Record<string, Partial<ZappRiver>> = {
     home: true,
   },
   B0987: {
+    type: "any",
     id: "B0987",
   },
   C5678: {
@@ -42,7 +42,7 @@ const contentTypes: ZappContentTypes = {
 const endpoint = "http://feed.com";
 
 const pipesEndpoints: ZappPipesEndpoints = {
-  [`${endpoint}`]: {
+  [endpoint]: {
     context_keys: [],
     context_obj: [],
   },
@@ -55,7 +55,6 @@ const navigator = {
   goHome: jest.fn(),
 } as any;
 
-const mockStore = configureStore();
 jest.spyOn(useNavigationHooks, "useNavigation").mockReturnValue(navigator);
 
 const helperSpy = jest.spyOn(helpers, "handlePresentNavigation");
@@ -80,31 +79,17 @@ jest.mock("../../../logger", () => ({
 // to use import instead of require it's required to use jest.mock above
 const { useOpenSchemeHandler } = require("../useOpenSchemeHandler");
 
-const getWrapper = (storeProps = {}) => {
-  const store = mockStore(
-    R.mergeDeepRight(
-      { rivers, contentTypes, pipesEndpoints, appData },
-      storeProps
-    )
-  );
-
-  appStore.set(store);
-
-  const Wrapper = ({ children }: { children: React.ReactChild }) => (
-    /* @ts-ignore */
-    <Provider store={store}>{children}</Provider>
-  );
-
-  return Wrapper;
-};
-
-const testHook = async ({ url, query, storeProps = {}, tests }) => {
-  const wrapper = getWrapper(storeProps);
+const mockStoreObj = { rivers, contentTypes, pipesEndpoints, appData };
 
+const testHook = async ({ url, query, storeProps = {}, tests }: any) => {
   const callback = jest.fn((fn) => fn(tests));
 
   renderHook(() => useOpenSchemeHandler({ url, query, onFinish: callback }), {
-    wrapper,
+    wrapper: ({ children }) => (
+      <WrappedWithProviders store={mergeDeepRight(mockStoreObj, storeProps)}>
+        {children}
+      </WrappedWithProviders>
+    ),
   });
 
   await waitFor(() => expect(callback).toHaveBeenCalled());

package/App/DeepLinking/URLSchemeHandler/SchemeHandlerHooks/__tests__/useUrlSchemeHandler.test.tsx

@@ -1,11 +1,35 @@
 import * as React from "react";
-import { renderHook } from "@testing-library/react-hooks";
+import { renderHook } from "@testing-library/react-native";
 import * as URLHandlersMap from "..";
 
 import { Provider } from "react-redux";
 import configureStore from "redux-mock-store";
 
 import { log_warning } from "../../../logger";
+import { handleActionSchemeUrl } from "../useUrlSchemeHandler";
+import { appStore } from "../../../../../../zapp-react-native-redux/AppStore";
+
+type UrlSchemeHandlerArgs = {
+  query: Record<string, unknown>;
+  url: string;
+  onFinish?: (callback: () => void) => void;
+};
+
+type PluginType = "general" | "player";
+
+interface ZappPlugin {
+  urlScheme?: {
+    host: string;
+    handler: (args: UrlSchemeHandlerArgs) => void;
+  };
+}
+
+interface QuickBrickPlugin {
+  module: ZappPlugin;
+  name: string;
+  identifier: string;
+  type: PluginType;
+}
 
 const mockStore = configureStore();
 
@@ -14,153 +38,222 @@ jest.mock("../../../logger", () => ({
   log_warning: jest.fn(),
 }));
 
-const lambdaPlugin = {
-  module: jest.fn() as ZappPlugin,
+const mockHandler = jest.fn(({ onFinish }) => {
+  onFinish?.(() => {});
+});
+
+const mockComplexHandler = jest.fn(({ onFinish }) => {
+  onFinish?.(() => {});
+});
+
+const lambdaPlugin: QuickBrickPlugin = {
+  module: {} as ZappPlugin,
   name: "Lambda plugin",
   identifier: "someplugin",
-  type: "general" as PluginType,
+  type: "general",
 };
 
-const pluginWithHandler = {
+const pluginWithHandler: QuickBrickPlugin = {
   name: "Plugin handling scheme",
   identifier: "plugin-with-handler",
-  type: "general" as PluginType,
+  type: "general",
   module: {
     urlScheme: {
       host: "foo",
-      handler: jest.fn(({ onFinish }) => {
-        onFinish(() => {});
-      }),
+      handler: mockHandler,
+    },
+  },
+};
+
+const pluginWithComplexHandler: QuickBrickPlugin = {
+  name: "Plugin with nested handler",
+  identifier: "plugin-with-nested-handler",
+  type: "general",
+  module: {
+    urlScheme: {
+      host: "complex",
+      handler: mockComplexHandler,
     },
-  } as ZappPlugin,
+  },
 };
 
-const plugins: QuickBrickPlugin[] = [lambdaPlugin, pluginWithHandler];
+const plugins = [lambdaPlugin, pluginWithHandler, pluginWithComplexHandler];
 
 const { useUrlSchemeHandler } = require("../useUrlSchemeHandler");
 
 describe("useUrlSchemeHandler", () => {
-  // beforeEach(() => {
-  //   log_warning.mockClear();
-  // });
+  const store = mockStore({ plugins });
 
-  const store = mockStore({ test: "test", plugins });
+  appStore.set(store);
 
-  const wrapper: React.FC<any> = ({ children }) => (
+  const wrapper: React.FC = ({ children }) => (
     <Provider store={store}>{children}</Provider>
   );
 
-  it("calls correct urlScheme handler with query params", () => {
-    const presentSpy = jest.fn();
-    const onFinish = jest.fn();
-    const url = "test://present?foo=bar";
+  beforeEach(() => {
+    jest.clearAllMocks();
 
-    URLHandlersMap.schemeHandlerHooks.present = presentSpy;
-
-    renderHook(
-      () =>
-        useUrlSchemeHandler({
-          url,
-          onFinish,
-        }),
-      { wrapper }
-    );
-
-    expect(presentSpy).toBeCalledWith({ query: { foo: "bar" }, url, onFinish });
+    Object.keys(URLHandlersMap.schemeHandlerHooks).forEach((key) => {
+      delete (URLHandlersMap.schemeHandlerHooks as any)[key];
+    });
   });
 
-  it("not throws an error and calls onFinish if correct url scheme handler can not be found", () => {
-    const url = "test://nonExistingHost?foo=bar";
-
-    const onFinish = jest.fn((cb) => {
-      cb();
+  describe("Basic URL scheme handling", () => {
+    it("handles query params correctly", () => {
+      const testHandler = jest.fn();
+      (URLHandlersMap.schemeHandlerHooks as any).test = testHandler;
+      const testUrl = "test://test?foo=bar";
+
+      renderHook(
+        () =>
+          useUrlSchemeHandler({
+            url: testUrl,
+            onFinish: jest.fn(),
+          }),
+        { wrapper }
+      );
+
+      expect(testHandler).toBeCalledWith({
+        query: { foo: "bar" },
+        url: testUrl,
+        onFinish: expect.any(Function),
+      });
     });
 
-    renderHook(
-      () =>
-        useUrlSchemeHandler({
-          url,
-          onFinish,
-        }),
-      { wrapper }
-    );
+    it("handles missing scheme handlers gracefully", () => {
+      const testUrl = "test://unknown?foo=bar";
+      const finishCallback = jest.fn();
 
-    expect(onFinish).toBeCalled();
+      const onFinish = jest.fn((cb) => {
+        cb();
+        finishCallback();
+      });
 
-    expect(log_warning).toHaveBeenCalledWith(
-      `unable to resolve ${url}: Non of the installed plugins knows how to handle this urlScheme ${url}`
-    );
-  });
+      renderHook(
+        () =>
+          useUrlSchemeHandler({
+            url: testUrl,
+            onFinish,
+          }),
+        { wrapper }
+      );
 
-  it("calls onFinish when the handler does", () => {
-    const url = "test://present?foo=bar";
-    const onFinish = jest.fn();
+      expect(finishCallback).toBeCalled();
 
-    const presentSpy = jest.fn(() => {
-      onFinish();
+      expect(log_warning).toBeCalledWith(expect.stringContaining(testUrl));
     });
-
-    URLHandlersMap.schemeHandlerHooks.present = presentSpy;
-
-    renderHook(
-      () =>
-        useUrlSchemeHandler({
-          url,
-          onFinish,
-        }),
-      { wrapper }
-    );
-
-    expect(onFinish).toBeCalled();
   });
 
-  it("calls onFinish if handler returns an error", () => {
-    const url = "test://present?foo=bar";
-
-    const onFinish = jest.fn((cb) => {
-      cb();
+  describe("Plugin-based scheme handling", () => {
+    it("resolves and calls plugin handlers", () => {
+      const testUrl = "test://foo?param=test";
+      const onFinish = jest.fn();
+
+      renderHook(
+        () =>
+          useUrlSchemeHandler({
+            url: testUrl,
+            onFinish,
+          }),
+        { wrapper }
+      );
+
+      expect(mockHandler).toBeCalledWith({
+        query: { param: "test" },
+        url: testUrl,
+        onFinish,
+      });
     });
 
-    const presentSpy = jest.fn(() => {
-      throw new Error("error");
+    it("handles complex plugin configurations", () => {
+      const testUrl = "test://complex?param=nested";
+      const onFinish = jest.fn();
+
+      renderHook(
+        () =>
+          useUrlSchemeHandler({
+            url: testUrl,
+            onFinish,
+          }),
+        { wrapper }
+      );
+
+      expect(mockComplexHandler).toBeCalledWith({
+        query: { param: "nested" },
+        url: testUrl,
+        onFinish,
+      });
     });
 
-    URLHandlersMap.schemeHandlerHooks.present = presentSpy;
+    it("ignores plugins without urlScheme", () => {
+      const testUrl = "test://nonexistent?param=value";
+      const finishCallback = jest.fn();
+
+      const onFinish = jest.fn((cb) => {
+        cb();
+        finishCallback();
+      });
+
+      renderHook(
+        () =>
+          useUrlSchemeHandler({
+            url: testUrl,
+            onFinish,
+          }),
+        { wrapper }
+      );
+
+      expect(lambdaPlugin.module).not.toHaveProperty("urlScheme");
+      expect(finishCallback).toBeCalled();
+    });
+  });
 
-    renderHook(
-      () =>
-        useUrlSchemeHandler({
-          url,
-          onFinish,
-        }),
-      { wrapper }
-    );
+  describe("Action scheme handling", () => {
+    it("handles action schemes using plugins", () => {
+      const testUrl = "test://foo?action=test";
 
-    expect(onFinish).toBeCalled();
+      handleActionSchemeUrl({
+        url: testUrl,
+        plugins,
+      } as any);
 
-    expect(log_warning).toHaveBeenCalledWith(`unable to resolve ${url}: error`);
-  });
+      expect(mockHandler).toBeCalledWith({
+        query: { action: "test" },
+        url: testUrl,
+      });
+    });
 
-  it("finds the plugin for the host", () => {
-    const url = "scheme://foo?whatever=bar";
+    it("throws for unknown action schemes", () => {
+      const testUrl = "test://unknown?action=test";
 
-    const onFinish = jest.fn((cb) => {
-      cb();
+      expect(() => {
+        handleActionSchemeUrl({
+          url: testUrl,
+          plugins,
+        } as any);
+      }).toThrow(/Non of the installed plugins/);
     });
 
-    renderHook(
-      () => {
-        useUrlSchemeHandler({ url, onFinish });
-      },
-      { wrapper }
-    );
-
-    expect(pluginWithHandler.module.urlScheme.handler).toBeCalledWith({
-      url,
-      onFinish,
-      query: { whatever: "bar" },
+    it("handles malformed URLs gracefully", () => {
+      const testUrl = "invalid-url";
+      const finishCallback = jest.fn();
+
+      const onFinish = jest.fn((cb) => {
+        cb();
+        finishCallback();
+      });
+
+      renderHook(
+        () =>
+          useUrlSchemeHandler({
+            url: testUrl,
+            onFinish,
+          }),
+        { wrapper }
+      );
+
+      expect(log_warning).toBeCalled();
+      expect(finishCallback).toBeCalled();
     });
-
-    expect(onFinish).toBeCalled();
   });
 });

package/App/DeepLinking/URLSchemeHandler/SchemeHandlerHooks/useOpenSchemeHandler/index.ts

@@ -1,8 +1,4 @@
-import {
-  useAppSelector,
-  selectContentTypes,
-  selectRivers,
-} from "@applicaster/zapp-react-native-redux";
+import { useContentTypes } from "@applicaster/zapp-react-native-redux";
 import { ZappPipesEntryContext } from "@applicaster/zapp-react-native-ui-components/Contexts";
 import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks/navigation";
 import { useEffect } from "react";
@@ -24,6 +20,7 @@ import {
   withInitialPlayerState,
 } from "./utils";
 import { log_warning } from "../../../logger";
+import { useRivers } from "@applicaster/zapp-react-native-utils/reactHooks";
 
 async function handleQuery({
   query,
@@ -101,8 +98,8 @@ async function handleQuery({
 }
 
 export function useOpenSchemeHandler({ query, url, onFinish }) {
-  const rivers = useAppSelector(selectRivers);
-  const contentTypes = useAppSelector(selectContentTypes);
+  const rivers = useRivers();
+  const contentTypes = useContentTypes();
   const navigator = useNavigation();
   const homeId = getHomeScreenId(rivers);
   const homeRoute = `/river/${homeId}`;