Commit Graph

14 Commits

Author SHA1 Message Date
Mike Jolley cc3ed31feb Disable checkout form in the editor (https://github.com/woocommerce/woocommerce-blocks/pull/2128)
* Move no-shipping-placeholder to block - allow pointer events

* Allow payments placeholder to have pointer events

* Enable pointer events for children

* Wrap checkout with disabled
2020-04-06 16:35:09 +01:00
Darren Ethier d108e5ea96 Update stripe payment methods to work with new event emitters (https://github.com/woocommerce/woocommerce-blocks/pull/2115)
* Add interface for setting an express payment error notice.

* fix typedefs

* remove usage of paymentstatus dispatcher from stripe cc

* remove usage of paymentstatus dispatcher from apple pay

* remove any existing express payment notice on click

* revert buggy change with abort payment call

- also ensure that completePayment sets applePayProcessing to false
2020-04-06 08:18:35 -04:00
Darren Ethier 2d53b2ace1 Refactor checkout context provider to be more flexible and implement CartProvider (https://github.com/woocommerce/woocommerce-blocks/pull/2083)
* Rename and move existing checkout provider to checkout-state provider.

This allows us to re-use the interface exposed on this provider for cart and checkout blocks.

* refactor checkout provider to implement the new checkout state provider.

* Add Cart provider and export

* fix type-defs

* fix editor context provider and ensure all `isEditor` checks come from this provider

* fix type definition

* implement cart provider
2020-04-01 05:27:53 -04:00
Darren Ethier fb3cae67e6 Implement Stripe CC and Stripe ApplePay payment methods (https://github.com/woocommerce/woocommerce-blocks/pull/1983)
* Server side changes for payment method integrations

Including adding a stripe class temporarily

* update needed npm packages (and add some types)

* updates to contexts

* remove stepContent from payment config for payment methods

* update payment method interface and typedefs

Exposing a components property to pass along components that payment methods can use (so we keep styles consistent for them)

* add apple pay and stripe cc integration and remove paypal

* remove save payment checkbox from checkout block

It is handled by payment methods.

* Include an id prop for tabs

* fix activePaymentMethod pass through on rendered payment method element

also adds an id for the rendered tab

* add styles for payment method fields

If payment methods use these classes for their fields then the styles will get applied. It _could_ allow for consistent styling, we may have to provide design documentation for this?

These are styles in cases where payment methods have to use elements provided by the gateway (eg. Stripe elements). In future iterations we could look at providing components to payment methods to use (if they aren’t restricted by the gateway).

* fix rebase conflict

* do a test payment request for applePay to determine if the current browser supports it

* don’t console.error for stripe loading.

* Fix placeholder errors in the editor

* improve styling and add missing validation for inline card element

* update pacakge-lock

* rename payment-methods-demo folder to payment-methods-extension

* expose checkbox control on payment method interface

* export payment-methods-extension to it’s own asset build

This allows us to more accurately demonstrate how payment extensions would hook in to the blocks.

* don’t enqueue a style that doesn’t exist

* add full stop to comments and remove obsolete comment blcok

* fix spacing

* switch `activeContent` to `content` for payment method registration config
2020-03-30 08:07:49 -04:00
Darren Ethier 1648e651b4 Fix build issues for production builds (https://github.com/woocommerce/woocommerce-blocks/pull/2042)
* add payment-methods-demo config to sideEffects and install @wordpress/icons and @wordpress/primitives to be used directly.

* configure dependency extraction to ignore imports we want to use directly

* fix style issues for production builds

It looks like when a style is imported on the entrypoint of a component (or in a file with just exports), it get’s treeshaken from the final build _regardless of exception rules_.

* fix style imports from wordpress components

* fix loading skeleton showing on production builds

* fix block skeleton showing on production builds for cart

* import side effectful code

* add treatment for `@wordpress/warning` too

* fix typo

* exclude `settings/block` from sideEffects

* rollback `wordpress-components` update and keep sideEffects fixes

* remove unnecessary handle handling

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2020-03-27 16:56:48 -04:00
Darren Ethier 690f61ec93 Move payment method registration state to payment data context and add saved payment methods handling (https://github.com/woocommerce/woocommerce-blocks/pull/2029)
* Add saved-payment-method options handling and improve payment method registration initialization

* add server side exposure of saved customer payment methods

* fix reducer for express payment method state

* fix default for customerPaymentMethods
2020-03-26 07:11:46 -04:00
Mike Jolley 8abad3ad04 Add no payment methods placeholder (https://github.com/woocommerce/woocommerce-blocks/pull/1998)
* Update tabs and payment methods component classnames to meet standards

* Tidied up logic and added NoPaymentMethods placeholder

* Consistent "NO" placeholders

* frontend notices

* comments

* Update assets/js/base/components/payment-methods/no-payment-methods/style.scss

Co-Authored-By: Albert Juhé Lluveras <aljullu@gmail.com>

* Address feedback

* Moar bundle size

* Another notice

* Tweak text

Co-authored-by: Albert Juhé Lluveras <aljullu@gmail.com>
2020-03-20 12:48:11 -04:00
Mike Jolley cba3b9712f Add checkout skeleton whilst loading (https://github.com/woocommerce/woocommerce-blocks/pull/1995)
* Add checkout skeleton as loading state and remove placeholder text from save method

* Hide skeleton when not loading

* add loading class

* Update snap
2020-03-19 10:39:04 +00:00
Mike Jolley 01602f90bf Implement "return to cart" and "place order" buttons on checkout (https://github.com/woocommerce/woocommerce-blocks/pull/1926)
* Add back icon

* Add cart URL constant

* Add button components

* Implement button components into checkout

* Update checkout styles to match mockup incl updates to margins and padding

* Add options to control return to cart link

* Use checkout context

* Update snapshot

* Update context

* href

* Color/arrow styling

* Implement select instead of open URL field

* Add notice and updated settings control

* Show notice conditonally

* Store permalinks to avoid extra API requests, and get pages via API

* Update snapshots

* Fix double layout conflict

* Switch back to ID and add permalink via block setting

* snaps

* Fix snapshot; add default shape for pages

* Feedback

* Better undefined handling

* Update assets/js/blocks/cart-checkout/checkout/block.js

Co-Authored-By: Darren Ethier <darren@roughsmootheng.in>

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-03-16 16:38:24 +00:00
Albert Juhé Lluveras bef5514044 Fix IE11 issues with the Checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/1941)
* Refactor useShippingRates so it doesn't use Object.fromEntries

* Refactor Checkout form CSS so it doesn't use grid autopositioning

* Fix Payment Methods title occupying too much space in IE11

* Fix payment methods tab icons not centered in IE11
2020-03-13 15:41:04 +01:00
Darren Ethier 74fe220f89 Add new hooks related to payment methods and checkout and remove obsolete. (https://github.com/woocommerce/woocommerce-blocks/pull/1929)
* add various hooks and improve hooks folder structure

- Also restructures hooks directory to make things a bit more organized
- Add useStoreOrder placeholder (followed up in future pull)
- Add useBillingData hook.

* implement usePaymentMethodInterface hook in payment method components

* remove obsolete hooks and implement new checkout context hooks

- add useCheckoutSubmit which exposes checkout submit button interface
- add useCheckoutRedirectUrl which exposes checkout redirect url interface

* add alias for `@woocommerce/base-utils` to jest config

* use consistent variable names for payment method id
2020-03-11 06:50:12 -04:00
Darren Ethier 3e355f8ac2 Update payment registration config to include `edit` components (https://github.com/woocommerce/woocommerce-blocks/pull/1928)
* add isEditor to checkotu context and implement in provider usage

* modify configuration expectations for payment method registration api

* update registration of payment methods in demo

* implement new configuration in payment method components

* fix argument order and update jsdocs
2020-03-10 12:35:30 -04:00
Mike Jolley 38890b3ff9 Add "or continue below" separator to checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/1906)
* Update express checkout component to match coding standards doc

* Improve express checkout spacing/styling

* Add continue rule
2020-03-09 15:49:01 +00:00
Darren Ethier 8627b81c16 Add payment method api and components to checkout steps (https://github.com/woocommerce/woocommerce-blocks/pull/1349)
This adds a payment methods api to the checkout block that allows for extension to register payment methods with the block.
2020-01-06 17:28:09 -05:00