diff --git a/plugins/woocommerce-blocks/assets/js/blocks/product-collection/collections/upsells.tsx b/plugins/woocommerce-blocks/assets/js/blocks/product-collection/collections/upsells.tsx new file mode 100644 index 00000000000..fb83b1cc595 --- /dev/null +++ b/plugins/woocommerce-blocks/assets/js/blocks/product-collection/collections/upsells.tsx @@ -0,0 +1,59 @@ +/** + * External dependencies + */ +import type { InnerBlockTemplate } from '@wordpress/blocks'; +import { __ } from '@wordpress/i18n'; +import { Icon, trendingUp } from '@wordpress/icons'; + +/** + * Internal dependencies + */ +import { INNER_BLOCKS_PRODUCT_TEMPLATE } from '../constants'; +import { CoreCollectionNames, CoreFilterNames } from '../types'; + +const collection = { + name: CoreCollectionNames.ON_SALE, + title: __( 'Upsells', 'woocommerce' ), + icon: , + description: __( + 'Upsells are typically products that are extra profitable or better quality or more expensive. Experiment with combinations to boost sales.', + 'woocommerce' + ), + keywords: [ 'boost', 'promotion' ], + scope: [], +}; + +const attributes = { + displayLayout: { + type: 'flex', + columns: 4, + shrinkColumns: true, + }, + query: { + woocommerceOnSale: true, + perPage: 8, + pages: 1, + }, + hideControls: [ CoreFilterNames.FILTERABLE ], +}; + +const heading: InnerBlockTemplate = [ + 'core/heading', + { + textAlign: 'center', + level: 2, + content: __( 'On sale products', 'woocommerce' ), + style: { spacing: { margin: { bottom: '1rem' } } }, + }, +]; + +const innerBlocks: InnerBlockTemplate[] = [ + heading, + INNER_BLOCKS_PRODUCT_TEMPLATE, +]; + +export default { + ...collection, + attributes, + innerBlocks, +};