Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Product Collection: Add stock status filter #9580

Merged
merged 20 commits into from
May 26, 2023
Merged

Product Collection: Add stock status filter #9580

merged 20 commits into from
May 26, 2023

Conversation

imanish003
Copy link
Contributor

@imanish003 imanish003 commented May 24, 2023 •
edited
Loading

This PR adds Stock status control to the Product collection block.
image

Fixes #9362

Testing

  1. Create a new post
  2. Add Product Collection block
  3. With the Product Collection block selected, check the sidebar for the Stock status control. Ensure that it is displayed as shown below:
image
  1. Test the functionality of the stock status filter by modifying its selection. Observe that the changes should immediately reflect in the Editor view. For instance, if On backorder is the selected option, only products with the On backorder status should be visible in the Editor.
  2. Save and publish the post.
    • Navigate to the live post on the Frontend and verify that the changes you made in the Editor are accurately reflected.
  3. Go back to the Editor and confirm that the filters can be reset using the Reset or Reset all button, as shown below:
image
  • Do not include in the Testing Notes

WooCommerce Visibility

  • WooCommerce Core
  • Feature plugin
  • Experimental

Changelog

Product Collection: Add stock status control to sidebar settings

imanish003 added 14 commits May 15, 2023 16:57
@imanish003
Add columns control to product collection block editor settings
e4abb25 
- `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.
@imanish003
Merge branch 'trunk' into 9356-product-collection-editor-settings-col…
43b2d1c 
…umns
@imanish003
Refactor: Simplify Fallback Return in ColumnsControl Component
65582af 
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.
@imanish003
Feature: Add 'Order By' Control to Product Collection Inspector
e03ecf6 
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.
@imanish003
Merge branch 'trunk' of https://github.com/woocommerce/woocommerce-bl…
91b5cb4 
…ocks into 9359-product-collection-editor-settings-order-by
@imanish003
Add more options to OrderBy type
5e5c6b1
@imanish003
Merge branch 'trunk' into 9359-product-collection-editor-settings-ord…
9cfa07e 
…er-by
@imanish003
Add orderby handling on frontend & editor
7954c13 
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.
@imanish003
Merge branch 'trunk' into 9359-product-collection-editor-settings-ord…
b756198 
…er-by
@imanish003
Merge branch 'trunk' into 9359-product-collection-editor-settings-ord…
bed6be4 
…er-by
@imanish003
Merge branch 'trunk' of https://github.com/woocommerce/woocommerce-bl…
724f894 
…ocks into 9361-product-collection-filters-on-sale
@imanish003
Add 'on sale' filter and enhance settings management in product colle…
e5a43cf 
…ction 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.
@imanish003
Merge branch 'trunk' into 9361-product-collection-filters-on-sale
2e77956
@imanish003
Add stock status filter to WooCommerce product collection block
a832d97 
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.
@imanish003 imanish003 linked an issue May 24, 2023 that may be closed by this pull request
Product Collection - Filters: Stock Status #9362
Closed
@imanish003 imanish003 changed the title 9362 product collection filters stock status Product Collection: Add stock status filter May 24, 2023
@github-actions
Copy link
Contributor

github-actions bot commented May 24, 2023 •
edited
Loading

The release ZIP for this PR is accessible via:

https://wcblocks.wpcomstaging.com/wp-content/uploads/woocommerce-gutenberg-products-block-9580.zip

Script Dependencies Report

The compare-assets action has detected some changed script dependencies between this branch and trunk. Please review and confirm the following are correct before merging.

Script Handle Added Removed
wc-blocks.js wp-block-editor, wp-blocks, wp-components, wp-compose, wp-core-data, wp-data, wp-edit-site, wp-element, wp-hooks, wp-i18n, wp-plugins, wp-polyfill, wp-primitives ⚠️
active-filters.js wc-blocks-data-store, wc-price-format, wc-settings, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-element, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-url ⚠️
all-products.js lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-blocks-registry, wc-blocks-shared-context, wc-blocks-shared-hocs, wc-price-format, wc-settings, wp-a11y, wp-api-fetch, wp-autop, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-deprecated, wp-dom, wp-element, wp-escape-html, wp-hooks, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-style-engine, wp-url, wp-warning, wp-wordcount ⚠️
all-reviews.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives ⚠️
attribute-filter.js lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-settings, wp-a11y, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-deprecated, wp-dom, wp-element, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-keycodes, wp-polyfill, wp-primitives, wp-url, wp-warning ⚠️
breadcrumbs.js wc-settings, wp-block-editor, wp-blocks, wp-components, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
cart.js lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-blocks-registry, wc-blocks-shared-context, wc-blocks-shared-hocs, wc-price-format, wc-settings, wp-a11y, wp-api-fetch, wp-autop, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-core-data, wp-data, wp-deprecated, wp-dom, wp-editor, wp-element, wp-hooks, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-keycodes, wp-plugins, wp-polyfill, wp-primitives, wp-style-engine, wp-url, wp-warning, wp-wordcount ⚠️
catalog-sorting.js wp-block-editor, wp-blocks, wp-components, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
checkout.js lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-blocks-registry, wc-price-format, wc-settings, wp-a11y, wp-api-fetch, wp-autop, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-core-data, wp-data, wp-deprecated, wp-dom, wp-editor, wp-element, wp-hooks, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-keycodes, wp-plugins, wp-polyfill, wp-primitives, wp-url, wp-warning, wp-wordcount ⚠️
customer-account.js wc-settings, wp-block-editor, wp-blocks, wp-components, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
featured-category.js react, wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-style-engine, wp-url ⚠️
featured-product.js react, wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-style-engine, wp-url ⚠️
filter-wrapper.js wp-block-editor, wp-blocks, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
handpicked-products.js react, wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render, wp-url ⚠️
legacy-template.js wc-settings, wp-block-editor, wp-blocks, wp-components, wp-core-data, wp-data, wp-element, wp-i18n, wp-notices, wp-polyfill, wp-primitives ⚠️
mini-cart.js react, wc-price-format, wc-settings, wp-block-editor, wp-blocks, wp-components, wp-data, wp-dom, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
mini-cart-contents.js lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-blocks-registry, wc-price-format, wc-settings, wp-a11y, wp-autop, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-deprecated, wp-dom, wp-element, wp-hooks, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-keycodes, wp-polyfill, wp-primitives, wp-url, wp-warning, wp-wordcount ⚠️
store-notices.js wp-block-editor, wp-blocks, wp-components, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
price-filter.js react, wc-blocks-data-store, wc-price-format, wc-settings, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-element, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-url ⚠️
product-best-sellers.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render, wp-url ⚠️
product-category.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render, wp-url ⚠️
product-categories.js wp-block-editor, wp-blocks, wp-components, wp-element, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render ⚠️
product-new.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render, wp-url ⚠️
product-on-sale.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render, wp-url ⚠️
product-query.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-element, wp-escape-html, wp-hooks, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-url ⚠️
product-results-count.js wp-block-editor, wp-blocks, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
product-search.js wc-settings, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
product-tag.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render, wp-url ⚠️
product-top-rated.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render, wp-url ⚠️
products-by-attribute.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-polyfill, wp-primitives, wp-server-side-render, wp-url ⚠️
rating-filter.js lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-settings, wp-a11y, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-deprecated, wp-dom, wp-element, wp-i18n, wp-is-shallow-equal, wp-keycodes, wp-polyfill, wp-primitives, wp-url, wp-warning ⚠️
reviews-by-category.js wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-url ⚠️
reviews-by-product.js react, wc-settings, wp-api-fetch, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-escape-html, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-url ⚠️
single-product.js lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-blocks-registry, wc-blocks-shared-context, wc-blocks-shared-hocs, wc-price-format, wc-settings, wp-api-fetch, wp-autop, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-deprecated, wp-dom, wp-element, wp-escape-html, wp-hooks, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-style-engine, wp-url, wp-warning, wp-wordcount ⚠️
stock-filter.js lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-settings, wp-a11y, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-data, wp-deprecated, wp-dom, wp-element, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-keycodes, wp-polyfill, wp-primitives, wp-url, wp-warning ⚠️
product-collection.js wc-settings, wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-i18n, wp-polyfill, wp-primitives ⚠️
product-template.js wc-settings, wp-block-editor, wp-blocks, wp-components, wp-core-data, wp-data, wp-element, wp-i18n, wp-polyfill ⚠️

This comment was automatically generated by the ./github/compare-assets action.

TypeScript Errors Report

  • Files with errors: 473
  • Total errors: 2262

⚠️ ⚠️ This PR introduces new TS errors on 1 files:

assets/js/blocks/product-collection/inspector-controls/stock-status-control.tsx

comments-aggregator

@github-actions
Copy link
Contributor

github-actions bot commented May 24, 2023 •
edited
Loading

Size Change: +355 B (0%)

Total Size: 1.09 MB

Filename Size Change
build/active-filters.js 7.48 kB +2 B (0%)
build/all-products.js 39.9 kB -15 B (0%)
build/all-reviews.js 7.77 kB +2 B (0%)
build/attribute-filter.js 13.1 kB -7 B (0%)
build/breadcrumbs.js 2.04 kB -2 B (0%)
build/cart.js 45.1 kB +6 B (0%)
build/catalog-sorting.js 1.7 kB +4 B (0%)
build/checkout.js 46.4 kB +4 B (0%)
build/customer-account.js 3.18 kB -2 B (0%)
build/featured-category.js 15 kB +1 B (0%)
build/featured-product.js 15.2 kB +2 B (0%)
build/handpicked-products.js 8 kB -2 B (0%)
build/legacy-template.js 6.38 kB -2 B (0%)
build/mini-cart-contents.js 18 kB +3 B (0%)
build/price-filter.js 8.47 kB +1 B (0%)
build/product-add-to-cart.js 8.87 kB +2 B (0%)
build/product-button.js 4.01 kB -1 B (0%)
build/product-category.js 9.35 kB +1 B (0%)
build/product-collection.js 4.1 kB +375 B (+10%) ⚠️
build/product-image.js 4.18 kB -4 B (0%)
build/product-on-sale.js 8.68 kB +2 B (0%)
build/product-price.js 1.68 kB +1 B (0%)
build/product-query.js 11.7 kB -1 B (0%)
build/product-rating.js 971 B -1 B (0%)
build/product-results-count.js 1.66 kB -1 B (0%)
build/product-template.js 3.26 kB +3 B (0%)
build/products-by-attribute.js 9.69 kB -2 B (0%)
build/rating-filter.js 6.89 kB -3 B (0%)
build/reviews-by-category.js 12.1 kB +1 B (0%)
build/single-product.js 11.1 kB -6 B (0%)
build/stock-filter.js 7.6 kB -2 B (0%)
build/wc-blocks-vendors.js 65 kB -4 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 8.57 kB
build/active-filters-wrapper-frontend.js 7.62 kB
build/all-products-frontend.js 11.9 kB
build/attribute-filter-wrapper--stock-filter-wrapper-frontend.js 4.05 kB
build/attribute-filter-wrapper-frontend.js 4.29 kB
build/blocks-checkout.js 35.1 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.39 kB
build/cart-blocks/cart-cross-sells-frontend.js 253 B
build/cart-blocks/cart-cross-sells-products--product-price-frontend.js 2.94 kB
build/cart-blocks/cart-cross-sells-products-frontend.js 3.71 kB
build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js 5.17 kB
build/cart-blocks/cart-express-payment-frontend.js 720 B
build/cart-blocks/cart-items-frontend.js 301 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.5 kB
build/cart-blocks/cart-line-items-frontend.js 1.06 kB
build/cart-blocks/cart-order-summary-frontend.js 1.27 kB
build/cart-blocks/cart-totals-frontend.js 308 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/filled-cart-frontend.js 656 B
build/cart-blocks/order-summary-coupon-form-frontend.js 1.63 kB
build/cart-blocks/order-summary-discount-frontend.js 2.12 kB
build/cart-blocks/order-summary-fee-frontend.js 272 B
build/cart-blocks/order-summary-heading-frontend.js 333 B
build/cart-blocks/order-summary-shipping-frontend.js 17.1 kB
build/cart-blocks/order-summary-subtotal-frontend.js 273 B
build/cart-blocks/order-summary-taxes-frontend.js 434 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.38 kB
build/cart-frontend.js 29.8 kB
build/checkout-blocks/actions-frontend.js 1.85 kB
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 4.7 kB
build/checkout-blocks/billing-address-frontend.js 1.18 kB
build/checkout-blocks/contact-information-frontend.js 2.04 kB
build/checkout-blocks/express-payment-frontend.js 1.14 kB
build/checkout-blocks/fields-frontend.js 332 B
build/checkout-blocks/order-note-frontend.js 1.14 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.69 kB
build/checkout-blocks/order-summary-coupon-form-frontend.js 1.79 kB
build/checkout-blocks/order-summary-discount-frontend.js 2.29 kB
build/checkout-blocks/order-summary-fee-frontend.js 275 B
build/checkout-blocks/order-summary-frontend.js 1.28 kB
build/checkout-blocks/order-summary-shipping-frontend.js 17 kB
build/checkout-blocks/order-summary-subtotal-frontend.js 273 B
build/checkout-blocks/order-summary-taxes-frontend.js 434 B
build/checkout-blocks/payment-frontend.js 8.29 kB
build/checkout-blocks/pickup-options-frontend.js 4.84 kB
build/checkout-blocks/shipping-address-frontend.js 1.17 kB
build/checkout-blocks/shipping-method-frontend.js 2.63 kB
build/checkout-blocks/shipping-methods-frontend.js 6.4 kB
build/checkout-blocks/terms-frontend.js 1.56 kB
build/checkout-blocks/totals-frontend.js 361 B
build/checkout-frontend.js 31.9 kB
build/filter-wrapper-frontend.js 14.2 kB
build/filter-wrapper.js 2.4 kB
build/general-style-rtl.css 1.31 kB
build/general-style.css 1.31 kB
build/mini-cart-component-frontend.js 28.4 kB
build/mini-cart-contents-block/cart-button-frontend.js 1.74 kB
build/mini-cart-contents-block/checkout-button-frontend.js 1.74 kB
build/mini-cart-contents-block/empty-cart-frontend.js 360 B
build/mini-cart-contents-block/filled-cart-frontend.js 267 B
build/mini-cart-contents-block/footer-frontend.js 4.1 kB
build/mini-cart-contents-block/items-frontend.js 237 B
build/mini-cart-contents-block/products-table-frontend.js 594 B
build/mini-cart-contents-block/shopping-button-frontend.js 528 B
build/mini-cart-contents-block/title-frontend.js 1.91 kB
build/mini-cart-contents-block/title-items-counter-frontend.js 1.61 kB
build/mini-cart-contents-block/title-label-frontend.js 1.54 kB
build/mini-cart-frontend.js 2.66 kB
build/mini-cart.js 4.35 kB
build/price-filter-wrapper-frontend.js 6.75 kB
build/price-format.js 1.19 kB
build/product-add-to-cart--product-button--product-image--product-price--product-rating--product-sale-bad--49d3ecb2.js 251 B
build/product-add-to-cart--product-button--product-image--product-rating--product-title.js 151 B
build/product-add-to-cart-frontend.js 6.51 kB
build/product-best-sellers.js 8.34 kB
build/product-button--product-image--product-price--product-rating--product-sale-badge--product-sku--prod--5bce0384.js 964 B
build/product-button-frontend.js 2.65 kB
build/product-categories.js 2.37 kB
build/product-image-frontend.js 2.63 kB
build/product-new.js 8.34 kB
build/product-price-frontend.js 203 B
build/product-rating-frontend.js 2.28 kB
build/product-sale-badge-frontend.js 1.8 kB
build/product-sale-badge.js 666 B
build/product-search.js 2.63 kB
build/product-sku-frontend.js 1.84 kB
build/product-sku.js 536 B
build/product-stock-indicator-frontend.js 2.02 kB
build/product-stock-indicator.js 731 B
build/product-summary-frontend.js 2.19 kB
build/product-summary.js 905 B
build/product-tag.js 8.97 kB
build/product-title-frontend.js 2.22 kB
build/product-title.js 3.69 kB
build/product-top-rated.js 8.89 kB
build/rating-filter-frontend.js 21.4 kB
build/rating-filter-wrapper-frontend.js 6.21 kB
build/reviews-by-product.js 13.2 kB
build/reviews-frontend.js 7.11 kB
build/stock-filter-wrapper-frontend.js 2.98 kB
build/store-notices.js 1.69 kB
build/vendors--attribute-filter-wrapper--cart-blocks/order-summary-coupon-form--cart-blocks/order-summary--48e1e4bb-frontend.js 6.82 kB
build/vendors--attribute-filter-wrapper--cart-blocks/order-summary-shipping--checkout-blocks/billing-addr--d9f38f9d-frontend.js 4.21 kB
build/vendors--attribute-filter-wrapper--stock-filter-wrapper-frontend.js 5.11 kB
build/vendors--cart-blocks/cart-cross-sells-products--cart-blocks/cart-line-items--cart-blocks/cart-order--3c5fe802-frontend.js 5.26 kB
build/vendors--cart-blocks/cart-line-items--checkout-blocks/order-summary-cart-items--mini-cart-contents---233ab542-frontend.js 3.57 kB
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--decc3dc6-frontend.js 19.4 kB
build/vendors--checkout-blocks/pickup-options--checkout-blocks/shipping-methods-frontend.js 8.25 kB
build/vendors--checkout-blocks/shipping-method-frontend.js 12.5 kB
build/vendors--price-filter-wrapper-frontend.js 2.2 kB
build/vendors--product-add-to-cart-frontend.js 7.26 kB
build/vendors--rating-filter-wrapper-frontend.js 5.1 kB
build/wc-blocks-data.js 22.5 kB
build/wc-blocks-editor-style-rtl.css 5.96 kB
build/wc-blocks-editor-style.css 5.96 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 933 B
build/wc-blocks-registry.js 3.15 kB
build/wc-blocks-shared-context.js 1.52 kB
build/wc-blocks-shared-hocs.js 1.75 kB
build/wc-blocks-style-rtl.css 27.8 kB
build/wc-blocks-style.css 27.8 kB
build/wc-blocks-vendors-style-rtl.css 1.96 kB
build/wc-blocks-vendors-style.css 1.96 kB
build/wc-blocks.js 3.7 kB
build/wc-payment-method-bacs.js 816 B
build/wc-payment-method-cheque.js 811 B
build/wc-payment-method-cod.js 909 B
build/wc-payment-method-paypal.js 837 B
build/wc-settings.js 2.6 kB
build/wc-shipping-method-pickup-location.js 30.3 kB
build/woo-directives-runtime.js 2.73 kB
build/woo-directives-vendors.js 7.91 kB

compressed-size-action

imanish003 added 2 commits May 24, 2023 15:56
@imanish003
Refactor Stock Status control of Product Collection block
c4188da 
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.
@imanish003
Merge branch 'trunk' into 9362-product-collection-filters-stock-status
2d5e3f9
@imanish003 imanish003 added type: enhancement The issue is a request for an enhancement. focus: blocks Specific work involving or impacting how blocks behave. block: product collection Issues related to the Product Collection block labels May 24, 2023
@imanish003 imanish003 marked this pull request as ready for review May 24, 2023 10:49
@woocommercebot woocommercebot requested review from a team and danieldudzic and removed request for a team May 24, 2023 10:49
@imanish003 imanish003 mentioned this pull request May 25, 2023
Merged
4 tasks
Aljullu
Aljullu approved these changes May 26, 2023
View reviewed changes
Copy link
Contributor

@Aljullu Aljullu left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code looks good and it's working as expected. I left some comments inline, but only the PHP warning is a blocking one IMO, so pre-approving (but feel free to ask for a re-review if you want).

src/BlockTypes/ProductCollection.php Outdated
* @param array $stock_statii An array of acceptable stock statii.
* @return array
*/
private function get_stock_status_query( $stock_statii ) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

TIL about statii, I guess that's the plural of status, no? I think in the codebase we use statuses more often than statii, so I would rename this variable to $stock_statuses if possible to keep it consistent. Not a strong opinion, though.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @Aljullu, I agree with you. I have updated all instances of statii in commit 0c30f5b. Thank you! 🙏🏻

src/BlockTypes/ProductCollection.php
$params['orderby']['enum'] = array_unique( array_merge( $original_enum, $this->custom_order_opts ) );
return $params;
private function get_final_query_args( $common_query_values, $query ) {
$orderby_query = $query['orderby'] ? $this->get_custom_orderby_query( $query['orderby'] ) : [];
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This causes a PHP warning in the frontend if orderby is not defined:

Warning: Undefined array key "orderby" in /wp-content/plugins/woocommerce-blocks/src/BlockTypes/ProductCollection.php on line 100

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @Aljullu, Thanks for raising this 🙏🏻 I have fixed it in d1e29ef 🤝

src/BlockTypes/ProductCollection.php
Comment on lines +380 to +381
* If all stock statuses are selected except 'outofstock', we use the
* product visibility query to filter out out of stock products.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have to say that, as a user, I would find this a bit confusing because the block settings and WC settings can contradict each other. IMO block settings should take priority over WooCommerce settings. So if the Hide out of stock items from the catalog option is checked but I add a Product Collection block selecting to display products with all stock statuses, I would expect all products to appear, ignoring the Hide out of stock items from the catalog option.

In other words, I think the Hide out of stock items from the catalog option should affect which stock status options are selected by default when inserting the block, but they shouldn't affect how the block works once the block attributes have been set.

But... I don't have a strong opinion so I'm happy to change my mind. Also, I don't think it's a blocker.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @Aljullu,

I think the Hide out of stock items from the catalog option should affect which stock status options are selected by default when inserting the block, but they shouldn't affect how the block works once the block attributes have been set.

I just want to confirm that currently, when we insert the block, we do take the "Hide out of stock items from the catalog" setting into consideration. This is implemented here.

Also, I agree that it makes sense to ignore the "Hide out of stock items from the catalog" setting if we allow merchants to explicitly set stock statuses in the Product Collection block.
image

PS: I will go ahead and merge this PR for now. We can continue our discussion here. If we decide to ignore the global "Hide out of stock items from the catalog" setting, I will create a new PR for that.

CC: @nerrad @tjcafferkey

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just want to confirm that currently, when we insert the block, we do take the "Hide out of stock items from the catalog" setting into consideration. This is implemented here.

Oh right, I missed it! That's nice.

@github-actions github-actions bot added this to the 10.4.0 milestone May 26, 2023
imanish003 added 3 commits May 26, 2023 16:01
@imanish003
Fix: Default values of attributes not saving as serialized block comment
d1e29ef 
This was happening because of this issue: WordPress/gutenberg#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.
@imanish003
Replace usage of 'statii' with 'statuses' in stock status handling
0c30f5b 
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.
@imanish003
Merge branch 'trunk' into 9362-product-collection-filters-stock-status
c99646e
@imanish003 imanish003 enabled auto-merge (squash) May 26, 2023 11:19
@imanish003 imanish003 merged commit b63814c into trunk May 26, 2023
@imanish003 imanish003 deleted the 9362-product-collection-filters-stock-status branch May 26, 2023 11:44
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@Aljullu Aljullu Aljullu approved these changes

@danieldudzic danieldudzic Awaiting requested review from danieldudzic danieldudzic was automatically assigned from woocommerce/woo-fse

Assignees
No one assigned
Labels
block: product collection Issues related to the Product Collection block focus: blocks Specific work involving or impacting how blocks behave. type: enhancement The issue is a request for an enhancement.
Projects
None yet
Milestone
10.4.0
Development

Successfully merging this pull request may close these issues.

Product Collection - Filters: Stock Status
2 participants
@imanish003 @Aljullu