diff --git a/packages/block-editor/src/components/media-replace-flow/index.js b/packages/block-editor/src/components/media-replace-flow/index.js index a2fb5f36036aaa..29790419af1317 100644 --- a/packages/block-editor/src/components/media-replace-flow/index.js +++ b/packages/block-editor/src/components/media-replace-flow/index.js @@ -1,3 +1,8 @@ +/** + * External dependencies + */ +import classnames from 'classnames'; + /** * WordPress dependencies */ @@ -58,6 +63,7 @@ const MediaReplaceFlow = ( { const mediaUpload = useSelect( ( select ) => { return select( blockEditorStore ).getSettings().mediaUpload; }, [] ); + const canUpload = !! mediaUpload; const editMediaButtonRef = useRef(); const errorNoticeID = `block-editor/media-replace-flow/error-notice/${ ++uniqueId }`; @@ -152,7 +158,7 @@ const MediaReplaceFlow = ( { renderContent={ ( { onClose } ) => ( <> - <> + ) } /> - - { - uploadFiles( event, onClose ); - } } - accept={ accept } - multiple={ multiple } - render={ ( { openFileDialog } ) => { - return ( - { - openFileDialog(); - } } - > - { __( 'Upload' ) } - - ); - } } - /> - - + { + uploadFiles( event, onClose ); + } } + accept={ accept } + multiple={ multiple } + render={ ( { openFileDialog } ) => { + return ( + { + openFileDialog(); + } } + > + { __( 'Upload' ) } + + ); + } } + /> + { onToggleFeaturedImage && ( { onSelectURL && ( // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -
+ { __( 'Current media URL:' ) } diff --git a/packages/block-editor/src/components/media-replace-flow/style.scss b/packages/block-editor/src/components/media-replace-flow/style.scss index 81484cbf806623..dd3b0563c3ca8a 100644 --- a/packages/block-editor/src/components/media-replace-flow/style.scss +++ b/packages/block-editor/src/components/media-replace-flow/style.scss @@ -10,12 +10,15 @@ } .block-editor-media-flow__url-input { - border-top: $border-width solid $gray-900; - margin-top: $grid-unit-10; margin-right: -$grid-unit-10; margin-left: -$grid-unit-10; padding: $grid-unit-20; + &.has-siblings { + border-top: $border-width solid $gray-900; + margin-top: $grid-unit-10; + } + .block-editor-media-replace-flow__image-url-label { display: block; top: $grid-unit-20;