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

Fix: incorrect default number of products in editor when inheriting query #10303

Merged
merged 8 commits into from
Jul 27, 2023

Conversation

dinhtungdu
Copy link
Member

Fixes #10228

In this PR, we're using two different approaches to fix the same problem:

  • For Products (Beta) block, as we're extending the Query Loop block, we expose the __woocommerceInherit parameter to the REST query then modify query using the rest_product_query filter to inject the correct loop items per page value to the posts_per_page argument.
  • For Product Collection block, because we have total control over the codebase, we're following what Gutenberg does with the Query Loop block by setting the correct loop items per page directly in the edit component.

Other Checks

  • This PR adds/removes a feature flag & I've updated this doc.
  • This PR adds/removes an experimental interfaces and I've updated this doc.
  • I tagged two reviewers because this PR makes queries to the database or I think it might have some security impact.

Testing

Automated Tests

  • Changes in this PR are covered by Automated Tests.
    • Unit tests
    • E2E tests

User Facing Testing

  1. Go to Editor and edit Product Catalog template
  2. Insert Product Collection and Products (Beta) blocks
  3. Make sure both of them have "Inherit query from template" options enabled
  4. Save the template
  5. Check number of products displayed in editor and frontend for both blocks:
x Products (Beta) Product Collection
Editor 12 12
Frontend 12 12
  • Do not include in the Testing Notes

WooCommerce Visibility

  • WooCommerce Core
  • Feature plugin
  • Experimental

Because this PR updates the Products (Beta), I checked the box for WooCommerce Core too.

Performance Impact

N/a

Changelog

Fix: incorrect default number of products in editor when inheriting query

@woocommercebot woocommercebot requested review from a team and imanish003 and removed request for a team July 21, 2023 10:15
@github-actions
Copy link
Contributor

github-actions bot commented Jul 21, 2023

The release ZIP for this PR is accessible via:

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

Script Dependencies Report

There is no changed script dependency between this branch and trunk.

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

TypeScript Errors Report

  • Files with errors: 470
  • Total errors: 2246

🎉 🎉 This PR does not introduce new TS errors.

comments-aggregator

@github-actions
Copy link
Contributor

github-actions bot commented Jul 21, 2023

Size Change: +147 B (0%)

Total Size: 1.34 MB

