Add isSelectableByUser attribute to product templates

packages/js/product-editor/changelog/add-unselectable-product-templates

@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Use isSelectableByUser product template attribute

packages/js/product-editor/src/blocks/product-fields/product-details-section-description/edit.tsx

@@ -60,10 +60,12 @@ export function ProductDetailsSectionDescriptionBlockEdit( {
 	const [ supportedProductTemplates, unsupportedProductTemplates ] =
 		productTemplates.reduce< [ ProductTemplate[], ProductTemplate[] ] >(
 			( [ supported, unsupported ], productTemplate ) => {
-				if ( productTemplate.layoutTemplateId ) {
-					supported.push( productTemplate );
-				} else {
-					unsupported.push( productTemplate );
+				if ( productTemplate.isSelectableByUser ) {
+					if ( productTemplate.layoutTemplateId ) {
+						supported.push( productTemplate );
+					} else {
+						unsupported.push( productTemplate );
+					}
 				}
 				return [ supported, unsupported ];
 			},

packages/js/product-editor/src/hooks/use-product-template/test/use-product-template.test.ts

@@ -22,6 +22,7 @@ describe( 'useProductTemplate', () => {
 					icon: 'icon',
 					order: 1,
 					layoutTemplateId: 'layout-template-1',
+					isSelectableByUser: true,
 					productData: {
 						type: 'simple',
 					},
@@ -32,6 +33,7 @@ describe( 'useProductTemplate', () => {
 					description: 'Template 2 description',
 					icon: 'icon',
 					layoutTemplateId: 'layout-template-2',
+					isSelectableByUser: true,
 					order: 2,
 					productData: {
 						type: 'grouped',
@@ -43,6 +45,7 @@ describe( 'useProductTemplate', () => {
 					description: 'Template 3 description',
 					icon: 'icon',
 					layoutTemplateId: 'layout-template-3',
+					isSelectableByUser: true,
 					order: 3,
 					productData: {
 						type: 'simple',
@@ -54,6 +57,7 @@ describe( 'useProductTemplate', () => {
 					description: 'Standard Product Template description',
 					icon: 'icon',
 					layoutTemplateId: 'layout-template-4',
+					isSelectableByUser: true,
 					order: 4,
 					productData: {
 						type: 'simple',
@@ -65,6 +69,7 @@ describe( 'useProductTemplate', () => {
 					description: 'Gift CardProduct Template description',
 					icon: 'icon',
 					layoutTemplateId: 'layout-template-5',
+					isSelectableByUser: true,
 					order: 5,
 					productData: {
 						type: 'simple',

packages/js/product-editor/src/types.ts

@@ -11,6 +11,7 @@ export type ProductTemplate = {
 	icon: string | null;
 	order: number;
 	layoutTemplateId: string;
+	isSelectableByUser: boolean;
 	productData: Partial< Product >;
 };
 

plugins/woocommerce/changelog/add-unselectable-product-templates

@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Add isSelectableByUser attribute to product templates

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

@@ -61,6 +61,13 @@ class ProductTemplate {
 	 */
 	private $icon = null;
 
+	/**
+	 * If the template is directly selectable through the UI.
+	 *
+	 * @var boolean
+	 */
+	private $is_selectable_by_user = true;
+
 	/**
 	 * ProductTemplate constructor
 	 *
@@ -86,6 +93,10 @@ public function __construct( array $data ) {
 		if ( isset( $data['icon'] ) ) {
 			$this->icon = $data['icon'];
 		}
+
+		if ( isset( $data['is_selectable_by_user'] ) ) {
+			$this->is_selectable_by_user = $data['is_selectable_by_user'];
+		}
 	}
 
 	/**
@@ -180,6 +191,15 @@ public function get_order() {
 		return $this->order;
 	}
 
+	/**
+	 * Get the selectable attribute.
+	 *
+	 * @return boolean Selectable.
+	 */
+	public function get_is_selectable_by_user() {
+		return $this->is_selectable_by_user;
+	}
+
 	/**
 	 * Set the template order.
 	 *
@@ -196,13 +216,14 @@ public function set_order( int $order ) {
 	 */
 	public function to_json() {
 		return array(
-			'id'               => $this->get_id(),
-			'title'            => $this->get_title(),
-			'description'      => $this->get_description(),
-			'icon'             => $this->get_icon(),
-			'order'            => $this->get_order(),
-			'layoutTemplateId' => $this->get_layout_template_id(),
-			'productData'      => $this->get_product_data(),
+			'id'                 => $this->get_id(),
+			'title'              => $this->get_title(),
+			'description'        => $this->get_description(),
+			'icon'               => $this->get_icon(),
+			'order'              => $this->get_order(),
+			'layoutTemplateId'   => $this->get_layout_template_id(),
+			'productData'        => $this->get_product_data(),
+			'isSelectableByUser' => $this->get_is_selectable_by_user(),
 		);
 	}
 }