diff --git a/projects/packages/videopress/changelog/update-videopress-handle-title-when-uploading-file b/projects/packages/videopress/changelog/update-videopress-handle-title-when-uploading-file new file mode 100644 index 0000000000000..29a47c7833576 --- /dev/null +++ b/projects/packages/videopress/changelog/update-videopress-handle-title-when-uploading-file @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +VideoPress: fix setting title when uploading video file diff --git a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js index 113644e7e9a8d..2141009b58c79 100644 --- a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js +++ b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/index.js @@ -32,7 +32,7 @@ const VideoPressUploader = ( { onReplaceCancel, } ) => { const [ uploadPaused, setUploadPaused ] = useState( false ); - const [ uploadCompleted, setUploadCompleted ] = useState( false ); + const [ uploadedVideoData, setUploadedVideoData ] = useState( false ); const [ isUploadingInProgress, setIsUploadingInProgress ] = useState( false ); const [ isVerifyingLocalMedia, setIsVerifyingLocalMedia ] = useState( false ); @@ -86,19 +86,11 @@ const VideoPressUploader = ( { setUploadErrorDataState( error ); }, [] ); - /* - * Handle upload success - */ - const handleUploadSuccess = attr => { - setAttributes( attr ); - setUploadCompleted( true ); - }; - // Get file upload handlers, data, and error. const { uploadHandler, resumeHandler, error: uploadingError } = useResumableUploader( { onError: setUploadErrorData, onProgress: setUploadingProgress, - onSuccess: handleUploadSuccess, + onSuccess: setUploadedVideoData, } ); /** @@ -138,7 +130,7 @@ const VideoPressUploader = ( { const startUploadFromLibrary = attachmentId => { uploadFromLibrary( attachmentId ) .then( result => { - handleUploadSuccess( result ); + setUploadedVideoData( result ); } ) .catch( error => { setUploadErrorDataState( error ); @@ -298,7 +290,7 @@ const VideoPressUploader = ( { file={ uploadFile } progress={ progress } paused={ uploadPaused } - completed={ uploadCompleted } + uploadedVideoData={ uploadedVideoData } onPauseOrResume={ pauseOrResumeUpload } onReplaceCancel={ cancelUploadingReplaceFile } isReplacing={ isReplacing } diff --git a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/style.scss b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/style.scss index face22e3cb35a..4aafb8a5dee86 100644 --- a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/style.scss +++ b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/style.scss @@ -63,6 +63,7 @@ &__title { margin-bottom: 15px; + width: 100%; } &__upload-link { diff --git a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/uploader-editor.js b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/uploader-editor.js index 9b6d48b4ee46e..2e878395a3abe 100644 --- a/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/uploader-editor.js +++ b/projects/packages/videopress/src/client/block-editor/blocks/video/components/videopress-uploader/uploader-editor.js @@ -2,21 +2,19 @@ * WordPress dependencies */ import { MediaUpload } from '@wordpress/block-editor'; -import { Button, TextControl, BaseControl } from '@wordpress/components'; -import { createInterpolateElement, useRef, useState } from '@wordpress/element'; -import { escapeHTML } from '@wordpress/escape-html'; +import { Button, BaseControl } from '@wordpress/components'; +import { createInterpolateElement, useRef } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; import { Icon } from '@wordpress/icons'; import classNames from 'classnames'; +/** + * Internal dependencies + */ import playIcon from '../../../../../components/icons/play-icon'; import VideoFrameSelector from '../../../../../components/video-frame-selector'; const VIDEO_POSTER_ALLOWED_MEDIA_TYPES = [ 'image' ]; -const removeFileNameExtension = name => { - return name.replace( /\.[^/.]+$/, '' ); -}; - const PosterImage = ( { videoPosterImageUrl } ) => { return (