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

Product by Category block: Fix error when adding the block to a store without reviews #9868

Conversation

thealexandrelara
Copy link
Contributor

@thealexandrelara thealexandrelara commented Jun 16, 2023

Description

In this PR I fixed a PropType warning and also solved an error that was occurring when adding the Reviews by Category block to a store that has no product reviews.

Walkthrough

🤖 Generated by Copilot at 4d660a5

  • Fix prop type validation warning for noReviewsPlaceholder prop in EditorContainerBlock component (link)
  • Pass NoReviewsPlaceholder component as a render prop to EditorContainerBlock component in reviews-by-category block (link)

Fixes #9867

Accessibility

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.

Screenshots

Before After
image image

Testing

Automated Tests

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

User Facing Testing

Pre-requisites:
- Make sure your store has no reviews

Steps to reproduce the behavior:

  1. Log in to your WordPress admin dashboard: This can be done by visiting your website's login URL, which typically looks like www.yourwebsite.com/wp-admin.
  2. Verify WooCommerce and WooCommerce Blocks installation: Before you proceed, make sure you have both WooCommerce and WooCommerce Blocks installed and activated. If you haven't, navigate to Plugins > Add New from your WordPress dashboard, search for WooCommerce and WooCommerce Blocks, install and activate them.
  3. Create a new post: To do this, navigate to Posts > Add New from the WordPress dashboard.
  4. Add the Reviews by Category block: Inside the new post editor, click on the plus icon (+) at the top left corner or within the post editor to add a new block. In the search bar that appears, type Reviews by Category and click on it to add the block to your post.
  5. Configure the Reviews by Category block: Now, you can configure the block based on your needs. Select the category you want to display reviews from using the dropdown in the block selector.
  6. Check that the block is inserted to the Editor and no error appears
  • Do not include in the Testing Notes

WooCommerce Visibility

  • WooCommerce Core
  • Feature plugin
  • Experimental

Performance Impact

Changelog

Fix error when adding the Reviews by Category block to a store without any product reviews

@github-actions
Copy link
Contributor

github-actions bot commented Jun 16, 2023

The release ZIP for this PR is accessible via:

https://wcblocks.wpcomstaging.com/wp-content/uploads/woocommerce-gutenberg-products-block-9868.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: 2215

⚠️ ⚠️ This PR introduces new TS errors on 1 files:

assets/js/blocks/reviews/all-reviews/block.tsx

comments-aggregator

@github-actions
Copy link
Contributor

Size Change: +18 B (0%)

Total Size: 1.1 MB

