[Product Block Editor]: register `metadata` attribute for all blocks (#45657)

* register the `metadata` attribute for all blocks

* bind value attribute with the nane product entity

* changelog

* add a ToDo note

* rename edit component fn to NameBlockEdit

* changelog

* restore @ts-export line

* fix eslint issue

* fix eslint issue

packages/js/product-editor/changelog/update-product-editor-register-metadata-block-attribute

@@ -0,0 +1,4 @@
+Significance: patch
+Type: update
+
+[Product Block Editor]: update Name field block name

packages/js/product-editor/src/blocks/product-fields/name/edit.tsx

@@ -43,7 +43,7 @@ import { ProductEditorBlockEditProps } from '../../../types';
 import { AUTO_DRAFT_NAME } from '../../../utils';
 import { NameBlockAttributes } from './types';
 
-export function Edit( {
+export function NameBlockEdit( {
 	attributes,
 	clientId,
 }: ProductEditorBlockEditProps< NameBlockAttributes > ) {

packages/js/product-editor/src/blocks/product-fields/name/index.ts

@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import metadata from './block.json';
-import { Edit } from './edit';
+import { NameBlockEdit } from './edit';
 import { registerProductEditorBlockType } from '../../../utils';
 
 const { name } = metadata;
@@ -11,7 +11,7 @@ export { metadata, name };
 
 export const settings = {
 	example: {},
-	edit: Edit,
+	edit: NameBlockEdit,
 };
 
 export const init = () =>

plugins/woocommerce/changelog/update-product-editor-register-metadata-block-attribute

@@ -0,0 +1,4 @@
+Significance: patch
+Type: add
+
+[Product Block Editor]: register `metadata` attribute for all blocks

plugins/woocommerce/src/Admin/Features/ProductBlockEditor/Init.php

@@ -78,6 +78,8 @@ class Init {
 			add_action( 'rest_api_init', array( $this, 'register_layout_templates' ) );
 			add_action( 'rest_api_init', array( $this, 'register_user_metas' ) );
 
+			add_filter( 'register_block_type_args', array( $this, 'register_metadata_attribute' ) );
+
 			// Make sure the block registry is initialized so that core blocks are registered.
 			BlockRegistry::get_instance();
 
@@ -417,4 +419,31 @@ class Init {
 			)
 		);
 	}
+
+	/**
+	 * Registers the metadata block attribute for all block types.
+	 * This is a fallback/temporary solution until
+	 * the Gutenberg core version registers the metadata attribute.
+	 *
+	 * @see https://github.com/WordPress/gutenberg/blob/6aaa3686ae67adc1a6a6b08096d3312859733e1b/lib/compat/wordpress-6.5/blocks.php#L27-L47
+	 * To do: Remove this method once the Gutenberg core version registers the metadata attribute.
+	 *
+	 * @param array $args Array of arguments for registering a block type.
+	 * @return array $args
+	 */
+	public function register_metadata_attribute( $args ) {
+		// Setup attributes if needed.
+		if ( ! isset( $args['attributes'] ) || ! is_array( $args['attributes'] ) ) {
+			$args['attributes'] = array();
+		}
+
+		// Add metadata attribute if it doesn't exist.
+		if ( ! array_key_exists( 'metadata', $args['attributes'] ) ) {
+			$args['attributes']['metadata'] = array(
+				'type' => 'object',
+			);
+		}
+
+		return $args;
+	}
 }

plugins/woocommerce/src/Internal/Features/ProductBlockEditor/ProductTemplates/SimpleProductTemplate.php

@@ -215,6 +215,16 @@ class SimpleProductTemplate extends AbstractProductFormTemplate implements Produ
 				'attributes' => array(
 					'name'      => 'Product name',
 					'autoFocus' => true,
+					'metadata'  => array(
+						'bindings' => array(
+							'value' => array(
+								'source' => 'woocommerce/entity-product',
+								'args'   => array(
+									'prop' => 'name',
+								),
+							),
+						),
+					),
 				),
 			)
 		);