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

Add ExperimentalOrderLocalPickupPackages Slot/Fill #8636

Merged
merged 4 commits into from
Mar 13, 2023

Conversation

opr
Copy link
Contributor

@opr opr commented Mar 4, 2023

This PR is based on add/local-pickup-select

It adds a Slot/Fill in the checkout-pickup-options-block block which can be used to render content below our pickup options.

It also changes the existing RadioControl in the CheckoutPickupOptionsBlock to a LocalPickupSelect - this is required because when WC Subs renders multiple packages, we need to show a title for the package.

Follow up issue: woocommerce/woocommerce#42461

Fixes #7998

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.

Testing

Automated Tests

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

User Facing Testing

  1. Go to WooCommerce -> Settings -> Shipping -> Local Pickup and activate Local Pickup. Ensure you have added a couple of locations.
  2. Add an item to your cart and go to the Checkout block.
  3. Select Local Pickup and ensure the options you set up in step 1 are visible.
  • Do not include in the Testing Notes

Internal developer testing

  1. From your plugins directory run npx @wordpress/create-block -t @woocommerce/extend-cart-checkout-block my-test-plugin - this will create a plugin called My test plugin. Activate this.
  2. Edit my-test-plugin/src/js/index.js and change the render function on/around line 17 to this:
const render = () => {
	return (
		<>
			<ExperimentalOrderLocalPickupPackages>
				<div
					style={{
						border: '1px solid grey',
						marginTop: 20,
						padding: 20,
						borderRadius: 2,
					}}
				>
					By using our convenient local pickup option, you can come to
					our store and pick up your order. We will send you an email
					when your order is ready for pickup.
				</div>
			</ExperimentalOrderLocalPickupPackages>
		</>
	);
};
  1. Go to WooCommerce -> Settings -> Shipping -> Local Pickup and activate Local Pickup. Ensure you have added a couple of locations.
  2. Add an item to your cart and go to the Checkout block.
  3. Select Local Pickup and ensure the options you set up in step 1 are visible.
  4. Ensure you can see the By using our convenient local pickup option, you can come to our store and pick up your order. We will send you an email when your order is ready for pickup. text below the pickup options.
  5. image

WooCommerce Visibility

  • WooCommerce Core
  • Feature plugin
  • Experimental

Dev note

In this release we added a new Slot/Fill to the Local Pickup area. The Slot/Fill is named ExperimentalOrderLocalPickupPackages and it can be used to output content below our local pickup options. To find out more about this Slot/Fill please refer to our available slot fills documentation.

Changelog

Add new ExperimentalOrderLocalPickupPackages Slot/Fill.

@opr opr added status: needs review category: extensibility Work involving adding or updating extensibility. Useful to combine with other scopes impacted. needs: tests The issue/PR needs tests before it can move forward. block: checkout Issues related to the checkout block. labels Mar 4, 2023
@opr opr self-assigned this Mar 4, 2023
@woocommercebot woocommercebot requested review from a team and wavvves and removed request for a team March 4, 2023 01:02
@github-actions
Copy link
Contributor

github-actions bot commented Mar 4, 2023

The release ZIP for this PR is accessible via:

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

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

assets/js/blocks/checkout/inner-blocks/checkout-pickup-options-block/block.tsx

packages/checkout/components/order-local-pickup-packages/index.tsx

comments-aggregator

@github-actions
Copy link
Contributor

github-actions bot commented Mar 4, 2023

Size Change: -3.52 kB (0%)

Total Size: 1.12 MB

Filename Size Change
build/active-filters-wrapper-frontend.js 5.98 kB -1 B (0%)
build/active-filters.js 7.37 kB +2 B (0%)
build/all-products-frontend.js 11.7 kB -1 B (0%)
build/attribute-filter-frontend.js 22.5 kB -12 B (0%)
build/attribute-filter-wrapper--stock-filter-wrapper-frontend.js 3.36 kB -1 B (0%)
build/attribute-filter.js 13.1 kB +6 B (0%)
build/blocks-checkout.js 41.2 kB +80 B (0%)
build/breadcrumbs.js 2.04 kB -3 B (0%)
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.38 kB -1 B (0%)
build/cart-blocks/cart-cross-sells-products-frontend.js 9.76 kB +12 B (0%)
build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js 5.19 kB +3 B (0%)
build/cart-blocks/cart-express-payment-frontend.js 719 B -1 B (0%)
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.36 kB +3 B (0%)
build/cart-blocks/cart-order-summary-frontend.js 1.24 kB -1 B (0%)
build/cart-blocks/filled-cart-frontend.js 655 B +2 B (0%)
build/cart-blocks/order-summary-coupon-form-frontend.js 1.62 kB +1 B (0%)
build/cart-blocks/order-summary-shipping-frontend.js 11.1 kB -3.73 kB (-25%) 🎉
build/cart-blocks/proceed-to-checkout-frontend.js 1.24 kB +2 B (0%)
build/cart-frontend.js 28.9 kB -3 B (0%)
build/cart.js 47.6 kB +11 B (0%)
build/checkout-blocks/actions-frontend.js 1.84 kB -1 B (0%)
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 0 B -3.92 kB (removed) 🏆
build/checkout-blocks/billing-address-frontend.js 4.09 kB +2.9 kB (+246%) 🆘
build/checkout-blocks/contact-information-frontend.js 2.05 kB -1 B (0%)
build/checkout-blocks/fields-frontend.js 331 B +1 B (0%)
build/checkout-blocks/order-summary-cart-items-frontend.js 3.68 kB +8 B (0%)
build/checkout-blocks/order-summary-coupon-form-frontend.js 1.79 kB +1 B (0%)
build/checkout-blocks/order-summary-discount-frontend.js 2.29 kB -1 B (0%)
build/checkout-blocks/order-summary-shipping-frontend.js 11.2 kB -3.75 kB (-25%) 🎉
build/checkout-blocks/payment-frontend.js 8.43 kB +2 B (0%)
build/checkout-blocks/pickup-options-frontend.js 4.04 kB +1.24 kB (+44%) 🚨
build/checkout-blocks/shipping-address-frontend.js 4.04 kB +2.9 kB (+254%) 🆘
build/checkout-blocks/shipping-methods-frontend.js 5.05 kB +469 B (+10%) ⚠️
build/checkout-blocks/terms-frontend.js 1.56 kB +1 B (0%)
build/checkout-blocks/totals-frontend.js 310 B -1 B (0%)
build/checkout-frontend.js 30.4 kB -14 B (0%)
build/checkout.js 44.5 kB +302 B (+1%)
build/customer-account.js 3.16 kB +1 B (0%)
build/featured-category.js 14 kB -3 B (0%)
build/featured-product.js 14.2 kB -8 B (0%)
build/filter-wrapper-frontend.js 14.1 kB +1 B (0%)
build/filter-wrapper.js 2.4 kB +4 B (0%)
build/handpicked-products.js 7.91 kB +1 B (0%)
build/legacy-template.js 5.32 kB -5 B (0%)
build/mini-cart-component-frontend.js 28 kB +6 B (0%)
build/mini-cart-contents-block/footer-frontend.js 2.86 kB -3 B (0%)
build/mini-cart-contents-block/shopping-button-frontend.js 575 B +2 B (0%)
build/mini-cart-contents.js 16.6 kB +2 B (0%)
build/mini-cart-frontend.js 2.02 kB +1 B (0%)
build/mini-cart.js 4.29 kB -1 B (0%)
build/price-filter-frontend.js 13.8 kB -4 B (0%)
build/price-filter-wrapper-frontend.js 6.99 kB -4 B (0%)
build/price-filter.js 8.39 kB +5 B (0%)
build/product-add-to-cart-frontend.js 6.69 kB -1 B (0%)
build/product-add-to-cart.js 8.61 kB +2 B (0%)
build/product-best-sellers.js 8.25 kB -2 B (0%)
build/product-button-frontend.js 2.22 kB -4 B (0%)
build/product-button.js 3.99 kB +2 B (0%)
build/product-categories.js 2.36 kB -1 B (0%)
build/product-category-list-frontend.js 1.19 kB -2 B (0%)
build/product-category-list.js 501 B -1 B (0%)
build/product-category.js 9.24 kB -4 B (0%)
build/product-image-frontend.js 2.22 kB -1 B (0%)
build/product-new.js 8.25 kB -1 B (0%)
build/product-on-sale.js 8.58 kB +1 B (0%)
build/product-price-frontend.js 2.38 kB +3 B (0%)
build/product-price.js 1.64 kB +2 B (0%)
build/product-query.js 10.8 kB +8 B (0%)
build/product-rating-frontend.js 1.65 kB -1 B (0%)
build/product-rating.js 918 B -1 B (0%)
build/product-results-count.js 1.66 kB +1 B (0%)
build/product-sale-badge-frontend.js 1.45 kB -2 B (0%)
build/product-sale-badge.js 818 B -1 B (0%)
build/product-search.js 2.63 kB -2 B (0%)
build/product-stock-indicator-frontend.js 1.31 kB -2 B (0%)
build/product-summary-frontend.js 1.58 kB -1 B (0%)
build/product-summary.js 920 B +1 B (0%)
build/product-tag-list-frontend.js 1.18 kB -5 B (0%)
build/product-tag.js 8.73 kB -1 B (0%)
build/product-title.js 3.46 kB -1 B (0%)
build/products-by-attribute.js 9.45 kB +4 B (0%)
build/rating-filter-frontend.js 20.8 kB -28 B (0%)
build/rating-filter-wrapper-frontend.js 5.61 kB -1 B (0%)
build/rating-filter.js 7.41 kB -1 B (0%)
build/reviews-by-category.js 11.9 kB -4 B (0%)
build/single-product-frontend.js 17.9 kB +3 B (0%)
build/single-product.js 10.6 kB +3 B (0%)
build/stock-filter-frontend.js 21 kB -31 B (0%)
build/stock-filter-wrapper-frontend.js 3.15 kB +1 B (0%)
build/stock-filter.js 8.14 kB +5 B (0%)
build/store-notices.js 1.69 kB -1 B (0%)
build/vendors--attribute-filter-wrapper--rating-filter-wrapper--stock-filter-wrapper-frontend.js 7.7 kB +6 B (0%)
build/vendors--cart-blocks/cart-cross-sells-products--cart-blocks/order-summary-shipping--checkout-blocks--18f9376a-frontend.js 19.4 kB +3 B (0%)
build/vendors--cart-blocks/cart-cross-sells-products--product-add-to-cart-frontend.js 7.25 kB +3 B (0%)
build/vendors--cart-blocks/cart-line-items--checkout-blocks/order-summary-cart-items--mini-cart-contents---233ab542-frontend.js 3.14 kB -1 B (0%)
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--5b8feb0b-frontend.js 0 B -4.83 kB (removed) 🏆
build/vendors--checkout-blocks/shipping-method-frontend.js 12 kB +6 B (0%)
build/vendors--checkout-blocks/shipping-methods-frontend.js 0 B -8.84 kB (removed) 🏆
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/order-summary-shipping--checkout-block--24d3fc0c-frontend.js 8.24 kB +8.24 kB (new file) 🆕
build/vendors--checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 5.44 kB +5.44 kB (new file) 🆕
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 7.97 kB
build/all-products.js 37.7 kB
build/all-reviews.js 7.66 kB
build/attribute-filter-wrapper-frontend.js 4.49 kB
build/cart-blocks/cart-cross-sells-frontend.js 253 B
build/cart-blocks/cart-items-frontend.js 301 B
build/cart-blocks/cart-line-items-frontend.js 1.07 kB
build/cart-blocks/cart-totals-frontend.js 307 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/order-summary-discount-frontend.js 2.12 kB
build/cart-blocks/order-summary-fee-frontend.js 274 B
build/cart-blocks/order-summary-heading-frontend.js 455 B
build/cart-blocks/order-summary-subtotal-frontend.js 275 B
build/cart-blocks/order-summary-taxes-frontend.js 434 B
build/catalog-sorting.js 1.7 kB
build/checkout-blocks/express-payment-frontend.js 1.13 kB
build/checkout-blocks/order-note-frontend.js 1.14 kB
build/checkout-blocks/order-summary-fee-frontend.js 277 B
build/checkout-blocks/order-summary-frontend.js 1.24 kB
build/checkout-blocks/order-summary-subtotal-frontend.js 275 B
build/checkout-blocks/order-summary-taxes-frontend.js 435 B
build/checkout-blocks/shipping-method-frontend.js 2.27 kB
build/general-style-rtl.css 1.31 kB
build/general-style.css 1.31 kB
build/mini-cart-contents-block/empty-cart-frontend.js 360 B
build/mini-cart-contents-block/filled-cart-frontend.js 268 B
build/mini-cart-contents-block/items-frontend.js 237 B
build/mini-cart-contents-block/products-table-frontend.js 588 B
build/mini-cart-contents-block/title-frontend.js 367 B
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 253 B
build/product-add-to-cart--product-button--product-image--product-rating--product-title.js 151 B
build/product-button--product-category-list--product-image--product-price--product-rating--product-sale-b--e17c7c01.js 500 B
build/product-button--product-image--product-price--product-rating--product-sale-badge--product-title.js 262 B
build/product-image.js 4.1 kB
build/product-sku-frontend.js 707 B
build/product-sku.js 452 B
build/product-stock-indicator.js 645 B
build/product-tag-list.js 498 B
build/product-title-frontend.js 1.65 kB
build/product-top-rated.js 8.49 kB
build/reviews-by-product.js 13 kB
build/reviews-frontend.js 7.13 kB
build/vendors--attribute-filter-wrapper--cart-blocks/cart-cross-sells-products--cart-blocks/order-summary--82e4ed06-frontend.js 6.86 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/wc-blocks-data.js 21.5 kB
build/wc-blocks-editor-style-rtl.css 5.82 kB
build/wc-blocks-editor-style.css 5.82 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 933 B
build/wc-blocks-registry.js 3.15 kB
build/wc-blocks-shared-context.js 1.52 kB
build/wc-blocks-shared-hocs.js 1.73 kB
build/wc-blocks-style-rtl.css 26.9 kB
build/wc-blocks-style.css 26.8 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 64.4 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
build/wc-shipping-method-pickup-location.js 29.7 kB
build/woo-directives-runtime.js 2.73 kB
build/woo-directives-vendors.js 7.91 kB

