import React from 'react' import classNames from 'classnames' import { Button } from '@sourcegraph/wildcard' import { useWebviewPageContext } from '../../platform/context' import styles from './ModalVideo.module.scss' // We can't play video in VS Code Desktop: https://stackoverflow.com/a/57512681 // Open video in YouTube instead. interface ModalVideoProps { id: string title: string src: string thumbnail?: { src: string; alt: string } onToggle?: (isOpen: boolean) => void showCaption?: boolean className?: string assetsRoot?: string } export const ModalVideo: React.FunctionComponent> = ({ title, src, thumbnail, onToggle, showCaption = false, className, assetsRoot = '', }) => { const { extensionCoreAPI } = useWebviewPageContext() const onClick = (): void => { onToggle?.(false) extensionCoreAPI.openLink(src).catch(error => { console.error(`Error opening video at ${src}`, error) }) } let thumbnailElement = thumbnail ? ( ) : null if (showCaption) { thumbnailElement = (

{thumbnailElement}

) } return

{thumbnailElement}

} const PlayIcon = React.memo(() => ( ))