picker refactor

Author: jorgefilipecosta

docs/reference/deprecated.md

@@ -22,6 +22,7 @@ Gutenberg's deprecation policy is intended to support backwards-compatibility fo
 - `getMetaBoxes` selector (`core/edit-post`) has been removed. Use `getActiveMetaBoxLocations` selector (`core/edit-post`) instead.
 - `getMetaBox` selector (`core/edit-post`) has been removed. Use `isMetaBoxLocationActive` selector (`core/edit-post`) instead.
 - Attribute type coercion has been removed. Omit the source to preserve type via serialized comment demarcation.
+- `mediaDetails` in object passed to `onFileChange` callback of `wp.editor.mediaUpload`. Please use `media_details` property instead.
 
 ## 4.1.0
 

packages/block-library/src/gallery/edit.js

@@ -44,7 +44,10 @@ export function defaultColumnsNumber( attributes ) {
 	return Math.min( 3, attributes.images.length );
 }
 
-export const RELEVANT_MEDIA_FIELDS = [ 'alt', 'caption', 'id', 'link', 'url' ];
+const RELEVANT_MEDIA_FIELDS = [ 'alt', 'caption', 'id', 'link', 'url' ];
+export const pickRelevantMediaFiles = ( image ) => {
+	return pick( image, RELEVANT_MEDIA_FIELDS );
+};
 
 class GalleryEdit extends Component {
 	constructor() {
@@ -89,7 +92,7 @@ class GalleryEdit extends Component {
 
 	onSelectImages( images ) {
 		this.props.setAttributes( {
-			images: images.map( ( image ) => pick( image, RELEVANT_MEDIA_FIELDS ) ),
+			images: images.map( ( image ) => pickRelevantMediaFiles( image ) ),
 		} );
 	}
 
@@ -137,7 +140,7 @@ class GalleryEdit extends Component {
 			allowedTypes: ALLOWED_MEDIA_TYPES,
 			filesList: files,
 			onFileChange: ( images ) => {
-				const imagesNormalized = images.map( ( image ) => pick( image, RELEVANT_MEDIA_FIELDS ) );
+				const imagesNormalized = images.map( ( image ) => pickRelevantMediaFiles( image ) );
 				setAttributes( {
 					images: currentImages.concat( imagesNormalized ),
 				} );

packages/block-library/src/gallery/index.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { filter, every, pick } from 'lodash';
+import { filter, every } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -14,7 +14,7 @@ import { createBlobURL } from '@wordpress/blob';
 /**
  * Internal dependencies
  */
-import { default as edit, defaultColumnsNumber, RELEVANT_MEDIA_FIELDS } from './edit';
+import { default as edit, defaultColumnsNumber, pickRelevantMediaFiles } from './edit';
 
 const blockAttributes = {
 	images: {
@@ -135,7 +135,7 @@ export const settings = {
 					mediaUpload( {
 						filesList: files,
 						onFileChange: ( images ) => onChange( block.clientId, {
-							images: images.map( ( image ) => pick( image, RELEVANT_MEDIA_FIELDS ) ),
+							images: images.map( ( image ) => pickRelevantMediaFiles( image ) ),
 						} ),
 						allowedTypes: [ 'image' ],
 					} );