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

Fix: Inner blocks control position for Cart Block #6973

Merged
merged 6 commits into from Sep 16, 2022

Conversation

tarunvijwani
Copy link
Contributor

@tarunvijwani tarunvijwani commented Aug 24, 2022

Describe the bug

Cart Block: Order summary inner blocks controls were appearing on the left side of the screen

Changes in the PR

Removed __experimentalExposeControlsToChildren from cart/index.js and cart/edit.js file.

__experimentalExposeControlsToChildren was added by the PR to display the view switcher when selecting the inner blocks of the Cart block. It was dependent on PR opened in Gutenberg repo, which was never merged.

Currently, the view switcher is only visible when we select the parent Cart block, which is nearly impossible to select without using the list view option. It can be done now using a filter, I'll create a different ticket to track the issue

Fixes #6698

Screenshots

Before After
Screenshot 2022-07-18 at 17 45 35 image

Testing

Automated Tests

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

User Facing Testing

  1. Go to the Cart Block
  2. Click on the fee inner block
  3. Confirm that the controls appear on the correct side
  • Do not include in the Testing Notes

WooCommerce Visibility

  • WooCommerce Core
  • Feature plugin
  • Experimental

Changelog

Fix: Inner blocks control position for Cart Block

@tarunvijwani tarunvijwani added status: needs review type: bug The issue/PR concerns a confirmed bug. block: cart Issues related to the cart block. labels Aug 24, 2022
@tarunvijwani tarunvijwani self-assigned this Aug 24, 2022
@tarunvijwani tarunvijwani marked this pull request as ready for review August 24, 2022 11:40
@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-6973.zip

@github-actions
Copy link
Contributor

github-actions bot commented Aug 24, 2022

Size Change: -37 B (0%)

Total Size: 874 kB

Filename Size Change
build/cart.js 41.8 kB -37 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 7.62 kB
build/active-filters.js 8.27 kB
build/all-products-frontend.js 18.1 kB
build/all-products.js 33.9 kB
build/all-reviews.js 7.79 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.08 kB
build/cart-blocks/cart-items-frontend.js 299 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 783 B
build/cart-blocks/order-summary-coupon-form-frontend.js 2.64 kB
build/cart-blocks/order-summary-discount-frontend.js 2.15 kB
build/cart-blocks/order-summary-fee-frontend.js 274 B
build/cart-blocks/order-summary-heading-frontend.js 454 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 428 B
build/cart-blocks/order-summary-subtotal-frontend.js 274 B
build/cart-blocks/order-summary-taxes-frontend.js 435 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.15 kB
build/cart-frontend.js 47.1 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 888 B
build/checkout-blocks/contact-information-frontend.js 2.84 kB
build/checkout-blocks/express-payment-frontend.js 5.38 kB
build/checkout-blocks/fields-frontend.js 344 B
build/checkout-blocks/order-note-frontend.js 1.08 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.27 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 434 B
build/checkout-blocks/payment-frontend.js 7.69 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 326 B
build/checkout-frontend.js 49.3 kB
build/checkout.js 43.1 kB
build/featured-category.js 13.2 kB
build/featured-product.js 13.4 kB
build/general-style-rtl.css 1.29 kB
build/general-style.css 1.29 kB
build/handpicked-products.js 7.29 kB
build/legacy-template.js 2.84 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 230 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.9 kB
build/mini-cart-frontend.js 1.72 kB
build/mini-cart.js 4.56 kB
build/price-filter-frontend.js 13.4 kB
build/price-filter.js 9.34 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.66 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.62 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.87 kB
build/product-button.js 1.57 kB
build/product-categories.js 2.36 kB
build/product-category-list-frontend.js 883 B
build/product-category-list.js 502 B
build/product-category.js 8.61 kB
build/product-image-frontend.js 1.88 kB
build/product-image.js 1.59 kB
build/product-new.js 7.62 kB
build/product-on-sale.js 7.94 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.17 kB
build/product-rating.js 739 B
build/product-sale-badge-frontend.js 1.13 kB
build/product-sale-badge.js 801 B
build/product-search.js 2.62 kB
build/product-sku-frontend.js 380 B
build/product-sku.js 379 B
build/product-stock-indicator-frontend.js 996 B
build/product-stock-indicator.js 623 B
build/product-summary-frontend.js 1.29 kB
build/product-summary.js 920 B
build/product-tag-list-frontend.js 876 B
build/product-tag-list.js 497 B
build/product-tag.js 8 kB
build/product-title-frontend.js 1.31 kB
build/product-title.js 921 B
build/product-top-rated.js 7.86 kB
build/products-by-attribute.js 8.53 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.62 kB
build/stock-filter.js 7.52 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.85 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.8 kB
build/wc-blocks-style.css 23.7 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

Copy link
Contributor

@tarhi-saad tarhi-saad left a comment

Choose a reason for hiding this comment

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

Hi @tarunvijwani! Thank you for fixing the block's control position bug! 🙌 You can find below my comment about a display bug!

<BlockSettings
attributes={ attributes }
setAttributes={ setAttributes }
/>
Copy link
Contributor

Choose a reason for hiding this comment

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

Hi @tarunvijwani! The BlockSettings component is already added on line 80 of this file. With the current two BlockSettings we have double dark mode controls:

image

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Sorry, I missed them while resolving the merge conflict. I have removed the duplicate code. Thank you!

@tarunvijwani tarunvijwani marked this pull request as draft September 6, 2022 17:47
@tarunvijwani tarunvijwani marked this pull request as ready for review September 15, 2022 14:13
@rubikuserbot rubikuserbot requested a review from a team September 15, 2022 14:14
Copy link
Contributor

@tarhi-saad tarhi-saad left a comment

Choose a reason for hiding this comment

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

That's perfect, @tarunvijwani! It looks good to me! So, let's 🚀 it! 💪

@github-actions github-actions bot added this to the 8.6.0 milestone Sep 15, 2022
@tarunvijwani tarunvijwani merged commit 722baa2 into trunk Sep 16, 2022
@tarunvijwani tarunvijwani deleted the fix/6698-order-summary-inner-blocks-controls branch September 16, 2022 06:02
senadir pushed a commit to senadir/woocommerce-blocks that referenced this pull request Nov 12, 2022
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. type: bug The issue/PR concerns a confirmed bug.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Cart Block: Order summary inner blocks controls appear on the left side of the screen
2 participants