diff --git a/editor/utils/editor-media-upload/index.js b/editor/utils/editor-media-upload/index.js index 2823592444a5c6..d2ffbad98729fa 100644 --- a/editor/utils/editor-media-upload/index.js +++ b/editor/utils/editor-media-upload/index.js @@ -8,7 +8,6 @@ import { noop } from 'lodash'; */ import { select } from '@wordpress/data'; import { mediaUpload } from '@wordpress/utils'; -import { __, sprintf } from '@wordpress/i18n'; /** * Upload a media file when the file upload button is activated. @@ -31,22 +30,6 @@ export default function editorMediaUpload( { } ) { const postId = select( 'core/editor' ).getCurrentPostId(); - const errorHandler = ( { file, sizeAboveLimit, generalError } ) => { - let errorMsg; - if ( sizeAboveLimit ) { - errorMsg = sprintf( - __( '%s exceeds the maximum upload size for this site.' ), - file.name - ); - } else if ( generalError ) { - errorMsg = sprintf( - __( 'Error while uploading file %s to the media library.' ), - file.name - ); - } - onError( errorMsg ); - }; - mediaUpload( { allowedType, filesList, @@ -55,6 +38,6 @@ export default function editorMediaUpload( { post: postId, }, maxUploadFileSize, - onError: errorHandler, + onError: ( { message } ) => onError( message ), } ); } diff --git a/lib/client-assets.php b/lib/client-assets.php index 2835cc187ece31..5d40d4cae6c462 100644 --- a/lib/client-assets.php +++ b/lib/client-assets.php @@ -185,7 +185,7 @@ function gutenberg_register_scripts_and_styles() { wp_register_script( 'wp-utils', gutenberg_url( 'build/utils/index.js' ), - array( 'lodash', 'wp-blob', 'wp-deprecated', 'wp-dom', 'wp-api-request' ), + array( 'lodash', 'wp-blob', 'wp-deprecated', 'wp-dom', 'wp-api-request', 'wp-i18n' ), filemtime( gutenberg_dir_path() . 'build/utils/index.js' ), true ); @@ -1048,7 +1048,8 @@ function gutenberg_editor_scripts_and_styles( $hook ) { } // Initialize media settings. wp_add_inline_script( 'wp-editor', 'window._wpMediaSettings = ' . wp_json_encode( array( - 'maxUploadSize' => $max_upload_size, + 'maxUploadSize' => $max_upload_size, + 'allowedMimeTypes' => get_allowed_mime_types(), ) ), 'before' ); // Prepare Jed locale data. diff --git a/utils/mediaupload.js b/utils/mediaupload.js index c42a4996a1c4a3..02b76603b95739 100644 --- a/utils/mediaupload.js +++ b/utils/mediaupload.js @@ -1,7 +1,12 @@ /** * External Dependencies */ -import { compact, forEach, get, noop, startsWith } from 'lodash'; +import { compact, forEach, get, includes, noop, startsWith } from 'lodash'; + +/** + * WordPress dependencies + */ +import { __, sprintf } from '@wordpress/i18n'; /** * WordPress dependencies @@ -38,15 +43,41 @@ export function mediaUpload( { filesSet[ idx ] = value; onFileChange( compact( filesSet ) ); }; + + // Allowed type specified by consumer const isAllowedType = ( fileType ) => startsWith( fileType, `${ allowedType }/` ); + + // Allowed types for the current WP_User + const allowedMimeTypesForUser = get( window, [ '_wpMediaSettings', 'allowedMimeTypes' ] ); + const isAllowedMimeTypeForUser = ( fileType ) => { + return includes( allowedMimeTypesForUser, fileType ); + }; + files.forEach( ( mediaFile, idx ) => { if ( ! isAllowedType( mediaFile.type ) ) { return; } + // verify if user is allowed to upload this mime type + if ( allowedMimeTypesForUser && ! isAllowedMimeTypeForUser( mediaFile.type ) ) { + onError( { + code: 'MIME_TYPE_NOT_ALLOWED_FOR_USER', + message: __( 'Sorry, this file type is not permitted for security reasons.' ), + file: mediaFile, + } ); + return; + } + // verify if file is greater than the maximum file upload size allowed for the site. if ( maxUploadFileSize && mediaFile.size > maxUploadFileSize ) { - onError( { sizeAboveLimit: true, file: mediaFile } ); + onError( { + code: 'SIZE_ABOVE_LIMIT', + message: sprintf( + __( '%s exceeds the maximum upload size for this site.' ), + mediaFile.name + ), + file: mediaFile, + } ); return; } @@ -69,7 +100,14 @@ export function mediaUpload( { () => { // Reset to empty on failure. setAndUpdateFiles( idx, null ); - onError( { generalError: true, file: mediaFile } ); + onError( { + code: 'GENERAL', + message: sprintf( + __( 'Error while uploading file %s to the media library.' ), + mediaFile.name + ), + file: mediaFile, + } ); } ); } ); diff --git a/utils/test/mediaupload.js b/utils/test/mediaupload.js index 898030d3a2ec55..4f779acf9c3657 100644 --- a/utils/test/mediaupload.js +++ b/utils/test/mediaupload.js @@ -45,7 +45,7 @@ describe( 'mediaUpload', () => { expect( console.error ).not.toHaveBeenCalled(); } ); - it( 'should call error handler with the correct message if file size is greater than the maximum', () => { + it( 'should call error handler with the correct error object if file size is greater than the maximum', () => { const onError = jest.fn(); mediaUpload( { allowedType: 'image', @@ -54,6 +54,28 @@ describe( 'mediaUpload', () => { maxUploadFileSize: 512, onError, } ); - expect( onError.mock.calls ).toEqual( [ [ { sizeAboveLimit: true, file: validMediaObj } ] ] ); + expect( onError ).toBeCalledWith( { + code: 'SIZE_ABOVE_LIMIT', + file: validMediaObj, + message: `${ validMediaObj.name } exceeds the maximum upload size for this site.`, + } ); + } ); + + it( 'should call error handler with the correct error object if file type is not allowed for user', () => { + const onError = jest.fn(); + global._wpMediaSettings = { + allowedMimeTypes: { aac: 'audio/aac' }, + }; + mediaUpload( { + allowedType: 'image', + filesList: [ validMediaObj ], + onFileChange, + onError, + } ); + expect( onError ).toBeCalledWith( { + code: 'MIME_TYPE_NOT_ALLOWED_FOR_USER', + file: validMediaObj, + message: 'Sorry, this file type is not permitted for security reasons.', + } ); } ); } );