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

Product Search Results template: fix the preview when the Inherit Query option is enabled #7965

Merged
merged 4 commits into from
Mar 16, 2023

Conversation

gigitux
Copy link
Contributor

@gigitux gigitux commented Dec 16, 2022

With this PR, when the user disabled the "Inherit Query option", the previous options are restored.

Fixes #7921

Testing

Automated Tests

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

User Facing Testing

  1. Edit the Product Search Results template.
  2. Add the Products block.
  3. Add the Sale Status filter and select Show only products on sale.
  4. Now, enable Inherit query from template.
  5. Be sure that all products are displayed.
  6. Disable Inherit query from template.
  7. Be sure that only on-sale products are visible.
  • Do not include in the Testing Notes

WooCommerce Visibility

  • WooCommerce Core
  • Feature plugin
  • Experimental

@gigitux gigitux self-assigned this Dec 16, 2022
@woocommercebot woocommercebot requested review from a team and nefeline and removed request for a team December 16, 2022 10:51
@github-actions
Copy link
Contributor

The release ZIP for this PR is accessible via:

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

@github-actions
Copy link
Contributor

TypeScript Errors Report

Files with errors: 432
Total errors: 2108

🎉 🎉 This PR does not introduce new TS errors.

@github-actions
Copy link
Contributor

github-actions bot commented Dec 16, 2022

Size Change: +109 B (0%)

Total Size: 1.12 MB

Filename Size Change
build/active-filters.js 7.47 kB -1 B (0%)
build/all-products.js 37.7 kB +1 B (0%)
build/cart.js 47.7 kB +3 B (0%)
build/mini-cart-contents.js 16.6 kB -7 B (0%)
build/price-filter.js 8.39 kB -1 B (0%)
build/product-add-to-cart.js 8.62 kB -2 B (0%)
build/product-category-list.js 503 B +2 B (0%)
build/product-on-sale.js 8.58 kB +1 B (0%)
build/product-price.js 1.64 kB +1 B (0%)
build/product-query.js 11 kB +112 B (+1%)
build/product-sale-badge.js 820 B +1 B (0%)
build/product-stock-indicator.js 646 B +1 B (0%)
build/product-summary.js 919 B -1 B (0%)
build/rating-filter.js 7.41 kB -1 B (0%)
build/single-product.js 10.6 kB +2 B (0%)
build/stock-filter.js 8.13 kB -2 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 7.97 kB
build/active-filters-wrapper-frontend.js 5.99 kB
build/all-products-frontend.js 11.7 kB
build/all-reviews.js 7.65 kB
build/attribute-filter-frontend.js 22.5 kB
build/attribute-filter-wrapper--stock-filter-wrapper-frontend.js 3.35 kB
build/attribute-filter-wrapper-frontend.js 4.5 kB
build/attribute-filter.js 13.2 kB
build/blocks-checkout.js 43.9 kB
build/breadcrumbs.js 2.04 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.38 kB
build/cart-blocks/cart-cross-sells-frontend.js 253 B
build/cart-blocks/cart-cross-sells-products-frontend.js 9.75 kB
build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js 5.19 kB
build/cart-blocks/cart-express-payment-frontend.js 720 B
build/cart-blocks/cart-items-frontend.js 302 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.36 kB
build/cart-blocks/cart-line-items-frontend.js 1.07 kB
build/cart-blocks/cart-order-summary-frontend.js 1.24 kB
build/cart-blocks/cart-totals-frontend.js 307 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/filled-cart-frontend.js 654 B
build/cart-blocks/order-summary-coupon-form-frontend.js 1.62 kB
build/cart-blocks/order-summary-discount-frontend.js 2.12 kB
build/cart-blocks/order-summary-fee-frontend.js 274 B
build/cart-blocks/order-summary-heading-frontend.js 455 B
build/cart-blocks/order-summary-shipping-frontend.js 11.2 kB
build/cart-blocks/order-summary-subtotal-frontend.js 275 B
build/cart-blocks/order-summary-taxes-frontend.js 434 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.33 kB
build/cart-frontend.js 29 kB
build/catalog-sorting.js 1.7 kB
build/checkout-blocks/actions-frontend.js 1.84 kB
build/checkout-blocks/billing-address-frontend.js 4.19 kB
build/checkout-blocks/contact-information-frontend.js 2.05 kB
build/checkout-blocks/express-payment-frontend.js 1.13 kB
build/checkout-blocks/fields-frontend.js 330 B
build/checkout-blocks/order-note-frontend.js 1.14 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.68 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 277 B
build/checkout-blocks/order-summary-frontend.js 1.24 kB
build/checkout-blocks/order-summary-shipping-frontend.js 11.2 kB
build/checkout-blocks/order-summary-subtotal-frontend.js 275 B
build/checkout-blocks/order-summary-taxes-frontend.js 435 B
build/checkout-blocks/payment-frontend.js 8.43 kB
build/checkout-blocks/pickup-options-frontend.js 4.04 kB
build/checkout-blocks/shipping-address-frontend.js 4.14 kB
build/checkout-blocks/shipping-method-frontend.js 2.47 kB
build/checkout-blocks/shipping-methods-frontend.js 5.26 kB
build/checkout-blocks/terms-frontend.js 1.56 kB
build/checkout-blocks/totals-frontend.js 310 B
build/checkout-frontend.js 30.5 kB
build/checkout.js 45.3 kB
build/customer-account.js 3.16 kB
build/featured-category.js 14 kB
build/featured-product.js 14.2 kB
build/filter-wrapper-frontend.js 14.1 kB
build/filter-wrapper.js 2.4 kB
build/general-style-rtl.css 1.31 kB
build/general-style.css 1.31 kB
build/handpicked-products.js 7.91 kB
build/legacy-template.js 5.32 kB
build/mini-cart-component-frontend.js 28 kB
build/mini-cart-contents-block/empty-cart-frontend.js 360 B
build/mini-cart-contents-block/filled-cart-frontend.js 268 B
build/mini-cart-contents-block/footer-frontend.js 2.86 kB
build/mini-cart-contents-block/items-frontend.js 237 B
build/mini-cart-contents-block/products-table-frontend.js 589 B
build/mini-cart-contents-block/shopping-button-frontend.js 572 B
build/mini-cart-contents-block/title-frontend.js 367 B
build/mini-cart-frontend.js 2.02 kB
build/mini-cart.js 4.49 kB
build/price-filter-frontend.js 13.8 kB
build/price-filter-wrapper-frontend.js 6.99 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 253 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.69 kB
build/product-best-sellers.js 8.25 kB
build/product-button--product-category-list--product-image--product-price--product-rating--product-sale-b--e17c7c01.js 500 B
build/product-button--product-image--product-price--product-rating--product-sale-badge--product-title.js 262 B
build/product-button-frontend.js 2.22 kB
build/product-button.js 4.01 kB
build/product-categories.js 2.36 kB
build/product-category-list-frontend.js 1.19 kB
build/product-category.js 9.24 kB
build/product-image-frontend.js 2.22 kB
build/product-image.js 4.12 kB
build/product-new.js 8.25 kB
build/product-price-frontend.js 2.39 kB
build/product-rating-frontend.js 1.65 kB
build/product-rating.js 919 B
build/product-results-count.js 1.66 kB
build/product-sale-badge-frontend.js 1.45 kB
build/product-search.js 2.63 kB
build/product-sku-frontend.js 707 B
build/product-sku.js 453 B
build/product-stock-indicator-frontend.js 1.32 kB
build/product-summary-frontend.js 1.58 kB
build/product-tag-list-frontend.js 1.18 kB
build/product-tag-list.js 498 B
build/product-tag.js 8.74 kB
build/product-title-frontend.js 1.65 kB
build/product-title.js 3.48 kB
build/product-top-rated.js 8.49 kB
build/products-by-attribute.js 9.58 kB
build/rating-filter-frontend.js 20.8 kB
build/rating-filter-wrapper-frontend.js 5.61 kB
build/reviews-by-category.js 11.9 kB
build/reviews-by-product.js 12.9 kB
build/reviews-frontend.js 7.13 kB
build/single-product-frontend.js 17.9 kB
build/stock-filter-frontend.js 21 kB
build/stock-filter-wrapper-frontend.js 3.15 kB
build/store-notices.js 1.69 kB
build/vendors--attribute-filter-wrapper--cart-blocks/cart-cross-sells-products--cart-blocks/order-summary--82e4ed06-frontend.js 6.86 kB
build/vendors--attribute-filter-wrapper--rating-filter-wrapper--stock-filter-wrapper-frontend.js 7.7 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-cross-sells-products--cart-blocks/order-summary-shipping--checkout-blocks--18f9376a-frontend.js 19.4 kB
build/vendors--cart-blocks/cart-cross-sells-products--product-add-to-cart-frontend.js 7.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/order-summary-shipping--checkout-block--24d3fc0c-frontend.js 8.24 kB
build/vendors--checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 5.44 kB
build/vendors--checkout-blocks/shipping-method-frontend.js 12 kB
build/wc-blocks-data.js 21.8 kB
build/wc-blocks-editor-style-rtl.css 5.82 kB
build/wc-blocks-editor-style.css 5.82 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 930 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.73 kB
build/wc-blocks-style-rtl.css 26.9 kB
build/wc-blocks-style.css 26.9 kB
build/wc-blocks-vendors-style-rtl.css 1.96 kB
build/wc-blocks-vendors-style.css 1.96 kB
build/wc-blocks-vendors.js 64.4 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
build/wc-shipping-method-pickup-location.js 29.9 kB
build/woo-directives-runtime.js 2.73 kB
build/woo-directives-vendors.js 7.91 kB

compressed-size-action

@gigitux gigitux marked this pull request as draft December 22, 2022 15:51
@github-actions
Copy link
Contributor

This PR has been marked as stale because it has not seen any activity within the past 7 days. Our team uses this tool to help surface pull requests that have slipped through review.

If deemed still relevant, the pr can be kept active by ensuring it's up to date with the main branch and removing the stale label.

@github-actions github-actions bot added the status: stale Stale issues and PRs have had no updates for 60 days. label Dec 30, 2022
@gigitux gigitux removed the status: stale Stale issues and PRs have had no updates for 60 days. label Dec 30, 2022
@gigitux gigitux changed the title [NOT Review]Fix/7921 product query product search result preview [NOT Review]Product Search Results template: fix the preview when the Inherit Query option is enabled Dec 30, 2022
@github-actions
Copy link
Contributor

github-actions bot commented Jan 7, 2023

This PR has been marked as stale because it has not seen any activity within the past 7 days. Our team uses this tool to help surface pull requests that have slipped through review.

If deemed still relevant, the pr can be kept active by ensuring it's up to date with the main branch and removing the stale label.

@github-actions github-actions bot added the status: stale Stale issues and PRs have had no updates for 60 days. label Jan 7, 2023
@gigitux gigitux removed the status: stale Stale issues and PRs have had no updates for 60 days. label Jan 9, 2023
@github-actions
Copy link
Contributor

github-actions bot commented Jan 9, 2023

The release ZIP for this PR is accessible via:

https://wcblocks.wpcomstaging.com/wp-content/uploads/woocommerce-gutenberg-products-block-7965.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: 487
  • Total errors: 2310

🎉 🎉 This PR does not introduce new TS errors.

comments-aggregator

@gigitux gigitux force-pushed the fix/7921-product-query-product-search-result-preview branch from f89afa8 to 654b9bc Compare January 10, 2023 10:07
@gigitux gigitux added block-type: product-query Issues related to/affecting all product-query variations. type: enhancement The issue is a request for an enhancement. skip-changelog PRs that you don't want to appear in the changelog. labels Jan 10, 2023
@gigitux gigitux force-pushed the fix/7921-product-query-product-search-result-preview branch 3 times, most recently from 6b7f546 to da8089b Compare January 10, 2023 13:48
@gigitux gigitux marked this pull request as ready for review January 10, 2023 13:49
@gigitux gigitux changed the title [NOT Review]Product Search Results template: fix the preview when the Inherit Query option is enabled Product Search Results template: fix the preview when the Inherit Query option is enabled Jan 10, 2023
@github-actions
Copy link
Contributor

This PR has been marked as stale because it has not seen any activity within the past 7 days. Our team uses this tool to help surface pull requests that have slipped through review.

If deemed still relevant, the pr can be kept active by ensuring it's up to date with the main branch and removing the stale label.

@github-actions github-actions bot added the status: stale Stale issues and PRs have had no updates for 60 days. label Jan 18, 2023
@gigitux gigitux removed the status: stale Stale issues and PRs have had no updates for 60 days. label Jan 18, 2023
@nefeline
Copy link
Contributor

Hey @gigitux ! I see this PR is flagged as blocked by #7956 : All good to review it right away or are more changes expected here after the blocker is removed & the other PR merged?

@gigitux
Copy link
Contributor Author

gigitux commented Jan 19, 2023

Hey @gigitux ! I see this PR is flagged as blocked by #7956 : All good to review it right away or are more changes expected here after the blocker is removed & the other PR merged?

You can already review it. This PR includes changes from #7956. I suggest reviewing #7956 and, after that, reviewing this PR.

@nefeline
Copy link
Contributor

nefeline commented Jan 19, 2023

Great work! 👏

This PR includes changes from #7956. I suggest reviewing #7956 and, after that, reviewing this PR.

I see @danieldudzic is already assigned to review that one, so I'll focus here, but heads up, some tests here are failing (both on the CI and locally).

User facing test results:

Edit the Product Search Results template.
Add the Products block.
Add the Sale Status filter and select Show only products on sale.

✅ Confirmed that when the sale status filter is enabled, only products on sale are displayed

Now, enable Inherit query from template.
Be sure that all products are displayed.

✅ Confirmed all products are displayed when the Inherit query from template option is enabled.

Disable Inherit query from template.
Be sure that only on-sale products are visible.

✅ Confirmed only on-sale products are visible.

e2e test results:

The tests on this branch are failing. When running the product-query test suite locally, it also failed, so probably worth investigating the causes.

@gigitux
Copy link
Contributor Author

gigitux commented Jan 19, 2023

Thanks for the review!

e2e test results:

The tests on this branch are failing. When running the product-query test suite locally, it also failed, so probably worth investigating the causes.

The E2E tests fail in trunk too. I will take a look at them next week!

@gigitux gigitux force-pushed the fix/7921-product-query-product-search-result-preview branch from 07da73a to a8e49aa Compare March 13, 2023 14:57
@gigitux gigitux force-pushed the fix/7921-product-query-product-search-result-preview branch from a8e49aa to fc5ccce Compare March 13, 2023 14:59
@gigitux gigitux requested a review from imanish003 March 13, 2023 15:04
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.

I tested the PR & it's working as expected. I left one minor suggestion but pre-approving PR because that's not a blocker 🚀

Comment on lines 235 to 244
<Control
{ ...props }
queryObjectBeforeInheritEnabled={
queryObjectBeforeInheritEnabled
}
defaultWooQueryParams={
defaultWooQueryParams
}
key={ key }
/>
Copy link
Contributor

Choose a reason for hiding this comment

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

AFAIU queryObjectBeforeInheritEnabled & defaultWooQueryParams will be used in only wooInherit. If that's the case then I think instead of passing these as props, we should calculate it inside wooInherit function.

As we are using hooks (ex. usePrevious), I believe we will need to extract the wooInherit function as a component, something like this.

wooInherit: WooInheritToggleControl

IMO this would make the code easier to understand, but please feel free to ignore my suggestion if you disagree.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Nice suggestion! I addressed it via 33fbac9.
I tested it, and it works. Please, could you recheck it?

@github-actions github-actions bot added this to the 9.9.0 milestone Mar 15, 2023
@gigitux gigitux requested a review from imanish003 March 15, 2023 14:16
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 @gigitux,
There is one issue. If I set keyword in filters as shown in screenshot below:
image

And then enable Inherit query from template then, keyword effect is still there, i.e., I still see products that are filtered by the Keyword.

Is it expected? AFAIK filters shouldn't have any effect when Inherit query from template is enabled. I might be wrong 🤷🏻‍♂️

@gigitux
Copy link
Contributor Author

gigitux commented Mar 16, 2023

Hi @gigitux, There is one issue. If I set keyword in filters as shown in screenshot below: image

And then enable Inherit query from template then, keyword effect is still there, i.e., I still see products that are filtered by the Keyword.

Is it expected? AFAIK filters shouldn't have any effect when Inherit query from template is enabled. I might be wrong 🤷🏻‍♂️

That is a good point, but I can replicate this issue on the trunk. I think that it is a bug in the Query Loop block. Should we open another issue or write the issue on WordPress/gutenberg#29438?

@gigitux gigitux requested a review from imanish003 March 16, 2023 09:49
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.

@gigitux You are right. We can open a new issue on Gutenberg repo. Approving the PR 🚀

Although I think the issue you mentioned is a different one & not related to Inherit query from template toggle. You can also see my comment on the issue.

@gigitux
Copy link
Contributor Author

gigitux commented Mar 16, 2023

Thanks for the review!

We can open a new issue on Gutenberg repo.

Can you take care of this?

@gigitux gigitux merged commit 8624555 into trunk Mar 16, 2023
@gigitux gigitux deleted the fix/7921-product-query-product-search-result-preview branch March 16, 2023 10:04
@imanish003
Copy link
Contributor

imanish003 commented Mar 16, 2023

Can you take care of this?

Sure, I will take care of this 🤝

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
block-type: product-query Issues related to/affecting all product-query variations. skip-changelog PRs that you don't want to appear in the changelog. type: enhancement The issue is a request for an enhancement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Product Query: Inherit Query template enabled and preview on the editor side
3 participants