Product Collection: Introduce "Related Products" Collection (woocomme…

…rce#51076)

* Fixed PHP 7.4 Compatibility

The splat operator does not support associative arrays until PHP 8.1.

* Added Related Products Collection Boilerplate

* Added `woocommerceRelatedTo` Collection Parameter

This parameter allows the block to query for products that are related
to the given product IDs.

* Added Collection Related Product Filter

Using `woocommerceRelatedTo`, queries may restrict the products returned
to those that are related to the given product ID(s).

* Removed Unnecessary Tracking

* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce

* Removing Misunderstood Option

* Linting Fix

* Fixed Test

* Removed Unnecessary Keyword

* Support Unlimited `wc_get_related_products()`

This changes related product fetching so that `-1` will return all
related products. I also removed a second +10 offset that seems
to have been accidentally added eight years ago.

* Removed `woocommerceRelatedTo` Param

Since we're going to use the collection name, we don't need
this functionality any longer.

* Simplified `post__in` Filtering

Since `merge_queries` was already using an intersection merge for
`post__in`, this second function is unnecessary. I've removed it
as well as refactored the merging logic.

* Pass Collection Name To Final Query

* Added Custom Collection Handlers

Developers can register collections along with handlers that implement
the custom behavior.

* Removed Second Test Query Construction

As it was, `build_query_vars_from_query_block()` was triggering the
ProductCollection instance hooked into WordPress. After that, we
called `build_frontend_query()` on our test instance. This caused some
weird behavior in tests. As a result, however, the tax_query merge
test couldn't rely on the tax_query transformation done by WordPress.

* Added Related Product Collection Handlers

* Revert "Support Unlimited `wc_get_related_products()`"

This reverts commit 41c8372.

* Fixed Preview Mode Query

It looks like we were checking the wrong place for the preview
state.

* Fixed Test

* Updated Collection Heading

* Better Collection Test Teardown

Passing a callable back means that we can use variables in the
setUp and then the tearDown without any confusion.

* Removed Unnecessary Test Provider

* Fixed `$post__in` Merging

When the intersection is empty it was returning all products. This
makes it so that it returns nothing when there's no results.

* Fixed PHPDoc

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>

* Hide Empty Related Product Collections

* Fix lint issue

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>

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 related from './related';
 
 const collections: BlockVariation[] = [
 	productCollection,
@@ -28,6 +29,7 @@ const collections: BlockVariation[] = [
 	onSale,
 	bestSellers,
 	newArrivals,
+	related,
 ];
 
 export const registerCollections = () => {

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

@@ -0,0 +1,55 @@
+/**
+ * External dependencies
+ */
+import type { InnerBlockTemplate } from '@wordpress/blocks';
+import { __ } from '@wordpress/i18n';
+import { Icon, loop } from '@wordpress/icons';
+
+/**
+ * Internal dependencies
+ */
+import { INNER_BLOCKS_PRODUCT_TEMPLATE } from '../constants';
+import { CoreCollectionNames, LayoutOptions } from '../types';
+
+const collection = {
+	name: CoreCollectionNames.RELATED,
+	title: __( 'Related Products', 'woocommerce' ),
+	icon: <Icon icon={ loop } />,
+	description: __( 'Recommend products like this one.', 'woocommerce' ),
+	keywords: [ 'product collection' ],
+	scope: [],
+	usesReference: [ 'product' ],
+};
+
+const attributes = {
+	displayLayout: {
+		type: LayoutOptions.GRID,
+		columns: 4,
+		shrinkColumns: true,
+	},
+	query: {
+		perPage: 4,
+		pages: 1,
+	},
+};
+
+const heading: InnerBlockTemplate = [
+	'core/heading',
+	{
+		textAlign: 'center',
+		level: 2,
+		content: __( 'Related Products', '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/types.ts

@@ -157,6 +157,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',
+	RELATED = 'woocommerce/product-collection/related',
 }
 
 export enum CoreFilterNames {

plugins/woocommerce/changelog/51076-add-49335-related-products-collection

@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+New "Related Products" Product Collection type.