woocommerce-blocks
woocommerce-blocks copied to clipboard
woocommerce
POC: Product Query
The release ZIP for this PR is accessible via:
https://wcblocks.wpcomstaging.com/wp-content/uploads/woocommerce-gutenberg-products-block-6812.zip
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
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 | |
|---|---|---|---|
product-query.js |
wp-hooks, wp-polyfill |
⚠️ |
This comment was automatically generated by the ./github/compare-assets action.
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 | |
|---|---|---|---|
reviews-frontend.js |
react, wc-settings, wp-a11y, wp-api-fetch, wp-compose, wp-element, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill |
⚠️ | |
all-products-frontend.js |
lodash, react, 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-compose, wp-data, wp-deprecated, wp-dom, wp-element, wp-hooks, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-url, wp-warning, wp-wordcount |
⚠️ | |
price-filter-frontend.js |
lodash, react, wc-blocks-data-store, wc-price-format, wc-settings, wp-data, wp-element, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-url |
⚠️ | |
attribute-filter-frontend.js |
lodash, react, wc-blocks-data-store, wc-settings, wp-a11y, wp-block-editor, wp-blocks, 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 |
⚠️ | |
stock-filter-frontend.js |
lodash, react, wc-blocks-data-store, wc-settings, wp-a11y, wp-data, wp-element, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-url |
⚠️ | |
active-filters-frontend.js |
lodash, react, wc-blocks-data-store, wc-price-format, wc-settings, wp-data, wp-element, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-url |
⚠️ | |
cart-frontend.js |
lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-blocks-registry, wc-blocks-shared-hocs, wc-price-format, wc-settings, wp-a11y, wp-api-fetch, wp-autop, wp-compose, wp-data, wp-deprecated, wp-dom, 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 |
⚠️ | |
checkout-frontend.js |
lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-blocks-registry, wc-blocks-shared-hocs, wc-price-format, wc-settings, wp-a11y, wp-api-fetch, wp-autop, wp-compose, wp-data, wp-deprecated, wp-dom, 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 |
⚠️ | |
mini-cart-frontend.js |
wc-settings, wp-polyfill |
⚠️ | |
single-product-frontend.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-compose, wp-data, wp-deprecated, wp-dom, wp-element, wp-hooks, wp-html-entities, wp-i18n, wp-is-shallow-equal, wp-polyfill, wp-primitives, wp-url, wp-warning, wp-wordcount |
⚠️ | |
mini-cart-component-frontend.js |
lodash, react, wc-blocks-checkout, wc-blocks-data-store, wc-blocks-registry, wc-price-format, wc-settings, wp-a11y, wp-autop, 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 |
⚠️ |
This comment was automatically generated by the ./github/compare-assets action.
Size Change: -102 B (0%)
Total Size: 867 kB
| Filename | Size | Change | |
|---|---|---|---|
build/active-filters-frontend.js |
7.33 kB | +10 B (0%) | |
build/all-products-frontend.js |
18.1 kB | -14 B (0%) | |
build/all-products.js |
33.7 kB | +1 B (0%) | |
build/all-reviews.js |
7.8 kB | +6 B (0%) | |
build/attribute-filter-frontend.js |
21.9 kB | +9 B (0%) | |
build/attribute-filter.js |
12.9 kB | +13 B (0%) | |
build/cart-blocks/cart-accepted-payment-methods-frontend.js |
1.16 kB | +1 B (0%) | |
build/cart-blocks/cart-express-payment-frontend.js |
5.1 kB | +6 B (0%) | |
build/cart-blocks/cart-items-frontend.js |
298 B | -1 B (0%) | |
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js |
5.27 kB | -2 B (0%) | |
build/cart-blocks/empty-cart-frontend.js |
345 B | -2 B (-1%) | |
build/cart-blocks/filled-cart-frontend.js |
781 B | -1 B (0%) | |
build/cart-blocks/order-summary-heading-frontend.js |
455 B | -1 B (0%) | |
build/cart-blocks/order-summary-shipping--checkout-blocks/order-summary-shipping-frontend.js |
6.37 kB | -1 B (0%) | |
build/cart-blocks/order-summary-shipping-frontend.js |
425 B | -1 B (0%) | |
build/cart.js |
41.3 kB | -15 B (0%) | |
build/checkout-blocks/actions-frontend.js |
1.42 kB | +4 B (0%) | |
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js |
4.12 kB | +2 B (0%) | |
build/checkout-blocks/billing-address-frontend.js |
891 B | -1 B (0%) | |
build/checkout-blocks/contact-information-frontend.js |
2.84 kB | -1 B (0%) | |
build/checkout-blocks/express-payment-frontend.js |
5.39 kB | +6 B (0%) | |
build/checkout-blocks/fields-frontend.js |
344 B | -1 B (0%) | |
build/checkout-blocks/order-note-frontend.js |
1.08 kB | -1 B (0%) | |
build/checkout-blocks/order-summary-cart-items-frontend.js |
3.66 kB | -1 B (0%) | |
build/checkout-blocks/order-summary-coupon-form-frontend.js |
2.8 kB | +2 B (0%) | |
build/checkout-blocks/order-summary-discount-frontend.js |
2.27 kB | -1 B (0%) | |
build/checkout-blocks/order-summary-shipping-frontend.js |
601 B | -1 B (0%) | |
build/checkout-blocks/order-summary-taxes-frontend.js |
433 B | +1 B (0%) | |
build/checkout-blocks/payment-frontend.js |
7.7 kB | +5 B (0%) | |
build/checkout-blocks/shipping-address-frontend.js |
1.03 kB | -2 B (0%) | |
build/checkout-blocks/shipping-methods-frontend.js |
4.75 kB | +1 B (0%) | |
build/checkout-blocks/terms-frontend.js |
1.23 kB | -2 B (0%) | |
build/checkout.js |
42.6 kB | -17 B (0%) | |
build/featured-category.js |
13.2 kB | +11 B (0%) | |
build/featured-product.js |
13.5 kB | +6 B (0%) | |
build/handpicked-products.js |
7.37 kB | +2 B (0%) | |
build/legacy-template.js |
2.79 kB | -4 B (0%) | |
build/mini-cart-component-frontend.js |
16.8 kB | -1 B (0%) | |
build/mini-cart-contents-block/footer-frontend.js |
6.99 kB | +8 B (0%) | |
build/mini-cart-contents.js |
22.9 kB | -10 B (0%) | |
build/price-filter-frontend.js |
13.2 kB | +127 B (+1%) | |
build/price-filter.js |
9.09 kB | +82 B (+1%) | |
build/product-add-to-cart-frontend.js |
6.96 kB | +2 B (0%) | |
build/product-add-to-cart.js |
6.88 kB | -3 B (0%) | |
build/product-best-sellers.js |
7.71 kB | +2 B (0%) | |
build/product-button--product-image--product-rating--product-sale-badge--product-title.js |
300 B | -2 B (-1%) | |
build/product-button-frontend.js |
1.88 kB | +3 B (0%) | |
build/product-button.js |
1.57 kB | -2 B (0%) | |
build/product-category-list-frontend.js |
881 B | +2 B (0%) | |
build/product-category-list.js |
504 B | +1 B (0%) | |
build/product-category.js |
8.68 kB | -1 B (0%) | |
build/product-image-frontend.js |
1.88 kB | +1 B (0%) | |
build/product-image.js |
1.59 kB | -2 B (0%) | |
build/product-new.js |
7.71 kB | +1 B (0%) | |
build/product-on-sale.js |
8.02 kB | +1 B (0%) | |
build/product-price.js |
1.51 kB | +2 B (0%) | |
build/product-rating-frontend.js |
1.17 kB | +2 B (0%) | |
build/product-rating.js |
742 B | +1 B (0%) | |
build/product-sale-badge-frontend.js |
1.13 kB | +2 B (0%) | |
build/product-sale-badge.js |
803 B | +1 B (0%) | |
build/product-search.js |
2.18 kB | -1 B (0%) | |
build/product-stock-indicator-frontend.js |
995 B | +2 B (0%) | |
build/product-stock-indicator.js |
625 B | +1 B (0%) | |
build/product-summary-frontend.js |
1.29 kB | +1 B (0%) | |
build/product-tag-list-frontend.js |
876 B | +3 B (0%) | |
build/product-tag-list.js |
500 B | +1 B (0%) | |
build/product-tag.js |
8.08 kB | -2 B (0%) | |
build/product-title-frontend.js |
1.31 kB | +1 B (0%) | |
build/product-top-rated.js |
7.95 kB | +3 B (0%) | |
build/products-by-attribute.js |
8.63 kB | -1 B (0%) | |
build/reviews-by-category.js |
11.2 kB | +3 B (0%) | |
build/reviews-by-product.js |
12.3 kB | +6 B (0%) | |
build/reviews-frontend.js |
7.02 kB | +2 B (0%) | |
build/single-product-frontend.js |
21.4 kB | -4 B (0%) | |
build/single-product.js |
10 kB | +6 B (0%) | |
build/stock-filter-frontend.js |
7.39 kB | +13 B (0%) | |
build/stock-filter.js |
7.3 kB | +15 B (0%) | |
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--decc3dc6-frontend.js |
19.1 kB | +1 B (0%) | |
build/vendors--product-add-to-cart-frontend.js |
7.53 kB | -1 B (0%) | |
build/wc-blocks-editor-style-rtl.css |
5.07 kB | +28 B (+1%) | |
build/wc-blocks-editor-style.css |
5.07 kB | +29 B (+1%) | |
build/wc-blocks-style-rtl.css |
22.2 kB | -543 B (-2%) | |
build/wc-blocks-style.css |
22.2 kB | -543 B (-2%) | |
build/wc-blocks-vendors.js |
54.5 kB | -2 B (0%) | |
build/product-query.js |
647 B | +647 B (new file) | 🆕 |
ℹ️ View Unchanged
| Filename | Size |
|---|---|
build/active-filters.js |
7.99 kB |
build/blocks-checkout.js |
17.4 kB |
build/cart-blocks/cart-line-items-frontend.js |
430 B |
build/cart-blocks/cart-order-summary-frontend.js |
1.1 kB |
build/cart-blocks/cart-totals-frontend.js |
321 B |
build/cart-blocks/order-summary-coupon-form-frontend.js |
2.65 kB |
build/cart-blocks/order-summary-discount-frontend.js |
2.14 kB |
build/cart-blocks/order-summary-fee-frontend.js |
273 B |
build/cart-blocks/order-summary-subtotal-frontend.js |
274 B |
build/cart-blocks/order-summary-taxes-frontend.js |
433 B |
build/cart-blocks/proceed-to-checkout-frontend.js |
1.15 kB |
build/cart-frontend.js |
47 kB |
build/checkout-blocks/order-summary-fee-frontend.js |
276 B |
build/checkout-blocks/order-summary-frontend.js |
1.1 kB |
build/checkout-blocks/order-summary-subtotal-frontend.js |
274 B |
build/checkout-blocks/totals-frontend.js |
325 B |
build/checkout-frontend.js |
49.2 kB |
build/general-style-rtl.css |
1.29 kB |
build/general-style.css |
1.29 kB |
build/mini-cart-contents-block/empty-cart-frontend.js |
365 B |
build/mini-cart-contents-block/filled-cart-frontend.js |
229 B |
build/mini-cart-contents-block/footer--mini-cart-contents-block/products-table-frontend.js |
4.69 kB |
build/mini-cart-contents-block/items-frontend.js |
237 B |
build/mini-cart-contents-block/products-table-frontend.js |
289 B |
build/mini-cart-contents-block/shopping-button-frontend.js |
288 B |
build/mini-cart-contents-block/title-frontend.js |
367 B |
build/mini-cart-frontend.js |
1.72 kB |
build/mini-cart.js |
4.58 kB |
build/price-format.js |
1.19 kB |
build/product-add-to-cart--product-button--product-category-list--product-image--product-price--product-r--a0326d00.js |
223 B |
build/product-add-to-cart--product-button--product-image--product-title.js |
2.66 kB |
build/product-button--product-category-list--product-image--product-price--product-rating--product-sale-b--e17c7c01.js |
436 B |
build/product-categories.js |
2.41 kB |
build/product-price-frontend.js |
1.9 kB |
build/product-sku-frontend.js |
380 B |
build/product-sku.js |
381 B |
build/product-summary.js |
922 B |
build/product-title.js |
921 B |
build/vendors--cart-blocks/cart-line-items--cart-blocks/cart-order-summary--cart-blocks/order-summary-shi--c02aad66-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.14 kB |
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--5b8feb0b-frontend.js |
4.85 kB |
build/vendors--mini-cart-contents-block/footer-frontend.js |
6.86 kB |
build/wc-blocks-data.js |
9.87 kB |
build/wc-blocks-google-analytics.js |
1.56 kB |
build/wc-blocks-middleware.js |
930 B |
build/wc-blocks-registry.js |
2.7 kB |
build/wc-blocks-shared-context.js |
1.52 kB |
build/wc-blocks-shared-hocs.js |
1.14 kB |
build/wc-blocks-vendors-style-rtl.css |
1.95 kB |
build/wc-blocks-vendors-style.css |
1.95 kB |
build/wc-blocks.js |
2.63 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 |
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 | |
|---|---|---|---|
product-query.js |
wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-hooks, wp-i18n, wp-polyfill, wp-primitives |
⚠️ |
This comment was automatically generated by the ./github/compare-assets action.
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 | |
|---|---|---|---|
product-query.js |
wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-hooks, wp-i18n, wp-polyfill, wp-primitives |
⚠️ |
This comment was automatically generated by the ./github/compare-assets action.
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 | |
|---|---|---|---|
product-query.js |
wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-hooks, wp-i18n, wp-polyfill, wp-primitives |
⚠️ |
This comment was automatically generated by the ./github/compare-assets action.
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 | |
|---|---|---|---|
product-query.js |
wp-block-editor, wp-blocks, wp-components, wp-compose, wp-element, wp-hooks, wp-i18n, wp-polyfill, wp-primitives |
⚠️ |
This comment was automatically generated by the ./github/compare-assets action.
Import from @wordpress/element
Import from @wordpress/element
https://github.com/woocommerce/woocommerce-blocks/blob/d7344ddbbce38d534047c200257bba2b0c70aa67/assets/js/blocks/product-query/inspector-controls.tsx#L9-L20
:rocket: This comment was generated by the automations bot based on a todo comment in d7344ddbbce38d534047c200257bba2b0c70aa67 in #6812. cc @gigitux
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 | |
|---|---|---|---|
product-query.js |
wp-hooks, wp-polyfill |
⚠️ |
This comment was automatically generated by the ./github/compare-assets action.
I've tested and the only thing I've found is that when you use Product Query with Show only products on sale or Products on sale what you see on the edit page does not match what the frontend renders. Maybe this is expected on this PoC, but mentioning it just in case:
https://user-images.githubusercontent.com/186112/185093474-cc448841-e840-4ecf-ba0c-bead52f7547a.mp4
Thanks for testing this PR, @albarin! Glad that you didn't find any issues :D Regarding no live preview on the edit page, it is expected 👍
@gigitux or @sunyatasattva, where is(are) the relevant PR(s) for the GB fork mentioned in this pull request? I recall someone sharing the PR link with me at some point but I've spent a few minutes trying to find it and I can't. If you could add it to the description in this PR to link the two together that'd be great!
Also, it doesn't look like this PR was attached to the current Zenhub sprint, and Epic (no estimate either). Was that intentional?
@gigitux or @sunyatasattva, where is(are) the relevant PR(s) for the GB fork mentioned in this pull request? I recall someone sharing the PR link with me at some point but I've spent a few minutes trying to find it and I can't. If you could add it to the description in this PR to link the two together that'd be great!
We didn't create any PR. We linked the branch that we have created. In any case, we can create it! @sunyatasattva can you take care of this? I don't have permission to create the PR.
Also, it doesn't look like this PR was attached to the current Zenhub sprint, and Epic (no estimate either). Was that intentional?
Good point! I forgot to attach it to the current sprint. I'm going to update it! Thanks for catching it!
We didn't create any PR.
Why not? Even if it's created as a draft, it can help with discussion around implementation for this use case. Code freeze for WP 6.1 will be coming soon, so it's important to surface API needs and begin these discussions early. Of course, it's possible I'm missing context around why the PR hasn't been created yet 😄
Yep, I'm taking care of the Gutenberg side of things. @nerrad The PR wasn't created yet as I am exploring the side-effects of our decisions. As a matter of fact, I have already found a pretty significant bug with our implementation. I thought it might have been blocking (as in, we needed to rethink the approach on the Gutenberg change a bit), but actually I managed to come up with a fix (PR coming soon), although I'm not too happy with that.
The PR for this change doesn't worry me much, as we had already discussed it with the Gutenberg team and it's literally 1 LOC. I'll publish it as soon as I finish my in-depth exploration.
The other PR which is required for us is going to be more interesting and will need to start as a draft. I have already got something and will publish that ASAP to start the discussion as you have mentioned.
More info here: https://github.com/woocommerce/woocommerce-blocks/pull/6952
This is the only problem I have encountered with our approach of adding the filter there. The solution I've found doesn't sit with me really well, so if there are alternative suggestions, I'm glad to hear about them. Otherwise, we'll have to accept the trade-off and I'll open the first PR on Gutenberg as soon as we agree about this.
cc @nerrad @gigitux
This is related to this GB issue and I think it would be good to have a consistent way of Query Loop extenders to do some things.
I've just created: https://github.com/WordPress/gutenberg/pull/43632 to start some discussions. Do you think something like that in core would simplify extending the block?
Nik, I'm really liking the direction of your PR to address the issue. I've left a comment in the PR. @gigitux and @sunyatasattva it'd be good to test & provide feedback on Nik's PR.