@applicaster/zapp-react-native-utils 13.0.0-alpha.4515349201 → 13.0.0-alpha.4528460103

package/reactHooks/navigation/useUniqueRouteSuffix.ts

@@ -0,0 +1,41 @@
+import React from "react";
+import { isWeb } from "../../reactUtils";
+import { useNavigation } from "./useNavigation";
+import { usePathname } from "./usePathname";
+import {
+  QUICK_BRICK_CONTENT,
+  QUICK_BRICK_NAVBAR,
+} from "@applicaster/quick-brick-core/const";
+
+type Return = (prefix: string) => string;
+
+export const useUniqueRouteSuffix = (): Return => {
+  const pathname = usePathname();
+  const { currentRoute } = useNavigation();
+
+  const suffix = `currentRoute:${currentRoute}_pathname:${pathname}`;
+
+  const withUniqueRouteSuffix = React.useCallback((prefix: string) => {
+    if (isWeb()) {
+      // we should use extended route prefix only on Web, where we have stack-navigator
+      return `${prefix}___${suffix}`;
+    }
+
+    // for other platforms use previous version
+    return prefix;
+  }, []);
+
+  return withUniqueRouteSuffix;
+};
+
+export const useNavbarId = () => {
+  const withUniqueRouteSuffix = useUniqueRouteSuffix();
+
+  return withUniqueRouteSuffix(QUICK_BRICK_NAVBAR);
+};
+
+export const useContentId = () => {
+  const withUniqueRouteSuffix = useUniqueRouteSuffix();
+
+  return withUniqueRouteSuffix(QUICK_BRICK_CONTENT);
+};

package/reactHooks/player/TVSeekControlller/ISeekController.ts

@@ -1,15 +1,32 @@
-import { SEEK_TYPE } from "../const";
+import { MAX_SEEK_TIME, SEEK_TYPE, SKIP_TIME_BASE } from "../const";
 
 export interface ISeekControllerDelegate {
   handleDelayedSeek(offset: number): void;
   handleSeek(offset: number): void;
   handleSeekComplete(): void;
   handlePlayerPause(): void;
-  delayedSeekOffset: number | null;
 }
 
 export interface ISeekController {
+  title: string;
   onStartSeek(seekType: SEEK_TYPE): void;
   onSeekEnd(): void;
   reset(): void;
 }
+
+export class SeekIncrementalBaseStrategy {
+  private skipMultiplier = 1;
+
+  getSkipTime = () =>
+    Math.min(MAX_SEEK_TIME, SKIP_TIME_BASE * this.skipMultiplier);
+
+  increment = () => {
+    this.skipMultiplier++;
+  };
+
+  getSkipMultiplier = () => this.skipMultiplier;
+
+  reset = () => {
+    this.skipMultiplier = 1;
+  };
+}

package/reactHooks/player/TVSeekControlller/LongPressSeekController.ts

