import React from 'react'
import { omit, keep } from '@skava/utils'
import { VideoPlayer as Video } from 'atoms/Video'
import { VideoControls } from './VideoControls'
import {
  VideoPresetProps,
  VideoPresetControlProps,
  VideoPresetStateType,
} from './typings'

const CONTROL_PROPS = Object.freeze([
  'state',
  'videoLength',
  'title',
  'slogan',
  'shareTitle',
])

const VIDEO_PROPS = Object.freeze([
  'state',
  'thumbnailImage',
  'shouldAutoPlay',
  'shouldLoop',
  'preload',
  'muted',
  'hasNativeControls',
  'hasPlayButton',
  'shouldShowVideoInformation',
])

export function defaultRenderControls(
  props: VideoPresetControlProps,
  state: VideoPresetStateType
) {
  const controlProps = keep(props, CONTROL_PROPS)
  return <VideoControls {...controlProps} state={state} />
}

export function defaultRenderVideo(
  props: VideoPresetProps,
  state: VideoPresetStateType
) {
  const { mp4Source, ...remainingProps } = props
  const strippedProps = omit(remainingProps, CONTROL_PROPS)

  const videoProps = {
    ...strippedProps,

    // props overwriting from state
    hasNativeControls: state.hasNativeControls,
    hasPlayButton: state.hasPlayButton,
    shouldShowVideoInformation: state.shouldShowVideoInformation,
    isPaused: !state.isPlaying,
    muted: strippedProps.shouldAutoPlay,
  }

  return <Video {...videoProps} />
}