Refactor/prod blocks registration 3

projects/js-packages/shared-extension-utils/changelog/refactor-business-hours-block-regsitration

@@ -0,0 +1,4 @@
+Significance: minor
+Type: added
+
+Helpers functions for block icons

projects/js-packages/shared-extension-utils/index.js

@@ -17,3 +17,4 @@ export { default as isCurrentUserConnected } from './src/is-current-user-connect
 export { default as useAnalytics } from './src/hooks/use-analytics';
 export { default as useModuleStatus } from './src/hooks/use-module-status';
 export { default as JetpackEditorPanelLogo } from './src/components/jetpack-editor-panel-logo';
+export { getBlockIconComponent, getBlockIconProp } from './src/get-block-icon-from-metadata';

projects/js-packages/shared-extension-utils/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@automattic/jetpack-shared-extension-utils",
-	"version": "0.11.4",
+	"version": "0.12.0-alpha",
 	"description": "Utility functions used by the block editor extensions",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/shared-extension-utils/#readme",
 	"bugs": {
@@ -29,20 +29,20 @@
 		"lodash": "4.17.21"
 	},
 	"devDependencies": {
+		"@automattic/jetpack-webpack-config": "workspace:*",
 		"@babel/core": "7.22.11",
+		"@babel/plugin-transform-react-jsx": "7.22.5",
 		"@babel/preset-react": "7.22.5",
+		"@testing-library/dom": "8.19.1",
+		"@testing-library/react": "13.4.0",
+		"@testing-library/user-event": "14.4.3",
+		"@wordpress/babel-plugin-import-jsx-pragma": "4.24.0",
 		"babel-jest": "29.3.1",
 		"jest": "29.3.1",
 		"jest-environment-jsdom": "29.3.1",
-		"react": "18.2.0",
-		"react-dom": "18.2.0",
 		"jetpack-js-tools": "workspace:*",
-		"@automattic/jetpack-webpack-config": "workspace:*",
-		"@wordpress/babel-plugin-import-jsx-pragma": "4.24.0",
-		"@testing-library/dom": "8.19.1",
-		"@testing-library/react": "13.4.0",
-		"@testing-library/user-event": "14.4.3",
-		"@babel/plugin-transform-react-jsx": "7.22.5"
+		"react": "18.2.0",
+		"react-dom": "18.2.0"
 	},
 	"engines": {
 		"node": "^18.13.0",

projects/js-packages/shared-extension-utils/src/get-block-icon-from-metadata.js

@@ -0,0 +1,32 @@
+/* eslint-disable jsdoc/no-undefined-types */
+import getIconColor from './get-icon-color';
+
+/**
+ * Generate an icon as a React component from the SVG markup defined in a block.json metadata file.
+ * This prevents us from duplicating the markup in various places.
+ *
+ * @param {object} metadata - Block.json content
+ * @returns {React.Component} Icon component
+ */
+export function getBlockIconComponent( metadata ) {
+	// Note: using an `img` tag and passing the SVG markup as a data URI doesn't allow
+	// us to dynamically set the icon color later on.
+	/* eslint-disable-next-line react/no-danger */
+	return <span dangerouslySetInnerHTML={ { __html: metadata.icon } } />;
+}
+
+/**
+ * A block icon needs to be redefined on the front end as a React component, since a string - even
+ * SVG markup - is interpreted as a dashicon. This function returns the object that must be passed
+ * to the `icon` attribute when registering the block in the front end. It also sets the color
+ * of the icon.
+ *
+ * @param {object} metadata - Block.json content
+ * @returns {object} Icon property for client registration
+ */
+export function getBlockIconProp( metadata ) {
+	return {
+		src: getBlockIconComponent( metadata ),
+		foreground: getIconColor(),
+	};
+}

projects/js-packages/shared-extension-utils/src/get-icon-color.js

@@ -0,0 +1,23 @@
+import { isAtomicSite, isSimpleSite } from './site-type-utils';
+
+/**
+ * Constants
+ */
+const JETPACK_GREEN_40 = '#069e08';
+
+/**
+ * Returns the icon color for Jetpack blocks.
+ *
+ * Green in the Jetpack context, otherwise black for Simple sites or Atomic sites.
+ *
+ * @returns {string} HEX color for block editor icons
+ */
+export default function getIconColor() {
+	if ( isAtomicSite() || isSimpleSite() ) {
+		// Return null to match core block styling
+		return null;
+	}
+
+	// Jetpack Green
+	return JETPACK_GREEN_40;
+}

projects/packages/blocks/changelog/refactor-beta-blocks-registration

@@ -0,0 +1,4 @@
+Significance: minor
+Type: added
+
+Helper to get a block's feature name

projects/packages/blocks/changelog/refactor-business-hours-block-regsitration

@@ -0,0 +1,4 @@
+Significance: minor
+Type: added
+
+Add function to get path to block metadata file

projects/packages/blocks/composer.json

@@ -3,7 +3,9 @@
 	"description": "Register and manage blocks within a plugin. Used to manage block registration, enqueues, and more.",
 	"type": "jetpack-library",
 	"license": "GPL-2.0-or-later",
-	"require": {},
+	"require": {
+		"automattic/jetpack-constants": "@dev"
+	},
 	"require-dev": {
 		"automattic/wordbless": "dev-master",
 		"brain/monkey": "2.6.1",

projects/packages/blocks/src/class-blocks.php

@@ -11,6 +11,7 @@
 
 namespace Automattic\Jetpack;
 
+use Automattic\Jetpack\Constants as Jetpack_Constants;
 use Jetpack_Gutenberg;
 
 /**
@@ -27,7 +28,7 @@ class Blocks {
 	 *
 	 * @since 1.1.0
 	 *
-	 * @param string $slug Slug of the block or absolute path to the directory containing the block.json file.
+	 * @param string $slug Slug of the block or absolute path to the block source code directory.
 	 * @param array  $args {
 	 *     Arguments that are passed into register_block_type.
 	 *     See register_block_type for full list of arguments.
@@ -49,12 +50,12 @@ public static function jetpack_register_block( $slug, $args = array() ) {
 
 		$block_type = $slug;
 
-		// If the path to block.json is passed, find the slug in the file then create a block type
-		// object to register the block.
+		// If a path is passed, find the slug in the file then create a block type object to register
+		// the block.
 		// Note: passing the path directly to register_block_type seems to loose the interactivity of
 		// the block once in the editor once it's out of focus.
 		if ( '/' === substr( $slug, 0, 1 ) ) {
-			$metadata = self::get_block_metadata_from_file( $slug );
+			$metadata = self::get_block_metadata_from_file( self::get_path_to_block_metadata( $slug ) );
 			$name     = self::get_block_name_from_metadata( $metadata );
 
 			if ( ! empty( $name ) ) {
@@ -130,7 +131,7 @@ function () use ( $feature_name, $method_name ) {
 	public static function get_block_metadata_from_file( $filename ) {
 		$metadata = array();
 		$needle   = '/block.json';
-		$filename = $needle === substr( $filename, -strlen( $needle ) ) ? $filename : realpath( $filename . $needle );
+		$filename = $needle === substr( $filename, -strlen( $needle ) ) ? $filename : $filename . $needle;
 
 		if ( file_exists( $filename ) ) {
 			try {
@@ -154,6 +155,31 @@ public static function get_block_name_from_metadata( $metadata ) {
 		return ! isset( $metadata['name'] ) || empty( $metadata['name'] ) ? '' : $metadata['name'];
 	}
 
+	/**
+	 * Get the block feature name (i.e. the name without the `jetpack` prefix).
+	 *
+	 * @param string|array $arg Path to block.json or its parent folder, or its content as an array.
+	 *
+	 * @return string The block feature name.
+	 */
+	public static function get_block_feature( $arg ) {
+		$metadata = is_array( $arg ) ? $arg : null;
+
+		if ( ! isset( $metadata ) ) {
+			$path = is_string( $arg ) ? $arg : null;
+
+			if ( isset( $path ) && ! empty( $path ) ) {
+				$metadata = self::get_block_metadata_from_file( self::get_path_to_block_metadata( $path ) );
+			}
+		}
+
+		if ( ! empty( $metadata ) ) {
+			return self::get_block_feature_from_metadata( $metadata );
+		}
+
+		return '';
+	}
+
 	/**
 	 * Get the block feature name (i.e. the name without the `jetpack` prefix) from its metadata.
 	 *
@@ -352,4 +378,26 @@ public static function is_standalone_block() {
 		 */
 		return apply_filters( 'jetpack_is_standalone_block', $is_standalone_block );
 	}
+
+	/**
+	 * Returns the path to the directory containing the block.json metadata file of a block, given its
+	 * source code directory and, optionally, the directory that holds the blocks built files of
+	 * the package. If the directory doesn't exist, falls back to the source directory.
+	 *
+	 * @since $$next-version$$
+	 *
+	 * @param string $block_src_dir    The path to the folder containing the block source code.
+	 *                                 Typically this is done by passing __DIR__ as the argument.
+	 * @param string $package_dist_dir Optional. A full path to the directory containing the blocks
+	 *                                 built files of the package. Default empty.
+	 *
+	 * @return string The path to the directory.
+	 */
+	public static function get_path_to_block_metadata( $block_src_dir, $package_dist_dir = '' ) {
+		$dir       = basename( $block_src_dir );
+		$dist_path = empty( $package_dist_dir ) ? dirname( Jetpack_Constants::get_constant( 'JETPACK__PLUGIN_FILE' ) ) . '/_inc/blocks' : $package_dist_dir;
+		$result    = realpath( "$dist_path/$dir" );
+
+		return false === $result ? $block_src_dir : $result;
+	}
 }

