@applicaster/zapp-react-native-utils 13.0.0-alpha.9270615060 → 13.0.0-alpha.9433330286

package/navigationUtils/index.ts

@@ -324,7 +324,13 @@ export function getPathAttributes({
  * @param {object} rivers
  * @returns {object}
  */
-export function getRiverFromRoute({ route, rivers }) {
+export function getRiverFromRoute({
+  route,
+  rivers,
+}: {
+  route: string;
+  rivers: Record<string, ZappRiver>;
+}) {
   if (!route) {
     return null;
   }
@@ -437,7 +443,7 @@ export const runZappHooksForEntry = async (
 
   let success;
   let payload;
-  const rivers = appStore.get("rivers");
+  const rivers: Record<string, ZappRiver> = appStore.get("rivers");
   const plugins = appStore.get("plugins");
   const appData = appStore.get("appData");
 
@@ -492,13 +498,16 @@ export const runZappHooksForEntry = async (
       payload = _payload;
     };
 
-  HooksManager(hooksOptions)
+  const hooksManager = HooksManager(hooksOptions);
+
+  hooksManager.subscriber
     .on(HOOKS_EVENTS.PRESENT_SCREEN_HOOK, handleHookPresent)
     .on(HOOKS_EVENTS.START_BACKGROUND_HOOK, handleBackgroundHook)
     .on(HOOKS_EVENTS.ERROR, onFinished(false))
     .on(HOOKS_EVENTS.CANCEL, onFinished(false))
-    .on(HOOKS_EVENTS.COMPLETE, onFinished(true))
-    .handleHooks(entry);
+    .on(HOOKS_EVENTS.COMPLETE, onFinished(true));
+
+  hooksManager.handleHooks(entry);
 
   // eslint-disable-next-line no-unmodified-loop-condition
   while (success === undefined) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "13.0.0-alpha.9270615060",
+  "version": "13.0.0-alpha.9433330286",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,7 +28,7 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "13.0.0-alpha.9270615060",
+    "@applicaster/applicaster-types": "13.0.0-alpha.9433330286",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "create-react-context": "^0.2.3",

package/reactHooks/navigation/index.ts

@@ -320,16 +320,19 @@ export const useZappHooksForEntry = (
         callbacks?.handleHookComplete?.(props);
       };
 
-      const hookManager = HooksManager(hooksOptions)
+      const hookManager = HooksManager(hooksOptions);
+
+      hookManager.subscriber
         .on(HOOKS_EVENTS.PRESENT_SCREEN_HOOK, handleHookPresent)
         .on(HOOKS_EVENTS.ERROR, handleHookError)
         .on(HOOKS_EVENTS.CANCEL, handleHookCancel)
         .on(HOOKS_EVENTS.START_BACKGROUND_HOOK, handleBackgroundHook)
-        .on(HOOKS_EVENTS.COMPLETE, handleHookComplete)
-        .handleHooks(entry);
+        .on(HOOKS_EVENTS.COMPLETE, handleHookComplete);
+
+      hookManager.handleHooks(entry);
 
       return () => {
-        hookManager
+        hookManager.subscriber
           .removeHandler(HOOKS_EVENTS.PRESENT_SCREEN_HOOK, handleHookPresent)
           .removeHandler(HOOKS_EVENTS.ERROR, handleHookError)
           .removeHandler(HOOKS_EVENTS.CANCEL, handleHookCancel)

package/reactHooks/player/__tests__/useAutoSeek.test.tsx

@@ -0,0 +1,116 @@
+import { act, renderHook } from "@testing-library/react-hooks";
+import { playerManager } from "@applicaster/zapp-react-native-utils/appUtils/playerManager";
+
+import { ON_HOLD_INTERVAL, SEEK_TYPE, SKIP_TIME_BASE } from "../const";
+
+import { useAutoSeek } from "../useAutoSeek";
+
+jest.useFakeTimers();
+
+const rewind = jest.fn();
+const forward = jest.fn();
+
+jest
+  .spyOn(playerManager, "getInstanceController")
+  // @ts-ignore
+  .mockImplementation(() => ({ rewind, forward }));
+
+describe("useAutoSeek", () => {
+  beforeEach(() => {
+    rewind.mockReset();
+    forward.mockReset();
+  });
+
+  describe("autoSeekStart", () => {
+    it("should call forward method on playerInstance", () => {
+      const { result } = renderHook(() => useAutoSeek());
+
+      act(() => {
+        result.current.autoSeekStart(SEEK_TYPE.FORWARD);
+      });
+
+      expect(forward).toBeCalled();
+      result.current.autoSeekStop();
+    });
+
+    it("should call rewind method on playerManager", () => {
+      const { result } = renderHook(() => useAutoSeek());
+
+      act(() => {
+        result.current.autoSeekStart(SEEK_TYPE.REWIND);
+      });
+
+      expect(rewind).toBeCalled();
+      result.current.autoSeekStop();
+    });
+
+    it("should call rewind with default skip time", () => {
+      const { result } = renderHook(() => useAutoSeek());
+
+      act(() => {
+        result.current.autoSeekStart(SEEK_TYPE.REWIND);
+      });
+
+      expect(rewind).toBeCalledWith(SKIP_TIME_BASE);
+      result.current.autoSeekStop();
+    });
+
+    it("should call forward with default skip time", () => {
+      const { result } = renderHook(() => useAutoSeek());
+
+      act(() => {
+        result.current.autoSeekStart(SEEK_TYPE.FORWARD);
+      });
+
+      expect(forward).toBeCalledWith(SKIP_TIME_BASE);
+      result.current.autoSeekStop();
+    });
+
+    it("should call rewind in intervals set in configuration", () => {
+      const { result } = renderHook(() => useAutoSeek());
+
+      act(() => {
+        result.current.autoSeekStart(SEEK_TYPE.REWIND);
+      });
+
+      expect(rewind).toBeCalled();
+      jest.advanceTimersByTime(ON_HOLD_INTERVAL * 3);
+      expect(rewind).toBeCalledTimes(4);
+      result.current.autoSeekStop();
+    });
+
+    it("should call forward in intervals set in configuration", () => {
+      const { result } = renderHook(() => useAutoSeek());
+
+      act(() => {
+        result.current.autoSeekStart(SEEK_TYPE.FORWARD);
+      });
+
+      expect(forward).toBeCalled();
+      jest.advanceTimersByTime(ON_HOLD_INTERVAL * 3);
+      expect(forward).toBeCalledTimes(4);
+      result.current.autoSeekStop();
+    });
+  });
+
+  describe("autoSeekStop", () => {
+    it("should stop calling playerManager method after autoSeekStop is called", () => {
+      const { result } = renderHook(() => useAutoSeek());
+
+      act(() => {
+        result.current.autoSeekStart(SEEK_TYPE.FORWARD);
+      });
+
+      expect(forward).toBeCalled();
+      jest.advanceTimersByTime(ON_HOLD_INTERVAL * 3);
+      expect(forward).toBeCalledTimes(4);
+
+      act(() => {
+        result.current.autoSeekStop();
+      });
+
+      jest.advanceTimersByTime(ON_HOLD_INTERVAL * 3);
+      expect(forward).toBeCalledTimes(4);
+    });
+  });
+});

package/reactHooks/player/__tests__/useTapSeek.test.ts

@@ -0,0 +1,94 @@
+import { renderHook } from "@testing-library/react-hooks";
+import { playerManager } from "@applicaster/zapp-react-native-utils/appUtils/playerManager";
+import { useTapSeek } from "../useTapSeek";
+
+import { ON_PRESS_RESET_DURATION, SEEK_TYPE, SKIP_TIME_BASE } from "../const";
+
+const rewind = jest.fn();
+const forward = jest.fn();
+
+jest
+  .spyOn(playerManager, "getInstanceController")
+  // @ts-ignore
+  .mockImplementation(() => ({ rewind, forward }));
+
+describe("useTapSeek", () => {
+  beforeEach(() => {
+    rewind.mockReset();
+    forward.mockReset();
+  });
+
+  describe("forward", () => {
+    it("should call forward method on playerManager", () => {
+      const { result } = renderHook(() => useTapSeek());
+
+      result.current(SEEK_TYPE.FORWARD);
+      expect(forward).toBeCalled();
+    });
+
+    it("should call forward with default skip time", () => {
+      const { result } = renderHook(() => useTapSeek());
+
+      result.current(SEEK_TYPE.FORWARD);
+      expect(forward).toBeCalledWith(SKIP_TIME_BASE);
+    });
+
+    it("should multiply skip time for every call", async () => {
+      const { result } = renderHook(() => useTapSeek());
+
+      result.current(SEEK_TYPE.FORWARD);
+      expect(forward).toBeCalledWith(SKIP_TIME_BASE);
+      result.current(SEEK_TYPE.FORWARD);
+      expect(forward).toBeCalledWith(SKIP_TIME_BASE * 2);
+    });
+
+    it("should reset multiplier if waiting more then resetDuration between press actions", () => {
+      const { result, waitFor } = renderHook(() => useTapSeek());
+
+      result.current(SEEK_TYPE.FORWARD);
+      expect(forward).toBeCalledWith(SKIP_TIME_BASE);
+      waitFor(jest.fn(), { timeout: ON_PRESS_RESET_DURATION });
+      result.current(SEEK_TYPE.FORWARD);
+      expect(forward).toBeCalledWith(SKIP_TIME_BASE);
+    });
+  });
+
+  describe("rewind", () => {
+    it("should call rewind method on playerManager", () => {
+      const { result } = renderHook(() => useTapSeek());
+
+      result.current(SEEK_TYPE.REWIND);
+      expect(rewind).toBeCalled();
+    });
+
+    it("should call rewind with default skip time", () => {
+      const { result } = renderHook(() => useTapSeek());
+
+      result.current(SEEK_TYPE.REWIND);
+      expect(rewind).toBeCalledWith(SKIP_TIME_BASE);
+    });
+
+    it("should multiply skip time for every call", async () => {
+      const { result } = renderHook(() => useTapSeek());
+
+      result.current(SEEK_TYPE.REWIND);
+      expect(rewind).toBeCalledWith(SKIP_TIME_BASE);
+      result.current(SEEK_TYPE.REWIND);
+      expect(rewind).toBeCalledWith(SKIP_TIME_BASE * 2);
+    });
+  });
+
+  describe("mixed usage", () => {
+    it("should reset timer if different type of event is emitted", () => {
+      const { result } = renderHook(() => useTapSeek());
+      result.current(SEEK_TYPE.REWIND);
+      expect(rewind).toBeCalledWith(SKIP_TIME_BASE);
+
+      result.current(SEEK_TYPE.REWIND);
+      expect(rewind).toBeCalledWith(SKIP_TIME_BASE * 2);
+
+      result.current(SEEK_TYPE.FORWARD);
+      expect(forward).toBeCalledWith(SKIP_TIME_BASE);
+    });
+  });
+});

package/reactHooks/player/const.ts

@@ -4,7 +4,7 @@ export const ON_PRESS_RESET_DURATION = 2000;
 
 export const ON_HOLD_INTERVAL = 500;
 
-export const MAX_SEEK_TIME = 60;
+export const MAX_SEEK_TIME = 600;
 
 export enum SEEK_TYPE {
   FORWARD = "forward",

package/reactHooks/player/index.ts

@@ -1 +1,7 @@
 export { useLanguageData } from "./useLanguageData";
+
+export { useAutoSeek } from "./useAutoSeek";
+
+export { useTapSeek } from "./useTapSeek";
+
+export { useSeek, withUseSeek } from "./useSeek";

package/reactHooks/player/useAutoSeek.tsx

@@ -0,0 +1,87 @@
+import React, { useEffect, useState } from "react";
+import { usePrevious } from "@applicaster/zapp-react-native-utils/reactHooks/utils";
+import { playerManager } from "@applicaster/zapp-react-native-utils/appUtils/playerManager";
+import {
+  MAX_SEEK_TIME,
+  ON_HOLD_INTERVAL,
+  SEEK_TYPE,
+  SKIP_TIME_BASE,
+} from "./const";
+import { noop } from "../../functionUtils";
+
+export const useAutoSeek = (resetHUDTimer = noop) => {
+  const [isRunning, setIsRunning] = useState<boolean>(false);
+  const [direction, setDirection] = useState<Nullable<SEEK_TYPE>>(null);
+  const [multiplier, setMultiplier] = useState(1);
+  const intervalTimer = React.useRef(null);
+  const prevRunning = usePrevious(isRunning);
+
+  const clearIntervalTimer = () => {
+    try {
+      clearInterval(intervalTimer.current);
+    } catch (err) {
+      intervalTimer.current = null;
+    }
+  };
+
+  const setIntervalTimer = (cb) => {
+    clearIntervalTimer();
+    intervalTimer.current = setInterval(cb, ON_HOLD_INTERVAL);
+  };
+
+  const resetState = () => {
+    setIsRunning(false);
+    setDirection(null);
+    setMultiplier(1);
+    clearIntervalTimer();
+  };
+
+  useEffect(() => {
+    const player = playerManager.getInstanceController();
+
+    if (!player) return;
+
+    if (direction) {
+      player[direction](Math.min(MAX_SEEK_TIME, SKIP_TIME_BASE * multiplier));
+      resetHUDTimer();
+    }
+  }, [multiplier, direction]);
+
+  useEffect(() => {
+    if (isRunning && isRunning !== prevRunning) {
+      setIntervalTimer(() => {
+        setMultiplier((prev) => {
+          return prev + 1;
+        });
+      });
+    } else if (!isRunning && isRunning !== prevRunning) {
+      resetState();
+    }
+
+    return () => {
+      clearIntervalTimer();
+    };
+  }, [isRunning, direction]);
+
+  const autoSeekStop = React.useCallback(() => {
+    resetState();
+  }, []);
+
+  const autoSeekStart = React.useCallback(
+    (eventType: SEEK_TYPE) => {
+      // Check if there is another session running
+      if (isRunning) {
+        autoSeekStop();
+      }
+
+      setDirection(eventType);
+      setIsRunning(true);
+    },
+    [isRunning]
+  );
+
+  return React.useMemo(
+    () => ({ autoSeekStart, autoSeekStop }),
+    [autoSeekStart, autoSeekStop]
+  );
+};

package/reactHooks/player/useSeek.tsx

@@ -0,0 +1,66 @@
+import React from "react";
+import { SEEK_TYPE } from "./const";
+import { useTapSeek } from "./useTapSeek";
+import { useAutoSeek } from "./useAutoSeek";
+import { noop } from "../../functionUtils";
+
+export const useSeek = (resetHUDTimer = noop) => {
+  const handlePressEvent = useTapSeek();
+  const { autoSeekStart, autoSeekStop } = useAutoSeek(resetHUDTimer);
+
+  const onForwardPress = () => {
+    handlePressEvent(SEEK_TYPE.FORWARD);
+  };
+
+  const onRewindPress = () => {
+    handlePressEvent(SEEK_TYPE.REWIND);
+  };
+
+  const onForwardPressIn = () => {
+    autoSeekStart(SEEK_TYPE.FORWARD);
+  };
+
+  const onForwardPressOut = () => {
+    autoSeekStop();
+  };
+
+  const onRewindPressIn = () => {
+    autoSeekStart(SEEK_TYPE.REWIND);
+  };
+
+  const onRewindLongPress = () => {
+    autoSeekStart(SEEK_TYPE.REWIND);
+  };
+
+  const onForwardLongPress = () => {
+    autoSeekStart(SEEK_TYPE.FORWARD);
+  };
+
+  const onRewindPressOut = () => {
+    autoSeekStop();
+  };
+
+  return React.useMemo(
+    () => ({
+      onForwardPress,
+      onRewindPress,
+      onForwardPressIn,
+      onForwardPressOut,
+      onRewindPressIn,
+      onRewindPressOut,
+      onRewindLongPress,
+      onForwardLongPress,
+    }),
+    [handlePressEvent, autoSeekStart]
+  );
+};
+
+export const withUseSeek = (Component) =>
+  Object.assign(
+    (props) => {
+      const seekMethods = useSeek(props?.resetHUDTimer);
+
+      return <Component {...props} seekMethods={seekMethods} />;
+    },
+    { displayName: "WithUseSeek" }
+  );

package/reactHooks/player/useTapSeek.tsx

@@ -0,0 +1,58 @@
+import { useCallback, useRef } from "react";
+import * as R from "ramda";
+import {
+  MAX_SEEK_TIME,
+  ON_PRESS_RESET_DURATION,
+  SEEK_TYPE,
+  SKIP_TIME_BASE,
+} from "./const";
+import { playerManager } from "@applicaster/zapp-react-native-utils/appUtils";
+
+type SeekType = SEEK_TYPE | null;
+
+const getSkipTime = (multiplier) => {
+  const skipTime = R.min(MAX_SEEK_TIME, SKIP_TIME_BASE * multiplier);
+
+  return skipTime;
+};
+
+export const useTapSeek = () => {
+  const onPressMultiplier = useRef(1);
+  const lastPressTime = useRef(0);
+  const currentOnPressEventType = useRef<SeekType>(null);
+
+  const resetMultiplier = useCallback(() => {
+    onPressMultiplier.current = 1;
+  }, []);
+
+  const handlePressEvent = useCallback(
+    (eventType) => {
+      const player = playerManager.getInstanceController();
+      if (!player) return;
+
+      const now = Date.now();
+      const timeSinceLastPress = now - lastPressTime.current;
+      const isSameEventType = eventType === currentOnPressEventType.current;
+
+      const isWithinResetDuration =
+        timeSinceLastPress <= ON_PRESS_RESET_DURATION;
+
+      const shouldIncreaseMultiplier = isSameEventType && isWithinResetDuration;
+
+      if (shouldIncreaseMultiplier) {
+        onPressMultiplier.current += 1;
+      } else {
+        resetMultiplier();
+      }
+
+      const seekTime = getSkipTime(onPressMultiplier.current);
+      player[eventType](seekTime);
+
+      lastPressTime.current = now;
+      currentOnPressEventType.current = eventType;
+    },
+    [resetMultiplier]
+  );
+
+  return handlePressEvent;
+};

package/reactUtils/index.ts

@@ -109,20 +109,6 @@ export const isTvOSPlatform = () => getPlatform() === "tvos";
 
 export const isAndroidTVPlatform = () => getPlatform() === "android_tv";
 
-declare global {
-  interface Window {
-    VIZIO?: {
-      Chromevox: {
-        play: (text: string) => void;
-      };
-      exitApplication: () => void;
-      setClosedCaptionHandler: (
-        callback: (isCCEnabled: boolean) => void
-      ) => void;
-    };
-  }
-}
-
 /**
  * Platforms found in userAgent string, please note that simulators
  * might not have the same agents that the devices have

package/appUtils/keyCodes/keys.ios.js

@@ -1,46 +0,0 @@
-/* global tizen */
-const isTizen = typeof tizen !== "undefined";
-
-export const KEYS = {
-  Enter: { code: "Enter", keyCode: 13 },
-  Space: { code: "Space", keyCode: 32 },
-  m: { code: "m", keyCode: 77 },
-  ArrowLeft: { code: "ArrowLeft", keyCode: 37 },
-  ArrowUp: { code: "ArrowUp", keyCode: 38 },
-  ArrowRight: { code: "ArrowRight", keyCode: 39 },
-  ArrowDown: { code: "ArrowDown", keyCode: 40 },
-  Back: isTizen
-    ? { code: "Back", keyCode: 10009 }
-    : { code: "Backspace", keyCode: 8 },
-  Play: isTizen
-    ? { code: "MediaPlay", keyCode: 10252 }
-    : { code: "PlayPause", keyCode: 179 },
-  Pause: isTizen
-    ? { code: "MediaPause", keyCode: 19 }
-    : { code: "Pause", keyCode: 179 },
-  Forward: isTizen
-    ? { code: "MediaFastForward", keyCode: 417 }
-    : { code: "Forward", keyCode: 176 },
-  Rewind: isTizen
-    ? { code: "MediaRewind", keyCode: 412 }
-    : { code: "Rewind", keyCode: 177 },
-  VolumeUp: isTizen
-    ? { code: "VolumeUp", keyCode: 447 }
-    : { code: "VolumeUp", keyCode: 175 },
-  VolumeDown: isTizen
-    ? { code: "VolumeDown", keyCode: 448 }
-    : { code: "VolumeDown", keyCode: 174 },
-  ToggleMute: isTizen
-    ? { code: "VolumeMute", keyCode: 449 }
-    : { code: "VolumeMute", keyCode: 173 },
-  Stop: isTizen
-    ? { code: "MediaStop", keyCode: 413 }
-    : { code: "Q", keyCode: 81 },
-};
-
-export const ARROW_KEYS = [
-  KEYS.ArrowUp,
-  KEYS.ArrowLeft,
-  KEYS.ArrowDown,
-  KEYS.ArrowRight,
-];

package/appUtils/keyInputHandler/KeyInputHandler.ts

@@ -1,90 +0,0 @@
-
-export type SeekKeyHandlerListener = {
-  onRewindPress: () => boolean;
-  onRewindLongPress: () => boolean;
-  onForwardPress: () => boolean;
-  onForwardLongPress: () => boolean;
-  onRewindPressOut: () => void;
-  onForwardPressOut: () => void;
-}
-
-export class KeyInputHandler {
-  private static instance: KeyInputHandler;
-
-  public static getInstance() {
-    if (!KeyInputHandler.instance) {
-      KeyInputHandler.instance = new KeyInputHandler();
-    }
-
-    return KeyInputHandler.instance;
-  }
-
-  constructor() {
-    this.listeners = [];
-  }
-
-  private listeners: SeekKeyHandlerListener[] = [];
-
-  addListener = (listener: SeekKeyHandlerListener) => {
-    this.listeners.splice(0, 0, listener);
-
-    return () =>
-      this.removeListener(listener);
-  }
-
-  removeListener = (listener: SeekKeyHandlerListener) => {
-    this.listeners = this.listeners.filter((l) => l !== listener);
-  }
-
-  onRewindPress = () => {
-    for (const element of this.listeners) {
-      if (element.onRewindPress()) {
-        break;
-      }
-    }
-  }
-
-  onRewindLongPress = () => {
-    for (const element of this.listeners) {
-      if (element.onRewindLongPress()) {
-        break;
-      }
-    }
-  }
-
-  onForwardPress = () => {
-    for (const element of this.listeners) {
-      if (element.onForwardPress()) {
-        break;
-      }
-    }
-  }
-
-  onForwardLongPress = () => {
-    for (const element of this.listeners) {
-      if (element.onForwardLongPress()) {
-        break;
-      }
-    }
-  }
-
-  // TODO: Event should be send to listeners who handled down event
-  onRewindPressOut = () => {
-    this.listeners.forEach((listener) => listener.onRewindPressOut());
-  }
-
-  onForwardPressOut = () => {
-    this.listeners.forEach((listener) => listener.onForwardPressOut());
-  }
-
-  getSeekMethods = () => {
-    return {
-      onForwardPress: this.onForwardPress,
-      onRewindPress: this.onRewindPress,
-      onForwardLongPress: this.onForwardLongPress,
-      onRewindLongPress: this.onRewindLongPress,
-      onForwardPressOut: this.onForwardPressOut,
-      onRewindPressOut: this.onRewindPressOut
-    };
-  }
-}