import * as React from "react";
import { useState, useCallback } from "react";
import { makeProvider } from "../../_lib";
import { VideoPlayerCollapseProps } from "../../components/video-player-collapse";
import { VideoItem } from "../../components/video/video";

function useVideoPlayerManager(): {
  openVideoPlayer: (data: any) => void;
  videoPlayerModal: VideoPlayerCollapseProps;
} {
  const [showVideoPlayer, seShowVideoPlayer] = useState(false);
  const [data, setData] = useState<VideoItem>();

  const openVideoPlayer = useCallback((data: any) => {
    seShowVideoPlayer(true);
    setData(data);
  }, []);
  const onClose = useCallback(() => {
    seShowVideoPlayer(false);
    setData(undefined);
  }, []);
  return {
    openVideoPlayer,
    videoPlayerModal: {
      onClose,
      open: showVideoPlayer,
      video: data,
    },
  };
}

export const {
  Provider: VideoPlayerManagerProvider,
  useProvider: useVideoPlayerManagerProvider,
} = makeProvider(useVideoPlayerManager);