@applicaster/quick-brick-core 13.0.0-alpha.5033140607 → 13.0.0-alpha.5304771702

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

@@ -2,7 +2,7 @@
 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 { cleanup, renderHook } from "@testing-library/react-hooks";
+import { waitFor, cleanup, renderHook } from "@testing-library/react-native";
 import nock from "nock";
 import * as R from "ramda";
 import React from "react";
@@ -66,13 +66,13 @@ const feedLoaderSpy = jest.spyOn(feedLoader, "useFeedLoader");
 
 const setEntryContext = jest.fn();
 
-jest.mock("@applicaster/zapp-react-native-ui-components/Contexts", () => ({
+jest.doMock("@applicaster/zapp-react-native-ui-components/Contexts", () => ({
   ZappPipesEntryContext: {
     useZappPipesContext: () => [{}, setEntryContext],
   },
 }));
 
-jest.mock("../../../logger", () => ({
+jest.doMock("../../../logger", () => ({
   log_info: jest.fn(),
   log_error: jest.fn(),
   log_warning: jest.fn(),
@@ -80,8 +80,11 @@ jest.mock("../../../logger", () => ({
   log_debug: jest.fn(),
 }));
 
-jest.useFakeTimers();
+jest.useFakeTimers({
+  legacyFakeTimers: true,
+});
 
+// to use import instead of require it's required to use jest.mock above
 const { useOpenSchemeHandler } = require("../useOpenSchemeHandler");
 
 const getWrapper = (storeProps = {}) => {
@@ -105,12 +108,13 @@ const getWrapper = (storeProps = {}) => {
 const testHook = async ({ url, query, storeProps = {}, tests }) => {
   const wrapper = getWrapper(storeProps);
 
-  renderHook(
-    () => useOpenSchemeHandler({ url, query, onFinish: (cb) => cb(tests) }),
-    {
-      wrapper,
-    }
-  );
+  const callback = jest.fn((fn) => fn(tests));
+
+  renderHook(() => useOpenSchemeHandler({ url, query, onFinish: callback }), {
+    wrapper,
+  });
+
+  await waitFor(() => expect(callback).toHaveBeenCalled());
 };
 
 function clearMocks() {
@@ -151,7 +155,7 @@ describe("useOpenSchemeHandler", () => {
 
     const query = { feed_locator, state: "fullscreen" };
 
-    it("fetches state and write it to extensions", (done) => {
+    it("fetches state and write it to extensions", async () => {
       const tests = () => {
         const entry = {
           ...entries[0],
@@ -167,13 +171,9 @@ describe("useOpenSchemeHandler", () => {
             pushScreen: true,
           })
         );
-
-        expect.assertions(1);
-
-        done();
       };
 
-      testHook({ url, query, tests });
+      await testHook({ url, query, tests });
     });
   });
 
@@ -189,17 +189,16 @@ describe("useOpenSchemeHandler", () => {
       type: { value: type },
     };
 
-    it("doesn't log a warning", (done) => {
+    it("doesn't log a warning", async () => {
       const tests = () => {
-        expect(log_warning).not.toBeCalled();
+        expect(log_warning).not.toHaveBeenCalled();
         expect.assertions(1);
-        done();
       };
 
-      testHook({ url, query, tests });
+      await testHook({ url, query, tests });
     });
 
-    it("opens the screen type-mapped to the provided value", (done) => {
+    it("opens the screen type-mapped to the provided value", async () => {
       const tests = () => {
         expect(helperSpy).toHaveBeenCalledWith(
           expect.objectContaining({
@@ -215,16 +214,12 @@ describe("useOpenSchemeHandler", () => {
             isDeepLink: true,
           })
         );
-
-        expect.assertions(2);
-
-        done();
       };
 
-      testHook({ url, query, tests });
+      await testHook({ url, query, tests });
     });
 
-    it("sets the entry context with the provided parameters", (done) => {
+    it("sets the entry context with the provided parameters", async () => {
       const params = { showId: "abc", param: "value" };
 
       const tests = () => {
@@ -249,13 +244,9 @@ describe("useOpenSchemeHandler", () => {
             extensions: { ...params, initial_player_state: "fullscreen" },
           })
         );
-
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({ url, query: { ...query, ...params }, tests });
+      await testHook({ url, query: { ...query, ...params }, tests });
     });
   });
 
@@ -267,17 +258,7 @@ describe("useOpenSchemeHandler", () => {
     const url = `app://open?screen_id=${screen_id}`;
     const query = { screen_id };
 
-    it("doesn't log a warning", (done) => {
-      const tests = () => {
-        expect(log_warning).not.toBeCalled();
-        expect.assertions(1);
-        done();
-      };
-
-      testHook({ url, query, tests });
-    });
-
-    it("opens the screen with the provided id", (done) => {
+    it("opens the screen with the provided id", async () => {
       const tests = () => {
         expect(helperSpy).toHaveBeenCalledWith(
           expect.objectContaining({
@@ -290,16 +271,12 @@ describe("useOpenSchemeHandler", () => {
         expect(navigator.push).toHaveBeenCalledWith(
           expect.objectContaining({ ...rivers[screen_id], isDeepLink: true })
         );
-
-        expect.assertions(2);
-
-        done();
       };
 
-      testHook({ url, query, tests });
+      await testHook({ url, query, tests });
     });
 
-    it("sets the entry context with the provided parameters", (done) => {
+    it("sets the entry context with the provided parameters", async () => {
       const params = { showId: "abc", param: "value" };
 
       const tests = () => {
@@ -324,13 +301,9 @@ describe("useOpenSchemeHandler", () => {
             extensions: { ...params, initial_player_state: "fullscreen" },
           })
         );
-
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({ url, query: { ...query, ...params }, tests });
+      await testHook({ url, query: { ...query, ...params }, tests });
     });
   });
 
@@ -359,17 +332,7 @@ describe("useOpenSchemeHandler", () => {
     const url = `app://open?feed_locator=${encodeURIComponent(feed_locator)}`;
     const query = { feed_locator };
 
-    it("doesn't log a warning", (done) => {
-      const tests = () => {
-        expect(log_warning).not.toBeCalled();
-        expect.assertions(1);
-        done();
-      };
-
-      testHook({ url, query, tests });
-    });
-
-    it("fetches the feed, sets the entryContext, and navigates to the first entry if no other parameter is provided", (done) => {
+    it("fetches the feed, sets the entryContext, and navigates to the first entry if no other parameter is provided", async () => {
       const tests = () => {
         const entryWithInitialPlayerState = withInitialPlayerState(
           query,
@@ -394,16 +357,12 @@ describe("useOpenSchemeHandler", () => {
         expect(setEntryContext).toHaveBeenCalledWith(
           entryWithInitialPlayerState
         );
-
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({ url, query, tests });
+      await testHook({ url, query, tests });
     });
 
-    it("fetches the feed, sets the entryContext, and navigates to the entry with the provided position", (done) => {
+    it("fetches the feed, sets the entryContext, and navigates to the entry with the provided position", async () => {
       const tests = () => {
         const entryWithInitialPlayerState = withInitialPlayerState(
           query,
@@ -428,16 +387,12 @@ describe("useOpenSchemeHandler", () => {
         expect(setEntryContext).toHaveBeenCalledWith(
           entryWithInitialPlayerState
         );
-
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({ url, query: { ...query, position: 3 }, tests });
+      await testHook({ url, query: { ...query, position: 3 }, tests });
     });
 
-    it("fetches the feed, sets the entryContext, and navigates to the entry with the provided id", (done) => {
+    it("fetches the feed, sets the entryContext, and navigates to the entry with the provided id", async () => {
       const tests = () => {
         const entryWithInitialPlayerState = withInitialPlayerState(
           query,
@@ -462,16 +417,12 @@ describe("useOpenSchemeHandler", () => {
         expect(setEntryContext).toHaveBeenCalledWith(
           entryWithInitialPlayerState
         );
-
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({ url, query: { ...query, id: "entry_3" }, tests });
+      await testHook({ url, query: { ...query, id: "entry_3" }, tests });
     });
 
-    it("fetches the feed, sets the entryContext, and navigates to the entry with the provided id as number", (done) => {
+    it("fetches the feed, sets the entryContext, and navigates to the entry with the provided id as number", async () => {
       const tests = () => {
         const entryWithInitialPlayerState = withInitialPlayerState(
           query,
@@ -496,16 +447,12 @@ describe("useOpenSchemeHandler", () => {
         expect(setEntryContext).toHaveBeenCalledWith(
           entryWithInitialPlayerState
         );
-
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({ url, query: { ...query, id: "1234" }, tests });
+      await testHook({ url, query: { ...query, id: "1234" }, tests });
     });
 
-    it("fetches the feed, sets the entryContext, and opens the entry in the provided screen_id", (done) => {
+    it("fetches the feed, sets the entryContext, and opens the entry in the provided screen_id", async () => {
       const tests = () => {
         const entryWithInitialPlayerState = withInitialPlayerState(
           query,
@@ -530,20 +477,16 @@ describe("useOpenSchemeHandler", () => {
         expect(setEntryContext).toHaveBeenCalledWith(
           entryWithInitialPlayerState
         );
-
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({
+      await testHook({
         url,
         query: { ...query, id: "entry_2", screen_id: "B0987" },
         tests,
       });
     });
 
-    it("fetches the feed, sets the entryContext, and opens the entry in the screen matching the provided type", (done) => {
+    it("fetches the feed, sets the entryContext, and opens the entry in the screen matching the provided type", async () => {
       const tests = () => {
         const entryWithInitialPlayerState = withInitialPlayerState(
           query,
@@ -568,20 +511,16 @@ describe("useOpenSchemeHandler", () => {
         expect(setEntryContext).toHaveBeenCalledWith(
           expect.objectContaining(entryWithInitialPlayerState)
         );
-
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({
+      await testHook({
         url,
         query: { ...query, id: "entry_2", type: "show" },
         tests,
       });
     });
 
-    it("logs an error and redirect to home if it cannot resolve the target screen", (done) => {
+    it("logs an error and redirect to home if it cannot resolve the target screen", async () => {
       const tests = () => {
         expect(log_warning).toHaveBeenCalledWith(resolveError(url), {
           url,
@@ -599,12 +538,9 @@ describe("useOpenSchemeHandler", () => {
 
         expect(navigator.goHome).toHaveBeenCalled();
         expect(setEntryContext).not.toHaveBeenCalled();
-        expect.assertions(4);
-
-        done();
       };
 
-      testHook({
+      await testHook({
         url,
         query: { ...query, id: "entry_2" },
         tests,
@@ -626,7 +562,7 @@ describe("useOpenSchemeHandler", () => {
     const url = `app://open?feed_locator=${encodeURIComponent(feed_locator)}`;
     const query = { feed_locator };
 
-    it("goes to home screen and logs a warning", (done) => {
+    it("goes to home screen and logs a warning", async () => {
       const tests = () => {
         expect(log_warning).toHaveBeenCalledWith(resolveError(url), {
           url,
@@ -643,12 +579,9 @@ describe("useOpenSchemeHandler", () => {
         );
 
         expect(navigator.goHome).toHaveBeenCalled();
-        expect.assertions(3);
-
-        done();
       };
 
-      testHook({ url, query, tests });
+      await testHook({ url, query, tests });
     });
   });
 
@@ -659,19 +592,15 @@ describe("useOpenSchemeHandler", () => {
     const url = "app://open?param=value";
     const query = { param: "value" };
 
-    it("logs a warning", (done) => {
+    it("logs a warning", async () => {
       const tests = () => {
         expect(log_warning).toBeCalledWith(
           typeWarningMessage(url),
           expect.objectContaining({ url, query })
         );
-
-        expect.assertions(1);
-
-        done();
       };
 
-      testHook({ url, query, tests });
+      await testHook({ url, query, tests });
     });
   });
 });

package/App/DeepLinking/URLSchemeHandler/__tests__/__snapshots__/URLSchemeHandler.test.tsx.snap

@@ -3,13 +3,13 @@
 exports[`URLSchemeHandler renders correctly and invokes the hook 1`] = `
 <View
   style={
-    Array [
-      Object {
+    [
+      {
         "alignItems": "center",
         "flex": 1,
         "justifyContent": "center",
       },
-      Object {
+      {
         "backgroundColor": "white",
         "height": 1334,
         "width": 750,

package/App/DeepLinking/URLSchemeListener/URLSchemeContextProvider.tsx

@@ -10,7 +10,11 @@ import * as ReactNative from "react-native";
 
 import { isWeb } from "@applicaster/zapp-react-native-utils/reactUtils";
 import { log_debug, log_error, log_info } from "../logger";
-
+import { getAppUrlScheme } from "@applicaster/zapp-react-native-utils/appDataUtils";
+import {
+  getZappPlatform,
+  ZappPlatform,
+} from "@applicaster/zapp-react-native-utils/appUtils/platform";
 type Props = {
   listenerSpy?: (...any) => void;
   children: ReactChild;
@@ -34,6 +38,15 @@ const initialState = { url: null, done: () => {} };
 
 export const URLSchemeContext = createContext<State>(initialState);
 
+const getWebDeepLink = (initialURL: string) => {
+  if (!initialURL) return null;
+
+  const index = initialURL.indexOf("?");
+  if (index === -1) return;
+
+  return getAppUrlScheme() + "://open" + initialURL.slice(index);
+};
+
 function URLSchemeContextProvider(props: Props) {
   const [state, setState] = useState<string | null>(initialState.url);
 
@@ -51,10 +64,24 @@ function URLSchemeContextProvider(props: Props) {
     props?.listenerSpy?.("getInitialURL");
 
     try {
-      if (isWeb()) return;
-
       const url = await Linking.getInitialURL();
 
+      if (isWeb()) {
+        if (getZappPlatform() === ZappPlatform.Vizio) {
+          const deepLink = getWebDeepLink(url);
+
+          if (deepLink) {
+            log_info(
+              `URLSchemeContextProvider: Retrieved initial deep link: ${deepLink}`
+            );
+
+            return setState(deepLink);
+          }
+        }
+
+        return;
+      }
+
       log_info(
         `URLSchemeContextProvider: Retrieved initial url: ${url || "not exist"}`
       );

package/App/NavigationProvider/NavigationProvider.tsx

@@ -66,6 +66,7 @@ import { inflateUrl } from "@applicaster/zapp-react-native-ui-components/Compone
 import { useModalStore } from "@applicaster/zapp-react-native-utils/modalState";
 import { useSubscriberFor } from "@applicaster/zapp-react-native-utils/reactHooks/useSubscriberFor";
 import { QBUIComponentEvents } from "@applicaster/zapp-react-native-ui-components/events";
+import { Hook } from "@applicaster/zapp-react-native-utils/appUtils/HooksManager/Hook";
 
 const logger = coreAppLogger.addSubsystem("Navigator");
 
@@ -75,17 +76,6 @@ type Props = {
   plugins?: QuickBrickPlugin[];
 };
 
-type EntryWithParent = ZappEntry & { parent?: EntryWithParent };
-
-type SingleEntry = {
-  data: EntryWithParent;
-  route: string;
-  id: string;
-  parentId?: string;
-};
-
-type EntryContextType = { [K in string]: SingleEntry };
-
 const navigationActions = {
   [ACTIONS.PUSH]: push,
   [ACTIONS.REPLACE]: replace,
@@ -122,9 +112,7 @@ export function NavigationProvider({ children }: Props) {
   const pathname = state?.location?.pathname;
   const pathnameRef = React.useRef(pathname);
 
-  const { context }: EntryContextType = React.useContext(
-    ZappPipesEntryContext.Context
-  );
+  const { context } = React.useContext(ZappPipesEntryContext.Context);
 
   const { openModal, dismissModal } = useModalStore();
 
@@ -380,7 +368,18 @@ export function NavigationProvider({ children }: Props) {
     }
   };
 
-  const handleHookPresent = ({ hookPlugin, route, payload }, dispose) => {
+  const handleHookPresent = (
+    {
+      hookPlugin,
+      route,
+      payload,
+    }: {
+      hookPlugin: Hook;
+      route: string;
+      payload: object;
+    },
+    dispose
+  ) => {
     if (hookPlugin?.lastHook) {
       dispose();
     }
@@ -498,8 +497,7 @@ export function NavigationProvider({ children }: Props) {
     ({ hookPlugin, payload, callback }, dispose) => {
       if (hookPlugin?.lastHook) {
         dispose({ disposeAll: true });
-
-        startUpHooks.current && setStartUpHooks(false);
+        currentStartUpHooks.current && setStartUpHooks(false);
       }
 
       dispatch(
@@ -614,7 +612,9 @@ export function NavigationProvider({ children }: Props) {
           },
         };
 
-        HooksManager(hooksOptions)
+        const hooksManager = HooksManager(hooksOptions);
+
+        hooksManager.subscriber
           .on(HOOKS_EVENTS.PRESENT_SCREEN_HOOK, handleHookPresent)
           .on(HOOKS_EVENTS.ERROR, handleHookError)
           .on(HOOKS_EVENTS.CANCEL, handleHookCancel)
@@ -625,8 +625,9 @@ export function NavigationProvider({ children }: Props) {
               screen,
               options,
             })
-          )
-          .handleHooks(legacyScreenData({ entry, screen }));
+          );
+
+        hooksManager.handleHooks(legacyScreenData({ entry, screen }));
       } else {
         dispatch(navigationAction(targetRoute, { screen, entry, options }));
       }

package/App/NavigationProvider/__tests__/__snapshots__/navigationProvider.test.tsx.snap

@@ -1,8 +1,8 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<NavigationProvider /> modal feature removes the visible flag when dismissing a modal 1`] = `
-Object {
-  "options": Object {
+{
+  "options": {
     "animated": true,
     "animationType": "slide",
     "onDismiss": [Function],
@@ -11,22 +11,20 @@ Object {
     "presentationStyle": "overFullScreen",
     "transparent": true,
   },
-  "props": Object {
-    "screenData": Object {},
-  },
-  "screen": Object {
+  "props": undefined,
+  "screen": {
     "id": "A1234",
-    "navigations": Array [],
-    "ui_components": Array [],
+    "navigations": [],
+    "ui_components": [],
   },
   "visible": true,
 }
 `;
 
 exports[`<NavigationProvider /> modal feature removes the visible flag when dismissing a modal 2`] = `
-Object {
-  "options": Object {},
-  "props": Object {},
+{
+  "options": {},
+  "props": {},
   "screen": null,
   "visible": false,
 }
@@ -35,8 +33,8 @@ Object {
 exports[`<NavigationProvider /> modal feature sets the modalState when opening a modal 1`] = `undefined`;
 
 exports[`<NavigationProvider /> modal feature should reset state to initial when dismissing a modal ( closeModalBottomSheet ) opened by openModalBottomSheet 1`] = `
-Object {
-  "options": Object {
+{
+  "options": {
     "animated": false,
     "animationType": "none",
     "onDismiss": [Function],
@@ -45,14 +43,14 @@ Object {
     "presentationStyle": "overFullScreen",
     "transparent": true,
   },
-  "props": Object {},
-  "screen": Object {
-    "ModalBottomSheetContent": Object {
+  "props": {},
+  "screen": {
+    "ModalBottomSheetContent": {
       "id": "A1234",
-      "navigations": Array [],
-      "ui_components": Array [],
+      "navigations": [],
+      "ui_components": [],
     },
-    "modalBottomSheetContentProps": Object {
+    "modalBottomSheetContentProps": {
       "some": "props",
     },
   },
@@ -61,9 +59,9 @@ Object {
 `;
 
 exports[`<NavigationProvider /> modal feature should reset state to initial when dismissing a modal ( closeModalBottomSheet ) opened by openModalBottomSheet 2`] = `
-Object {
-  "options": Object {},
-  "props": Object {},
+{
+  "options": {},
+  "props": {},
   "screen": null,
   "visible": false,
 }