Plyr w/ TypeScript

ReactPlyr.tsx

export const VideoPlayer = ({youtubeId}: VideoPlayerProps) => {
    useEffect(() => {
        const options = {
            noCookie: false,
            rel: 0,
            showinfo: 1,
            iv_load_policy: 3,
            modestbranding: 1
        }
        if (typeof document !== `undefined`) {
            const Plyr = require('plyr');
            require("plyr/dist/plyr.css");
            const player = new Plyr(".js-plyr", options);
            player.source = {
                type: "video",
                sources: [
                    {
                        src: youtubeId,
                        provider: "youtube"
                    }
                ]
            };
        }
    })