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

Update Checkout to Checkout i2 #4745

Merged
merged 17 commits into from
Sep 16, 2021
Merged

Update Checkout to Checkout i2 #4745

merged 17 commits into from
Sep 16, 2021

Conversation

mikejolley
Copy link
Member

@mikejolley mikejolley commented Sep 14, 2021 •
edited
Loading

This PR moves Checkout i2 from experimental mode, into feature plugin mode, replacing Checkout i1. This also takes care of consolidating styles that were shared between i1 and i2, and frontend rendering issues.

Closes #4681
Closes #4491
Fixes #4739

Testing

How to test the changes in this Pull Request:

Migration:

  1. Before using this PR, have an already setup Checkout Block
  2. Use this PR
  3. Confirm the old checkout is functional and no block invalidation messages are shown
  4. Confirm (before saving anything) the Checkout is functional on the frontend

General:

  1. Test purchase flow via checkout
  2. Test purchase flow on mobile device
  3. Test Stripe Integration to make payment and checkout
  4. Customise inner blocks. Confirm changes persist and work as intended.

Changelog

Checkout v2: The checkout now supports inner blocks that allow for greater customizability. This update also includes an optional Terms and Conditions field.

@mikejolley mikejolley added status: needs review needs: dev note PR that has some text that needs to be included in the release notes. labels Sep 14, 2021
@mikejolley mikejolley added this to the 6.0.0 milestone Sep 14, 2021
@mikejolley mikejolley self-assigned this Sep 14, 2021
@mikejolley mikejolley requested a review from a team as a code owner September 14, 2021 16:07
@mikejolley mikejolley requested review from Aljullu and removed request for a team September 14, 2021 16:07
@github-actions
Copy link
Contributor

When forcing all blocks at once, they will append based o...

When forcing all blocks at once, they will append based on the order they are registered. Introduce formal sorting param.

https://github.com/woocommerce/woocommerce-gutenberg-products-block/blob/2c8fb22a334aa823277e69429fd2acde650ee16d/assets/js/blocks/cart-checkout/checkout/inner-blocks/register-components.ts#L29-L40

🚀 This comment was generated by the automations bot based on a todo comment in 2c8fb22 in #4745. cc @mikejolley

@github-actions
Copy link
Contributor

github-actions bot commented Sep 14, 2021 •
edited
Loading

Size Change: -85.5 kB (-7%) ✅

Total Size: 1.11 MB

