diff --git a/src/components/node/NodeVideoBlock/index.tsx b/src/components/node/NodeVideoBlock/index.tsx new file mode 100644 index 00000000..0c250b4c --- /dev/null +++ b/src/components/node/NodeVideoBlock/index.tsx @@ -0,0 +1,36 @@ +import React, { FC, useMemo } from 'react'; +import { INode } from '~/redux/types'; +import * as styles from './styles.scss'; +import path from 'ramda/es/path'; + +interface IProps { + node: INode; +} + +const NodeVideoBlock: FC = ({ node }) => { + const video = useMemo(() => { + const url: string = path(['blocks', 0, 'url'], node); + const match = + url && + url.match( + /http(?:s?):\/\/(?:www\.)?youtu(?:be\.com\/watch\?v=|\.be\/)([\w\-\_]*)(&(amp;)?[\w\?=]*)?/ + ); + + return match && match[1]; + }, [node]); + + return ( +
+