feat(controls): add autoDismiss prop

premieroctet · Dec 20, 2022 · 1f88f19 · 1f88f19
1 parent b79acbe
commit 1f88f19
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 2 deletions.
diff --git a/src/components/VideoControls.tsx b/src/components/VideoControls.tsx
@@ -46,6 +46,7 @@ export const VideoControls = ({
   videoElement,
   onZoomIn,
   onZoomOut,
+  autoDismiss = true,
 }: PropsWithChildren<VideoControlProps>) => {
   const [visible, setVisible] = useState(initialVisible);
   const opacityAnim = useSharedValue(initialVisible ? 1 : 0);
@@ -143,6 +144,7 @@ export const VideoControls = ({
       visible={visible}
       visibilityDuration={autoHideAfterDuration}
       isPlaying={componentsProps?.videoState?.isPlaying ?? false}
+      autoDismiss={autoDismiss}
     >
       <GestureDetector
         gesture={Gesture.Exclusive(pinchGesture, doubleTap, tapGesture)}

diff --git a/src/components/types.ts b/src/components/types.ts
@@ -195,6 +195,12 @@ export type VideoControlProps = {
    * Function called on pinch gesture that is zooming out
    */
   onZoomOut?: () => void;
+  /**
+   * Boolean indicating the auto dismiss of the controls.
+   *
+   * Defaults to true
+   */
+  autoDismiss?: boolean;
 };
 
 export type ControlTouchableProps = {

diff --git a/src/context/ControlsVisibility.tsx b/src/context/ControlsVisibility.tsx
@@ -27,6 +27,7 @@ type ControlsVisibilityProviderProps = {
   onHide: () => void;
   visibilityDuration?: number;
   isPlaying: boolean;
+  autoDismiss?: boolean;
 };
 
 const ControlsVisibilityProvider = ({
@@ -35,17 +36,18 @@ const ControlsVisibilityProvider = ({
   children,
   visibilityDuration,
   isPlaying,
+  autoDismiss = true,
 }: PropsWithChildren<ControlsVisibilityProviderProps>) => {
   const timeoutId = useRef<NodeJS.Timeout | undefined>(undefined);
   const startTimer = useCallback(() => {
-    if (!timeoutId.current) {
+    if (!timeoutId.current && autoDismiss) {
       timeoutId.current = setTimeout(() => {
         if (isPlaying) {
           onHide();
         }
       }, visibilityDuration);
     }
-  }, [visibilityDuration, onHide, isPlaying]);
+  }, [visibilityDuration, onHide, isPlaying, autoDismiss]);
 
   const stopTimer = useCallback(() => {
     clearTimeout(timeoutId.current);