Filename Size Change
build/reviews-by-category.js 12.1 kB +18 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 8.64 kB
build/active-filters-wrapper-frontend.js 7.61 kB
build/active-filters.js 7.48 kB
build/all-products-frontend.js 12 kB
build/all-products.js 40.2 kB
build/all-reviews.js 7.86 kB
build/attribute-filter-wrapper--stock-filter-wrapper-frontend.js 4.04 kB
build/attribute-filter-wrapper-frontend.js 4.29 kB
build/attribute-filter.js 13.2 kB
build/blocks-checkout.js 35.1 kB
build/breadcrumbs.js 2.13 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.39 kB
build/cart-blocks/cart-cross-sells-frontend.js 254 B
build/cart-blocks/cart-cross-sells-products--product-price-frontend.js 2.92 kB
build/cart-blocks/cart-cross-sells-products-frontend.js 3.77 kB
build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js 5.17 kB
build/cart-blocks/cart-express-payment-frontend.js 720 B
build/cart-blocks/cart-items-frontend.js 301 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.57 kB
build/cart-blocks/cart-line-items-frontend.js 1.06 kB
build/cart-blocks/cart-order-summary-frontend.js 1.27 kB
build/cart-blocks/cart-totals-frontend.js 308 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/filled-cart-frontend.js 656 B
build/cart-blocks/order-summary-coupon-form-frontend.js 1.63 kB
build/cart-blocks/order-summary-discount-frontend.js 2.12 kB
build/cart-blocks/order-summary-fee-frontend.js 273 B
build/cart-blocks/order-summary-heading-frontend.js 334 B
build/cart-blocks/order-summary-shipping-frontend.js 17.1 kB
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.38 kB
build/cart-frontend.js 29.9 kB
build/cart.js 45.2 kB
build/catalog-sorting.js 1.7 kB
build/checkout-blocks/actions-frontend.js 1.88 kB
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/contact-information-frontend.js 2.04 kB
build/checkout-blocks/express-payment-frontend.js 1.14 kB
build/checkout-blocks/fields-frontend.js 332 B
build/checkout-blocks/order-note-frontend.js 1.14 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.75 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.27 kB
build/checkout-blocks/order-summary-shipping-frontend.js 17 kB
build/checkout-blocks/order-summary-subtotal-frontend.js 274 B
build/checkout-blocks/order-summary-taxes-frontend.js 434 B
build/checkout-blocks/payment-frontend.js 8.28 kB
build/checkout-blocks/pickup-options-frontend.js 4.84 kB
build/checkout-blocks/shipping-address-frontend.js 1.17 kB
build/checkout-blocks/shipping-method-frontend.js 2.63 kB
build/checkout-blocks/shipping-methods-frontend.js 6.4 kB
build/checkout-blocks/terms-frontend.js 1.56 kB
build/checkout-blocks/totals-frontend.js 361 B
build/checkout-frontend.js 32 kB
build/checkout.js 46.6 kB
build/customer-account.js 3.18 kB
build/featured-category.js 15.1 kB
build/featured-product.js 15.3 kB
build/filter-wrapper-frontend.js 14.3 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 8.04 kB
build/legacy-template.js 6.72 kB
build/mini-cart-component-frontend.js 29.5 kB
build/mini-cart-contents-block/cart-button-frontend.js 1.73 kB
build/mini-cart-contents-block/checkout-button-frontend.js 1.73 kB
build/mini-cart-contents-block/empty-cart-frontend.js 362 B
build/mini-cart-contents-block/filled-cart-frontend.js 267 B
build/mini-cart-contents-block/footer-frontend.js 4.09 kB
build/mini-cart-contents-block/items-frontend.js 237 B
build/mini-cart-contents-block/products-table-frontend.js 593 B
build/mini-cart-contents-block/shopping-button-frontend.js 526 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-label-frontend.js 1.53 kB
build/mini-cart-contents.js 18.1 kB
build/mini-cart-frontend.js 2.72 kB
build/mini-cart.js 5.32 kB
build/price-filter-wrapper-frontend.js 6.74 kB
build/price-filter.js 8.55 kB
build/price-format.js 1.19 kB
build/product-add-to-cart--product-button--product-image--product-price--product-rating--product-sale-bad--49d3ecb2.js 250 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.51 kB
build/product-add-to-cart.js 8.84 kB
build/product-best-sellers.js 8.35 kB
build/product-button--product-image--product-price--product-rating--product-sale-badge--product-sku--prod--5bce0384.js 954 B
build/product-button-frontend.js 2.65 kB
build/product-button.js 3.97 kB
build/product-categories.js 2.71 kB
build/product-category.js 9.37 kB
build/product-collection.js 11.8 kB
build/product-image-frontend.js 2.62 kB
build/product-image.js 4.14 kB
build/product-new.js 8.65 kB
build/product-on-sale.js 8.65 kB
build/product-price-frontend.js 203 B
build/product-price.js 1.68 kB
build/product-query.js 11.8 kB
build/product-rating-frontend.js 2.33 kB
build/product-rating.js 1.03 kB
build/product-results-count.js 1.66 kB
build/product-sale-badge-frontend.js 1.79 kB
build/product-sale-badge.js 666 B
build/product-search.js 2.63 kB
build/product-sku-frontend.js 1.84 kB
build/product-sku.js 535 B
build/product-stock-indicator-frontend.js 2.03 kB
build/product-stock-indicator.js 731 B
build/product-summary-frontend.js 2.25 kB
build/product-summary.js 1.01 kB
build/product-tag.js 9.01 kB
build/product-template.js 3.34 kB
build/product-title-frontend.js 2.21 kB
build/product-title.js 3.66 kB
build/product-top-rated.js 8.91 kB
build/products-by-attribute.js 9.74 kB
build/rating-filter-frontend.js 21.4 kB
build/rating-filter-wrapper-frontend.js 6.2 kB
build/rating-filter.js 6.9 kB
build/reviews-by-product.js 13.3 kB
build/reviews-frontend.js 7.17 kB
build/single-product.js 11.1 kB
build/stock-filter-wrapper-frontend.js 2.98 kB
build/stock-filter.js 7.62 kB
build/store-notices.js 1.68 kB
build/vendors--attribute-filter-wrapper--cart-blocks/order-summary-coupon-form--cart-blocks/order-summary--48e1e4bb-frontend.js 6.82 kB
build/vendors--attribute-filter-wrapper--cart-blocks/order-summary-shipping--checkout-blocks/billing-addr--d9f38f9d-frontend.js 4.21 kB
build/vendors--attribute-filter-wrapper--stock-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--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--price-filter-wrapper-frontend.js 2.2 kB
build/vendors--product-add-to-cart-frontend.js 7.26 kB
build/vendors--rating-filter-wrapper-frontend.js 5.11 kB
build/wc-blocks-data.js 22.3 kB
build/wc-blocks-editor-style-rtl.css 6.04 kB
build/wc-blocks-editor-style.css 6.03 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-shared-context.js 1.1 kB
build/wc-blocks-shared-hocs.js 1.75 kB
build/wc-blocks-style-rtl.css 28 kB
build/wc-blocks-style.css 27.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 65 kB
build/wc-blocks.js 3.7 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
build/woo-directives-runtime.js 2.73 kB
build/woo-directives-vendors.js 7.91 kB

compressed-size-action

@thealexandrelara thealexandrelara added type: bug The issue/PR concerns a confirmed bug. block: reviews by category Issues related to the Reviews by Category block. labels Jun 16, 2023
@thealexandrelara thealexandrelara self-assigned this Jun 16, 2023
@thealexandrelara thealexandrelara marked this pull request as ready for review June 16, 2023 20:00
@woocommercebot woocommercebot requested review from a team and imanish003 and removed request for a team June 16, 2023 20:00
@thealexandrelara thealexandrelara changed the title Adjust PropTypes definition and fix block error when store has no rev… Product by Category block: Fix error when adding the block to a store without reviews Jun 16, 2023
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.

Hey @thealexandrelara, I have tested the PR and can confirm that it works as expected. Therefore, I'm approving this PR. Great work! 🚀

@github-actions github-actions bot added this to the 10.5.0 milestone Jun 19, 2023
@imanish003 imanish003 merged commit c47a0f0 into trunk Jun 19, 2023
@imanish003 imanish003 deleted the fix/9867-error-when-adding-reviews-by-category-block-to-store-without-reviews branch June 19, 2023 07:07
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
block: reviews by category Issues related to the Reviews by Category block. type: bug The issue/PR concerns a confirmed bug.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Reviews by Category block: Error when adding the block to a store without reviews
2 participants