From f02ea49f05d4f7e9f95846263683be8db83bcd1a Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Tue, 11 Jul 2023 14:19:01 +0400
Subject: [PATCH] Block Editor: Display variation icon in the 'BlockDraggable'
 component

---
 .../src/components/block-draggable/index.js     | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/packages/block-editor/src/components/block-draggable/index.js b/packages/block-editor/src/components/block-draggable/index.js
index 1e4048c90ab61..0b8f3c2d87f52 100644
--- a/packages/block-editor/src/components/block-draggable/index.js
+++ b/packages/block-editor/src/components/block-draggable/index.js
@@ -22,16 +22,25 @@ const BlockDraggable = ( {
 } ) => {
 	const { srcRootClientId, isDraggable, icon } = useSelect(
 		( select ) => {
-			const { canMoveBlocks, getBlockRootClientId, getBlockName } =
-				select( blockEditorStore );
-			const { getBlockType } = select( blocksStore );
+			const {
+				canMoveBlocks,
+				getBlockRootClientId,
+				getBlockName,
+				getBlockAttributes,
+			} = select( blockEditorStore );
+			const { getBlockType, getActiveBlockVariation } =
+				select( blocksStore );
 			const rootClientId = getBlockRootClientId( clientIds[ 0 ] );
 			const blockName = getBlockName( clientIds[ 0 ] );
+			const variation = getActiveBlockVariation(
+				blockName,
+				getBlockAttributes( clientIds[ 0 ] )
+			);
 
 			return {
 				srcRootClientId: rootClientId,
 				isDraggable: canMoveBlocks( clientIds, rootClientId ),
-				icon: getBlockType( blockName )?.icon,
+				icon: variation?.icon || getBlockType( blockName )?.icon,
 			};
 		},
 		[ clientIds ]