From 22371b08c7409957b2c86b448c6fda352f340b89 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Sat, 9 May 2026 10:32:46 +0400
Subject: [PATCH] Classic Block: Use onReplace prop for migration actions

---
 .../src/freeform/convert-to-blocks-button.js  | 21 ++----------
 packages/block-library/src/freeform/edit.js   |  8 +++--
 .../src/freeform/migration-notice.js          | 34 ++++++-------------
 3 files changed, 19 insertions(+), 44 deletions(-)

diff --git a/packages/block-library/src/freeform/convert-to-blocks-button.js b/packages/block-library/src/freeform/convert-to-blocks-button.js
index bf73ecafb382fc..fff830ddf9fd11 100644
--- a/packages/block-library/src/freeform/convert-to-blocks-button.js
+++ b/packages/block-library/src/freeform/convert-to-blocks-button.js
@@ -3,27 +3,12 @@
  */
 import { __ } from '@wordpress/i18n';
 import { ToolbarButton } from '@wordpress/components';
-import { useDispatch, useSelect } from '@wordpress/data';
-import { rawHandler, serialize } from '@wordpress/blocks';
-import { store as blockEditorStore } from '@wordpress/block-editor';
-
-const ConvertToBlocksButton = ( { clientId } ) => {
-	const { replaceBlocks } = useDispatch( blockEditorStore );
-	const block = useSelect(
-		( select ) => {
-			return select( blockEditorStore ).getBlock( clientId );
-		},
-		[ clientId ]
-	);
+import { rawHandler } from '@wordpress/blocks';
 
+const ConvertToBlocksButton = ( { content, onReplace } ) => {
 	return (
 		<ToolbarButton
-			onClick={ () =>
-				replaceBlocks(
-					block.clientId,
-					rawHandler( { HTML: serialize( block ) } )
-				)
-			}
+			onClick={ () => onReplace( rawHandler( { HTML: content } ) ) }
 		>
 			{ __( 'Convert to blocks' ) }
 		</ToolbarButton>
diff --git a/packages/block-library/src/freeform/edit.js b/packages/block-library/src/freeform/edit.js
index c10c4a1adc3e1b..5a75b2bfc493bb 100644
--- a/packages/block-library/src/freeform/edit.js
+++ b/packages/block-library/src/freeform/edit.js
@@ -29,6 +29,7 @@ export default function FreeformEdit( {
 	attributes,
 	setAttributes,
 	clientId,
+	onReplace,
 } ) {
 	const { content } = attributes;
 	const [ isOpen, setOpen ] = useState( false );
@@ -49,7 +50,10 @@ export default function FreeformEdit( {
 			{ canRemove && ! isDeprecationMode && (
 				<BlockControls>
 					<ToolbarGroup>
-						<ConvertToBlocksButton clientId={ clientId } />
+						<ConvertToBlocksButton
+							content={ content }
+							onReplace={ onReplace }
+						/>
 					</ToolbarGroup>
 				</BlockControls>
 			) }
@@ -66,8 +70,8 @@ export default function FreeformEdit( {
 			<div { ...useBlockProps() }>
 				{ isDeprecationMode && canRemove && content && (
 					<MigrationNotice
-						clientId={ clientId }
 						content={ content }
+						onReplace={ onReplace }
 					/>
 				) }
 				{ content ? (
diff --git a/packages/block-library/src/freeform/migration-notice.js b/packages/block-library/src/freeform/migration-notice.js
index 1208a77508f03b..e6aefa57fd17a9 100644
--- a/packages/block-library/src/freeform/migration-notice.js
+++ b/packages/block-library/src/freeform/migration-notice.js
@@ -1,10 +1,9 @@
 /**
  * WordPress dependencies
  */
-import { store as blockEditorStore, Warning } from '@wordpress/block-editor';
+import { Warning } from '@wordpress/block-editor';
 import { Button } from '@wordpress/components';
-import { useDispatch } from '@wordpress/data';
-import { createBlock, rawHandler, serialize } from '@wordpress/blocks';
+import { createBlock, rawHandler } from '@wordpress/blocks';
 import { __ } from '@wordpress/i18n';
 
 /**
@@ -16,32 +15,17 @@ import { __ } from '@wordpress/i18n';
  * and offers two migration actions - a primary "Convert to blocks", and a
  * secondary "Convert to Custom HTML".
  *
- * @param {Object} props
- * @param {string} props.clientId Client ID of the Classic block.
- * @param {string} props.content  Raw HTML content of the Classic block.
+ * @param {Object}   props
+ * @param {string}   props.content   Raw HTML content of the Classic block.
+ * @param {Function} props.onReplace Replace the current block with the given blocks.
  */
-export default function MigrationNotice( { clientId, content } ) {
-	const { replaceBlocks } = useDispatch( blockEditorStore );
-
-	const convertToBlocks = () => {
-		replaceBlocks(
-			clientId,
-			rawHandler( {
-				HTML: serialize( createBlock( 'core/freeform', { content } ) ),
-			} )
-		);
-	};
-
-	const convertToHtmlBlock = () => {
-		replaceBlocks( clientId, createBlock( 'core/html', { content } ) );
-	};
-
+export default function MigrationNotice( { content, onReplace } ) {
 	const actions = [
 		<Button
 			__next40pxDefaultSize
 			key="convert-to-blocks"
 			variant="primary"
-			onClick={ convertToBlocks }
+			onClick={ () => onReplace( rawHandler( { HTML: content } ) ) }
 		>
 			{ __( 'Convert to blocks' ) }
 		</Button>,
@@ -49,7 +33,9 @@ export default function MigrationNotice( { clientId, content } ) {
 			__next40pxDefaultSize
 			key="convert-to-html"
 			variant="secondary"
-			onClick={ convertToHtmlBlock }
+			onClick={ () =>
+				onReplace( createBlock( 'core/html', { content } ) )
+			}
 		>
 			{ __( 'Convert to HTML' ) }
 		</Button>,