@@ -1,85 +1,64 @@
-import { ISeekController, ISeekControllerDelegate } from "./ISeekController";
+import {
+  ISeekController,
+  ISeekControllerDelegate,
+  SeekIncrementalBaseStrategy,
+} from "./ISeekController";
 import { SEEK_TYPE } from "../const";
 import { log_debug, log_error, log_verbose } from "./TVSeekController";
 import { interval, Subscription } from "rxjs";
 import { tap } from "rxjs/operators";
 
 interface LongPressConfig {
-  TIMER_INTERVAL_MS: number; // ms
-  SKIP_INCREMENT_STEP: number; // seconds
-  MAX_SKIP_PER_TICK: number; // seconds
-  INITIAL_SKIP_AMOUNT: number; // e.g., 10s to start
+  TIMER_INTERVAL_MS: number;
 }
 
 export class LongPressSeekController implements ISeekController {
-  isLongPressActive = false;
-  private currentSkipAmount = 0;
   private subscription: Subscription | null = null;
-
+  readonly title = "LongPressSeek";
   constructor(
     private seekControllerDelegate: ISeekControllerDelegate,
+    private seekIncrementalStrategy: SeekIncrementalBaseStrategy,
     private config: LongPressConfig
   ) {}
 
   onStartSeek(seekType: SEEK_TYPE) {
     this.cleanUpSubscription();
 
-    log_debug(
-      `LongPressSeekController: start long press seek type:${seekType}.`
-    );
+    log_debug(`${this.title}: start long press seek type: ${seekType}.`);
 
     this.seekControllerDelegate.handlePlayerPause();
 
-    this.isLongPressActive = true;
-    this.currentSkipAmount = this.config.INITIAL_SKIP_AMOUNT;
-
     this.subscription = interval(this.config.TIMER_INTERVAL_MS)
       .pipe(
         tap(() => {
-          this.seekControllerDelegate.handleDelayedSeek(this.currentSkipAmount);
+          this.seekControllerDelegate.handleDelayedSeek(
+            this.seekIncrementalStrategy.getSkipTime()
+          );
 
           log_debug(
-            `LongPressSeekController: handle delayed seek type: ${seekType} - currentSkipAmount: ${this.currentSkipAmount}.`
+            `${
+              this.title
+            }: handle delayed seek type: ${seekType} - multiplier: ${this.seekIncrementalStrategy.getSkipMultiplier()}, currentSkipAmount: ${this.seekIncrementalStrategy.getSkipTime()}.`
           );
 
-          this.currentSkipAmount = Math.min(
-            this.currentSkipAmount + this.config.SKIP_INCREMENT_STEP,
-            this.config.MAX_SKIP_PER_TICK
-          );
+          this.seekIncrementalStrategy.increment();
         })
       )
       .subscribe({
         complete: () =>
-          log_verbose(
-            "LongPressSeekController: Long press subscription complete"
-          ),
+          log_verbose(`${this.title}: Long press subscription complete`),
         error: (err) =>
-          log_error(
-            "LongPressSeekController: Long press subscription error",
-            err
-          ),
+          log_error(`${this.title}: Long press subscription error`, err),
       });
   }
 
   onSeekEnd() {
-    if (this.isLongPressActive) {
-      const offset = this.seekControllerDelegate.delayedSeekOffset;
-
-      if (offset !== null) {
-        log_debug(
-          `LongPressSeekController: onPressEnd for LongPressSeekController, seek offset: ${offset}`
-        );
-
-        this.seekControllerDelegate.handleSeek(offset);
-      }
-    }
-
+    this.cleanUpSubscription();
     this.seekControllerDelegate.handleSeekComplete();
   }
 
   reset() {
-    this.isLongPressActive = false;
-    this.currentSkipAmount = 0;
+    this.seekIncrementalStrategy.reset();
     this.cleanUpSubscription();
   }
 

package/reactHooks/player/TVSeekControlller/TVSeekController.ts

@@ -5,7 +5,11 @@ import { SEEK_TYPE } from "../const";
 import { createLogger } from "../../../logger";
 import { Player } from "../../../appUtils/playerManager/player";
 import { SeekKeyHandlerListener } from "../../../appUtils/keyInputHandler/KeyInputHandler";
-import { ISeekController, ISeekControllerDelegate } from "./ISeekController";
+import {
+  ISeekController,
+  ISeekControllerDelegate,
+  SeekIncrementalBaseStrategy,
+} from "./ISeekController";
 
 export const { log_warning, log_debug, log_info, log_error, log_verbose } =
   createLogger({
@@ -23,17 +27,16 @@ const CONFIG_TAP_SEEK = {
 };
 
 const CONFIG_LONG_PRESS = {
-  TIMER_INTERVAL_MS: 300,
-  SKIP_INCREMENT_STEP: 5,
-  MAX_SKIP_PER_TICK: 300,
-  INITIAL_SKIP_AMOUNT: 10,
+  TIMER_INTERVAL_MS: 200,
 };
 
 const LONG_PRESS_THRESHOLD = 500;
+const SEEK_END_TIMEOUT_DURATION = 700;
+// prettier-ignore
 
 export class TVSeekController
   implements SeekKeyHandlerListener, ISeekControllerDelegate {
-  public delayedSeekOffset: number | null = null;
+  public delayedSeekPosition: number | null = null;
   private readonly playerController: Player;
   private delayedSeekProgressSubject = new BehaviorSubject<number | null>(null);
   isPlayerInitiallyPaused: null | boolean = null;
@@ -43,14 +46,20 @@ export class TVSeekController
   private readonly tapSeekController: TapSeekController;
   private readonly longPressSeekController: LongPressSeekController;
   private longPressThresholdTimeout: any | null = null;
+  private seekEndTimeout: any | null = null;
 
   constructor(playerController: Player) {
     this.playerController = playerController;
 
-    this.tapSeekController = new TapSeekController(this, CONFIG_TAP_SEEK);
+    this.tapSeekController = new TapSeekController(
+      this,
+      new SeekIncrementalBaseStrategy(),
+      CONFIG_TAP_SEEK
+    );
 
     this.longPressSeekController = new LongPressSeekController(
       this,
+      new SeekIncrementalBaseStrategy(),
       CONFIG_LONG_PRESS
     );
 
@@ -64,30 +73,28 @@ export class TVSeekController
   setStrategy = (seekStrategy: SEEK_STRATEGY) => {
     switch (seekStrategy) {
       case SEEK_STRATEGY.TAP_SEEK:
-        clearTimeout(this.longPressThresholdTimeout);
-        this.longPressThresholdTimeout = null;
         this.currentSeekController = this.tapSeekController;
+        log_debug("TVSeekController: setStrategy - TAP_SEEK");
 
         break;
       case SEEK_STRATEGY.AUTO_SEEK:
-        this.currentSeekController.reset();
         this.currentSeekController = this.longPressSeekController;
+        log_debug("TVSeekController: setStrategy - AUTO_SEEK");
+
         break;
       default:
     }
   };
 
   handleStartSeek = (seekType: SEEK_TYPE) => {
-    if (this.currentSeekType !== seekType) {
-      this.resetAll();
-    }
-
     this.currentSeekType = seekType;
 
     if (this.isPlayerInitiallyPaused === null) {
       this.isPlayerInitiallyPaused = this.playerController.isPaused();
     }
 
+    this.clearLongPressThresholdTimeout();
+    this.clearSeekCompleteTimeout();
     this.setStrategy(SEEK_STRATEGY.TAP_SEEK);
     this.currentSeekController.onStartSeek(seekType);
 
@@ -110,8 +117,8 @@ export class TVSeekController
   };
 
   onSeekEnd = () => {
+    this.clearLongPressThresholdTimeout();
     this.currentSeekController.onSeekEnd();
-    this.setStrategy(SEEK_STRATEGY.TAP_SEEK);
   };
 
   onRewindPressOut = () => {
@@ -122,40 +129,39 @@ export class TVSeekController
     this.onSeekEnd();
   };
 
-  public onVideoProgress = (position: number) => {
-    if (this.delayedSeekOffset) {
+  onVideoProgress = (position: number) => {
+    if (this.delayedSeekPosition !== null) {
       return;
     }
 
-    // TODO: If 1 second after seek, send
-
     this.delayedSeekProgressSubject.next(position);
   };
 
-  handleDelayedSeek = (offset: number) => {
+  handleDelayedSeek = (offset: number = 0) => {
     this.handlePlayerPause();
 
-    const newOffset = (this.delayedSeekOffset || 0) + offset;
-    const currentPos = this.playerController.getPosition();
+    const currentPos =
+      this.delayedSeekPosition === null
+        ? this.playerController.getPosition()
+        : this.delayedSeekPosition;
+
     let targetPos = currentPos;
 
     if (this.currentSeekType === SEEK_TYPE.FORWARD) {
       targetPos = Math.min(
-        currentPos + newOffset,
+        currentPos + offset,
         this.playerController.getSeekableDuration()
       );
     } else if (this.currentSeekType === SEEK_TYPE.REWIND) {
-      targetPos = Math.max(0, currentPos - newOffset);
+      targetPos = Math.max(0, currentPos - offset);
     } else {
       log_warning(
         `TVSeekController: handleDelayedSeek - invalid seek type: ${this.currentSeekType}`
       );
     }
 
-    this.delayedSeekOffset = newOffset;
-
     log_debug(
-      `TVSeekController: handleDelayedSeek - targetPos: ${targetPos}, offset: ${newOffset}, skipTime: ${offset}`
+      `TVSeekController: handleDelayedSeek - targetPos: ${targetPos}, skipTime: ${offset}`
     );
 
     const prevValue = this.delayedSeekProgressSubject.getValue();
@@ -168,9 +174,18 @@ export class TVSeekController
       }
     }
 
+    this.delayedSeekPosition = targetPos;
     this.delayedSeekProgressSubject.next(targetPos);
   };
 
+  handleSeekTo = (newPosition: number) => {
+    this.playerController.seekTo(newPosition);
+
+    if (!this.isPlayerInitiallyPaused) {
+      this.playerController.play();
+    }
+  };
+
   handleSeek = (offset: number) => {
     this.playerController[this.currentSeekType](offset);
 
@@ -180,11 +195,23 @@ export class TVSeekController
   };
 
   handleSeekComplete = () => {
-    this.resetAll();
+    this.clearSeekCompleteTimeout();
+
+    this.seekEndTimeout = setTimeout(() => {
+      if (this.delayedSeekPosition !== null) {
+        this.handleSeekTo(this.delayedSeekPosition);
+      }
+
+      log_debug(
+        `handleSeekComplete: Seek finished, type: ${this.currentSeekController.title}, seekPosition: ${this.delayedSeekPosition}. Reset all states and seek position.`
+      );
+
+      this.resetAll();
+    }, SEEK_END_TIMEOUT_DURATION);
   };
 
-  isAutoSeeking = (): boolean => {
-    return this.longPressSeekController.isLongPressActive;
+  isSeeking = (): boolean => {
+    return this.delayedSeekPosition !== null;
   };
 
   handlePlayerPause = () => {
@@ -195,12 +222,34 @@ export class TVSeekController
     this.playerController.pause();
   };
 
+  clearSeekCompleteTimeout = () => {
+    if (this.seekEndTimeout === null) {
+      return;
+    }
+
+    clearTimeout(this.seekEndTimeout);
+    this.seekEndTimeout = null;
+  };
+
+  clearLongPressThresholdTimeout = () => {
+    if (this.longPressThresholdTimeout === null) {
+      return;
+    }
+
+    clearTimeout(this.longPressThresholdTimeout);
+    this.longPressThresholdTimeout = null;
+  };
+
   resetAll() {
     log_debug("TVSeekController: Reset all states");
     this.currentSeekType = null;
-    this.delayedSeekOffset = null;
+
+    this.delayedSeekPosition = null;
     this.isPlayerInitiallyPaused = null;
 
+    this.clearSeekCompleteTimeout();
+    this.clearLongPressThresholdTimeout();
+
     this.tapSeekController.reset();
     this.longPressSeekController.reset();
 

package/reactHooks/player/TVSeekControlller/TapSeekController.ts

@@ -1,75 +1,53 @@
-import { ISeekController, ISeekControllerDelegate } from "./ISeekController";
-import { SEEK_TYPE, MAX_SEEK_TIME, SKIP_TIME_BASE } from "../const";
+import {
+  ISeekController,
+  ISeekControllerDelegate,
+  SeekIncrementalBaseStrategy,
+} from "./ISeekController";
+import { SEEK_TYPE } from "../const";
 import { log_debug } from "./TVSeekController";
 
 interface TapPressConfig {
   CLICKS_BEFORE_PAUSE: number;
 }
 
-const getSkipTime = (multiplier: number) =>
-  Math.min(MAX_SEEK_TIME, SKIP_TIME_BASE * multiplier);
-
 export class TapSeekController implements ISeekController {
-  private tapSequenceTimeout: any | null = null;
-  private seekMultiplier = 1;
-  private readonly ON_PRESS_RESET_DURATION = 500; // ms
-
+  readonly title = "TapSeek";
   constructor(
     private seekControllerDelegate: ISeekControllerDelegate,
+    private seekIncrementalStrategy: SeekIncrementalBaseStrategy,
     private config: TapPressConfig
   ) {}
 
   onStartSeek = (seekType: SEEK_TYPE) => {
-    log_debug(`TapSeekController: start tap seek type: ${seekType}.`);
+    log_debug(`${this.title}: start tap seek type: ${seekType}.`);
 
-    if (this.tapSequenceTimeout) {
-      clearTimeout(this.tapSequenceTimeout);
-      this.tapSequenceTimeout = null;
-    }
+    const skipTime = this.seekIncrementalStrategy.getSkipTime();
+    const seekMultiplier = this.seekIncrementalStrategy.getSkipMultiplier();
 
-    const skipTime = getSkipTime(this.seekMultiplier);
-
-    if (this.seekMultiplier > this.config.CLICKS_BEFORE_PAUSE) {
+    if (seekMultiplier > this.config.CLICKS_BEFORE_PAUSE) {
       log_debug(
-        `TapSeekController: handle delayed seek type:${seekType} - skipTime: ${skipTime}.`
+        `${this.title}: handle delayed seek type:${seekType} - skipTime: ${skipTime}, seekMultiplier: ${seekMultiplier}.`
       );
 
       this.seekControllerDelegate.handleDelayedSeek(skipTime);
     } else {
       log_debug(
-        `TapSeekController: handle seek type:${seekType} - skipTime: ${skipTime}.`
+        `${this.title}: handle seek type:${seekType} - skipTime: ${skipTime}.`
       );
 
       this.seekControllerDelegate.handleSeek(skipTime);
     }
 
-    this.seekMultiplier++;
+    this.seekIncrementalStrategy.increment();
   };
 
   onSeekEnd = () => {
-    this.tapSequenceTimeout = setTimeout(() => {
-      if (this.seekControllerDelegate.delayedSeekOffset !== null) {
-        this.seekControllerDelegate.handleSeek(
-          this.seekControllerDelegate.delayedSeekOffset
-        );
-      }
-
-      log_debug(
-        `TapSeekController: Tap sequence timeout fired, delayedSeekOffset: ${this.seekControllerDelegate.delayedSeekOffset}.`
-      );
-
-      this.seekControllerDelegate.handleSeekComplete();
-    }, this.ON_PRESS_RESET_DURATION);
+    this.seekControllerDelegate.handleSeekComplete();
   };
 
   reset = () => {
-    log_debug("TapSeekController: Reset states");
+    log_debug("{this.title}: Reset states");
 
-    this.seekMultiplier = 1;
-
-    if (this.tapSequenceTimeout) {
-      clearTimeout(this.tapSequenceTimeout);
-      this.tapSequenceTimeout = null;
-    }
+    this.seekIncrementalStrategy.reset();
   };
 }

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

@@ -0,0 +1,115 @@
+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({ legacyFakeTimers: true });
+
+const rewind = jest.fn();
+const forward = jest.fn();
+
+jest
+  .spyOn(playerManager, "getInstanceController")
+  .mockReturnValue({ 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);
+    });
+  });
+});