Fix drop indicator around dragged block

packages/block-editor/src/components/block-tools/insertion-point.js

@@ -45,32 +45,35 @@ function InsertionPointPopover( {
 			getBlockOrder,
 			getBlockListSettings,
 			getBlockInsertionPoint,
+			isBlockBeingDragged,
+			getPreviousBlockClientId,
+			getNextBlockClientId,
 		} = select( blockEditorStore );
 		const insertionPoint = getBlockInsertionPoint();
 		const order = getBlockOrder( insertionPoint.rootClientId );
-		const targetClientId = order[ insertionPoint.index - 1 ];
-		const targetRootClientId = insertionPoint.rootClientId;
-		const blockOrder = getBlockOrder( targetRootClientId );
-		if ( ! blockOrder.length ) {
+
+		if ( ! order.length ) {
 			return {};
 		}
-		const previous = targetClientId
-			? targetClientId
-			: blockOrder[ blockOrder.length - 1 ];
-		const isLast = previous === blockOrder[ blockOrder.length - 1 ];
-		const next = isLast
-			? null
-			: blockOrder[ blockOrder.indexOf( previous ) + 1 ];
-		const blockOrientation =
-			getBlockListSettings( targetRootClientId )?.orientation ||
-			'vertical';
+
+		let _previousClientId = order[ insertionPoint.index - 1 ];
+		let _nextClientId = order[ insertionPoint.index ];
+
+		while ( isBlockBeingDragged( _previousClientId ) ) {
+			_previousClientId = getPreviousBlockClientId( _previousClientId );
+		}
+
+		while ( isBlockBeingDragged( _nextClientId ) ) {
+			_nextClientId = getNextBlockClientId( _nextClientId );
+		}
 
 		return {
-			previousClientId: previous,
-			nextClientId: next,
-			orientation: blockOrientation,
-			clientId: targetClientId,
-			rootClientId: targetRootClientId,
+			previousClientId: _previousClientId,
+			nextClientId: _nextClientId,
+			orientation:
+				getBlockListSettings( insertionPoint.rootClientId )
+					?.orientation || 'vertical',
+			rootClientId: insertionPoint.rootClientId,
 			isInserterShown: insertionPoint?.__unstableWithInserter,
 		};
 	}, [] );

packages/block-editor/src/components/use-block-drop-zone/index.js

@@ -59,16 +59,7 @@ export function getNearestBlockIndex( elements, position, orientation ) {
 			// If the user is dropping to the trailing edge of the block
 			// add 1 to the index to represent dragging after.
 			const isTrailingEdge = edge === 'bottom' || edge === 'right';
-			let offset = isTrailingEdge ? 1 : 0;
-
-			// If the target is the dragged block itself and another 1 to
-			// index as the dragged block is set to `display: none` and
-			// should be skipped in the calculation.
-			const isTargetDraggedBlock =
-				isTrailingEdge &&
-				elements[ index + 1 ] &&
-				elements[ index + 1 ].classList.contains( 'is-dragging' );
-			offset += isTargetDraggedBlock ? 1 : 0;
+			const offset = isTrailingEdge ? 1 : 0;
 
 			// Update the currently known best candidate.
 			candidateDistance = distance;