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 dd6000a5f68451..c2e1a43d2013e6 100644 --- a/packages/block-editor/src/components/media-replace-flow/index.js +++ b/packages/block-editor/src/components/media-replace-flow/index.js @@ -1,8 +1,3 @@ -/** - * External dependencies - */ -import clsx from 'clsx'; - /** * WordPress dependencies */ @@ -61,10 +56,7 @@ const MediaReplaceFlow = ( { handleUpload = true, popoverProps, } ) => { - const mediaUpload = useSelect( ( select ) => { - return select( blockEditorStore ).getSettings().mediaUpload; - }, [] ); - const canUpload = !! mediaUpload; + const { getSettings } = useSelect( blockEditorStore ); const editMediaButtonRef = useRef(); const errorNoticeID = `block-editor/media-replace-flow/error-notice/${ ++uniqueId }`; @@ -107,7 +99,7 @@ const MediaReplaceFlow = ( { return onSelect( files ); } onFilesUpload( files ); - mediaUpload( { + getSettings().mediaUpload( { allowedTypes, filesList: files, onFileChange: ( [ media ] ) => { @@ -219,15 +211,7 @@ const MediaReplaceFlow = ( { { 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 61df542cf58404..d9d8d1c98c11f5 100644 --- a/packages/block-editor/src/components/media-replace-flow/style.scss +++ b/packages/block-editor/src/components/media-replace-flow/style.scss @@ -9,17 +9,17 @@ margin-left: 4px; } +.block-editor-media-replace-flow__media-upload-menu:not(:empty) + .block-editor-media-flow__url-input { + border-top: $border-width solid $gray-900; + margin-top: $grid-unit-10; + padding-bottom: $grid-unit-10; +} + .block-editor-media-flow__url-input { 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; - padding-bottom: $grid-unit-10; - } - .block-editor-media-replace-flow__image-url-label { display: block; top: $grid-unit-20;