Filename Size Change
build/active-filters-frontend.js 8.4 kB +18 B (0%)
build/active-filters.js 8 kB -7 B (0%)
build/all-products-frontend.js 23.1 kB +20 B (0%)
build/all-products.js 37.1 kB +132 B (0%)
build/all-reviews.js 9.63 kB +46 B (0%)
build/atomic-block-components/add-to-cart--atomic-block-components/button--atomic-block-components/image---a7e2bb9b.js 2.66 kB +3 B (0%)
build/atomic-block-components/add-to-cart--atomic-block-components/button.js 1.82 kB +3 B (0%)
build/atomic-block-components/add-to-cart--atomic-block-components/image--atomic-block-components/title.js 334 B +1 B (0%)
build/atomic-block-components/add-to-cart-frontend.js 8.38 kB +1 B (0%)
build/atomic-block-components/add-to-cart.js 7.72 kB -15 B (0%)
build/atomic-block-components/button-frontend.js 1.74 kB +1 B (0%)
build/atomic-block-components/button.js 873 B -2 B (0%)
build/atomic-block-components/image-frontend.js 1.88 kB +4 B (0%)
build/atomic-block-components/image.js 1.35 kB +3 B (0%)
build/atomic-block-components/price-frontend.js 2.1 kB +5 B (0%)
build/atomic-block-components/price.js 2.11 kB +1 B (0%)
build/atomic-block-components/rating-frontend.js 564 B +1 B (0%)
build/atomic-block-components/sale-badge-frontend.js 859 B -1 B (0%)
build/atomic-block-components/sale-badge.js 867 B -1 B (0%)
build/atomic-block-components/sku-frontend.js 392 B +4 B (+1%)
build/atomic-block-components/sku.js 393 B -1 B (0%)
build/atomic-block-components/stock-indicator.js 611 B -1 B (0%)
build/atomic-block-components/summary-frontend.js 904 B -1 B (0%)
build/atomic-block-components/tag-list.js 472 B -1 B (0%)
build/atomic-block-components/title-frontend.js 1.44 kB +2 B (0%)
build/atomic-block-components/title.js 1.29 kB +2 B (0%)
build/attribute-filter-frontend.js 18.1 kB -579 B (-3%)
build/attribute-filter.js 12 kB -184 B (-2%)
build/blocks-checkout.js 21 kB +14 B (0%)
build/cart-frontend.js 91.6 kB +256 B (0%)
build/cart.js 46.4 kB +42 B (0%)
build/checkout-frontend.js 54.4 kB -40.8 kB (-43%) 🎉
build/checkout-i2-frontend.js 0 B -52.5 kB (removed) 🏆
build/checkout-i2.js 0 B -49.5 kB (removed) 🏆
build/checkout.js 52.3 kB +3.24 kB (+7%) 🔍
build/featured-category.js 7.79 kB -15 B (0%)
build/featured-product.js 9.5 kB -9 B (0%)
build/handpicked-products.js 6.33 kB -16 B (0%)
build/mini-cart-component-frontend.js 36.8 kB +261 B (+1%)
build/mini-cart-frontend.js 2.35 kB +1 B (0%)
build/mini-cart.js 2.34 kB -15 B (-1%)
build/price-filter-frontend.js 14.4 kB -116 B (-1%)
build/price-filter.js 9.69 kB -10 B (0%)
build/price-format.js 1.37 kB -3 B (0%)
build/product-best-sellers.js 6.68 kB -10 B (0%)
build/product-categories.js 3.38 kB -4 B (0%)
build/product-category.js 7.56 kB -4 B (0%)
build/product-new.js 6.84 kB -8 B (0%)
build/product-on-sale.js 7.19 kB -11 B (0%)
build/product-search.js 2.66 kB -2 B (0%)
build/product-tag.js 6.65 kB -19 B (0%)
build/product-top-rated.js 6.81 kB -8 B (0%)
build/products-by-attribute.js 7.77 kB -17 B (0%)
build/reviews-by-category.js 11.5 kB -39 B (0%)
build/reviews-by-product.js 13.1 kB +1 B (0%)
build/reviews-frontend.js 8.97 kB -49 B (-1%)
build/single-product-frontend.js 26.2 kB +6 B (0%)
build/single-product.js 9.78 kB -10 B (0%)
build/stock-filter-frontend.js 8.82 kB +74 B (+1%)
build/stock-filter.js 7.81 kB +75 B (+1%)
build/vendors--atomic-block-components/add-to-cart-frontend.js 4.78 kB -15.5 kB (-76%) 🏆
build/vendors--atomic-block-components/price-frontend.js 0 B -5.72 kB (removed) 🏆
build/wc-blocks-data.js 11.1 kB -5 B (0%)
build/wc-blocks-editor-style-rtl.css 15.5 kB -22 B (0%)
build/wc-blocks-editor-style.css 15.5 kB -23 B (0%)
build/wc-blocks-middleware.js 1.47 kB -4 B (0%)
build/wc-blocks-registry.js 3.73 kB +56 B (+2%)
build/wc-blocks-style-rtl.css 20.1 kB -592 B (-3%)
build/wc-blocks-style.css 20.1 kB -593 B (-3%)
build/wc-blocks-vendors.js 254 kB +82 B (0%)
build/wc-blocks.js 3.5 kB -2 B (0%)
build/wc-settings.js 2.91 kB -9 B (0%)
build/checkout-blocks/actions-frontend.js 1.47 kB +1.47 kB (new file) 🆕
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 5.02 kB +5.02 kB (new file) 🆕
build/checkout-blocks/billing-address-frontend.js 1.15 kB +1.15 kB (new file) 🆕
build/checkout-blocks/contact-information-frontend.js 3.88 kB +3.88 kB (new file) 🆕
build/checkout-blocks/express-payment--checkout-blocks/payment-frontend.js 4.82 kB +4.82 kB (new file) 🆕
build/checkout-blocks/express-payment-frontend.js 1.83 kB +1.83 kB (new file) 🆕
build/checkout-blocks/fields-frontend.js 290 B +290 B (new file) 🆕
build/checkout-blocks/order-note-frontend.js 1.56 kB +1.56 kB (new file) 🆕
build/checkout-blocks/order-summary-frontend.js 12.6 kB +12.6 kB (new file) 🆕
build/checkout-blocks/payment-frontend.js 4.52 kB +4.52 kB (new file) 🆕
build/checkout-blocks/sample-frontend.js 249 B +249 B (new file) 🆕
build/checkout-blocks/shipping-address-frontend.js 1.62 kB +1.62 kB (new file) 🆕
build/checkout-blocks/shipping-methods-frontend.js 5.57 kB +5.57 kB (new file) 🆕
build/checkout-blocks/terms-frontend.js 1.64 kB +1.64 kB (new file) 🆕
build/checkout-blocks/totals-frontend.js 269 B +269 B (new file) 🆕
build/vendors--atomic-block-components/add-to-cart--checkout-blocks/billing-address--checkout-blocks/orde--63cde524-frontend.js 16.2 kB +16.2 kB (new file) 🆕
build/vendors--atomic-block-components/price--checkout-blocks/order-summary--checkout-blocks/shipping-methods-frontend.js 5.71 kB +5.71 kB (new file) 🆕
build/vendors--checkout-blocks/billing-address--checkout-blocks/order-summary--checkout-blocks/shipping-address-frontend.js 5.03 kB +5.03 kB (new file) 🆕
build/vendors--checkout-blocks/order-summary-frontend.js 3.11 kB +3.11 kB (new file) 🆕
ℹ️ View Unchanged
Filename Size
build/atomic-block-components/category-list-frontend.js 469 B
build/atomic-block-components/category-list.js 476 B
build/atomic-block-components/rating.js 567 B
build/atomic-block-components/stock-indicator-frontend.js 611 B
build/atomic-block-components/summary.js 911 B
build/atomic-block-components/tag-list-frontend.js 466 B
build/wc-blocks-google-analytics.js 1.98 kB
build/wc-blocks-shared-context.js 1.54 kB
build/wc-blocks-shared-hocs.js 1.75 kB
build/wc-blocks-vendors-style-rtl.css 1.37 kB
build/wc-blocks-vendors-style.css 1.37 kB
build/wc-payment-method-bacs.js 806 B
build/wc-payment-method-cheque.js 806 B
build/wc-payment-method-cod.js 898 B
build/wc-payment-method-paypal.js 839 B
build/wc-payment-method-stripe.js 12.2 kB