Filename Size Change
build/active-filters.js 7.46 kB +1 B (0%)
build/all-products.js 41.1 kB -6 B (0%)
build/attribute-filter.js 13 kB +1 B (0%)
build/cart.js 44.6 kB +7 B (0%)
build/checkout.js 47.2 kB +1 B (0%)
build/featured-category.js 14.7 kB -6 B (0%)
build/featured-product.js 14.9 kB -1 B (0%)
build/legacy-template.js 8.07 kB +1 B (0%)
build/mini-cart-contents-block/products-table-style.js 5.31 kB -1 B (0%)
build/mini-cart-contents.js 17.5 kB -3 B (0%)
build/price-filter.js 8.48 kB +3 B (0%)
build/product-add-to-cart--product-average-rating--product-button--product-image--product-price--product---1d132d69.js 271 B +2 B (+1%)
build/product-add-to-cart.js 8.51 kB +7 B (0%)
build/product-average-rating--product-button--product-image--product-price--product-rating--product-ratin--e23975b5.js 928 B +1 B (0%)
build/product-best-sellers.js 8.29 kB +1 B (0%)
build/product-button.js 3.85 kB -2 B (0%)
build/product-category.js 9.26 kB -2 B (0%)
build/product-new.js 8.57 kB +2 B (0%)
build/product-on-sale.js 8.57 kB -4 B (0%)
build/product-query.js 12.8 kB +74 B (+1%)
build/product-summary.js 911 B -1 B (0%)
build/product-template.js 3.41 kB +80 B (+2%)
build/product-top-rated.js 8.83 kB +1 B (0%)
build/products-by-attribute.js 9.61 kB -2 B (0%)
build/rating-filter.js 6.87 kB +1 B (0%)
build/reviews-by-category.js 11.9 kB -1 B (0%)
build/reviews-by-product.js 13.1 kB -2 B (0%)
build/single-product.js 11.2 kB -5 B (0%)
build/stock-filter.js 7.58 kB +2 B (0%)
build/vendors--mini-cart-contents-block/products-table-style.js 3.16 kB -1 B (0%)
build/wc-blocks-vendors.js 65.4 kB -1 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 8.52 kB
build/active-filters-rtl.css 1.99 kB
build/active-filters-wrapper--mini-cart-contents-block/cart-button--mini-cart-contents-block/checkout-but--e791dc6c-style.js 926 B
build/active-filters-wrapper-frontend.js 7.54 kB
build/active-filters-wrapper-rtl.css 1.85 kB
build/active-filters-wrapper.css 1.85 kB
build/active-filters.css 1.99 kB
build/add-to-cart-form-rtl.css 355 B
build/add-to-cart-form.css 354 B
build/all-products-frontend.js 9.89 kB
build/all-products-rtl.css 4.19 kB
build/all-products.css 4.19 kB
build/all-reviews-rtl.css 1.79 kB
build/all-reviews.css 1.79 kB
build/all-reviews.js 7.75 kB
build/attribute-filter-frontend.js 22.8 kB
build/attribute-filter-rtl.css 4.14 kB
build/attribute-filter-wrapper-frontend.js 7.56 kB
build/attribute-filter-wrapper-rtl.css 4.01 kB
build/attribute-filter-wrapper.css 4.01 kB
build/attribute-filter.css 4.14 kB
build/blocks-checkout.js 35 kB
build/breadcrumbs-rtl.css 232 B
build/breadcrumbs.css 232 B
build/breadcrumbs.js 2.15 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.33 kB
build/cart-blocks/cart-accepted-payment-methods-style.js 137 B
build/cart-blocks/cart-cross-sells-frontend.js 249 B
build/cart-blocks/cart-cross-sells-products--product-price-frontend.js 2.88 kB
build/cart-blocks/cart-cross-sells-products-frontend.js 3.69 kB
build/cart-blocks/cart-cross-sells-products-style.js 138 B
build/cart-blocks/cart-cross-sells-style.js 250 B
build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js 5.09 kB
build/cart-blocks/cart-express-payment-frontend.js 711 B
build/cart-blocks/cart-express-payment-style.js 137 B
build/cart-blocks/cart-items-frontend.js 283 B
build/cart-blocks/cart-items-style.js 219 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.33 kB
build/cart-blocks/cart-line-items-frontend.js 1.06 kB
build/cart-blocks/cart-line-items-style.js 136 B
build/cart-blocks/cart-order-summary-frontend.js 1.24 kB
build/cart-blocks/cart-order-summary-style.js 318 B
build/cart-blocks/cart-totals-frontend.js 287 B
build/cart-blocks/cart-totals-style.js 228 B
build/cart-blocks/empty-cart-frontend.js 342 B
build/cart-blocks/empty-cart-style.js 335 B
build/cart-blocks/filled-cart-frontend.js 651 B
build/cart-blocks/filled-cart-style.js 310 B
build/cart-blocks/order-summary-coupon-form-frontend.js 1.56 kB
build/cart-blocks/order-summary-coupon-form-style.js 136 B
build/cart-blocks/order-summary-discount-frontend.js 2.04 kB
build/cart-blocks/order-summary-discount-style.js 136 B
build/cart-blocks/order-summary-fee-frontend.js 270 B
build/cart-blocks/order-summary-fee-style.js 137 B
build/cart-blocks/order-summary-heading-frontend.js 324 B
build/cart-blocks/order-summary-heading-style.js 325 B
build/cart-blocks/order-summary-shipping-frontend.js 17 kB
build/cart-blocks/order-summary-shipping-style.js 178 B
build/cart-blocks/order-summary-subtotal-frontend.js 271 B
build/cart-blocks/order-summary-subtotal-style.js 137 B
build/cart-blocks/order-summary-taxes-frontend.js 433 B
build/cart-blocks/order-summary-taxes-style.js 176 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.41 kB
build/cart-blocks/proceed-to-checkout-style.js 1.09 kB
build/cart-frontend.js 29.6 kB
build/cart-rtl.css 9.48 kB
build/cart.css 9.46 kB
build/catalog-sorting-rtl.css 256 B
build/catalog-sorting.css 256 B
build/catalog-sorting.js 1.71 kB
build/checkout-blocks/actions--checkout-blocks/terms-style.js 485 B
build/checkout-blocks/actions-frontend.js 1.8 kB
build/checkout-blocks/actions-style.js 683 B
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 4.64 kB
build/checkout-blocks/billing-address-frontend.js 1.17 kB
build/checkout-blocks/billing-address-style.js 531 B
build/checkout-blocks/contact-information-frontend.js 2.01 kB
build/checkout-blocks/contact-information-style.js 605 B
build/checkout-blocks/express-payment-frontend.js 1.11 kB
build/checkout-blocks/fields-frontend.js 300 B
build/checkout-blocks/fields-style.js 249 B
build/checkout-blocks/order-note-frontend.js 1.09 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.62 kB
build/checkout-blocks/order-summary-cart-items-style.js 137 B
build/checkout-blocks/order-summary-coupon-form-frontend.js 1.71 kB
build/checkout-blocks/order-summary-coupon-form-style.js 136 B
build/checkout-blocks/order-summary-discount-frontend.js 2.21 kB
build/checkout-blocks/order-summary-discount-style.js 137 B
build/checkout-blocks/order-summary-fee-frontend.js 273 B
build/checkout-blocks/order-summary-fee-style.js 137 B
build/checkout-blocks/order-summary-frontend.js 1.24 kB
build/checkout-blocks/order-summary-shipping-frontend.js 16.9 kB
build/checkout-blocks/order-summary-shipping-style.js 137 B
build/checkout-blocks/order-summary-style.js 318 B
build/checkout-blocks/order-summary-subtotal-frontend.js 271 B
build/checkout-blocks/order-summary-subtotal-style.js 137 B
build/checkout-blocks/order-summary-taxes-frontend.js 433 B
build/checkout-blocks/order-summary-taxes-style.js 176 B
build/checkout-blocks/payment-frontend.js 9.2 kB
build/checkout-blocks/payment-style.js 460 B
build/checkout-blocks/pickup-options-frontend.js 4.81 kB
build/checkout-blocks/pickup-options-style.js 440 B
build/checkout-blocks/shipping-address-frontend.js 1.17 kB
build/checkout-blocks/shipping-address-style.js 476 B
build/checkout-blocks/shipping-method-frontend.js 2.57 kB
build/checkout-blocks/shipping-method-style.js 1.34 kB
build/checkout-blocks/shipping-methods-frontend.js 6.36 kB
build/checkout-blocks/shipping-methods-style.js 416 B
build/checkout-blocks/terms-frontend.js 1.51 kB
build/checkout-blocks/terms-style.js 671 B
build/checkout-blocks/totals-frontend.js 330 B
build/checkout-blocks/totals-style.js 275 B
build/checkout-frontend.js 31.5 kB
build/checkout-rtl.css 9.14 kB
build/checkout.css 9.13 kB
build/customer-account-rtl.css 388 B
build/customer-account.css 387 B
build/customer-account.js 3.17 kB
build/featured-category-rtl.css 971 B
build/featured-category.css 970 B
build/featured-product-rtl.css 1.02 kB
build/featured-product.css 1.02 kB
build/filter-wrapper-frontend.js 14.2 kB
build/filter-wrapper-rtl.css 375 B
build/filter-wrapper.css 375 B
build/filter-wrapper.js 2.38 kB
build/handpicked-products.js 7.95 kB
build/legacy-template-rtl.css 238 B
build/legacy-template.css 238 B
build/mini-cart-component-frontend.js 30.7 kB
build/mini-cart-contents-block/cart-button--mini-cart-contents-block/checkout-button--mini-cart-contents---358acf4e-style.js 249 B
build/mini-cart-contents-block/cart-button-frontend.js 1.69 kB
build/mini-cart-contents-block/cart-button-style.js 381 B
build/mini-cart-contents-block/checkout-button-frontend.js 1.77 kB
build/mini-cart-contents-block/checkout-button-style.js 463 B
build/mini-cart-contents-block/empty-cart-frontend.js 357 B
build/mini-cart-contents-block/empty-cart-style.js 355 B
build/mini-cart-contents-block/filled-cart-frontend.js 266 B
build/mini-cart-contents-block/filled-cart-style.js 267 B
build/mini-cart-contents-block/footer-frontend.js 3.76 kB
build/mini-cart-contents-block/footer-rtl.css 400 B
build/mini-cart-contents-block/footer-style.js 2.35 kB
build/mini-cart-contents-block/footer.css 400 B
build/mini-cart-contents-block/items-frontend.js 228 B
build/mini-cart-contents-block/items-style.js 229 B
build/mini-cart-contents-block/products-table--product-image--product-title-style.js 316 B
build/mini-cart-contents-block/products-table-frontend.js 543 B
build/mini-cart-contents-block/products-table-rtl.css 2.12 kB
build/mini-cart-contents-block/products-table.css 2.11 kB
build/mini-cart-contents-block/shopping-button-frontend.js 488 B
build/mini-cart-contents-block/shopping-button-style.js 396 B
build/mini-cart-contents-block/title-frontend.js 1.85 kB
build/mini-cart-contents-block/title-items-counter-frontend.js 1.57 kB
build/mini-cart-contents-block/title-items-counter-style.js 301 B
build/mini-cart-contents-block/title-label-frontend.js 1.51 kB
build/mini-cart-contents-block/title-label-style.js 301 B
build/mini-cart-contents-block/title-style.js 439 B
build/mini-cart-contents-rtl.css 2.66 kB
build/mini-cart-contents.css 2.65 kB
build/mini-cart-frontend.js 2.79 kB
build/mini-cart-rtl.css 2.56 kB
build/mini-cart.css 2.56 kB
build/mini-cart.js 6.32 kB
build/packages-style-rtl.css 3.55 kB
build/packages-style.css 3.55 kB
build/price-filter-frontend.js 14.5 kB
build/price-filter-rtl.css 2.67 kB
build/price-filter-wrapper-frontend.js 6.64 kB
build/price-filter-wrapper-rtl.css 2.53 kB
build/price-filter-wrapper.css 2.53 kB
build/price-filter.css 2.67 kB
build/price-format.js 1.15 kB
build/product-add-to-cart--product-button--product-rating--product-rating-counter--product-rating-stars.js 151 B
build/product-add-to-cart--product-image--product-title.js 315 B
build/product-add-to-cart-frontend.js 8.45 kB
build/product-add-to-cart-rtl.css 1.35 kB
build/product-add-to-cart.css 1.36 kB
build/product-average-rating-frontend.js 1.7 kB
build/product-average-rating.js 397 B
build/product-button-frontend.js 4.85 kB
build/product-button-rtl.css 864 B
build/product-button.css 863 B
build/product-categories-rtl.css 651 B
build/product-categories.css 649 B
build/product-categories.js 2.71 kB
build/product-collection.js 13.8 kB
build/product-details-rtl.css 394 B
build/product-details.css 391 B
build/product-gallery-large-image-rtl.css 295 B
build/product-gallery-large-image.css 295 B
build/product-gallery-large-image.js 2.01 kB
build/product-gallery.js 2.3 kB
build/product-image-frontend.js 2.64 kB
build/product-image-gallery-rtl.css 304 B
build/product-image-gallery.css 303 B
build/product-image-rtl.css 922 B
build/product-image.css 920 B
build/product-image.js 1.5 kB
build/product-price-frontend.js 247 B
build/product-price-rtl.css 667 B
build/product-price.css 665 B
build/product-price.js 1.65 kB
build/product-query-rtl.css 347 B
build/product-query.css 347 B
build/product-rating-counter-frontend.js 2 kB
build/product-rating-counter.js 686 B
build/product-rating-frontend.js 2.34 kB
build/product-rating-rtl.css 244 B
build/product-rating-stars-frontend.js 2.24 kB
build/product-rating-stars-rtl.css 895 B
build/product-rating-stars.css 897 B
build/product-rating-stars.js 933 B
build/product-rating.css 244 B
build/product-rating.js 1.03 kB
build/product-results-count-rtl.css 228 B
build/product-results-count.css 228 B
build/product-results-count.js 1.67 kB
build/product-reviews-rtl.css 456 B
build/product-reviews.css 455 B
build/product-sale-badge-frontend.js 1.79 kB
build/product-sale-badge-rtl.css 369 B
build/product-sale-badge.css 370 B
build/product-sale-badge.js 665 B
build/product-search-rtl.css 415 B
build/product-search.css 415 B
build/product-search.js 2.62 kB
build/product-sku-frontend.js 1.83 kB
build/product-sku-rtl.css 237 B
build/product-sku.css 237 B
build/product-sku.js 519 B
build/product-stock-indicator-frontend.js 2.02 kB
build/product-stock-indicator-rtl.css 229 B
build/product-stock-indicator.css 229 B
build/product-stock-indicator.js 707 B
build/product-summary-frontend.js 2.17 kB
build/product-summary-rtl.css 546 B
build/product-summary.css 546 B
build/product-tag.js 8.75 kB
build/product-template-rtl.css 418 B
build/product-template.css 418 B
build/product-title-frontend.js 2.2 kB
build/product-title-rtl.css 688 B
build/product-title.css 689 B
build/product-title.js 955 B
build/rating-filter-frontend.js 21.4 kB
build/rating-filter-rtl.css 4.2 kB
build/rating-filter-wrapper-frontend.js 6.18 kB
build/rating-filter-wrapper-rtl.css 4.07 kB
build/rating-filter-wrapper.css 4.07 kB
build/rating-filter.css 4.19 kB
build/reviews-by-category-rtl.css 1.79 kB
build/reviews-by-category.css 1.79 kB
build/reviews-by-product-rtl.css 1.79 kB
build/reviews-by-product.css 1.79 kB
build/reviews-frontend.js 7.04 kB
build/single-product-rtl.css 375 B
build/single-product.css 375 B
build/stock-filter-frontend.js 21.6 kB
build/stock-filter-rtl.css 4.01 kB
build/stock-filter-wrapper-frontend.js 6.38 kB
build/stock-filter-wrapper-rtl.css 3.88 kB
build/stock-filter-wrapper.css 3.88 kB
build/stock-filter.css 4.01 kB
build/store-notices.js 1.69 kB
build/vendors--active-filters-wrapper--attribute-filter-wrapper--mini-cart-contents-block/cart-button--mi--d6bb29e6-style.js 604 B
build/vendors--attribute-filter-wrapper--cart-blocks/order-summary-coupon-form--cart-blocks/order-summary--48e1e4bb-frontend.js 6.83 kB
build/vendors--attribute-filter-wrapper--cart-blocks/order-summary-shipping--checkout-blocks/billing-addr--d9f38f9d-frontend.js 4.19 kB
build/vendors--attribute-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--cart-blocks/proceed-to-checkout-style.js 178 B
build/vendors--checkout-blocks/pickup-options--checkout-blocks/shipping-methods-frontend.js 8.25 kB
build/vendors--checkout-blocks/shipping-method-frontend.js 12.4 kB
build/vendors--checkout-blocks/shipping-method-style.js 11.7 kB
build/vendors--mini-cart-contents-block/products-table--price-filter-wrapper--product-price-style.js 5.27 kB
build/vendors--price-filter-wrapper-frontend.js 2.2 kB
build/vendors--product-add-to-cart-frontend.js 7.35 kB
build/vendors--rating-filter-wrapper-frontend.js 5.11 kB
build/vendors--stock-filter-wrapper-frontend.js 5.11 kB
build/wc-blocks-data.js 21.7 kB
build/wc-blocks-editor-style-rtl.css 6.33 kB
build/wc-blocks-editor-style.css 6.34 kB
build/wc-blocks-google-analytics.js 1.54 kB
build/wc-blocks-middleware.js 933 B
build/wc-blocks-registry.js 3.18 kB
build/wc-blocks-rtl.css 2.51 kB
build/wc-blocks-shared-context.js 1.1 kB
build/wc-blocks-shared-hocs.js 1.62 kB
build/wc-blocks.css 2.51 kB
build/wc-blocks.js 3.7 kB
build/wc-interactivity.js 10.4 kB
build/wc-payment-method-bacs.js 816 B
build/wc-payment-method-cheque.js 811 B
build/wc-payment-method-cod.js 908 B
build/wc-payment-method-paypal.js 837 B
build/wc-settings.js 2.57 kB
build/wc-shipping-method-pickup-location.js 30.4 kB

