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

Switch to correct view if inner block is selected #5358

Merged
merged 3 commits into from
Dec 14, 2021
Merged

Conversation

dinhtungdu
Copy link
Member

@dinhtungdu dinhtungdu commented Dec 10, 2021

Fixes #5351

This PR watches for the change of current selected block then switch the current view of the view switcher if an inner block is selected.

Testing

Automated Tests

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

Manual Testing

How to test the changes in this Pull Request:

  1. Insert or edit the Cart block.
  2. Open the block navigation list panel.
  3. Given the current view is the Filled Cart.
  4. Select an inner block of Empty Cart.
  5. See the view changes to Empty.
  6. Repeat all steps above to test Mini Cart Contents block.

User Facing Testing

These are steps for user testing (where "user" is someone interacting with this change that is not editing any code).

  • Same as above, or
  • See steps below.

Changelog

Cart block: switch to correct view if inner block is selected.

@dinhtungdu dinhtungdu self-assigned this Dec 10, 2021
@rubikuserbot rubikuserbot requested review from a team and Aljullu and removed request for a team December 10, 2021 10:35
@dinhtungdu dinhtungdu added status: needs review type: bug The issue/PR concerns a confirmed bug. block: cart Issues related to the cart block. block: mini-cart Issues related to the Mini-Cart block. labels Dec 10, 2021
@github-actions
Copy link
Contributor

github-actions bot commented Dec 10, 2021

Size Change: -23.3 kB (-3%)

Total Size: 817 kB

Filename Size Change
build/active-filters.js 7.05 kB -11 B (0%)
build/all-products-frontend.js 18.6 kB +42 B (0%)
build/all-products.js 34.4 kB -3 B (0%)
build/all-reviews.js 8.35 kB -8 B (0%)
build/atomic-block-components/add-to-cart--atomic-block-components/button--atomic-block-components/image---a7e2bb9b.js 2.76 kB -1 B (0%)
build/atomic-block-components/add-to-cart-frontend.js 6.87 kB -15 B (0%)
build/atomic-block-components/add-to-cart.js 6.42 kB -1 B (0%)
build/atomic-block-components/button-frontend.js 1.48 kB +2 B (0%)
build/atomic-block-components/button.js 849 B +1 B (0%)
build/atomic-block-components/category-list-frontend.js 457 B -1 B (0%)
build/atomic-block-components/image-frontend.js 1.37 kB -2 B (0%)
build/atomic-block-components/image.js 1.05 kB +1 B (0%)
build/atomic-block-components/price-frontend.js 1.74 kB -2 B (0%)
build/atomic-block-components/rating-frontend.js 552 B -1 B (0%)
build/atomic-block-components/sale-badge-frontend.js 625 B -1 B (0%)
build/atomic-block-components/stock-indicator-frontend.js 584 B -1 B (0%)
build/atomic-block-components/summary-frontend.js 872 B -3 B (0%)
build/atomic-block-components/tag-list-frontend.js 458 B -1 B (0%)
build/atomic-block-components/title-frontend.js 1.11 kB +1 B (0%)
build/atomic-block-components/title.js 1.1 kB +1 B (0%)
build/attribute-filter-frontend.js 16.3 kB -281 B (-2%)
build/attribute-filter.js 12.7 kB -8 B (0%)
build/blocks-checkout.js 17.6 kB +7 B (0%)
build/cart-blocks/accepted-payment-methods-frontend.js 1.15 kB +5 B (0%)
build/cart-blocks/express-payment-frontend.js 4.86 kB -6 B (0%)
build/cart-blocks/filled-cart-frontend.js 766 B -1 B (0%)
build/cart-blocks/items-frontend.js 298 B +1 B (0%)
build/cart-blocks/line-items-frontend.js 5.13 kB -7 B (0%)
build/cart-blocks/order-summary-frontend.js 8.98 kB +23 B (0%)
build/cart-frontend.js 45.5 kB +10 B (0%)
build/cart.js 44.1 kB +175 B (0%)
build/checkout-blocks/actions-frontend.js 1.44 kB -2 B (0%)
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 4.24 kB -6 B (0%)
build/checkout-blocks/billing-address-frontend.js 884 B -3 B (0%)
build/checkout-blocks/contact-information-frontend.js 2.93 kB -13 B (0%)
build/checkout-blocks/express-payment-frontend.js 5.15 kB -18 B (0%)
build/checkout-blocks/order-note-frontend.js 1.13 kB -1 B (0%)
build/checkout-blocks/order-summary-frontend.js 11.4 kB -27 B (0%)
build/checkout-blocks/payment-frontend.js 7.41 kB -66 B (-1%)
build/checkout-blocks/shipping-address-frontend.js 971 B -2 B (0%)
build/checkout-blocks/shipping-methods-frontend.js 4.81 kB +4 B (0%)
build/checkout-blocks/terms-frontend.js 1.21 kB -1 B (0%)
build/checkout-blocks/totals-frontend.js 324 B +1 B (0%)
build/checkout-frontend.js 47.6 kB +35 B (0%)
build/checkout.js 47 kB -21 B (0%)
build/featured-product.js 9.9 kB -2 B (0%)
build/handpicked-products.js 7.32 kB -4 B (0%)
build/mini-cart-component-frontend.js 14.2 kB -23.4 kB (-62%) 🏆
build/mini-cart-contents.js 3.58 kB +122 B (+4%)
build/mini-cart-frontend.js 1.76 kB +3 B (0%)
build/mini-cart.js 6.65 kB -1 B (0%)
build/price-filter-frontend.js 12.4 kB +30 B (0%)
build/price-filter.js 8.6 kB -8 B (0%)
build/product-best-sellers.js 7.51 kB -3 B (0%)
build/product-categories.js 3.47 kB -1 B (0%)
build/product-category.js 8.35 kB -4 B (0%)
build/product-new.js 7.66 kB -3 B (0%)
build/product-search.js 2.46 kB -2 B (0%)
build/product-tag.js 7.76 kB -8 B (0%)
build/product-top-rated.js 7.63 kB -3 B (0%)
build/products-by-attribute.js 8.48 kB -1 B (0%)
build/reviews-by-category.js 11.8 kB -7 B (0%)
build/reviews-by-product.js 12.9 kB -7 B (0%)
build/reviews-frontend.js 7.24 kB +13 B (0%)
build/single-product-frontend.js 22.1 kB +126 B (+1%)
build/single-product.js 10.4 kB -7 B (0%)
build/stock-filter-frontend.js 6.81 kB +12 B (0%)
build/stock-filter.js 6.82 kB -11 B (0%)
build/vendors--atomic-block-components/add-to-cart--cart-blocks/order-summary--checkout-blocks/billing-ad--c5eb4dcd-frontend.js 18.9 kB +4 B (0%)
build/vendors--atomic-block-components/add-to-cart-frontend.js 6.82 kB +3 B (0%)
build/vendors--atomic-block-components/price--cart-blocks/line-items--cart-blocks/order-summary--checkout--8a3571de-frontend.js 5.71 kB +1 B (0%)
build/vendors--cart-blocks/line-items--checkout-blocks/order-summary-frontend.js 3.14 kB +1 B (0%)
build/vendors--cart-blocks/order-summary--checkout-blocks/billing-address--checkout-blocks/order-summary---eb4d2cec-frontend.js 4.75 kB +1 B (0%)
build/wc-blocks-data.js 8.84 kB -1 B (0%)
build/wc-blocks-editor-style-rtl.css 4.32 kB +13 B (0%)
build/wc-blocks-editor-style.css 4.32 kB +13 B (0%)
build/wc-blocks.js 2.96 kB +10 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 6.21 kB
build/atomic-block-components/add-to-cart--atomic-block-components/button.js 1.48 kB
build/atomic-block-components/category-list.js 458 B
build/atomic-block-components/price.js 1.69 kB
build/atomic-block-components/rating.js 553 B
build/atomic-block-components/sale-badge.js 622 B
build/atomic-block-components/sku-frontend.js 386 B
build/atomic-block-components/sku.js 385 B
build/atomic-block-components/stock-indicator.js 586 B
build/atomic-block-components/summary.js 872 B
build/atomic-block-components/tag-list.js 458 B
build/cart-blocks/checkout-button-frontend.js 1.14 kB
build/cart-blocks/empty-cart-frontend.js 345 B
build/cart-blocks/totals-frontend.js 320 B
build/checkout-blocks/fields-frontend.js 343 B
build/featured-category.js 8.55 kB
build/legacy-template.js 2.08 kB
build/price-format.js 1.18 kB
build/product-on-sale.js 8.05 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 949 B
build/wc-blocks-registry.js 2.7 kB
build/wc-blocks-shared-context.js 1.51 kB
build/wc-blocks-shared-hocs.js 1.14 kB
build/wc-blocks-style-rtl.css 21.1 kB
build/wc-blocks-style.css 21.1 kB
build/wc-blocks-vendors-style-rtl.css 1.28 kB
build/wc-blocks-vendors-style.css 1.28 kB
build/wc-blocks-vendors.js 65.5 kB
build/wc-payment-method-bacs.js 820 B
build/wc-payment-method-cheque.js 816 B
build/wc-payment-method-cod.js 912 B
build/wc-payment-method-paypal.js 838 B
build/wc-payment-method-stripe.js 11.1 kB
build/wc-settings.js 2.6 kB