compressed-size-action

wavvves
wavvves previously approved these changes Mar 7, 2023
@github-actions github-actions bot added this to the 9.8.0 milestone Mar 7, 2023
Base automatically changed from add/local-pickup-select to trunk March 10, 2023 15:52
@opr opr force-pushed the add/local-pickup-slot-fill branch from dfea41a to 5029278 Compare March 10, 2023 15:56
@opr opr requested a review from mikejolley March 10, 2023 18:48
@Aljullu Aljullu modified the milestones: 9.8.0, 9.9.0 Mar 13, 2023
@wavvves wavvves dismissed their stale review March 13, 2023 10:37

Mistaken urls

@mikejolley mikejolley merged commit 58cf23f into trunk Mar 13, 2023
@mikejolley mikejolley deleted the add/local-pickup-slot-fill branch March 13, 2023 12:00
@tarunvijwani tarunvijwani added type: bug The issue/PR concerns a confirmed bug. and removed type: bug The issue/PR concerns a confirmed bug. labels Mar 27, 2023
@tarunvijwani tarunvijwani added the type: enhancement The issue is a request for an enhancement. label Mar 27, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
block: checkout Issues related to the checkout block. category: extensibility Work involving adding or updating extensibility. Useful to combine with other scopes impacted. needs: tests The issue/PR needs tests before it can move forward. type: enhancement The issue is a request for an enhancement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Local Pickup: WooCommerce Subscriptions should render local pickup rates in a local pickup slot
5 participants