Initialize the Hand-Picked collection

plugins/woocommerce-blocks/assets/js/blocks/product-collection/collections/hand-picked.tsx

@@ -0,0 +1,95 @@
+/**
+ * External dependencies
+ */
+import type { InnerBlockTemplate } from '@wordpress/blocks';
+import { __ } from '@wordpress/i18n';
+import { Icon } from '@wordpress/icons';
+
+/**
+ * Internal dependencies
+ */
+import { INNER_BLOCKS_PRODUCT_TEMPLATE } from '../constants';
+import {
+	CoreCollectionNames,
+	CoreFilterNames,
+	ETimeFrameOperator,
+} from '../types';
+
+const handPickedIcon = (
+	<svg
+		width="24"
+		height="24"
+		viewBox="0 0 24 24"
+		fill="none"
+		xmlns="http://www.w3.org/2000/svg"
+	>
+		<path
+			d="M8.85074 4.8213L7.64702 3.92627L5.56365 6.72818L4.44959 5.89735L3.55286 7.0998L5.87107 8.82862L8.85074 4.8213Z"
+			fill="currentColor"
+		/>
+		<path d="M20 7.75004H11.1111V6.25004H20V7.75004Z" fill="currentColor" />
+		<path d="M20 12.75H11.1111V11.25H20V12.75Z" fill="currentColor" />
+		<path
+			fillRule="evenodd"
+			clipRule="evenodd"
+			d="M6 14C7.10457 14 8 13.1046 8 12C8 10.8955 7.10457 10 6 10C4.89543 10 4 10.8955 4 12C4 13.1046 4.89543 14 6 14ZM6 13C6.55229 13 7 12.5523 7 12C7 11.4478 6.55229 11 6 11C5.44772 11 5 11.4478 5 12C5 12.5523 5.44772 13 6 13Z"
+			fill="currentColor"
+		/>
+		<path
+			fillRule="evenodd"
+			clipRule="evenodd"
+			d="M8 17C8 18.1046 7.10457 19 6 19C4.89543 19 4 18.1046 4 17C4 15.8955 4.89543 15 6 15C7.10457 15 8 15.8955 8 17ZM7 17C7 17.5523 6.55229 18 6 18C5.44772 18 5 17.5523 5 17C5 16.4478 5.44772 16 6 16C6.55229 16 7 16.4478 7 17Z"
+			fill="currentColor"
+		/>
+		<path d="M11.1111 17.75H20V16.25H11.1111V17.75Z" fill="currentColor" />
+	</svg>
+);
+
+const collection = {
+	name: CoreCollectionNames.HAND_PICKED,
+	title: __( 'Hand Picked', 'woocommerce' ),
+	icon: <Icon icon={ handPickedIcon } />,
+	description: __( 'Recommend your hand-picked products.', 'woocommerce' ),
+	keywords: [ 'hand-picked products', 'product collection' ],
+	scope: [],
+};
+
+const attributes = {
+	displayLayout: {
+		type: 'flex',
+		columns: 5,
+		shrinkColumns: true,
+	},
+	query: {
+		orderBy: 'date',
+		order: 'desc',
+		perPage: 5,
+		pages: 1,
+		timeFrame: {
+			operator: ETimeFrameOperator.IN,
+			value: '-7 days',
+		},
+	},
+	hideControls: [ CoreFilterNames.ORDER, CoreFilterNames.FILTERABLE ],
+};
+
+const heading: InnerBlockTemplate = [
+	'core/heading',
+	{
+		textAlign: 'center',
+		level: 2,
+		content: __( 'Hand Picked', 'woocommerce' ),
+		style: { spacing: { margin: { bottom: '1rem' } } },
+	},
+];
+
+const innerBlocks: InnerBlockTemplate[] = [
+	heading,
+	INNER_BLOCKS_PRODUCT_TEMPLATE,
+];
+
+export default {
+	...collection,
+	attributes,
+	innerBlocks,
+};

plugins/woocommerce-blocks/assets/js/blocks/product-collection/collections/index.tsx

@@ -20,6 +20,7 @@ import topRated from './top-rated';
 import bestSellers from './best-sellers';
 import onSale from './on-sale';
 import featured from './featured';
+import handPicked from './hand-picked';
 
 const collections: BlockVariation[] = [
 	productCollection,
@@ -28,6 +29,7 @@ const collections: BlockVariation[] = [
 	onSale,
 	bestSellers,
 	newArrivals,
+	handPicked,
 ];
 
 export const registerCollections = () => {

plugins/woocommerce-blocks/assets/js/blocks/product-collection/types.ts

@@ -153,6 +153,7 @@ export enum CoreCollectionNames {
 	NEW_ARRIVALS = 'woocommerce/product-collection/new-arrivals',
 	ON_SALE = 'woocommerce/product-collection/on-sale',
 	TOP_RATED = 'woocommerce/product-collection/top-rated',
+	HAND_PICKED = 'woocommerce/product-collection/hand-picked',
 }
 
 export enum CoreFilterNames {