Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
woocommerce/plugins/woocommerce-blocks/assets/js/blocks/product-collection/block.json

59 lines
1.2 KiB
JSON
Raw Normal View History

Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352) * Add Products Collection block scaffolding This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend. * Add Product Template block and integrate with Products Collection block This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include: - Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files. - Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files. - Updates to the webpack-entries.js file to include the new Product Template block. - Addition of the ProductTemplate class in the src/BlockTypes directory. - Inclusion of the ProductTemplate class in the src/BlockTypesController.php file. * Enhance product-template block with context and styling This commit adds various enhancements to the product-template block. It includes: - Introduce `usesContext` and `supports` properties to the block.json file - Update the edit.tsx file to use BlockContextProvider and add query logic - Add an editor.scss file for styling the product-template block in the editor - Extend the products-collection block.json file with new properties - Modify the products-collection edit.tsx file to include instanceId and useEffect These changes improve the product-template block by providing better context handling and styling options. * Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor. * Add product title and summary variations for Products Collection block - Add default spacing between product elements in `style.scss` - Register product title and summary element variations in `products-collection` block - Create utility for registering element variations - Extend core elements with WooCommerce namespace * Set inherit to false by default and other improvements This commit introduces several changes to the ProductsCollection block: 1. Set the "inherit" property to false in block.json, disabling inheritance by default. 2. Remove the default styles for inner blocks in the edit.tsx file. 3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block. 4. Update the ProductTemplate.php file to properly render the block content based on the changes. 5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary. These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior. * Fix pagination issue * Minor code quality improvments * Register product blocks only in experimental builds - Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds. - Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page. * Add experimental flag to PHP file * Update documentation for feature flags - Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file. - Include references to PHP and webpack flags for both blocks. * Change default order and orderBy values in block.json - Update the default 'order' value from 'desc' to 'asc'. - Update the default 'orderBy' value from 'date' to 'title'. * Refactor experimental block registration and remove unused file - Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx. - Remove unused file types.ts in product-template directory. - Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null. * Update variation names in product summary and product title elements Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block. * Rename 'Products Collection' to 'Product Collection' - Renamed all instances of "products-collection" to "product-collection" across multiple files. - Adjusted related types and method calls to match the new naming convention. - Updated documentation and feature flags to reflect the name change. - Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`. * Hide product-template block from inserter - Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`. - Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component. * Fix Eslint error
2023-05-15 08:51:49 +00:00
{
"$schema": "https://schemas.wp.org/trunk/block.json",
New flow of adding Product Collection and basic set of Collections (#42696) * Migrate PR to Core * Migrate test changes * Add Custom Collection with inherit query attribute disabled * Update copy of Product Catalog collection * Don't choose default active collection in polaceholder and remove highlight * Remove inherit query option from inspector controls * Add collection names to Product Catalog and Custom one * Unify Collection Chooser between Modal and Placeholder * Bring back util removed by accident * Replace the translations domain with woocommerce * Remove leftovers after merge * Add pagination and no results to Product Catalog and Custom collections * Revert textdomain change * Fix lint error * Add changelog entry * Change collection label * Bring back Inherit query from template * Remove Custom collection and bring back single Product Collection * Simplify applying collection * Make sure Inherit query from template is enabled in archive templates by default and disbaled in posts/pages * Change incorrect Playwright locator * Add test for Product Catalog inheriting the query in product archive * Add tests for recommendation collection hiding the predefined filters * Add reviews to multiple products * Update expected products in Top Rated * Remove rating creation in test env and skip undeterministic tests * Add skip to Best Sellers test * Update README.md * Add more keywords to collections, like 'product collection' to recommendation collections * Rephrase the README note about Collections registration * Simplify types * Rename unchangeableFilters to hideControls * Fix typo in file name * Remove 'pattern' references from toolbar files * Replace hardcoded SCSS color with wc variable * Remove changelog file from different PR * Move hideControls to Product Collection ayttributes * Improve responsiveness of columns in Product Collection Placeholder * Use admin color pallette in Product Collection Placeholder * Move Inherit query from template to the top of Inspector Controls * Change the Collection prefix to woocommerce rather than woocommerce-blocks * Simplify Placeholder and Modal styles
2023-12-27 10:07:27 +00:00
"apiVersion": 2,
"name": "woocommerce/product-collection",
"version": "1.0.0",
"title": "Product Collection (Beta)",
"description": "Display a collection of products from your store.",
"category": "woocommerce",
"keywords": [ "WooCommerce", "Products (Beta)" ],
"textdomain": "woocommerce",
Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352) * Add Products Collection block scaffolding This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend. * Add Product Template block and integrate with Products Collection block This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include: - Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files. - Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files. - Updates to the webpack-entries.js file to include the new Product Template block. - Addition of the ProductTemplate class in the src/BlockTypes directory. - Inclusion of the ProductTemplate class in the src/BlockTypesController.php file. * Enhance product-template block with context and styling This commit adds various enhancements to the product-template block. It includes: - Introduce `usesContext` and `supports` properties to the block.json file - Update the edit.tsx file to use BlockContextProvider and add query logic - Add an editor.scss file for styling the product-template block in the editor - Extend the products-collection block.json file with new properties - Modify the products-collection edit.tsx file to include instanceId and useEffect These changes improve the product-template block by providing better context handling and styling options. * Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor. * Add product title and summary variations for Products Collection block - Add default spacing between product elements in `style.scss` - Register product title and summary element variations in `products-collection` block - Create utility for registering element variations - Extend core elements with WooCommerce namespace * Set inherit to false by default and other improvements This commit introduces several changes to the ProductsCollection block: 1. Set the "inherit" property to false in block.json, disabling inheritance by default. 2. Remove the default styles for inner blocks in the edit.tsx file. 3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block. 4. Update the ProductTemplate.php file to properly render the block content based on the changes. 5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary. These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior. * Fix pagination issue * Minor code quality improvments * Register product blocks only in experimental builds - Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds. - Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page. * Add experimental flag to PHP file * Update documentation for feature flags - Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file. - Include references to PHP and webpack flags for both blocks. * Change default order and orderBy values in block.json - Update the default 'order' value from 'desc' to 'asc'. - Update the default 'orderBy' value from 'date' to 'title'. * Refactor experimental block registration and remove unused file - Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx. - Remove unused file types.ts in product-template directory. - Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null. * Update variation names in product summary and product title elements Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block. * Rename 'Products Collection' to 'Product Collection' - Renamed all instances of "products-collection" to "product-collection" across multiple files. - Adjusted related types and method calls to match the new naming convention. - Updated documentation and feature flags to reflect the name change. - Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`. * Hide product-template block from inserter - Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`. - Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component. * Fix Eslint error
2023-05-15 08:51:49 +00:00
"attributes": {
"queryId": {
"type": "number"
},
"query": {
Product Collection: Add stock status filter (https://github.com/woocommerce/woocommerce-blocks/pull/9580) * Add columns control to product collection block editor settings - `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function. - A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'. - The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties. * Refactor: Simplify Fallback Return in ColumnsControl Component This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React. * Feature: Add 'Order By' Control to Product Collection Inspector This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse. * Add more options to OrderBy type * Add orderby handling on frontend & editor The main changes include: 1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block. 2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block. 3. Added methods to manage query parameters for both frontend rendering and the Editor. 4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values. 5. Defined a function to build the query based on block attributes, filters, and global WP_Query. 6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively. These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections. * Add 'on sale' filter and enhance settings management in product collection block This commit introduces several changes to the product collection block. - First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale. - It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings. - It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control. - A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters. - The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes. - Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter. This should enhance the flexibility and user-friendliness of the product collection block. * Add stock status filter to WooCommerce product collection block This commit introduces a stock status filter to the WooCommerce product collection block. The changes include: 1. Added the ability to filter products based on their stock status within the 'product-collection' block. A new stock status control is created within the inspector-controls of the block. 2. A new 'get_stock_status_query' function is introduced in 'ProductCollection.php' which returns a query for products depending on their stock status. Please note that the stock status filter will only appear in the experimental build for now. * Refactor Stock Status control of Product Collection block This commit refactors the Stock Status control. The changes aim to improve the code organization and make the behavior of the component more explicit. The key modifications are: 1. Moved stock status related constants and functions from `inspector-controls/utils.tsx` to `inspector-controls/constants.ts`. This is done to ensure that all constants and similar utility functions are organized in one place. 2. Updated `product-collection/index.tsx` to import `getDefaultStockStatuses` from `inspector-controls/constants` instead of `inspector-controls/utils`. 3. Updated `stock-status-control.tsx` to determine whether the stock status has value or not by comparing with the default stock statuses using `fastDeepEqual`. If the stock status control is deselected, it resets the stock status to the default statuses. These changes do not introduce any new functionalities, but improve the readability and maintainability of the code. * Fix: Default values of attributes not saving as serialized block comment This was happening because of this issue: https://github.com/WordPress/gutenberg/issues/7342 Therefore, I had to use `useEffect` to set the default values of the attributes. Here is the list of changes I made: 1. Removed default values from `block.json` for `query`, `tagName`, and `displayLayout`. 2. Moved the default values to `constants.ts` and created a new object `DEFAULT_ATTRIBUTES` to store them. 3. Relocated `constants.ts` from `inspector-controls` to the parent directory. 4. Refactored `edit.tsx` to use `DEFAULT_ATTRIBUTES` from `constants.ts` to set default attributes using `useEffect`. 5. Removed the attributes assignment from `registerBlockType` in `index.tsx`. 6. Updated `columns-control.tsx`, `index.tsx`, `order-by-control.tsx`, and `stock-status-control.tsx` to import from the relocated `constants.ts`. 7. Updated `ProductCollectionAttributes` and `ProductCollectionQuery` in `types.ts` to include `tagName` and `isProductCollectionBlock` respectively. 8. Modified `ProductCollection.php` to match the updated `orderBy` key in the query parameter. This refactor enhances the readability of the code and reduces duplication by keeping all constants and default values in one place. * Replace usage of 'statii' with 'statuses' in stock status handling This commit replaces all instances of 'statii' with the correct term 'statuses' in the context of handling stock status. This change affects three files: 1. `assets/js/blocks/product-collection/inspector-controls/stock-status-control.tsx` - The term is corrected in a comment block. 2. `assets/js/blocks/product-collection/types.ts` - Updated the name of a variable in the `ProductCollectionQuery` interface. 3. `src/BlockTypes/ProductCollection.php` - Here, the term is replaced in several locations including variable names, comments and the method `get_stock_status_query`. This commit helps improve code readability and consistency across the repository.
2023-05-26 11:44:37 +00:00
"type": "object"
Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352) * Add Products Collection block scaffolding This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend. * Add Product Template block and integrate with Products Collection block This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include: - Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files. - Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files. - Updates to the webpack-entries.js file to include the new Product Template block. - Addition of the ProductTemplate class in the src/BlockTypes directory. - Inclusion of the ProductTemplate class in the src/BlockTypesController.php file. * Enhance product-template block with context and styling This commit adds various enhancements to the product-template block. It includes: - Introduce `usesContext` and `supports` properties to the block.json file - Update the edit.tsx file to use BlockContextProvider and add query logic - Add an editor.scss file for styling the product-template block in the editor - Extend the products-collection block.json file with new properties - Modify the products-collection edit.tsx file to include instanceId and useEffect These changes improve the product-template block by providing better context handling and styling options. * Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor. * Add product title and summary variations for Products Collection block - Add default spacing between product elements in `style.scss` - Register product title and summary element variations in `products-collection` block - Create utility for registering element variations - Extend core elements with WooCommerce namespace * Set inherit to false by default and other improvements This commit introduces several changes to the ProductsCollection block: 1. Set the "inherit" property to false in block.json, disabling inheritance by default. 2. Remove the default styles for inner blocks in the edit.tsx file. 3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block. 4. Update the ProductTemplate.php file to properly render the block content based on the changes. 5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary. These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior. * Fix pagination issue * Minor code quality improvments * Register product blocks only in experimental builds - Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds. - Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page. * Add experimental flag to PHP file * Update documentation for feature flags - Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file. - Include references to PHP and webpack flags for both blocks. * Change default order and orderBy values in block.json - Update the default 'order' value from 'desc' to 'asc'. - Update the default 'orderBy' value from 'date' to 'title'. * Refactor experimental block registration and remove unused file - Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx. - Remove unused file types.ts in product-template directory. - Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null. * Update variation names in product summary and product title elements Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block. * Rename 'Products Collection' to 'Product Collection' - Renamed all instances of "products-collection" to "product-collection" across multiple files. - Adjusted related types and method calls to match the new naming convention. - Updated documentation and feature flags to reflect the name change. - Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`. * Hide product-template block from inserter - Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`. - Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component. * Fix Eslint error
2023-05-15 08:51:49 +00:00
},
"tagName": {
Product Collection: Add stock status filter (https://github.com/woocommerce/woocommerce-blocks/pull/9580) * Add columns control to product collection block editor settings - `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function. - A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'. - The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties. * Refactor: Simplify Fallback Return in ColumnsControl Component This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React. * Feature: Add 'Order By' Control to Product Collection Inspector This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse. * Add more options to OrderBy type * Add orderby handling on frontend & editor The main changes include: 1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block. 2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block. 3. Added methods to manage query parameters for both frontend rendering and the Editor. 4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values. 5. Defined a function to build the query based on block attributes, filters, and global WP_Query. 6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively. These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections. * Add 'on sale' filter and enhance settings management in product collection block This commit introduces several changes to the product collection block. - First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale. - It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings. - It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control. - A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters. - The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes. - Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter. This should enhance the flexibility and user-friendliness of the product collection block. * Add stock status filter to WooCommerce product collection block This commit introduces a stock status filter to the WooCommerce product collection block. The changes include: 1. Added the ability to filter products based on their stock status within the 'product-collection' block. A new stock status control is created within the inspector-controls of the block. 2. A new 'get_stock_status_query' function is introduced in 'ProductCollection.php' which returns a query for products depending on their stock status. Please note that the stock status filter will only appear in the experimental build for now. * Refactor Stock Status control of Product Collection block This commit refactors the Stock Status control. The changes aim to improve the code organization and make the behavior of the component more explicit. The key modifications are: 1. Moved stock status related constants and functions from `inspector-controls/utils.tsx` to `inspector-controls/constants.ts`. This is done to ensure that all constants and similar utility functions are organized in one place. 2. Updated `product-collection/index.tsx` to import `getDefaultStockStatuses` from `inspector-controls/constants` instead of `inspector-controls/utils`. 3. Updated `stock-status-control.tsx` to determine whether the stock status has value or not by comparing with the default stock statuses using `fastDeepEqual`. If the stock status control is deselected, it resets the stock status to the default statuses. These changes do not introduce any new functionalities, but improve the readability and maintainability of the code. * Fix: Default values of attributes not saving as serialized block comment This was happening because of this issue: https://github.com/WordPress/gutenberg/issues/7342 Therefore, I had to use `useEffect` to set the default values of the attributes. Here is the list of changes I made: 1. Removed default values from `block.json` for `query`, `tagName`, and `displayLayout`. 2. Moved the default values to `constants.ts` and created a new object `DEFAULT_ATTRIBUTES` to store them. 3. Relocated `constants.ts` from `inspector-controls` to the parent directory. 4. Refactored `edit.tsx` to use `DEFAULT_ATTRIBUTES` from `constants.ts` to set default attributes using `useEffect`. 5. Removed the attributes assignment from `registerBlockType` in `index.tsx`. 6. Updated `columns-control.tsx`, `index.tsx`, `order-by-control.tsx`, and `stock-status-control.tsx` to import from the relocated `constants.ts`. 7. Updated `ProductCollectionAttributes` and `ProductCollectionQuery` in `types.ts` to include `tagName` and `isProductCollectionBlock` respectively. 8. Modified `ProductCollection.php` to match the updated `orderBy` key in the query parameter. This refactor enhances the readability of the code and reduces duplication by keeping all constants and default values in one place. * Replace usage of 'statii' with 'statuses' in stock status handling This commit replaces all instances of 'statii' with the correct term 'statuses' in the context of handling stock status. This change affects three files: 1. `assets/js/blocks/product-collection/inspector-controls/stock-status-control.tsx` - The term is corrected in a comment block. 2. `assets/js/blocks/product-collection/types.ts` - Updated the name of a variable in the `ProductCollectionQuery` interface. 3. `src/BlockTypes/ProductCollection.php` - Here, the term is replaced in several locations including variable names, comments and the method `get_stock_status_query`. This commit helps improve code readability and consistency across the repository.
2023-05-26 11:44:37 +00:00
"type": "string"
Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352) * Add Products Collection block scaffolding This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend. * Add Product Template block and integrate with Products Collection block This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include: - Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files. - Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files. - Updates to the webpack-entries.js file to include the new Product Template block. - Addition of the ProductTemplate class in the src/BlockTypes directory. - Inclusion of the ProductTemplate class in the src/BlockTypesController.php file. * Enhance product-template block with context and styling This commit adds various enhancements to the product-template block. It includes: - Introduce `usesContext` and `supports` properties to the block.json file - Update the edit.tsx file to use BlockContextProvider and add query logic - Add an editor.scss file for styling the product-template block in the editor - Extend the products-collection block.json file with new properties - Modify the products-collection edit.tsx file to include instanceId and useEffect These changes improve the product-template block by providing better context handling and styling options. * Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor. * Add product title and summary variations for Products Collection block - Add default spacing between product elements in `style.scss` - Register product title and summary element variations in `products-collection` block - Create utility for registering element variations - Extend core elements with WooCommerce namespace * Set inherit to false by default and other improvements This commit introduces several changes to the ProductsCollection block: 1. Set the "inherit" property to false in block.json, disabling inheritance by default. 2. Remove the default styles for inner blocks in the edit.tsx file. 3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block. 4. Update the ProductTemplate.php file to properly render the block content based on the changes. 5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary. These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior. * Fix pagination issue * Minor code quality improvments * Register product blocks only in experimental builds - Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds. - Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page. * Add experimental flag to PHP file * Update documentation for feature flags - Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file. - Include references to PHP and webpack flags for both blocks. * Change default order and orderBy values in block.json - Update the default 'order' value from 'desc' to 'asc'. - Update the default 'orderBy' value from 'date' to 'title'. * Refactor experimental block registration and remove unused file - Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx. - Remove unused file types.ts in product-template directory. - Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null. * Update variation names in product summary and product title elements Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block. * Rename 'Products Collection' to 'Product Collection' - Renamed all instances of "products-collection" to "product-collection" across multiple files. - Adjusted related types and method calls to match the new naming convention. - Updated documentation and feature flags to reflect the name change. - Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`. * Hide product-template block from inserter - Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`. - Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component. * Fix Eslint error
2023-05-15 08:51:49 +00:00
},
"displayLayout": {
Product Collection: Add stock status filter (https://github.com/woocommerce/woocommerce-blocks/pull/9580) * Add columns control to product collection block editor settings - `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function. - A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'. - The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties. * Refactor: Simplify Fallback Return in ColumnsControl Component This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React. * Feature: Add 'Order By' Control to Product Collection Inspector This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse. * Add more options to OrderBy type * Add orderby handling on frontend & editor The main changes include: 1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block. 2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block. 3. Added methods to manage query parameters for both frontend rendering and the Editor. 4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values. 5. Defined a function to build the query based on block attributes, filters, and global WP_Query. 6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively. These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections. * Add 'on sale' filter and enhance settings management in product collection block This commit introduces several changes to the product collection block. - First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale. - It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings. - It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control. - A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters. - The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes. - Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter. This should enhance the flexibility and user-friendliness of the product collection block. * Add stock status filter to WooCommerce product collection block This commit introduces a stock status filter to the WooCommerce product collection block. The changes include: 1. Added the ability to filter products based on their stock status within the 'product-collection' block. A new stock status control is created within the inspector-controls of the block. 2. A new 'get_stock_status_query' function is introduced in 'ProductCollection.php' which returns a query for products depending on their stock status. Please note that the stock status filter will only appear in the experimental build for now. * Refactor Stock Status control of Product Collection block This commit refactors the Stock Status control. The changes aim to improve the code organization and make the behavior of the component more explicit. The key modifications are: 1. Moved stock status related constants and functions from `inspector-controls/utils.tsx` to `inspector-controls/constants.ts`. This is done to ensure that all constants and similar utility functions are organized in one place. 2. Updated `product-collection/index.tsx` to import `getDefaultStockStatuses` from `inspector-controls/constants` instead of `inspector-controls/utils`. 3. Updated `stock-status-control.tsx` to determine whether the stock status has value or not by comparing with the default stock statuses using `fastDeepEqual`. If the stock status control is deselected, it resets the stock status to the default statuses. These changes do not introduce any new functionalities, but improve the readability and maintainability of the code. * Fix: Default values of attributes not saving as serialized block comment This was happening because of this issue: https://github.com/WordPress/gutenberg/issues/7342 Therefore, I had to use `useEffect` to set the default values of the attributes. Here is the list of changes I made: 1. Removed default values from `block.json` for `query`, `tagName`, and `displayLayout`. 2. Moved the default values to `constants.ts` and created a new object `DEFAULT_ATTRIBUTES` to store them. 3. Relocated `constants.ts` from `inspector-controls` to the parent directory. 4. Refactored `edit.tsx` to use `DEFAULT_ATTRIBUTES` from `constants.ts` to set default attributes using `useEffect`. 5. Removed the attributes assignment from `registerBlockType` in `index.tsx`. 6. Updated `columns-control.tsx`, `index.tsx`, `order-by-control.tsx`, and `stock-status-control.tsx` to import from the relocated `constants.ts`. 7. Updated `ProductCollectionAttributes` and `ProductCollectionQuery` in `types.ts` to include `tagName` and `isProductCollectionBlock` respectively. 8. Modified `ProductCollection.php` to match the updated `orderBy` key in the query parameter. This refactor enhances the readability of the code and reduces duplication by keeping all constants and default values in one place. * Replace usage of 'statii' with 'statuses' in stock status handling This commit replaces all instances of 'statii' with the correct term 'statuses' in the context of handling stock status. This change affects three files: 1. `assets/js/blocks/product-collection/inspector-controls/stock-status-control.tsx` - The term is corrected in a comment block. 2. `assets/js/blocks/product-collection/types.ts` - Updated the name of a variable in the `ProductCollectionQuery` interface. 3. `src/BlockTypes/ProductCollection.php` - Here, the term is replaced in several locations including variable names, comments and the method `get_stock_status_query`. This commit helps improve code readability and consistency across the repository.
2023-05-26 11:44:37 +00:00
"type": "object"
Automatic migration path from Products to Product Collection - step 2 - display notice (https://github.com/woocommerce/woocommerce-blocks/pull/10139) * Display upgrade notice after successful replacement
2023-07-12 09:19:35 +00:00
},
Add logic of Upgrade Notice after upgrading Products to Product Collection (https://github.com/woocommerce/woocommerce-blocks/pull/10267) * WIP of Upgrade Notice state * Extend the state options with seeing option * Move the logic to the dedicated folder * Subscribe only if not reverted * Refactor the way UpgradeNotice is rendered * Simplify the logic of keeping the Upgrade Notice state in local storage * Improve types organisation * Lift the functions interacting with local storage to the Inspector Controls of Product Colelction * Simplify logic of showing Upgrade Notice * Disable auto migration * Refactoring * Use useLocalStorageState hook * Fix incorrect merge * Final improvements * Allow to display Upgrade Notice after revert and manual upgrade * Fix incorrect merge * Improve the unsubscribe process * Trigger auto-update from Product Collection only * Remove weird console.log * Abstract manual update from Product Query * Fix the taxQuery migration from Product Collection to Products * Product Collection - logic to hide upgrade notice (https://github.com/woocommerce/woocommerce-blocks/pull/10494) * Add timestamp to each upgrade notice status change * Revert back only Product Collections converted from Products block * Make the time threshold configurable * Add logic that hides the Upgrade Notice after some amount of displays * Fix the taxQuery migration from Product Collection to Products * Change the way to count Product Collection entries * Fix the problem of multiple display counter increments with Product Collection * Update Upgrade Notice visibility conditions * Add contiions to unmark Product Collection as converted from Products * Change variable name * Change variable t to time name for better readibility. Improve types * Replace useState with useRef * Remove unecessary props passed to UpgradeNotice
2023-08-18 06:25:15 +00:00
"convertedFromProducts": {
Automatic migration path from Products to Product Collection - step 2 - display notice (https://github.com/woocommerce/woocommerce-blocks/pull/10139) * Display upgrade notice after successful replacement
2023-07-12 09:19:35 +00:00
"type": "boolean",
"default": false
New flow of adding Product Collection and basic set of Collections (#42696) * Migrate PR to Core * Migrate test changes * Add Custom Collection with inherit query attribute disabled * Update copy of Product Catalog collection * Don't choose default active collection in polaceholder and remove highlight * Remove inherit query option from inspector controls * Add collection names to Product Catalog and Custom one * Unify Collection Chooser between Modal and Placeholder * Bring back util removed by accident * Replace the translations domain with woocommerce * Remove leftovers after merge * Add pagination and no results to Product Catalog and Custom collections * Revert textdomain change * Fix lint error * Add changelog entry * Change collection label * Bring back Inherit query from template * Remove Custom collection and bring back single Product Collection * Simplify applying collection * Make sure Inherit query from template is enabled in archive templates by default and disbaled in posts/pages * Change incorrect Playwright locator * Add test for Product Catalog inheriting the query in product archive * Add tests for recommendation collection hiding the predefined filters * Add reviews to multiple products * Update expected products in Top Rated * Remove rating creation in test env and skip undeterministic tests * Add skip to Best Sellers test * Update README.md * Add more keywords to collections, like 'product collection' to recommendation collections * Rephrase the README note about Collections registration * Simplify types * Rename unchangeableFilters to hideControls * Fix typo in file name * Remove 'pattern' references from toolbar files * Replace hardcoded SCSS color with wc variable * Remove changelog file from different PR * Move hideControls to Product Collection ayttributes * Improve responsiveness of columns in Product Collection Placeholder * Use admin color pallette in Product Collection Placeholder * Move Inherit query from template to the top of Inspector Controls * Change the Collection prefix to woocommerce rather than woocommerce-blocks * Simplify Placeholder and Modal styles
2023-12-27 10:07:27 +00:00
},
"collection": {
"type": "string"
},
"hideControls": {
"default": [],
"type": "array"
Product Collection: Make attributes available in rest_product_query hook (#44150) * Make attributes available in rest_product_query hook This commit introduces the 'includeInQueryContext' attribute to the 'woocommerce/product-collection' block and updates the 'woocommerce/product-template' block to consume this new attribute. Key Changes: 1. `woocommerce/product-collection` Block: - A new attribute 'includeInQueryContext' is added in `block.json`. This attribute is designed to hold a list of attribute names relevant for the query context. - The 'includeInQueryContext' attribute is included in the `providesContext` field to ensure its availability to child blocks. - In `constants.ts`, default values for 'includeInQueryContext' are defined, specifying 'collection' and 'id' as initial attributes. - The `types.ts` file is updated with a comment explaining the purpose of 'includeInQueryContext'. 2. `woocommerce/product-template` Block: - Modified `block.json` to utilize the 'includeInQueryContext' context provided by the parent `woocommerce/product-collection` block. - The `edit.tsx` file is updated to handle the new context. It uses a newly added utility function `useProductCollectionBlockAttributes` from `utils.tsx` to access parent block attributes. - The `utils.tsx` file is introduced, containing the `useProductCollectionBlockAttributes` hook. This hook is responsible for finding the parent 'woocommerce/product-collection' block and returning its attributes. - Within `edit.tsx`, logic is added to create a query context object based on the attributes specified in 'includeInQueryContext', enhancing the block's ability to dynamically adapt to changes. * Remove commented code * Rename query context attribute and optimize parent block detection This commit introduces two significant changes aimed at improving code readability and efficiency. 1. **Renaming of Query Context Attribute:** - The attribute `includeInQueryContext` has been renamed to `queryContextIncludes` across various files, including block JSON configurations and TypeScript definitions. This change makes the attribute's purpose more intuitive, indicating it specifies which attributes to include in the query context. 2. **Optimized Parent Block Detection:** - Replaced the use of `getBlockParents` with `getBlockParentsByBlockName` in utility functions to find the closest Product Collection block. This optimization allows for a more direct and efficient way to identify the relevant parent block by specifying the block name, reducing unnecessary iterations and improving code performance. * Streamline query context construction in product template Key Changes: - **Introduction of `useProductCollectionQueryContext` Hook:** This new hook takes the `clientId` and `queryContextIncludes` as inputs and returns a query context object. It encapsulates the logic for fetching parent product collection block attributes and constructing the query context accordingly. This abstraction simplifies the edit component's logic, focusing on the essentials and improving code readability. - **Optimization of Parent Block Detection:** The hook uses `getBlockParentsByBlockName` to accurately and efficiently find the closest parent `Product Collection` block, minimizing the overhead previously associated with traversing the block hierarchy. * Always include `collection` and `id` in query context * Minor refactor * Enhance query context handling for more maintainable code - Introduced `DEFAULT_QUERY_CONTEXT_ATTRIBUTES` in `edit.tsx` to maintain a clear list of default query context attributes. - Modified `ProductTemplateEdit` to automatically include these default attributes in `queryContextIncludes`, ensuring they are always part of the query context without manual initialization. - Simplified `useProductCollectionQueryContext` in `utils.tsx` by removing static initialization of 'collection' and 'id', relying instead on the dynamic addition of necessary attributes from `queryContextIncludes`. This refactor enhances the maintainability and clarity of the code, ensuring a solid foundation for future enhancements and features. * Add E2E tests for Product Collection query context - Added a new test suite 'Query Context in Editor' to validate the correctness of query context parameters when the Product Collection block is used. This suite ensures that: - For the 'Product Catalog', only the ID is sent in the query context, confirming that collection-specific parameters are excluded when not relevant. - For collections such as 'On Sale', the collection name is correctly passed in the query context, validating that the block dynamically adjusts query parameters based on its settings. - Introduced a new utility method `setupAndFetchQueryContextURL` in `product-collection.page.ts`. This method automates the setup of a post with the Product Collection block and fetches the URL with query context parameters, facilitating the validation of query context handling. * Add changefile(s) from automation for the following project(s): woocommerce-blocks * Fix edge case when `queryContextIncludes` is not defined - Initializing `queryContextIncludes` with a default empty array directly in the destructuring assignment of the component's props. This approach ensures that `queryContextIncludes` is always an array, simplifying downstream logic. - Creating a new constant `queryContextIncludesWithDefaults` to hold the combination of `queryContextIncludes` and `DEFAULT_QUERY_CONTEXT_ATTRIBUTES`. This step avoids directly mutating the `queryContextIncludes` prop, aligning with best practices for functional purity and making the code easier to understand and debug. - Updating the `useProductCollectionQueryContext` hook call to use `queryContextIncludesWithDefaults`. This ensures that the default query context attributes are consistently included without altering the original prop. These adjustments not only enhance the code's maintainability but also ensure more predictable behavior by avoiding side effects related to parameter mutation. --------- Co-authored-by: github-actions <github-actions@github.com>
2024-02-12 08:45:24 +00:00
},
"queryContextIncludes": {
"type": "array"
Product Collection: Disable client side navigation if blocks incompatible with Interactivity API are detected (#45435) * Add dummy Force Page Reload control to Inspector Advanced Control * Add enhancedPagination attribute that decides if client side navigation is enabled * Consume the enhancedPagination attribute * Force client side navigation when incompatible blocks detected * Dummy util to detect incompatible blocks * Detect incompatible blocks in the Editor * Switch to WordPress Interactivity package in Product Collection * Add initial implementation of the incompatible blocks detection in frontend * Remove leftover * Revert to using internal version of interactivity API * There's no Interactivity store config available in the internal Interactivity implementation so remove it * Disable client side navigation if the incompatible block is detected * Add default attribute value * Switch from enmhancedPagination attribute to forcePageReload * Fixed some misclicked line order change * Switch from enhancedPagination to forcePageReload in PHP code * Apply the correct filter * Fix the incorrect condition to detect incompatible block * Initial implementation of orange dot to bring attention * Cleanup * Remove the orange dot indicator * Refactor checking for unsupported blocks * Add changelog * Fix PHP lint errors * Bring back empty line at the end of pnpm-lock * Bring pnpm-lock.yaml file to original state * Fix incorrect function call * Add visibility description to function * Switch private method to public * More linted fixes
2024-03-18 07:24:03 +00:00
},
"forcePageReload": {
"type": "boolean",
"default": false
Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352) * Add Products Collection block scaffolding This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend. * Add Product Template block and integrate with Products Collection block This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include: - Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files. - Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files. - Updates to the webpack-entries.js file to include the new Product Template block. - Addition of the ProductTemplate class in the src/BlockTypes directory. - Inclusion of the ProductTemplate class in the src/BlockTypesController.php file. * Enhance product-template block with context and styling This commit adds various enhancements to the product-template block. It includes: - Introduce `usesContext` and `supports` properties to the block.json file - Update the edit.tsx file to use BlockContextProvider and add query logic - Add an editor.scss file for styling the product-template block in the editor - Extend the products-collection block.json file with new properties - Modify the products-collection edit.tsx file to include instanceId and useEffect These changes improve the product-template block by providing better context handling and styling options. * Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor. * Add product title and summary variations for Products Collection block - Add default spacing between product elements in `style.scss` - Register product title and summary element variations in `products-collection` block - Create utility for registering element variations - Extend core elements with WooCommerce namespace * Set inherit to false by default and other improvements This commit introduces several changes to the ProductsCollection block: 1. Set the "inherit" property to false in block.json, disabling inheritance by default. 2. Remove the default styles for inner blocks in the edit.tsx file. 3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block. 4. Update the ProductTemplate.php file to properly render the block content based on the changes. 5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary. These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior. * Fix pagination issue * Minor code quality improvments * Register product blocks only in experimental builds - Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds. - Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page. * Add experimental flag to PHP file * Update documentation for feature flags - Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file. - Include references to PHP and webpack flags for both blocks. * Change default order and orderBy values in block.json - Update the default 'order' value from 'desc' to 'asc'. - Update the default 'orderBy' value from 'date' to 'title'. * Refactor experimental block registration and remove unused file - Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx. - Remove unused file types.ts in product-template directory. - Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null. * Update variation names in product summary and product title elements Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block. * Rename 'Products Collection' to 'Product Collection' - Renamed all instances of "products-collection" to "product-collection" across multiple files. - Adjusted related types and method calls to match the new naming convention. - Updated documentation and feature flags to reflect the name change. - Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`. * Hide product-template block from inserter - Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`. - Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component. * Fix Eslint error
2023-05-15 08:51:49 +00:00
}
},
"providesContext": {
"queryId": "queryId",
"query": "query",
Include the selected collection in the product collection block context (#43247) * Include collection attribute in the block context * add 'collection' to useContext for Product Template * Changelog --------- Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2024-02-08 08:55:05 +00:00
"displayLayout": "displayLayout",
Product Collection: Make attributes available in rest_product_query hook (#44150) * Make attributes available in rest_product_query hook This commit introduces the 'includeInQueryContext' attribute to the 'woocommerce/product-collection' block and updates the 'woocommerce/product-template' block to consume this new attribute. Key Changes: 1. `woocommerce/product-collection` Block: - A new attribute 'includeInQueryContext' is added in `block.json`. This attribute is designed to hold a list of attribute names relevant for the query context. - The 'includeInQueryContext' attribute is included in the `providesContext` field to ensure its availability to child blocks. - In `constants.ts`, default values for 'includeInQueryContext' are defined, specifying 'collection' and 'id' as initial attributes. - The `types.ts` file is updated with a comment explaining the purpose of 'includeInQueryContext'. 2. `woocommerce/product-template` Block: - Modified `block.json` to utilize the 'includeInQueryContext' context provided by the parent `woocommerce/product-collection` block. - The `edit.tsx` file is updated to handle the new context. It uses a newly added utility function `useProductCollectionBlockAttributes` from `utils.tsx` to access parent block attributes. - The `utils.tsx` file is introduced, containing the `useProductCollectionBlockAttributes` hook. This hook is responsible for finding the parent 'woocommerce/product-collection' block and returning its attributes. - Within `edit.tsx`, logic is added to create a query context object based on the attributes specified in 'includeInQueryContext', enhancing the block's ability to dynamically adapt to changes. * Remove commented code * Rename query context attribute and optimize parent block detection This commit introduces two significant changes aimed at improving code readability and efficiency. 1. **Renaming of Query Context Attribute:** - The attribute `includeInQueryContext` has been renamed to `queryContextIncludes` across various files, including block JSON configurations and TypeScript definitions. This change makes the attribute's purpose more intuitive, indicating it specifies which attributes to include in the query context. 2. **Optimized Parent Block Detection:** - Replaced the use of `getBlockParents` with `getBlockParentsByBlockName` in utility functions to find the closest Product Collection block. This optimization allows for a more direct and efficient way to identify the relevant parent block by specifying the block name, reducing unnecessary iterations and improving code performance. * Streamline query context construction in product template Key Changes: - **Introduction of `useProductCollectionQueryContext` Hook:** This new hook takes the `clientId` and `queryContextIncludes` as inputs and returns a query context object. It encapsulates the logic for fetching parent product collection block attributes and constructing the query context accordingly. This abstraction simplifies the edit component's logic, focusing on the essentials and improving code readability. - **Optimization of Parent Block Detection:** The hook uses `getBlockParentsByBlockName` to accurately and efficiently find the closest parent `Product Collection` block, minimizing the overhead previously associated with traversing the block hierarchy. * Always include `collection` and `id` in query context * Minor refactor * Enhance query context handling for more maintainable code - Introduced `DEFAULT_QUERY_CONTEXT_ATTRIBUTES` in `edit.tsx` to maintain a clear list of default query context attributes. - Modified `ProductTemplateEdit` to automatically include these default attributes in `queryContextIncludes`, ensuring they are always part of the query context without manual initialization. - Simplified `useProductCollectionQueryContext` in `utils.tsx` by removing static initialization of 'collection' and 'id', relying instead on the dynamic addition of necessary attributes from `queryContextIncludes`. This refactor enhances the maintainability and clarity of the code, ensuring a solid foundation for future enhancements and features. * Add E2E tests for Product Collection query context - Added a new test suite 'Query Context in Editor' to validate the correctness of query context parameters when the Product Collection block is used. This suite ensures that: - For the 'Product Catalog', only the ID is sent in the query context, confirming that collection-specific parameters are excluded when not relevant. - For collections such as 'On Sale', the collection name is correctly passed in the query context, validating that the block dynamically adjusts query parameters based on its settings. - Introduced a new utility method `setupAndFetchQueryContextURL` in `product-collection.page.ts`. This method automates the setup of a post with the Product Collection block and fetches the URL with query context parameters, facilitating the validation of query context handling. * Add changefile(s) from automation for the following project(s): woocommerce-blocks * Fix edge case when `queryContextIncludes` is not defined - Initializing `queryContextIncludes` with a default empty array directly in the destructuring assignment of the component's props. This approach ensures that `queryContextIncludes` is always an array, simplifying downstream logic. - Creating a new constant `queryContextIncludesWithDefaults` to hold the combination of `queryContextIncludes` and `DEFAULT_QUERY_CONTEXT_ATTRIBUTES`. This step avoids directly mutating the `queryContextIncludes` prop, aligning with best practices for functional purity and making the code easier to understand and debug. - Updating the `useProductCollectionQueryContext` hook call to use `queryContextIncludesWithDefaults`. This ensures that the default query context attributes are consistently included without altering the original prop. These adjustments not only enhance the code's maintainability but also ensure more predictable behavior by avoiding side effects related to parameter mutation. --------- Co-authored-by: github-actions <github-actions@github.com>
2024-02-12 08:45:24 +00:00
"queryContextIncludes": "queryContextIncludes",
Include the selected collection in the product collection block context (#43247) * Include collection attribute in the block context * add 'collection' to useContext for Product Template * Changelog --------- Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2024-02-08 08:55:05 +00:00
"collection": "collection"
Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352) * Add Products Collection block scaffolding This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend. * Add Product Template block and integrate with Products Collection block This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include: - Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files. - Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files. - Updates to the webpack-entries.js file to include the new Product Template block. - Addition of the ProductTemplate class in the src/BlockTypes directory. - Inclusion of the ProductTemplate class in the src/BlockTypesController.php file. * Enhance product-template block with context and styling This commit adds various enhancements to the product-template block. It includes: - Introduce `usesContext` and `supports` properties to the block.json file - Update the edit.tsx file to use BlockContextProvider and add query logic - Add an editor.scss file for styling the product-template block in the editor - Extend the products-collection block.json file with new properties - Modify the products-collection edit.tsx file to include instanceId and useEffect These changes improve the product-template block by providing better context handling and styling options. * Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor. * Add product title and summary variations for Products Collection block - Add default spacing between product elements in `style.scss` - Register product title and summary element variations in `products-collection` block - Create utility for registering element variations - Extend core elements with WooCommerce namespace * Set inherit to false by default and other improvements This commit introduces several changes to the ProductsCollection block: 1. Set the "inherit" property to false in block.json, disabling inheritance by default. 2. Remove the default styles for inner blocks in the edit.tsx file. 3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block. 4. Update the ProductTemplate.php file to properly render the block content based on the changes. 5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary. These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior. * Fix pagination issue * Minor code quality improvments * Register product blocks only in experimental builds - Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds. - Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page. * Add experimental flag to PHP file * Update documentation for feature flags - Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file. - Include references to PHP and webpack flags for both blocks. * Change default order and orderBy values in block.json - Update the default 'order' value from 'desc' to 'asc'. - Update the default 'orderBy' value from 'date' to 'title'. * Refactor experimental block registration and remove unused file - Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx. - Remove unused file types.ts in product-template directory. - Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null. * Update variation names in product summary and product title elements Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block. * Rename 'Products Collection' to 'Product Collection' - Renamed all instances of "products-collection" to "product-collection" across multiple files. - Adjusted related types and method calls to match the new naming convention. - Updated documentation and feature flags to reflect the name change. - Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`. * Hide product-template block from inserter - Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`. - Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component. * Fix Eslint error
2023-05-15 08:51:49 +00:00
},
Product Collection: telemetry choosing collection (#45827) * Use templateSlug context in Product Collection * Implement util recognising the location for track events * Implement the track event when user chooses a collection in Product Collection * Add changelog * Remove incorrect import * Cover cases with specific Product or Specific Taxonomy * Update event name * Adjust Product Filters tests * Revert wrong commit
2024-04-02 12:12:20 +00:00
"usesContext": [ "templateSlug" ],
Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352) * Add Products Collection block scaffolding This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend. * Add Product Template block and integrate with Products Collection block This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include: - Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files. - Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files. - Updates to the webpack-entries.js file to include the new Product Template block. - Addition of the ProductTemplate class in the src/BlockTypes directory. - Inclusion of the ProductTemplate class in the src/BlockTypesController.php file. * Enhance product-template block with context and styling This commit adds various enhancements to the product-template block. It includes: - Introduce `usesContext` and `supports` properties to the block.json file - Update the edit.tsx file to use BlockContextProvider and add query logic - Add an editor.scss file for styling the product-template block in the editor - Extend the products-collection block.json file with new properties - Modify the products-collection edit.tsx file to include instanceId and useEffect These changes improve the product-template block by providing better context handling and styling options. * Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor. * Add product title and summary variations for Products Collection block - Add default spacing between product elements in `style.scss` - Register product title and summary element variations in `products-collection` block - Create utility for registering element variations - Extend core elements with WooCommerce namespace * Set inherit to false by default and other improvements This commit introduces several changes to the ProductsCollection block: 1. Set the "inherit" property to false in block.json, disabling inheritance by default. 2. Remove the default styles for inner blocks in the edit.tsx file. 3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block. 4. Update the ProductTemplate.php file to properly render the block content based on the changes. 5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary. These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior. * Fix pagination issue * Minor code quality improvments * Register product blocks only in experimental builds - Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds. - Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page. * Add experimental flag to PHP file * Update documentation for feature flags - Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file. - Include references to PHP and webpack flags for both blocks. * Change default order and orderBy values in block.json - Update the default 'order' value from 'desc' to 'asc'. - Update the default 'orderBy' value from 'date' to 'title'. * Refactor experimental block registration and remove unused file - Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx. - Remove unused file types.ts in product-template directory. - Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null. * Update variation names in product summary and product title elements Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block. * Rename 'Products Collection' to 'Product Collection' - Renamed all instances of "products-collection" to "product-collection" across multiple files. - Adjusted related types and method calls to match the new naming convention. - Updated documentation and feature flags to reflect the name change. - Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`. * Hide product-template block from inserter - Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`. - Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component. * Fix Eslint error
2023-05-15 08:51:49 +00:00
"supports": {
"align": [ "wide", "full" ],
"anchor": true,
"html": false,
Product Collection: Return to top after page change (#43817) * Initial working version * Update scrolling behavior in product collection block frontend This commit updates the scrolling behavior in the product collection block's frontend script. Previously, the code focused on the first anchor or button within a product collection block. This approach was taken to maintain accessibility and ensure that the focused element was scrolled into view. However, this behavior has been changed to improve the user experience. The updated code now directly scrolls to the first product in the collection. This is achieved by selecting the product using a new selector that targets the `.wc-block-product` class within the `.wc-block-product-template` of the specified `data-wc-navigation-id`. Once the product is selected, the `scrollIntoView` method is used with smooth behavior and start block alignment, offering a more visually appealing scroll effect. This change enhances the user experience by smoothly directing attention to the beginning of the product collection, making it easier for users to browse products. * Remove code related to animation * Fix the issue related to pagination block rendering - I have improved the code by breaking it into smaller functions - Added unique `data-wc-key` to each anchor tag * Enhance Product Collection Block with Interactive Prefetching * Refine Prefetch Logic & other improvements This commit further refines the prefetch logic and interactivity in the Product Collection block. It focuses on enhancing code clarity and improving the prefetch behavior based on user interactions. Key changes include: 1. Renamed 'isPrefetchNextAndPreviousLink' to 'isPrefetchNextOrPreviousLink' in ProductCollectionStoreContext for better readability and accuracy. 2. Modified the scrollToFirstProductIfNotVisible function to accept a wcNavigationId as a parameter instead of a reference 3. Introduced checks for the existence of wcNavigationId in scrollToFirstProductIfNotVisible to prevent unnecessary executions. 4. Updated comments throughout frontend.tsx for enhanced clarity, explaining the prefetch logic and its triggers in detail. 5. Adjusted the logic in the navigate and prefetch functions to align with the new context structure and prefetch strategy. 6. In ProductCollection.php, updated data attributes to align with the revised prefetch strategy. 7. Refined the attribute setting in process_pagination_links function to correctly implement the updated interactivity and prefetch logic. These changes aim to optimize the prefetch functionality, reduce unnecessary prefetching on initial page load, and ensure a smoother and more efficient navigation experience within the Product Collection block. * Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce * Improve comments * Use wp_json_encode for data-wc-interactive attribute This commit updates the `ProductCollection` class to use `wp_json_encode` for setting the `data-wc-interactive` attribute value. Previously, the attribute value was hardcoded as a JSON string. Now, by utilizing `wp_json_encode`, we ensure the JSON encoding is handled correctly by WordPress standards, enhancing readability and maintainability of the code. --------- Co-authored-by: github-actions <github-actions@github.com>
2024-02-02 06:37:29 +00:00
"__experimentalLayout": true,
"interactivity": true
Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352) * Add Products Collection block scaffolding This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend. * Add Product Template block and integrate with Products Collection block This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include: - Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files. - Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files. - Updates to the webpack-entries.js file to include the new Product Template block. - Addition of the ProductTemplate class in the src/BlockTypes directory. - Inclusion of the ProductTemplate class in the src/BlockTypesController.php file. * Enhance product-template block with context and styling This commit adds various enhancements to the product-template block. It includes: - Introduce `usesContext` and `supports` properties to the block.json file - Update the edit.tsx file to use BlockContextProvider and add query logic - Add an editor.scss file for styling the product-template block in the editor - Extend the products-collection block.json file with new properties - Modify the products-collection edit.tsx file to include instanceId and useEffect These changes improve the product-template block by providing better context handling and styling options. * Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor. * Add product title and summary variations for Products Collection block - Add default spacing between product elements in `style.scss` - Register product title and summary element variations in `products-collection` block - Create utility for registering element variations - Extend core elements with WooCommerce namespace * Set inherit to false by default and other improvements This commit introduces several changes to the ProductsCollection block: 1. Set the "inherit" property to false in block.json, disabling inheritance by default. 2. Remove the default styles for inner blocks in the edit.tsx file. 3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block. 4. Update the ProductTemplate.php file to properly render the block content based on the changes. 5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary. These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior. * Fix pagination issue * Minor code quality improvments * Register product blocks only in experimental builds - Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds. - Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page. * Add experimental flag to PHP file * Update documentation for feature flags - Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file. - Include references to PHP and webpack flags for both blocks. * Change default order and orderBy values in block.json - Update the default 'order' value from 'desc' to 'asc'. - Update the default 'orderBy' value from 'date' to 'title'. * Refactor experimental block registration and remove unused file - Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx. - Remove unused file types.ts in product-template directory. - Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null. * Update variation names in product summary and product title elements Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block. * Rename 'Products Collection' to 'Product Collection' - Renamed all instances of "products-collection" to "product-collection" across multiple files. - Adjusted related types and method calls to match the new naming convention. - Updated documentation and feature flags to reflect the name change. - Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`. * Hide product-template block from inserter - Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`. - Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component. * Fix Eslint error
2023-05-15 08:51:49 +00:00
}
}