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

Add types to Checkout State Provider, and introduce Context Module Functions #3983

Closed
wants to merge 4 commits into from

Conversation

mikejolley
Copy link
Member

@mikejolley mikejolley commented Mar 19, 2021

This PR implements Typescript in the Checkout State Provider. Doing this revealed a bunch of typos and bugs!

As well as this, I added some shared helpers to base-utils to help with Typescript support (isObject, objectHasProp, isNull).

Finally, inspired by epic react I added some new functions exported from the context provider which take dispatch as a parameter and do something. These were previously exported by the context provider, but with this method we only need to export the dispatcher which means the functions can be tree-shaken.

  • submitCheckout
  • resetCheckout
  • setRedirectUrl
  • setHasError
  • incrementCalculating
  • decrementCalculating
  • setCustomerId
  • setOrderId
  • setOrderNotes
  • setShouldCreateAccount
  • setAfterProcessing

So example usage would be:

import {
	useCheckoutContext,
	setOrderNotes,
} from '@woocommerce/base-context/cart-checkout/checkout-state';

...

const { dispatch } = useCheckoutContext();

setOrderNotes( dispatch, value );

To test:

Smoke test the checkout process, including making payment. Checkout state provider is only used during checkout.

@mikejolley mikejolley self-assigned this Mar 19, 2021
@mikejolley mikejolley requested a review from a team as a code owner March 19, 2021 23:28
@mikejolley mikejolley requested review from ralucaStan and removed request for a team and ralucaStan March 19, 2021 23:28
@github-actions
Copy link
Contributor

github-actions bot commented Mar 19, 2021

Size Change: -284 B (0%)

Total Size: 1.16 MB