projects/packages/blocks/tests/php/fixtures/test-block/block.json

@@ -0,0 +1,14 @@
+{
+	"$schema": "https://schemas.wp.org/trunk/block.json",
+	"apiVersion": 3,
+	"name": "jetpack/test-block",
+	"title": "Test Block",
+	"description": "",
+	"keywords": [],
+	"version": "",
+	"textdomain": "jetpack",
+	"category": "",
+	"icon": "",
+	"supports": {},
+	"editorScript": ""
+}

projects/packages/blocks/tests/php/test-blocks.php

@@ -9,6 +9,7 @@
 
 namespace Automattic\Jetpack;
 
+use Automattic\Jetpack\Constants as Jetpack_Constants;
 use Brain\Monkey;
 use PHPUnit\Framework\TestCase;
 
@@ -339,7 +340,7 @@ public function test_jetpack_register_block_with_existing_editor_style() {
 	 * @covers Automattic\Jetpack\Blocks::get_block_metadata_from_file
 	 */
 	public function test_jetpack_register_block_from_metadata_file() {
-		$result = Blocks::jetpack_register_block( __DIR__ . '/fixtures/block.json' );
+		$result = Blocks::jetpack_register_block( __DIR__ . '/fixtures/test-block/block.json' );
 
 		$this->assertInstanceOf( 'WP_Block_Type', $result );
 	}
@@ -352,7 +353,7 @@ public function test_jetpack_register_block_from_metadata_file() {
 	 * @covers Automattic\Jetpack\Blocks::get_block_metadata_from_file
 	 */
 	public function test_get_block_metadata_from_file() {
-		$result = Blocks::get_block_metadata_from_file( __DIR__ . '/fixtures/block.json' );
+		$result = Blocks::get_block_metadata_from_file( __DIR__ . '/fixtures/test-block/block.json' );
 
 		// phpcs:ignore MediaWiki.PHPUnit.SpecificAssertions.assertIsArray -- assertIsArray not supported by all PHP versions we support.
 		$this->assertTrue( is_array( $result ) );
@@ -367,7 +368,7 @@ public function test_get_block_metadata_from_file() {
 	 * @covers Automattic\Jetpack\Blocks::get_block_metadata_from_file
 	 */
 	public function test_get_block_metadata_from_folder() {
-		$result = Blocks::get_block_metadata_from_file( __DIR__ . '/fixtures/' );
+		$result = Blocks::get_block_metadata_from_file( __DIR__ . '/fixtures/test-block' );
 
 		// phpcs:ignore MediaWiki.PHPUnit.SpecificAssertions.assertIsArray -- assertIsArray not supported by all PHP versions we support.
 		$this->assertTrue( is_array( $result ) );
@@ -425,4 +426,66 @@ public function test_get_block_feature_from_metadata() {
 
 		$this->assertEquals( $result, $feature );
 	}
+
+	/**
+	 * Test getting the path to a block's metadata file.
+	 *
+	 * @since $$next-version$$
+	 *
+	 * @covers Automattic\Jetpack\Blocks::get_path_to_block_metadata
+	 */
+	public function test_get_path_to_block_metadata() {
+		$base_dir  = __DIR__ . '/fixtures';
+		$block_dir = $base_dir . '/test-block';
+
+		// Existing build folder
+
+		Jetpack_Constants::set_constant( 'JETPACK__PLUGIN_FILE', $base_dir . '/jetpack.php' );
+
+		$result = Blocks::get_path_to_block_metadata( $block_dir );
+		$this->assertEquals( $base_dir . '/_inc/blocks/test-block', $result );
+
+		$result = Blocks::get_path_to_block_metadata( $block_dir, $base_dir . '/_inc/blocks/' );
+		$this->assertEquals( $base_dir . '/_inc/blocks/test-block', $result );
+
+		$result = Blocks::get_path_to_block_metadata( $block_dir, $base_dir . '/_inc/blocks' );
+		$this->assertEquals( $base_dir . '/_inc/blocks/test-block', $result );
+
+		// Invalid build folder
+
+		Jetpack_Constants::set_constant( 'JETPACK__PLUGIN_FILE', '/a/b/c/jetpack.php' );
+
+		$result = Blocks::get_path_to_block_metadata( $block_dir );
+		$this->assertEquals( $block_dir, $result );
+
+		$result = Blocks::get_path_to_block_metadata( $block_dir, '/dist' );
+		$this->assertEquals( $block_dir, $result );
+
+		Jetpack_Constants::clear_constants();
+	}
+
+	/**
+	 * Test getting the block feature name.
+	 *
+	 * @since $$next-version$$
+	 *
+	 * @covers Automattic\Jetpack\Blocks::get_block_feature
+	 */
+	public function test_get_block_feature() {
+		// Pass metadata
+
+		$result = Blocks::get_block_feature( array() );
+		$this->assertSame( '', $result );
+
+		$result = Blocks::get_block_feature( array( 'name' => 'jetpack/test-block' ) );
+		$this->assertEquals( 'test-block', $result );
+
+		// Pass path
+
+		$result = Blocks::get_block_feature( '' );
+		$this->assertSame( '', $result );
+
+		$result = Blocks::get_block_feature( __DIR__ . '/fixtures/test-block/block.json' );
+		$this->assertEquals( 'test-block', $result );
+	}
 }

projects/plugins/jetpack/changelog/refactor-beta-blocks-registration

@@ -0,0 +1,4 @@
+Significance: patch
+Type: enhancement
+
+Register beta blocks by specifying path to block.json

projects/plugins/jetpack/changelog/refactor-business-hours-block-regsitration

@@ -0,0 +1,4 @@
+Significance: patch
+Type: enhancement
+
+Refactor Business Hours block registration to avoid duplication

projects/plugins/jetpack/changelog/refactor-prod-blocks-registration-3

@@ -0,0 +1,4 @@
+Significance: patch
+Type: other
+
+Refactor production blocks registration

projects/plugins/jetpack/class.jetpack-gutenberg.php

@@ -466,7 +466,7 @@ public static function should_load() {
 	/**
 	 * Only enqueue block assets when needed.
 	 *
-	 * @param string $type Slug of the block or absolute path to the directory containing the block.json file.
+	 * @param string $type Slug of the block or absolute path to the block source code directory.
 	 * @param array  $script_dependencies Script dependencies. Will be merged with automatically
 	 *                                    detected script dependencies from the webpack build.
 	 *
@@ -478,9 +478,10 @@ public static function load_assets_as_required( $type, $script_dependencies = ar
 			return;
 		}
 
-		// Retrieve the feature from block.json if its path is passed.
+		// Retrieve the feature from block.json if a path is passed.
 		if ( '/' === substr( $type, 0, 1 ) ) {
-			$feature = Blocks::get_block_feature_from_metadata( Blocks::get_block_metadata_from_file( $type ) );
+			$metadata = Blocks::get_block_metadata_from_file( Blocks::get_path_to_block_metadata( $type ) );
+			$feature  = Blocks::get_block_feature_from_metadata( $metadata );
 
 			if ( ! empty( $feature ) ) {
 				$type = $feature;