diff --git a/packages/block-library/src/video/edit.js b/packages/block-library/src/video/edit.js index 64b22726687804..1f26f3a4355bfa 100644 --- a/packages/block-library/src/video/edit.js +++ b/packages/block-library/src/video/edit.js @@ -54,7 +54,6 @@ function VideoEdit( { } ) { const instanceId = useInstanceId( VideoEdit ); const videoPlayer = useRef(); - const posterImageButton = useRef(); const { id, controls, poster, src, tracks } = attributes; const [ temporaryURL, setTemporaryURL ] = useState( attributes.blob ); const dropdownMenuProps = useToolsPanelDropdownMenuProps(); @@ -174,13 +173,6 @@ function VideoEdit( { ); } - function onRemovePoster() { - setAttributes( { poster: undefined } ); - - // Move focus back to the Media Upload button. - posterImageButton.current.focus(); - } - return ( <> { isSingleSelected && ( @@ -230,8 +222,6 @@ function VideoEdit( { diff --git a/packages/block-library/src/video/poster-image.js b/packages/block-library/src/video/poster-image.js index 7be5255375d0eb..cde95f974d8e69 100644 --- a/packages/block-library/src/video/poster-image.js +++ b/packages/block-library/src/video/poster-image.js @@ -8,14 +8,10 @@ import { __experimentalToolsPanelItem as ToolsPanelItem, } from '@wordpress/components'; import { __, sprintf } from '@wordpress/i18n'; +import { useRef } from '@wordpress/element'; -function PosterImage( { - poster, - setAttributes, - posterImageButton, - onRemovePoster, - instanceId, -} ) { +function PosterImage( { poster, setAttributes, instanceId } ) { + const posterImageButton = useRef(); const VIDEO_POSTER_ALLOWED_MEDIA_TYPES = [ 'image' ]; const videoPosterDescription = `video-block__poster-image-description-${ instanceId }`; @@ -24,6 +20,13 @@ function PosterImage( { setAttributes( { poster: image.url } ); } + function onRemovePoster() { + setAttributes( { poster: undefined } ); + + // Move focus back to the Media Upload button. + posterImageButton.current.focus(); + } + return (