Filename Size Change
build/active-filters-frontend.js 8.62 kB +6 B (0%)
build/all-products-frontend.js 35.1 kB +2 B (0%)
build/all-products.js 37 kB +19 B (0%)
build/all-reviews.js 9.91 kB -3 B (0%)
build/atomic-block-components/add-to-cart-frontend.js 8.09 kB +2 B (0%)
build/atomic-block-components/add-to-cart.js 7.75 kB +11 B (0%)
build/atomic-block-components/image-frontend.js 1.77 kB -1 B (0%)
build/atomic-block-components/price-frontend.js 1.98 kB -2 B (0%)
build/atomic-block-components/price.js 2 kB -1 B (0%)
build/atomic-block-components/rating.js 524 B -1 B (0%)
build/atomic-block-components/sale-badge-frontend.js 859 B -2 B (0%)
build/atomic-block-components/sale-badge.js 869 B -2 B (0%)
build/atomic-block-components/sku.js 393 B -1 B (0%)
build/atomic-block-components/title.js 1.21 kB +1 B (0%)
build/attribute-filter-frontend.js 18.4 kB +5 B (0%)
build/cart-frontend.js 76.3 kB -112 B (0%)
build/cart.js 42.5 kB +5 B (0%)
build/checkout-frontend.js 80.8 kB -84 B (0%)
build/checkout.js 44.8 kB -83 B (0%)
build/featured-category.js 7.86 kB +1 B (0%)
build/handpicked-products.js 7.54 kB -2 B (0%)
build/price-filter-frontend.js 14.7 kB +3 B (0%)
build/price-filter.js 10 kB +3 B (0%)
build/product-best-sellers.js 7.61 kB -3 B (0%)
build/product-categories.js 3.24 kB +1 B (0%)
build/product-category.js 8.55 kB -8 B (0%)
build/product-new.js 7.78 kB -4 B (0%)
build/product-on-sale.js 8.17 kB -2 B (0%)
build/product-search.js 3.61 kB -1 B (0%)
build/products-by-attribute.js 8.53 kB -4 B (0%)
build/reviews-by-category.js 12 kB +1 B (0%)
build/reviews-by-product.js 13.5 kB -3 B (0%)
build/reviews-frontend.js 9.59 kB +1 B (0%)
build/single-product.js 10.3 kB -10 B (0%)
build/vendors.js 419 kB -16 B (0%)
ℹ️ View Unchanged
Filename Size Change
build/active-filters.js 8.71 kB 0 B
build/atomic-block-components/add-to-cart--atomic-block-components/button-frontend.js 1.97 kB 0 B
build/atomic-block-components/add-to-cart--atomic-block-components/button.js 3.59 kB 0 B
build/atomic-block-components/add-to-cart--atomic-block-components/image--atomic-block-components/title.js 336 B 0 B
build/atomic-block-components/button-frontend.js 1.04 kB 0 B
build/atomic-block-components/button.js 1.05 kB 0 B
build/atomic-block-components/category-list-frontend.js 470 B 0 B
build/atomic-block-components/category-list.js 476 B 0 B
build/atomic-block-components/image.js 1.24 kB 0 B
build/atomic-block-components/rating-frontend.js 520 B 0 B
build/atomic-block-components/sku-frontend.js 391 B 0 B
build/atomic-block-components/stock-indicator-frontend.js 569 B 0 B
build/atomic-block-components/stock-indicator.js 573 B 0 B
build/atomic-block-components/summary-frontend.js 922 B 0 B
build/atomic-block-components/summary.js 924 B 0 B
build/atomic-block-components/tag-list-frontend.js 467 B 0 B
build/atomic-block-components/tag-list.js 473 B 0 B
build/atomic-block-components/title-frontend.js 1.35 kB 0 B
build/attribute-filter.js 12.5 kB 0 B
build/blocks-checkout.js 17 kB 0 B
build/blocks.js 3.5 kB 0 B
build/editor-rtl.css 14.9 kB 0 B
build/editor.css 14.9 kB 0 B
build/featured-product.js 10.1 kB 0 B
build/price-format.js 1.46 kB 0 B
build/product-tag.js 6.61 kB 0 B
build/product-top-rated.js 7.75 kB 0 B
build/single-product-frontend.js 38.1 kB 0 B
build/style-rtl.css 18.4 kB 0 B
build/style.css 18.4 kB 0 B
build/vendors--atomic-block-components/price-frontend.js 6.54 kB 0 B
build/vendors-style-rtl.css 1.05 kB 0 B
build/vendors-style.css 1.05 kB 0 B
build/wc-blocks-data.js 7.2 kB 0 B
build/wc-blocks-google-analytics.js 1.35 kB 0 B
build/wc-blocks-middleware.js 1.11 kB 0 B
build/wc-blocks-registry.js 2.74 kB 0 B
build/wc-payment-method-bacs.js 812 B 0 B
build/wc-payment-method-cheque.js 807 B 0 B
build/wc-payment-method-cod.js 903 B 0 B
build/wc-payment-method-paypal.js 844 B 0 B
build/wc-payment-method-stripe.js 12.3 kB 0 B
build/wc-settings.js 2.43 kB 0 B
build/wc-shared-context.js 1.53 kB 0 B
build/wc-shared-hocs.js 1.72 kB 0 B

compressed-size-action

// Checkout state provider dispatch function.
dispatch: React.Dispatch< ActionType >;
// Submits the checkout and begins processing.
onSubmit: () => void;
Copy link
Member Author

Choose a reason for hiding this comment

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

I've left this in place because it's exposed to Payment Methods.

Copy link
Contributor

Choose a reason for hiding this comment

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

Potentially, the usePaymentMethodIntegrations hook could just pull in the dispatch functions and expose them though right?

@mikejolley mikejolley force-pushed the refactor/checkout-state-provider branch from 94beca1 to c6c5463 Compare March 22, 2021 17:58
@mikejolley mikejolley changed the title In progress - Refactor checkout state provider Add types to Checkout State Provider, and introduce Context Module Functions Mar 22, 2021
@mikejolley mikejolley added status: needs review type: refactor The issue/PR is related to refactoring. block: checkout Issues related to the checkout block. labels Mar 22, 2021
@mikejolley
Copy link
Member Author

I am extracting the TS changes to a new PR.

@mikejolley
Copy link
Member Author

Closing in favour of #4200 and #4204

@mikejolley mikejolley closed this May 13, 2021
@ralucaStan ralucaStan deleted the refactor/checkout-state-provider branch August 4, 2021 14:34
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. type: refactor The issue/PR is related to refactoring.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants