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

Fix filter count display toggle #10096

Merged
merged 3 commits into from
Jul 5, 2023
Merged

Fix filter count display toggle #10096

merged 3 commits into from
Jul 5, 2023

Conversation

gigitux
Copy link
Contributor

@gigitux gigitux commented Jul 4, 2023

This PR is a follow-up of #9833. After the last refactor, a regression has been introduced. The counter was displayed/hidden correctly based on the toggle on the editor side. Instead, the counter was always visible on the frontend side.

When the showCounts is false, it isn't saved as an attribute. So I changed the check in the utils.ts.

Also, I improved the save method since it isn't necessary anymore to use the inner HTML.

Testing

Automated Tests

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

User Facing Testing

  1. Before checking out this branch, check out release/10.5.0 branch, add post/page, and test the following blocks Filter by Attributes, Filter by Stock and Filter by Rating along with Products (beta) block. Just leave all default settings and publish post/page.
  2. Now checkout this PR and load the post/page you created in step 1 and ensure there are no block validation errors in the console.
  3. Add the 3 blocks again. Check that in each of the blocks, Display product count option is set to false/off.
    Ensure you can toggle Display product count and it will hide/show the product counts in editor and frontend.
  • Do not include in the Testing Notes

@gigitux gigitux added type: bug The issue/PR concerns a confirmed bug. skip-changelog PRs that you don't want to appear in the changelog. labels Jul 4, 2023
@gigitux gigitux self-assigned this Jul 4, 2023
@woocommercebot woocommercebot requested review from a team and nefeline and removed request for a team July 4, 2023 16:33
@gigitux gigitux requested review from alexflorisca, opr and thealexandrelara and removed request for nefeline July 4, 2023 16:34
@github-actions
Copy link
Contributor

github-actions bot commented Jul 4, 2023

The release ZIP for this PR is accessible via:

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

🎉 🎉 This PR does not introduce new TS errors.

comments-aggregator

@github-actions
Copy link
Contributor

github-actions bot commented Jul 4, 2023

Size Change: -37 B (0%)

Total Size: 1.35 MB

Filename Size Change
build/attribute-filter-frontend.js 23 kB -5 B (0%)
build/attribute-filter-wrapper-frontend.js 7.73 kB -5 B (0%)
build/attribute-filter.js 13.3 kB -2 B (0%)
build/filter-wrapper-frontend.js 14.3 kB -1 B (0%)
build/rating-filter-frontend.js 21.4 kB -5 B (0%)
build/rating-filter-wrapper-frontend.js 6.24 kB -4 B (0%)
build/rating-filter.js 6.93 kB -3 B (0%)
build/stock-filter-frontend.js 21.7 kB -6 B (0%)
build/stock-filter-wrapper-frontend.js 6.49 kB -4 B (0%)
build/stock-filter.js 7.67 kB -2 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 8.64 kB
build/active-filters-rtl.css 2.02 kB
build/active-filters-wrapper--mini-cart-contents-block/cart-button--mini-cart-contents-block/checkout-but--3d5b804b-style.js 958 B
build/active-filters-wrapper-frontend.js 7.58 kB
build/active-filters-wrapper-rtl.css 1.88 kB
build/active-filters-wrapper.css 1.88 kB
build/active-filters.css 2.02 kB
build/active-filters.js 7.54 kB
build/all-products-frontend.js 12.2 kB
build/all-products-rtl.css 4.17 kB
build/all-products.css 4.16 kB
build/all-products.js 41.2 kB
build/all-reviews-rtl.css 1.84 kB
build/all-reviews.css 1.84 kB
build/all-reviews.js 7.86 kB
build/attribute-filter-rtl.css 4.19 kB
build/attribute-filter-wrapper-rtl.css 4.06 kB
build/attribute-filter-wrapper.css 4.06 kB
build/attribute-filter.css 4.19 kB
build/blocks-checkout.js 35.1 kB
build/breadcrumbs-rtl.css 253 B
build/breadcrumbs.css 253 B
build/breadcrumbs.js 2.15 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.38 kB
build/cart-blocks/cart-accepted-payment-methods-style.js 137 B
build/cart-blocks/cart-cross-sells-frontend.js 253 B
build/cart-blocks/cart-cross-sells-products--product-price-frontend.js 2.91 kB
build/cart-blocks/cart-cross-sells-products-frontend.js 3.83 kB
build/cart-blocks/cart-cross-sells-products-style.js 137 B
build/cart-blocks/cart-cross-sells-style.js 253 B
build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js 5.16 kB
build/cart-blocks/cart-express-payment-frontend.js 721 B
build/cart-blocks/cart-express-payment-style.js 137 B
build/cart-blocks/cart-items-frontend.js 301 B
build/cart-blocks/cart-items-style.js 228 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.47 kB
build/cart-blocks/cart-line-items-frontend.js 1.06 kB
build/cart-blocks/cart-line-items-style.js 138 B
build/cart-blocks/cart-order-summary-frontend.js 1.28 kB
build/cart-blocks/cart-order-summary-style.js 319 B
build/cart-blocks/cart-totals-frontend.js 308 B
build/cart-blocks/cart-totals-style.js 238 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/empty-cart-style.js 339 B
build/cart-blocks/filled-cart-frontend.js 657 B
build/cart-blocks/filled-cart-style.js 311 B
build/cart-blocks/order-summary-coupon-form-frontend.js 1.63 kB
build/cart-blocks/order-summary-coupon-form-style.js 137 B
build/cart-blocks/order-summary-discount-frontend.js 2.12 kB
build/cart-blocks/order-summary-discount-style.js 137 B
build/cart-blocks/order-summary-fee-frontend.js 273 B
build/cart-blocks/order-summary-fee-style.js 138 B
build/cart-blocks/order-summary-heading-frontend.js 334 B
build/cart-blocks/order-summary-heading-style.js 335 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 273 B
build/cart-blocks/order-summary-subtotal-style.js 137 B
build/cart-blocks/order-summary-taxes-frontend.js 435 B
build/cart-blocks/order-summary-taxes-style.js 178 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.43 kB
build/cart-blocks/proceed-to-checkout-style.js 1.09 kB
build/cart-frontend.js 29.9 kB
build/cart-rtl.css 9.58 kB
build/cart.css 9.56 kB
build/cart.js 45.4 kB
build/catalog-sorting-rtl.css 277 B
build/catalog-sorting.css 276 B
build/catalog-sorting.js 1.71 kB
build/checkout-blocks/actions--checkout-blocks/terms-style.js 487 B
build/checkout-blocks/actions-frontend.js 1.88 kB
build/checkout-blocks/actions-style.js 686 B
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/billing-address-style.js 532 B
build/checkout-blocks/contact-information-frontend.js 2.05 kB
build/checkout-blocks/contact-information-style.js 609 B
build/checkout-blocks/express-payment-frontend.js 1.14 kB
build/checkout-blocks/fields-frontend.js 319 B
build/checkout-blocks/fields-style.js 260 B
build/checkout-blocks/order-note-frontend.js 1.13 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.76 kB
build/checkout-blocks/order-summary-cart-items-style.js 138 B
build/checkout-blocks/order-summary-coupon-form-frontend.js 1.79 kB
build/checkout-blocks/order-summary-coupon-form-style.js 138 B
build/checkout-blocks/order-summary-discount-frontend.js 2.29 kB
build/checkout-blocks/order-summary-discount-style.js 137 B
build/checkout-blocks/order-summary-fee-frontend.js 275 B
build/checkout-blocks/order-summary-fee-style.js 137 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-shipping-style.js 137 B
build/checkout-blocks/order-summary-style.js 318 B
build/checkout-blocks/order-summary-subtotal-frontend.js 273 B
build/checkout-blocks/order-summary-subtotal-style.js 136 B
build/checkout-blocks/order-summary-taxes-frontend.js 435 B
build/checkout-blocks/order-summary-taxes-style.js 178 B
build/checkout-blocks/payment-frontend.js 9.28 kB
build/checkout-blocks/payment-style.js 461 B
build/checkout-blocks/pickup-options-frontend.js 4.83 kB
build/checkout-blocks/pickup-options-style.js 445 B
build/checkout-blocks/shipping-address-frontend.js 1.17 kB
build/checkout-blocks/shipping-address-style.js 477 B
build/checkout-blocks/shipping-method-frontend.js 2.63 kB
build/checkout-blocks/shipping-method-style.js 1.37 kB
build/checkout-blocks/shipping-methods-frontend.js 6.4 kB
build/checkout-blocks/shipping-methods-style.js 417 B
build/checkout-blocks/terms-frontend.js 1.55 kB
build/checkout-blocks/terms-style.js 676 B
build/checkout-blocks/totals-frontend.js 348 B
build/checkout-blocks/totals-style.js 285 B
build/checkout-frontend.js 31.8 kB
build/checkout-rtl.css 9.23 kB
build/checkout.css 9.22 kB
build/checkout.js 47.9 kB
build/customer-account-rtl.css 406 B
build/customer-account.css 406 B
build/customer-account.js 3.19 kB
build/featured-category-rtl.css 986 B
build/featured-category.css 987 B
build/featured-category.js 15.1 kB
build/featured-product-rtl.css 1.03 kB
build/featured-product.css 1.03 kB
build/featured-product.js 15.3 kB
build/filter-wrapper-rtl.css 399 B
build/filter-wrapper.css 397 B
build/filter-wrapper.js 2.4 kB
build/handpicked-products.js 8.08 kB
build/legacy-template-rtl.css 258 B
build/legacy-template.css 257 B
build/legacy-template.js 8.92 kB
build/mini-cart-component-frontend.js 30.8 kB
build/mini-cart-contents-block/cart-button--mini-cart-contents-block/checkout-button--mini-cart-contents---358acf4e-style.js 293 B
build/mini-cart-contents-block/cart-button-frontend.js 1.73 kB
build/mini-cart-contents-block/cart-button-style.js 388 B
build/mini-cart-contents-block/checkout-button-frontend.js 1.81 kB
build/mini-cart-contents-block/checkout-button-style.js 469 B
build/mini-cart-contents-block/empty-cart-frontend.js 359 B
build/mini-cart-contents-block/empty-cart-style.js 358 B
build/mini-cart-contents-block/filled-cart-frontend.js 267 B
build/mini-cart-contents-block/filled-cart-style.js 268 B
build/mini-cart-contents-block/footer-frontend.js 3.83 kB
build/mini-cart-contents-block/footer-rtl.css 419 B
build/mini-cart-contents-block/footer-style.js 2.4 kB
build/mini-cart-contents-block/footer.css 418 B
build/mini-cart-contents-block/items-frontend.js 237 B
build/mini-cart-contents-block/items-style.js 237 B
build/mini-cart-contents-block/products-table--product-summary-style.js 737 B
build/mini-cart-contents-block/products-table-frontend.js 588 B
build/mini-cart-contents-block/products-table-rtl.css 2.19 kB
build/mini-cart-contents-block/products-table-style.js 5.1 kB
build/mini-cart-contents-block/products-table.css 2.18 kB
build/mini-cart-contents-block/shopping-button-frontend.js 531 B
build/mini-cart-contents-block/shopping-button-style.js 396 B
build/mini-cart-contents-block/title-frontend.js 1.9 kB
build/mini-cart-contents-block/title-items-counter-frontend.js 1.59 kB
build/mini-cart-contents-block/title-items-counter-style.js 299 B
build/mini-cart-contents-block/title-label-frontend.js 1.53 kB
build/mini-cart-contents-block/title-label-style.js 301 B
build/mini-cart-contents-block/title-style.js 440 B
build/mini-cart-contents-rtl.css 2.73 kB
build/mini-cart-contents.css 2.73 kB
build/mini-cart-contents.js 18.1 kB
build/mini-cart-frontend.js 2.84 kB
build/mini-cart-rtl.css 2.61 kB
build/mini-cart.css 2.61 kB
build/mini-cart.js 5.93 kB
build/packages-style-rtl.css 3.59 kB
build/packages-style.css 3.59 kB
build/price-filter-frontend.js 14.7 kB
build/price-filter-rtl.css 2.71 kB
build/price-filter-wrapper-frontend.js 6.79 kB
build/price-filter-wrapper-rtl.css 2.56 kB
build/price-filter-wrapper.css 2.56 kB
build/price-filter.css 2.71 kB
build/price-filter.js 8.6 kB
build/price-format.js 1.19 kB
build/product-add-to-cart--product-button--product-image--product-price--product-rating--product-rating-s--92e2d51d.js 272 B
build/product-add-to-cart--product-button--product-image--product-rating--product-rating-stars--product-title.js 151 B
build/product-add-to-cart-frontend.js 6.53 kB
build/product-add-to-cart-rtl.css 1.39 kB
build/product-add-to-cart.css 1.4 kB
build/product-add-to-cart.js 8.84 kB
build/product-best-sellers.js 8.43 kB
build/product-button--product-image--product-price--product-rating--product-rating-stars--product-sale-ba--4e6a8b3c.js 955 B
build/product-button-frontend.js 2.67 kB
build/product-button-rtl.css 889 B
build/product-button.css 891 B
build/product-button.js 3.97 kB
build/product-categories-rtl.css 671 B
build/product-categories.css 670 B
build/product-categories.js 2.72 kB
build/product-category.js 9.42 kB
build/product-collection.js 12.3 kB
build/product-details-rtl.css 413 B
build/product-details.css 410 B
build/product-gallery.js 2.3 kB
build/product-image-frontend.js 2.71 kB
build/product-image-gallery-rtl.css 322 B
build/product-image-gallery.css 322 B
build/product-image-rtl.css 951 B
build/product-image.css 949 B
build/product-image.js 4.21 kB
build/product-new.js 8.72 kB
build/product-on-sale.js 8.73 kB
build/product-price-frontend.js 231 B
build/product-price-rtl.css 696 B
build/product-price.css 695 B
build/product-price.js 1.67 kB
build/product-query-rtl.css 367 B
build/product-query.css 365 B
build/product-query.js 11.9 kB
build/product-rating-frontend.js 2.33 kB
build/product-rating-stars-frontend.js 2.24 kB
build/product-rating-stars-rtl.css 904 B
build/product-rating-stars.css 906 B
build/product-rating-stars.js 939 B
build/product-rating.js 1.02 kB
build/product-results-count-rtl.css 248 B
build/product-results-count.css 247 B
build/product-results-count.js 1.66 kB
build/product-reviews-rtl.css 474 B
build/product-reviews.css 473 B
build/product-sale-badge-frontend.js 1.8 kB
build/product-sale-badge-rtl.css 392 B
build/product-sale-badge.css 389 B
build/product-sale-badge.js 667 B
build/product-search-rtl.css 435 B
build/product-search.css 434 B
build/product-search.js 2.63 kB
build/product-sku-frontend.js 1.85 kB
build/product-sku-rtl.css 258 B
build/product-sku.css 258 B
build/product-sku.js 534 B
build/product-stock-indicator-frontend.js 2.04 kB
build/product-stock-indicator-rtl.css 250 B
build/product-stock-indicator.css 250 B
build/product-stock-indicator.js 732 B
build/product-summary-frontend.js 2.26 kB
build/product-summary-rtl.css 571 B
build/product-summary.css 572 B
build/product-summary.js 1.01 kB
build/product-tag.js 8.92 kB
build/product-template-rtl.css 439 B
build/product-template.css 437 B
build/product-template.js 3.35 kB
build/product-title-frontend.js 2.22 kB
build/product-title-rtl.css 718 B
build/product-title.css 719 B
build/product-title.js 3.65 kB
build/product-top-rated.js 8.97 kB
build/products-by-attribute.js 9.78 kB
build/rating-filter-rtl.css 4.24 kB
build/rating-filter-wrapper-rtl.css 4.1 kB
build/rating-filter-wrapper.css 4.1 kB
build/rating-filter.css 4.23 kB
build/reviews-by-category-rtl.css 1.84 kB
build/reviews-by-category.css 1.84 kB
build/reviews-by-category.js 12.2 kB
build/reviews-by-product-rtl.css 1.84 kB
build/reviews-by-product.css 1.84 kB
build/reviews-by-product.js 13.3 kB
build/reviews-frontend.js 7.17 kB
build/single-product-rtl.css 399 B
build/single-product.css 397 B
build/single-product.js 11.2 kB
build/stock-filter-rtl.css 4.06 kB
build/stock-filter-wrapper-rtl.css 3.93 kB
build/stock-filter-wrapper.css 3.93 kB
build/stock-filter.css 4.06 kB
build/store-notices.js 1.69 kB
build/vendors--active-filters-wrapper--attribute-filter-wrapper--mini-cart-contents-block/cart-button--mi--6436fd83-style.js 605 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.2 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.5 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--mini-cart-contents-block/products-table-style.js 3.16 kB
build/vendors--price-filter-wrapper-frontend.js 2.19 kB
build/vendors--product-add-to-cart-frontend.js 7.25 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 22.4 kB
build/wc-blocks-editor-style-rtl.css 6.17 kB
build/wc-blocks-editor-style.css 6.17 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 934 B
build/wc-blocks-registry.js 3.15 kB
build/wc-blocks-rtl.css 1.98 kB
build/wc-blocks-shared-context.js 1.1 kB
build/wc-blocks-shared-hocs.js 1.75 kB
build/wc-blocks-vendors.js 65.2 kB
build/wc-blocks.css 1.98 kB
build/wc-blocks.js 3.74 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 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.4 kB

