Changed the id reference for the draggable clone

It now uses the Gallery Image itself instead of the whole Gallery Item because of styling issues
WordPress · Sep 30, 2018 · c6aa720 · c6aa720
1 parent f070faf
commit c6aa720
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/packages/block-library/src/gallery/edit.js b/packages/block-library/src/gallery/edit.js
@@ -265,7 +265,7 @@ class GalleryEdit extends Component {
 					{ dropZone }
 					{ images.map( ( img, index ) => {
 						const imageId = `gallery_image_${ clientId }_${ img.id }`;
-						return <li id={ imageId } className="blocks-gallery-item" key={ img.id || img.url }>
+						return <li className="blocks-gallery-item" key={ img.id || img.url }>
 							<ReorderZone index={ index } handleDrop={ this.handleDrop } />
 							<GalleryImage
 								url={ img.url }

diff --git a/packages/block-library/src/gallery/gallery-image.js b/packages/block-library/src/gallery/gallery-image.js
@@ -103,7 +103,7 @@ class GalleryImage extends Component {
 		// Disable reason: Image itself is not meant to be
 		// interactive, but should direct image selection and unfocus caption fields
 		// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events
-		const img = url ? <img src={ url } alt={ alt } data-id={ id } onClick={ this.onImageClick } /> : <Spinner />;
+		const img = url ? <img id={ dragId }src={ url } alt={ alt } data-id={ id } onClick={ this.onImageClick } /> : <Spinner />;
 
 		const className = classnames( {
 			'is-selected': isSelected,