From c6aa7206ba8ecd43e68eddc42da96d7614603207 Mon Sep 17 00:00:00 2001
From: caxco93 <caxco93@gmail.com>
Date: Sun, 30 Sep 2018 04:28:59 -0500
Subject: [PATCH] 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
---
 packages/block-library/src/gallery/edit.js          | 2 +-
 packages/block-library/src/gallery/gallery-image.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/block-library/src/gallery/edit.js b/packages/block-library/src/gallery/edit.js
index 6d04a8ed4b8ee8..c52b1e342d39dd 100644
--- 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
index c6d16212a69c9b..ce1902609f17dd 100644
--- 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,