compressed-size-action

senadir
senadir approved these changes Sep 15, 2021
View reviewed changes
Copy link
Member

@senadir senadir left a comment

Choose a reason for hiding this comment

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

Overall this is great, we did it, I'm going to cry. Let's ship this and do this again with Cart i2.

assets/js/atomic/utils/render-parent-block.tsx Show resolved Hide resolved
assets/js/blocks/cart-checkout/checkout/edit.tsx Show resolved Hide resolved
src/BlockTypes/Checkout.php Outdated Show resolved Hide resolved
tests/utils/select-block-by-name.js Outdated Show resolved Hide resolved
@mikejolley mikejolley merged commit 0e50628 into trunk Sep 16, 2021
@mikejolley mikejolley deleted the update/replace-checkout-i1-with-i2 branch September 16, 2021 12:16
@github-actions github-actions bot mentioned this pull request Sep 16, 2021
Closed
@senadir senadir added type: enhancement The issue is a request for an enhancement. type: new block Applied to work that introduces a new block (typically used on an epic issue). labels Sep 27, 2021
@eason9487 eason9487 mentioned this pull request Dec 26, 2023
Closed
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@senadir senadir senadir approved these changes

@Aljullu Aljullu Awaiting requested review from Aljullu

@nerrad nerrad Awaiting requested review from nerrad

Assignees

@mikejolley mikejolley

Labels
needs: dev note PR that has some text that needs to be included in the release notes. type: enhancement The issue is a request for an enhancement. type: new block Applied to work that introduces a new block (typically used on an epic issue).
Projects
None yet
Milestone
6.0.0
2 participants
@mikejolley @senadir