compressed-size-action

Copy link
Contributor

@Aljullu Aljullu left a comment

Choose a reason for hiding this comment

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

Works like a charm! 👏

Code looks good but I have a performance improvement proposal: can we move the views definition from Cart and Mini Cart blocks outside of the component? This way the array is persisted across renders and that would avoid that useEffect() running on every render.

@dinhtungdu dinhtungdu requested a review from Aljullu December 13, 2021 06:25
@dinhtungdu
Copy link
Member Author

@Aljullu thanks for the suggestion, I moved those definitions outside of components in bdf9748, can you please take another look at this PR?

Copy link
Contributor

@Aljullu Aljullu left a comment

Choose a reason for hiding this comment

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

Thanks for updating the PR @dinhtungdu, this is working like a charm. 👏

@github-actions github-actions bot added this to the 6.6.0 milestone Dec 13, 2021
@dinhtungdu dinhtungdu merged commit f7fd0f4 into trunk Dec 14, 2021
@dinhtungdu dinhtungdu deleted the fix/5351 branch December 14, 2021 00:46
jonny-bull pushed a commit to jonny-bull/woocommerce-gutenberg-products-block that referenced this pull request Dec 14, 2021
jonny-bull pushed a commit to jonny-bull/woocommerce-gutenberg-products-block that referenced this pull request Dec 16, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
block: cart Issues related to the cart block. block: mini-cart Issues related to the Mini-Cart block. type: bug The issue/PR concerns a confirmed bug.
Projects
None yet
2 participants