'use client'

import YouTube, {YouTubeProps} from 'react-youtube'

export default function YoutubeComponent({id}: {id: string}) {
	const onPlayerReady: YouTubeProps['onReady'] = e => {
		e.target.pauseVideo()
	}

	const opts: YouTubeProps['opts'] = {
		height: '100%',
		width: '100%',
		playerVars: {
			// https://developers.google.com/youtube/player_parameters
			autoplay: 0
		}
	}

	return (
		<YouTube
			id={`video-yt-${id}`}
			videoId={id}
			opts={opts}
			onReady={onPlayerReady}
			iframeClassName='bw-yt-video'
		/>
	)
}
