Merge pull request #4833 from wordpress-mobile/feature/drag-and-drop-…

…analytics

Track block movement actions

src/analytics/redux/tracked_events.js

@@ -64,6 +64,51 @@ function trackBlocksHandler(
 	} );
 }
 
+/**
+ * Helper function to track block movement events.
+ *
+ * @param {string[]} clientIds The client IDs of the blocks being moved
+ * @param {string}   action    Type of movement (arrows/drag & drop)
+ * @return {void}
+ */
+function trackBlockMoved( clientIds, action ) {
+	const block = select( 'core/block-editor' ).getBlock( clientIds?.[ 0 ] );
+
+	if ( block ) {
+		const eventProperties = {
+			action_source: action,
+			inner_block: !! block.innerBlocks.length,
+			block_name: block.name,
+		};
+
+		sendEventToHost( 'editor_block_moved', eventProperties );
+	}
+}
+
+/**
+ * Helper function to handle when a block is moved by an index position
+ *
+ * @param {string[]} clientIds The client IDs of the blocks being moved
+ * @param {number}   toIndex   Index of the new position of the block
+ * @return {void}
+ */
+function handleBlockMovedByPosition( clientIds, toIndex ) {
+	const lastBlockIndex = select( 'core/block-editor' ).getBlockCount() - 1;
+	const currentBlockIndex = select( 'core/block-editor' ).getBlockIndex(
+		clientIds?.[ 0 ]
+	);
+
+	if ( currentBlockIndex >= 0 ) {
+		if ( toIndex > currentBlockIndex && toIndex === lastBlockIndex ) {
+			// The block was moved to the bottom of the editor
+			trackBlockMoved( clientIds, 'move_arrows_to_bottom' );
+		} else if ( toIndex < currentBlockIndex && toIndex === 0 ) {
+			// The block was moved to the top of the editor
+			trackBlockMoved( clientIds, 'move_arrows_to_top' );
+		}
+	}
+}
+
 export const trackedEvents = {
 	'core/block-editor': {
 		insertBlock( blocks ) {
@@ -80,5 +125,27 @@ export const trackedEvents = {
 				( { name } ) => ( { block_name: name } )
 			);
 		},
+		moveBlocksUp( clientIds ) {
+			trackBlockMoved( clientIds, 'move_arrows_up' );
+		},
+		moveBlocksDown( clientIds ) {
+			trackBlockMoved( clientIds, 'move_arrows_down' );
+		},
+		moveBlocksToPosition(
+			clientIds,
+			_fromRootClientId,
+			_toRootClientId,
+			toIndex
+		) {
+			const isDraggingBlock = select(
+				'core/block-editor'
+			).isDraggingBlocks();
+
+			if ( isDraggingBlock ) {
+				trackBlockMoved( clientIds, 'drag_and_drop' );
+			} else {
+				handleBlockMovedByPosition( clientIds, toIndex );
+			}
+		},
 	},
 };