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

POC: use the filter query.entityRecordsArgs to customize the getEntityRecords behavior #7075

Closed
wants to merge 2 commits into from

Conversation

gigitux
Copy link
Contributor

@gigitux gigitux commented Sep 6, 2022

This is another attempt (#6975) to have a live preview experience for the Product Query on the editor side.
With this attempt, I want to try to customize the getEntityRecords behavior with the JS filters.

Thanks to the JS filter, it is possible to customize the endpoint that getEntityRecords fetches. This allows us to use WooCommerce API instead of WordPress API. In this way, we could fetch products with a specific filter (by price, on sale, etc).

Unfortunately, there are also disadvantages/blockers to this approach:

  1. A 3rd plugin can easily break the Query Loop block.
  2. With multiple Product Query blocks it could be very hard to handle this filter (how could we enable the filter, execute it only for that specific block, and after that remove it? Keep in mind when the user edits a page that contains multiple Query Loop/Product Query blocks, all the queries are done in parallel).
  3. At this stage, the preview still doesn't update when the user toggle settings. We should force the re-render of the block.

⚠️ This is just a POC to check different paths and have feedback and ideas. Does it make sense to continue to explore this path? IMHO, this is not the right solution to take, we over-complicated a lot of code, and it potentially could be the main blocker (2-3) that could require more changes on the Gutenberg side.

Gutenberg PR sunyatasattva/gutenberg#4
Gutenberg Issue WordPress/gutenberg#34201

@gigitux gigitux changed the title POC: use the filter query.entityRecordsArgs to customize the getEntityRecords behavior. POC: use the filter query.entityRecordsArgs to customize the getEntityRecords behavior Sep 6, 2022
@rubikuserbot rubikuserbot requested review from a team and albarin and removed request for a team September 6, 2022 14:04
@gigitux gigitux marked this pull request as draft September 6, 2022 14:04
@gigitux gigitux removed the request for review from albarin September 6, 2022 14:05
@gigitux gigitux force-pushed the try/use-filter-for-get-on-sale-products branch from 8088891 to 14bdef9 Compare September 6, 2022 14:05
@github-actions
Copy link
Contributor

github-actions bot commented Sep 6, 2022

The release ZIP for this PR is accessible via:

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

@github-actions
Copy link
Contributor

github-actions bot commented Sep 6, 2022

Size Change: 0 B

Total Size: 873 kB

ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 7.34 kB
build/active-filters.js 8.01 kB
build/all-products-frontend.js 18.1 kB
build/all-products.js 33.9 kB
build/all-reviews.js 7.8 kB
build/attribute-filter-frontend.js 22.3 kB
build/attribute-filter.js 13.3 kB
build/blocks-checkout.js 17.4 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.16 kB
build/cart-blocks/cart-express-payment-frontend.js 5.09 kB
build/cart-blocks/cart-items-frontend.js 298 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.25 kB
build/cart-blocks/cart-line-items-frontend.js 429 B
build/cart-blocks/cart-order-summary-frontend.js 1.11 kB
build/cart-blocks/cart-totals-frontend.js 322 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/filled-cart-frontend.js 784 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 274 B
build/cart-blocks/order-summary-heading-frontend.js 453 B
build/cart-blocks/order-summary-shipping--checkout-blocks/order-summary-shipping-frontend.js 6.37 kB
build/cart-blocks/order-summary-shipping-frontend.js 427 B
build/cart-blocks/order-summary-subtotal-frontend.js 274 B
build/cart-blocks/order-summary-taxes-frontend.js 434 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.15 kB
build/cart-frontend.js 47.1 kB
build/cart.js 41.8 kB
build/checkout-blocks/actions-frontend.js 1.42 kB
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 4.12 kB
build/checkout-blocks/billing-address-frontend.js 891 B
build/checkout-blocks/contact-information-frontend.js 2.83 kB
build/checkout-blocks/express-payment-frontend.js 5.39 kB
build/checkout-blocks/fields-frontend.js 344 B
build/checkout-blocks/order-note-frontend.js 1.07 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.64 kB
build/checkout-blocks/order-summary-coupon-form-frontend.js 2.79 kB
build/checkout-blocks/order-summary-discount-frontend.js 2.26 kB
build/checkout-blocks/order-summary-fee-frontend.js 276 B
build/checkout-blocks/order-summary-frontend.js 1.11 kB
build/checkout-blocks/order-summary-shipping-frontend.js 602 B
build/checkout-blocks/order-summary-subtotal-frontend.js 274 B
build/checkout-blocks/order-summary-taxes-frontend.js 435 B
build/checkout-blocks/payment-frontend.js 7.7 kB
build/checkout-blocks/shipping-address-frontend.js 1.03 kB
build/checkout-blocks/shipping-methods-frontend.js 4.74 kB
build/checkout-blocks/terms-frontend.js 1.23 kB
build/checkout-blocks/totals-frontend.js 325 B
build/checkout-frontend.js 49.2 kB
build/checkout.js 43.1 kB
build/featured-category.js 13.2 kB
build/featured-product.js 13.5 kB
build/general-style-rtl.css 1.29 kB
build/general-style.css 1.29 kB
build/handpicked-products.js 7.37 kB
build/legacy-template.js 2.86 kB
build/mini-cart-component-frontend.js 16.8 kB
build/mini-cart-contents-block/empty-cart-frontend.js 366 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/footer-frontend.js 6.98 kB
build/mini-cart-contents-block/items-frontend.js 237 B
build/mini-cart-contents-block/products-table-frontend.js 290 B
build/mini-cart-contents-block/shopping-button-frontend.js 288 B
build/mini-cart-contents-block/title-frontend.js 368 B
build/mini-cart-contents.js 22.8 kB
build/mini-cart-frontend.js 1.72 kB
build/mini-cart.js 4.58 kB
build/price-filter-frontend.js 13.4 kB
build/price-filter.js 9.31 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.65 kB
build/product-add-to-cart-frontend.js 6.95 kB
build/product-add-to-cart.js 6.88 kB
build/product-best-sellers.js 7.71 kB
build/product-button--product-category-list--product-image--product-price--product-rating--product-sale-b--e17c7c01.js 435 B
build/product-button--product-image--product-rating--product-sale-badge--product-title.js 300 B
build/product-button-frontend.js 1.88 kB
build/product-button.js 1.57 kB
build/product-categories.js 2.41 kB
build/product-category-list-frontend.js 880 B
build/product-category-list.js 502 B
build/product-category.js 8.69 kB
build/product-image-frontend.js 1.88 kB
build/product-image.js 1.59 kB
build/product-new.js 7.71 kB
build/product-on-sale.js 8.02 kB
build/product-price-frontend.js 1.9 kB
build/product-price.js 1.51 kB
build/product-query.js 648 B
build/product-rating-frontend.js 1.16 kB
build/product-rating.js 740 B
build/product-sale-badge-frontend.js 1.13 kB
build/product-sale-badge.js 802 B
build/product-search.js 2.65 kB
build/product-sku-frontend.js 381 B
build/product-sku.js 379 B
build/product-stock-indicator-frontend.js 994 B
build/product-stock-indicator.js 624 B
build/product-summary-frontend.js 1.28 kB
build/product-summary.js 922 B
build/product-tag-list-frontend.js 875 B
build/product-tag-list.js 498 B
build/product-tag.js 8.08 kB
build/product-title-frontend.js 1.31 kB
build/product-title.js 922 B
build/product-top-rated.js 7.95 kB
build/products-by-attribute.js 8.63 kB
build/reviews-by-category.js 11.2 kB
build/reviews-by-product.js 12.3 kB
build/reviews-frontend.js 7.02 kB
build/single-product-frontend.js 21.4 kB
build/single-product.js 10 kB
build/stock-filter-frontend.js 7.61 kB
build/stock-filter.js 7.55 kB
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.84 kB
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--decc3dc6-frontend.js 19.1 kB
build/vendors--mini-cart-contents-block/footer-frontend.js 6.86 kB
build/vendors--product-add-to-cart-frontend.js 7.53 kB
build/wc-blocks-data.js 9.87 kB
build/wc-blocks-editor-style-rtl.css 5.1 kB
build/wc-blocks-editor-style.css 5.1 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 931 B
build/wc-blocks-registry.js 2.7 kB
build/wc-blocks-shared-context.js 1.53 kB
build/wc-blocks-shared-hocs.js 1.71 kB
build/wc-blocks-style-rtl.css 23.3 kB
build/wc-blocks-style.css 23.3 kB
build/wc-blocks-vendors-style-rtl.css 1.95 kB
build/wc-blocks-vendors-style.css 1.95 kB
build/wc-blocks-vendors.js 54.5 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

compressed-size-action

@gigitux gigitux changed the title POC: use the filter query.entityRecordsArgs to customize the getEntityRecords behavior POC: use the filter query.entityRecordsArgs to customize the getEntityRecords behavior Sep 6, 2022
@gigitux
Copy link
Contributor Author

gigitux commented Sep 13, 2022

I close this issue. We decided to proceed with another solution (#6975)

@gigitux gigitux closed this Sep 13, 2022
@nielslange nielslange deleted the try/use-filter-for-get-on-sale-products branch April 19, 2023 23:47
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant