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

// oppositeOfOmit
function keep(props: Object, keysToKeep: Array<String>) {
  const obj = {}
  keysToKeep.forEach((key: string) => {
    obj[key] = props[key]
  })
  return obj
}

const CONTROL_PROPS = Object.freeze([
  'state',
  'videoLength',
  'title',
  'slogan',
  'shareTitle',
])
const VIDEO_PROPS = Object.freeze([
  'state',
  'thumbnailImage',
  'shouldAutoPlay',
  'shouldLoop',
  'preload',
  'hasNativeControls',
])
export function defaultRenderControls(
  props: VideoPresetControlProps,
  state: VideoPresetStateType
) {
  console.debug('[Video] defaultRenderControls')

  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,
  }

  console.debug('[Video] defaultRenderVideo')
  console.dir(videoProps)

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