compressed-size-action

Copy link
Contributor

@imanish003 imanish003 left a comment

Choose a reason for hiding this comment

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

Hi @dinhtungdu,

Thanks for working on this. I was verifying the number of products as mentioned in the following table:

image

However, for the Product (Beta) block, the number of products is not correct in the Editor. It's showing 9 products instead of 12 in the editor. But, it displays the correct number of products on the frontend. I'm not sure if this is happening only for me. 🤷🏻‍♂️

@@ -139,6 +139,7 @@ export const WooInheritToggleControl = (
setQueryAttribute( props, {
...props.defaultWooQueryParams,
inherit,
__woocommerceInherit: inherit,
Copy link
Contributor

Choose a reason for hiding this comment

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

AFAIK, we should use inherit instead of __woocommerceInherit. The __woocommerceInherit is added only when isCustomInheritGlobalQueryImplementationEnabled is true, but we've decided not to implement the custom inherit query from template. Therefore, this flag will always be false, as seen here. You can also find related discussion on Slack here: p1681812585287949-slack-C02UBB1EPEF.

In short, we shouldn’t use __woocommerceInherit. Additionally, I believe we can remove the isCustomInheritGlobalQueryImplementationEnabled flag and related code since we decided not to implement the "custom inherit query from template." I understand it might be confusing because there is still a partial implementation for the "custom inherit query from template," which is disabled by using the isCustomInheritGlobalQueryImplementationEnabled flag.

Does that make sense?

CC: @gigitux

Copy link
Contributor

Choose a reason for hiding this comment

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

In short, we shouldn’t use __woocommerceInherit. Additionally, I believe we can remove the isCustomInheritGlobalQueryImplementationEnabled flag and related code since we decided not to implement the "custom inherit query from template." I understand it might be confusing because there is still a partial implementation for the "custom inherit query from template," which is disabled by using the isCustomInheritGlobalQueryImplementationEnabled flag.

Since the logic is added on the Products block (that will be deprecated) I agree with you, we can remove that logic!

Copy link
Member Author

Choose a reason for hiding this comment

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

Thanks @imanish003 for the review, I agree this is a bit confusing, so let's discuss more.

  • In 0d8fc18, I fixed the issue you mentioned in the review. I didn't handle well the case adding the block into archive template in the template editor.
  • I use the __woocommerceInherit attribute just for detecting if the current rest query is inherited from template. I used it in the rest_product_query filter here (as a custom rest query argument). The reason for that is I can't find a better way, I'm open to any alternative that we can detect the 'inherit state' in the rest query. I admit this is a workaround than a solution, but given that the Products (Beta) block will be deprecated, this is acceptable IMO.
  • About removing isCustomInheritGlobalQueryImplementationEnabled, let's do it in a separated PR for better history.

Copy link
Contributor

@imanish003 imanish003 Jul 25, 2023

Choose a reason for hiding this comment

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

In 0d8fc18, I fixed the issue you mentioned in the review. I didn't handle well the case adding the block into archive template in the template editor.

Not sure why but it's still showing 9 products in Products beta block 🤔 Are you able to replicate this?

I use the __woocommerceInherit attribute just for detecting if the current rest query is inherited from template. I used it in the rest_product_query filter here (as a custom rest query argument). The reason for that is I can't find a better way, I'm open to any alternative that we can detect the 'inherit state' in the rest query. I admit this is a workaround than a solution, but given that the Products (Beta) block will be deprecated, this is acceptable IMO.

Got it. In that case, maybe we should consider naming this something other than __woocommerceInherit because its original intention was for use in the "custom inherit from query" implementation. Since this fix is not directly related to "custom inherit from query," using __woocommerceInherit for this fix might cause confusion. What do you think?

About removing isCustomInheritGlobalQueryImplementationEnabled, let's do it in a separated PR for better history.

Definitely, Also this doesn't fall into scope of this PR.

Copy link
Member Author

Choose a reason for hiding this comment

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

Since this fix is not directly related to "custom inherit from query," using __woocommerceInherit for this fix might cause confusion. What do you think?

@imanish003 Because we're removing that "custom inherit feature", and the Products (Beta) block will be deprecated eventually, I don't think that's a big issue. But by the way, any name will work, I will try to find another one to clear any potential confusion.

Not sure why but it's still showing 9 products in Products beta block 🤔 Are you able to replicate this?

Let's pair on this.

Copy link
Contributor

Choose a reason for hiding this comment

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

But by the way, any name will work, I will try to find another one to clear any potential confusion.

Thank you so much for your understanding. Since we're unsure who will be working on removing the "custom inherit query" feature, it's better to avoid any potential confusion if we can. 🙌🏻

@dinhtungdu
Copy link
Member Author

@imanish003 I updated my PR to fix the issue with Products Beta block, can you please take another look at this?

Copy link
Contributor

@imanish003 imanish003 left a comment

Choose a reason for hiding this comment

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

Awesome work! Tested and confirmed that the Products beta block in the Editor now displays 12 products. 🚀

@github-actions github-actions bot added this to the 10.8.0 milestone Jul 26, 2023
@dinhtungdu
Copy link
Member Author

Something to clarify:

  • We only introduce a partial solution for the Products (Beta) block. If the site changes the number of products per page after setting the product archive templates with the Products (Beta) block, that number won't reflect in the editor. Users must re-add the block or toggle off and on the Inherit query from template to update the correct per-page value. This is because we are extending the Query Loop block, and that block uses the Settings > Reading > Blog pages show at most value for the number of posts per page, and we can't filter/change it.
  • Product Collection however doesn't have that issue because we have total control over the code base, we take a similar approach that Query Loop uses to have the number of products per page (in the editor) dynamically set according to the correct value.

cc @imanish003

@dinhtungdu dinhtungdu merged commit 57ec11d into trunk Jul 27, 2023
@dinhtungdu dinhtungdu deleted the fix/10228-cleaner-approach branch July 27, 2023 03:06
@imanish003 imanish003 added type: bug The issue/PR concerns a confirmed bug. block-type: product-query Issues related to/affecting all product-query variations. block: product collection Issues related to the Product Collection block labels Jul 31, 2023
@gigitux gigitux mentioned this pull request Aug 3, 2023
5 tasks
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
block: product collection Issues related to the Product Collection block block-type: product-query Issues related to/affecting all product-query variations. type: bug The issue/PR concerns a confirmed bug.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Product Collection - incorrect default number of products in editor when inheriting query
3 participants