compressed-size-action

Copy link
Contributor

@thealexandrelara thealexandrelara left a comment

Choose a reason for hiding this comment

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

Thank you for working on this @gigitux. I noticed that the counts was being shown for the Rating filter, and that there was a change missing in the rating-filter/utils.ts file so I commited this change and now it seems to be working correctly.

I'm approving this PR! ✅

@gigitux
Copy link
Contributor Author

gigitux commented Jul 5, 2023

@thealexandrelara Thanks for fixing the rating-filter!

@gigitux gigitux merged commit 59f2ba9 into trunk Jul 5, 2023
@gigitux gigitux deleted the fix/filters branch July 5, 2023 06:51
@opr opr added this to the 10.6.0 milestone Jul 5, 2023
@opr opr added the release: cherry-pick Cherry picked into the relevant release branch. label Jul 5, 2023
opr pushed a commit that referenced this pull request Jul 5, 2023
* fix save method

* improve check

* Only display counts if showCounts is true

---------

Co-authored-by: Alexandre Lara <[email protected]>
@Aljullu Aljullu mentioned this pull request Jul 6, 2023
4 tasks
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
release: cherry-pick Cherry picked into the relevant release branch. skip-changelog PRs that you don't want to appear in the changelog. type: bug The issue/PR concerns a confirmed bug.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants