Commit Graph

743 Commits

Author SHA1 Message Date
Seghir Nadir 39ab3070c8 fix double imports 2021-02-11 16:36:24 +01:00
Seghir Nadir d107dc89a9 Allow extensions to extend Cart Item Name in Cart and Checkout. (https://github.com/woocommerce/woocommerce-blocks/pull/3807)
* Add validation function

* Prefix validateElementOrString with __experimental

* Update experimental docs

* Typo

* Update JS docs

* Use an object for applyCheckoutFilter args

* Args doesn't need to be an object

* Wrap validation function execution in a try/catch block

* Only accept strings for the totalLabel filter

* Change applyCheckoutFilter signature

* Add validation function

* Add Product name filter

* rebase

* update second filter call

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2021-02-11 13:40:55 +01:00
Thomas Roberts cb09248b07 Add subtotal and sale badge filters - PR to correct branch (https://github.com/woocommerce/woocommerce-blocks/pull/3826)
* Replace filters with an extendibility API to hook into Cart and Checkout blocks

* Update docs

* Add a validate argument

* Add docs comments

* Add tests

* Add validation function

* Prefix validateElementOrString with __experimental

* Update experimental docs

* Typo

* Update comment

* Update JS docs

* Use an object for applyCheckoutFilter args

* Args doesn't need to be an object

* Wrap validation function execution in a try/catch block

* Only accept strings for the totalLabel filter

* Change applyCheckoutFilter signature

* Apply filters for subtotal and sale badge in CartLineItemRow

* Append suffix to prices and SaleBadge if passed in as a prop

* Add subtotal filter to OrderSummaryItem

* Add tests for OrderSummaryItem and ProductPrice

* Rename test for ProductPrice

* Update checkout filter registration plugin name

* Remove obsolete snapshop

* Remove suffix and change to format

This is because we want to make the entire price string editable, not just the part after it.

* Change formatting on SaleBadge to use createInterpolateElement

* Remove tests that are no longer needed.

* Update ProductPrice tests to reflect changes to format prop

* Check that subtotalPriceFormat contains <price/> in OrderSummaryItem

* Fix cart block styling to stop badges overflowing the container

* Add <price/> placeholder in OrderSummaryItem price filter

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2021-02-10 17:12:47 +00:00
Albert Juhé Lluveras 1a97bf80b0 Replace filters with an extendibility API to hook into Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/3774)
* Replace filters with an extendibility API to hook into Cart and Checkout blocks

* Update docs

* Add a validate argument

* Add docs comments

* Add tests

* Add validation function

* Prefix validateElementOrString with __experimental

* Update experimental docs

* Typo

* Update comment

* Update JS docs

* Use an object for applyCheckoutFilter args

* Args doesn't need to be an object

* Wrap validation function execution in a try/catch block

* Only accept strings for the totalLabel filter

* Change applyCheckoutFilter signature
2021-02-09 17:54:38 +01:00
Albert Juhé Lluveras 77119d9a7e Update Cart and Checkout sidebar design (https://github.com/woocommerce/woocommerce-blocks/pull/3797)
* Fix ShippingRatesControl not honoring renderOption prop

* Update order summary design

* Updates TotalsCoupon design

* Update Cart block sidebar title design

* Make values bold and labels regular in Cart and Checkout sidebar

* Update styles of shipping rates selector and radio control

* Remove unnecessary overflow rule in Panel content

* Fix shipping options in Checkout block

* Add some Twenty Twenty One fixes

* Fix saved payment methods display

* Remove top spacing no longer necessary in order summary quantity badge

* turn Totals title to bold

* Move right padding from product name to item description

* Take left margin off list items in product details

This is because in themes where a left margin is applied to li elements, the product detail/addon gets indented and it does not sit flush with the edge of the product details container. Adding this rule to the main wc-block-components-product-details  rule will stop other themes indenting <li>s

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
2021-02-09 09:10:45 +01:00
Seghir Nadir 99b78a1c9a add price package (https://github.com/woocommerce/woocommerce-blocks/pull/3790) 2021-02-04 15:30:28 +00:00
Darren Ethier b991486a84 Fix broken shipping Calculator (https://github.com/woocommerce/woocommerce-blocks/pull/3778)
* move shipping-rates-control and shipping totals back into base/components/cart-checkout

* fix notice styling

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2021-02-03 12:35:17 +01:00
Bartosz Budzanowski 14297add88 Update checkout payment methods design. (https://github.com/woocommerce/woocommerce-blocks/pull/3439)
* Add left vertical bar to payments methods step.

* Remove horizontal borders around order notes.

* Add class to order notes component.

We need it to traget that element with CSS.

* Update padding on order notes checkbox to match desing.

* Remove full stop to match the design.

* Add label for not saved payment methods option.

* Remove use new payment radio.

* Always show new ayment methods selector

* Remove editor context for now.

* Add accordion component skeleton.

* Small component refactor.

* Use accordion for new payment options.

* Fix jsdoc.

* Add styling.

* Add input styling.

* Hide label if we don't have saved methods.

* Cleanup.

* Cleanup and styling.

* Add target class to aid with alignment.

* Update use new payments label styling.

* Update Place Order button location.

* add full stop to payment method copy

* ensure that there is always a (default) selected payment method:
- using `activePaymentMethod` from context
- this ensures there is a default selected on initial render
- and handles any dynamic changes to available payment methods
  - e.g. COD disappearing when change shipping option
- remove unused / redundant selectedMethod prop - context is best

* use tab-based payment UI for 2 or fewer payment methods:
- move saved payment state to payment context; it's shared state needed
  by both PaymentMethodOptions and SavedPaymentMethodOptions
- show previous tabs UI if:
  - customer has no saved payment methods (cards)
  - store has 2 or fewer payment methods available
- when initialising SavedPaymentMethodOptions, only select one if the
  user hasn't selected a real payment method - this ensures radio
  buttons switch correctly between saved card => `Use another`
- remove various props and local state that is no longer required (🤞🏻)

* experimental - styling tweaks for single payment tab (remove "tab" UI)

* Revert "experimental - styling tweaks for single payment tab (remove "tab" UI)"

This reverts commit e09dd4862b97d989d950a9d67672d83e7b8992e4.

* Add single payment method UI.

* Adjust single method styling.

* Add outline and margin to two methods  version.

* Fix gap for order notes on/off option.

* Update Order button spacing CSS.

* Reuse computed values.

* Remove tabs and single payment option.

* We no longer need this test as the UI was changed.

* Fix payment methods labels height.

* Simplify.

* Remove not needed import.

* Typecheck an option.

* Refactor code.

* Rename.

* Rename.

* Update typdefs.

* Remove border for add order notes.

* Correct spacing for radio-button and label.

* Add simple test. Switch to payment method.

* Update style.

Co-authored-by: Rua Haszard <rua.haszard@automattic.com>
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2021-02-02 05:51:47 +01:00
Bartosz Budzanowski a0eb52d32b Introduce payment gateway feature check for cart content. (https://github.com/woocommerce/woocommerce-blocks/pull/3719)
* Add supports data to payment methods abstractions. Implement in Stripe.

* Add capabilities to the payment gateway.

* Payment requirements in cart schema.

* Supported features format update.

* Formatting.

* Check required payment features.

* Refactor capabilieties check.

* No need for the cart parameter.

* Allow external modifiacation of features capability.

* Use ExtendRestApi to inject payment requirements into cart endpoint.

* Simplify the code.

* Enable more integrations.

* Enable Stripe payment request.

* Move  the filter to a more correc location.

* Add features check.

* Update typedefs and documentation.

* Update tests with new functionality.

* Style fixes.
2021-01-29 07:28:44 +01:00
Mike Jolley 7ae87ca367 Subscriptions Shipping Packages Integration Points (https://github.com/woocommerce/woocommerce-blocks/pull/3687)
* Expose schemas

* Accept strings for select shipping rate

* strings are allowed

* Refactor shipping package to hold it's own state

* Add extension data to cart hook

* Progress but state is broken

* Move state back to hook

* Progress but state is broken

* use shipping hook updates

* Fix re-render issue

* hide x1

* Shipping slot fill

* Working slot fills

* Do not export package

* Update extend usage in unit tests

* update mock test data

* Package per slotfill

* Resolved merge conflicts

* Update assets/js/blocks/cart-checkout/subscriptions-integration.js

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>

* rename slot

* deriveSelectedRates return doc

* useCallback in throwError

* final class ExtendRestApi

* spacing

* Move shipping rate selection to package level

* remove const for counts

* Remove schemas from extend

* unused use

* move to a single fill for packages

* add todos

* move subs code

* fix extra extensions

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2021-01-28 15:24:01 +01:00
Raluca Stan 23ac1073ff Fix color for BlockErrorBoundry (https://github.com/woocommerce/woocommerce-blocks/pull/3738)
* Fix color for BlockErrorBoundry

The new color ensures readability on both light and dark themes.

* Remove spaces from scss file
2021-01-27 14:10:58 +01:00
Thomas Roberts 49a56e27ee Add subtotal to cart and checkout and update the CartLineItem component with new styles (https://github.com/woocommerce/woocommerce-blocks/pull/3734)
* Create new vars to differentiate between single and multiple item price

This is because we need to display the subtotal of the item AND the total (subtotal * quantity)

* Add subtotal and move quantity picker

As per the new designs, the quantity picker should be moved below the product metadata, and the product subtotals should appear below the product name.

* Move line item total to top of grid on mobile/medium/small

* Remove CSS for trash icon that is no longer used.

* Remove link style colour override from product name and make total bold

* Remove quantity column from CartLineItem

This is because the quantity picker is now displayed below the product metadata and name.

* Fix margins around quantity picker and its width

* Always disable link to product in OrderSummaryItem

* Add single price below product name in OrderSummaryItem

* Add styles for new OrderItemSummary design

* Move total into its own "column"

This is to stop product description text flowing under the total and making it look untidy.

* Add styles to cater for total price being its own column

* Convert precision after multiplication instead of before

* Remove unnecessary div from OrderSummaryItem

* Remove line height from product names on order summary

* Add more margin to the bottom of the product metadata div

* Delete trash icon

* Only remove margin from the bottom of last product-details

* Move quantity input to below product name in cart skeleton

* Add placeholder for individual price to Cart skeleton
2021-01-27 11:34:59 +00:00
Albert Juhé Lluveras 4ae28daca0 Honor hidden property of cart item data and add support for experimenal property (https://github.com/woocommerce/woocommerce-blocks/pull/3732)
* Honor hidden property of cart item data and add support for experimental property

* Add docs to experimental property

* Typo

* Add protection in ProductDetails for the case where 'details' is not an array

* Update ProductDetails so it works properly in cases where 'name' is not provided

* Add snapshot testing to ProductDetails
2021-01-26 15:50:19 +01:00
Thomas Roberts 96e3ff9662 Change payment processing for subscriptions (https://github.com/woocommerce/woocommerce-blocks/pull/3686)
* Remove savePaymentInfo check when displaying payment methods

This is because the savePaymentInfo is derived from whether the save payment method checkbox shows. This check doesn't make sense to do because it's not a good indicator of whether the payment method is enabled. Subscriptions for example hides the checkbox because it is implied that the method will be saved. We should instead rely on the server-side to only send permitted saved payment methods.

* Add safely_get_request_payment_method

This will allow us to try to get the payment method if it was passed in the request, but will default to an empty string if not. This is different to get_request_payment_method because it doesn't throw any errors. We need it to be different because get_request_payment_method is used when the order definitely needs payment (so a normal checkout scenario, vs. a £0 subscription checkout)

* Add action to update order meta when checking out

This is needed because some extensions rely on this action to add their information to the metadata of order items.

* Remove safely_get_request_payment_method

This is no longer needed.

* Remove @since from experimental hook

* Add PHPDoc for new update_order_meta hook

* Document use of experimental hook

* Reinstate the check for allowing saved cards

* Add method to Stripe integration to determine if saved_cards is enabled

* Add new field to get_payment_method_data

This adds displaySavePaymentMethodCheckbox which will be used to determine if the checkbox to save payment methods should display.

* Add displaySavePaymentMethodCheckbox option to client

This will determine whether the "Save payment information" checkbox will be displayed.

* Add requiresSaving option to Stripe payment method data

This is informed by the saved_cards option and the result of the wc_stripe_display_save_payment_method_checkbox filter.

* Rename displaySavePaymentMethodCheckbox to requiresSaving & fix logic

* Revert negation on display_save_payment method_checkbox filter & rename

We are going to rename the properties we use to determine whether saved cards are shown, or whether the save payment method checkbox is shown, so that their names are more descriptive of what they are for.

* Rename allowSavedCards and requiresSaving in Stripe integration

* Rename savePaymentInfo&requiresSaving to showSavedCards & showSaveOption

This is so we can hide the checkbox independently of hiding the saved payment methods.

* Show deprecated message if payment methods use savePaymentInfo

This is because we are leaving it in to enable backward compatibility but payment methods registering using this should be informed of the change in case it gets removed.

* Update Stripe typedefs and keys of supports object

* Show customer payment methods if showSavedCards is true on the method

* Make PaymentMethodTab accept showSaveOption prop

This will allow us to show the save checkbox only if the payment method says it should be shown.

* Update tests to use new keys in supports when reg'ing payment methods

* Add optional chaining when validating payment method config

This makes the code a little tidier :)

* Update assets/js/blocks-registry/payment-methods/payment-method-config.js

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>

* Add more information to deprecated call in payment method config

* Fix lint error

* Fix prop types for PaymentMethodTab

* Add information about supports on payment methods to docs

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2021-01-24 14:59:13 +01:00
Albert Juhé Lluveras 03b03380d3 Allow extensions to filter Total label (https://github.com/woocommerce/woocommerce-blocks/pull/3716)
* Allow extensions to filter totals label

* Add docs
2021-01-21 15:45:31 +01:00
Seghir Nadir 5b2b753100 Move Total components to checkout package (https://github.com/woocommerce/woocommerce-blocks/pull/3671)
* move items to package

* move components to package

* fix dep issue

* pass down classname

* move Panel and Price utils

* expose extensions

* fix import

* move cart call to inside slot

* fix unit tests

* fixes after rebase

* move ShippingRatesControl into packages/checkout

This fixes the `wc-blocks-checkout` circular dependency because `Package` was importing from `@woocommerce/checkout`.

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2021-01-20 21:35:53 +01:00
Raluca Stan ed0a440274 add missing aria-label for stars image in review-list-item component (https://github.com/woocommerce/woocommerce-blocks/pull/3706) 2021-01-20 13:45:25 +01:00
Darren Ethier b4507d3b92 Fix circular dependencies (https://github.com/woocommerce/woocommerce-blocks/pull/3704)
* fix circular dependency in text-input

* fix circular dependency in chip component

* fix circular dependencies in AddressForm component

* fix circular dependencies in product-list

* fix circular dependencies in hooks

* fix circular dependencies in context

* Fix circular dependencies in components/cart-checkout

* fix use-checkout-submit test

- can’t mock the hook alias anymore
- account for undefined object returned from `usePaymentMethods`
2021-01-19 10:55:44 -05:00
Mike Jolley 8c98c1eaac Support for multiple fee rows in the cart (https://github.com/woocommerce/woocommerce-blocks/pull/3678)
* Inject the routes controller

* Cart totals need to be calculated on cart routes or fees will be missing

* Add fees to schema and response

* Add fees to useStoreCart

* Fix styling of multiple fee rows

* Fix test shape
2021-01-13 16:57:42 +00:00
Albert Juhé Lluveras 2c8d85d18d Cart & Checkout blocks: print all item data and update variation designs (https://github.com/woocommerce/woocommerce-blocks/pull/3665)
* Cart and Checkout blocks: show all item data and update variations design

* Add class with detail name to product details
2021-01-12 11:04:53 +01:00
David Levin f97c5b8264 Update input colors and alignment (https://github.com/woocommerce/woocommerce-blocks/pull/3597)
* update input colors for dark and light mode + tweak padding and alignment

* update light input dropdown text color

* Fix lint errors

* Fix  package lock.

* Use input-text-active for select options

* Make sizes responsive in radio control

* Unify border colors of text inputs, checkboxes and radio controls

* Unify radio control sizes in mobile/desktop

Co-authored-by: David Levin <davidlevin@Davids-MacBook-Pro-2.local>
Co-authored-by: budzanowski <bartosz.budzanowski@gmail.com>
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2021-01-12 10:09:47 +01:00
Albert Juhé Lluveras b4a37aebd6 Create @woocommerce/checkout to export components to a global (https://github.com/woocommerce/woocommerce-blocks/pull/3654)
* add plugin area

* add invisible errorBoundary

* introduce slot

* change name to OrderMeta

* fix rebase

* wip

* create checkout file

* Import ExperimentalOrderMeta from @woocommerce/checkout

* Rename wc-checkout-packages handle to wc-blocks-checkout

* Only import wc-blocks-checkout in the feature plugin

* Move checkout package to packages folder

* Add @woocommerce/blocks-checkout to tsconfig

* Move TotalsItem to @woocommerce/checkout

* Use Fragment short syntax

* Remove example code

* Honor renderError prop in BlockErrorBoundary

* Rename error boundary

* Add example code

This reverts commit 9b6af7178cbef05589779ef7f5a750d53e7fc8cf.

* Revert "Add example code"

This reverts commit 2f50349692f53c5bb143516365eee7a98d580dfd.

* Add @woocommerce/blocks-checkout to jest config

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2021-01-07 13:02:21 +01:00
Albert Juhé Lluveras fb5c0f3af2 Add tests to AddressForm (https://github.com/woocommerce/woocommerce-blocks/pull/3621)
* Remove unnecessary async key in read more tests

* Add tests to AddressForm component
2021-01-06 10:22:51 +01:00
Albert Juhé Lluveras de2796ca4e Convert saved payment methods token to a string (https://github.com/woocommerce/woocommerce-blocks/pull/3627)
* Allow integers in payment_data values

* Revert "Allow integers in payment_data values"

This reverts commit b7f2ca4a5b696091afe796f47e84f584a0b27d9e.

* Enforce payment tokens to be strings
2021-01-05 10:51:23 +01:00
Albert Juhé Lluveras 257c970726 Don't add the hidden class name to elements with the hidden attribute (https://github.com/woocommerce/woocommerce-blocks/pull/3582)
* Revert "Add 'hidden' class name when using the 'hidden' attribute"

This reverts commit 0332e33a60a516506718e8ed4659e45d32dc80a4.

* Add styles for hidden panel content

* Add docs about account for the hidden attribute in styles

* Update docs/theming/README.md

Co-authored-by: Rua Haszard <rua.haszard@automattic.com>

Co-authored-by: Rua Haszard <rua.haszard@automattic.com>
2020-12-22 10:26:59 +01:00
Seghir Nadir 94d8d580a2 Fix isDefault on Buttons and switch Toolbar with ToolbarGroup (https://github.com/woocommerce/woocommerce-blocks/pull/3577)
* Fix isDefault notice

* fix Toolbar to ToolbarGroup
2020-12-21 17:03:54 +01:00
Albert Juhé Lluveras 7ea0aa4fbc Use em for coupon code button height (https://github.com/woocommerce/woocommerce-blocks/pull/3575) 2020-12-21 14:49:43 +01:00
Albert Juhé Lluveras 4197cfdb2d Add 'hidden' class name when using the 'hidden' attribute (https://github.com/woocommerce/woocommerce-blocks/pull/3569) 2020-12-21 14:47:51 +01:00
Albert Juhé Lluveras 5d01c8d781 Merge markup from Product Title atomic block and ProductName component (https://github.com/woocommerce/woocommerce-blocks/pull/3562)
* Merge markup from ProductTitle atomic block and ProductName component

* Add test

* Remove duplicate decodeEntities call

* Minor improvements
2020-12-21 14:45:27 +01:00
Albert Juhé Lluveras e3d97d7387 Fix Fees not visible in Cart & Checkout blocks when order doesn't need shipping (https://github.com/woocommerce/woocommerce-blocks/pull/3521) 2020-12-21 14:15:27 +01:00
Bartosz Budzanowski e2e934ec46 Remove customer saved payment methods from context if they are not enabled. (https://github.com/woocommerce/woocommerce-blocks/pull/3551)
* For gateways with disabled saved payment metods, don't show saved items in context.

* Fix style.

* Update name.

* Simplify and fix.

* Whitespace.

* Revert for another PR.

* Formatting fix.
2020-12-21 12:07:31 +01:00
Mike Jolley 55f0bc73a6 Fix Address Validation in the Store API and client (https://github.com/woocommerce/woocommerce-blocks/pull/3552)
* Trim input values before validation on Checkout

* Fixes required field checking at schema level

* Require country during checkout and ensure values are formatted

* Add handling for rest_invalid_param messages

* Remove prepare_address_fields - handled by schema

* Add address validation to OrderController

* Implement address validation

* Error errors from all endpoints more gracefully

* update non-true description

* required prop

* Update tests

* Fix equalityFn so updates are triggered when address changes

* Remove debounce so fields update if context changes

* Update src/StoreApi/Schemas/AbstractAddressSchema.php

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

* Add missing wp_unslash

* Validate allowed countries should block checkout if no countries are allowed

* Type in locale variable

* Update assets/js/base/utils/errors.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Fix validator calls

* Remove refererence

* Restore onChange order

* eslint fix

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-12-17 14:52:44 +00:00
Thomas Roberts ef081ef8a2 Fix select inputs when dark mode is enabled in Twenty Twenty-One (https://github.com/woocommerce/woocommerce-blocks/pull/3554)
* Add CSS rules for dark mode theme setting in Twenty Twenty-One

This is required because the theme may be set to dark mode independently of the browser. The reason we need two rules for this is because the checkout block can be set to have dark mode inputs too, so this rule doesn't need to apply then.

* Add theme-specific class for Twenty Twenty-One
2020-12-16 16:01:46 +00:00
Mike Jolley f459ad664c Switch to Fragment Short Syntax (`<>`) (https://github.com/woocommerce/woocommerce-blocks/pull/3536)
* Replace Fragment with shorthand

* Update eslint rules for short fragment syntax
2020-12-14 11:54:34 +00:00
Albert Juhé Lluveras 02174c5431 Add stories to Cart & Checkout totals components (https://github.com/woocommerce/woocommerce-blocks/pull/3533)
* Add stories to Cart & Checkout totals components

* Create @woocommerce/knobs alias

* Update TotalsFooterItem default values so they are in line with other stories
2020-12-14 09:15:50 +01:00
Rua Haszard 87d9b01dfb Add storybook demo for CheckboxControl (https://github.com/woocommerce/woocommerce-blocks/pull/3030)
* story for CheckboxControl aka Checkbox

* Rename exported story to Default and use correct component name

This keeps our stories more consistent
2020-12-10 10:38:26 +00:00
Albert Juhé Lluveras bc40247d70 Rename Cart & Checkout totals components (https://github.com/woocommerce/woocommerce-blocks/pull/3520)
* Rename TotalsCouponCodeInput to TotalsCoupon

* Rename SubtotalsItem to Subtotal

* Rename TotalsDiscountItem to TotalsDiscount

* Rename TotalsFeesItem to TotalsFess

* Rename TotalsFooterItem folder

* Rename TotalsItem folder

* Rename TotalsShippingItem to TotalsShipping

* Rename TotalsTaxesItem to TotalsTaxes
2020-12-09 08:29:34 +01:00
Seghir Nadir 231d49406a Introduce pluginArea in Cart and Checkout (https://github.com/woocommerce/woocommerce-blocks/pull/3498)
* add plugin area

* add invisible errorBoundary

* move PluginArea to CheckoutProvider
2020-12-04 10:52:52 +01:00
Albert Juhé Lluveras 2e5bcca7c6 Update @wordpress/components to v. 11.1.1 and @wordpress/base-styles to v. 3.2.0 (https://github.com/woocommerce/woocommerce-blocks/pull/3457)
* Update @wordpress/components and @wordpress/base-styles

* Fix JS warning in Select/downshift

* Remove color definitions that are now imported from @wordpress/base-styles. Fixes woocommerce/woocommerce-blocks#3311

* Use -unit values from @wordpress/base-styles. Fixes woocommerce/woocommerce-blocks#3313

* Update snapshots

* Fix payment methods test

* Don't extract dependencies that are not available in WP 5.3

* Avoid extracting @wordpress/compose since last version doesn't have resize observer

* Remove unnecessary uses of @wordpress/compose in a frontend scripts

* Add missing spaces
2020-12-03 14:04:25 +01:00
Albert Juhé Lluveras 5683ed1e54 Fix c notice close button color in Twenty Twenty One dark mode (https://github.com/woocommerce/woocommerce-blocks/pull/3472) 2020-12-02 13:09:57 +01:00
Albert Juhé Lluveras 281cc99291 Create IE11 SCSS mixin (https://github.com/woocommerce/woocommerce-blocks/pull/3473) 2020-12-01 09:04:52 +01:00
opr 704fab02d6 Reverse logic for hiding product name in checkout sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/3464)
The hasLink prop was removed from ProductName and disabled is used instead, this change makes the variable name more descriptive, and uses disabled to signal if the ProductName should link or not.
2020-11-25 12:39:02 +00:00
opr 404e669f72 Change left margin of notice's dismiss icon to auto (https://github.com/woocommerce/woocommerce-blocks/pull/3455)
This is needed to ensure the dismiss icon in notices will always be as far over to the right of the parent container as possible.
2020-11-25 11:50:59 +00:00
Albert Juhé Lluveras 94064c1597 Fix checkbox and textarea styles in Twenty Twenty One when it has dark controls (https://github.com/woocommerce/woocommerce-blocks/pull/3450)
* Fix textarea styles in Twenty Twenty One when has dark controls

* Fix checkbox styles in Twenty Twenty One when has dark controls
2020-11-23 15:20:31 -05:00
Albert Juhé Lluveras e125dfd97b Fix radio controls and checkboxes in Twenty Twenty One dark theme (https://github.com/woocommerce/woocommerce-blocks/pull/3446)
* Fix radio controls in Twenty Twenty One dark theme

* Fix checkbox control in Twenty Twenty One dark theme
2020-11-23 14:43:36 -05:00
Mike Jolley cf9dc1b6bf Fix Twenty Twenty One Button and Placeholder Styling (https://github.com/woocommerce/woocommerce-blocks/pull/3443)
* Reset product list padding

* Adjust placeholder color if css variable exists

This is 2021 specific but may become more prominant.

* FIx editor button styles in 2021

* Adjust button sizes based on columns

* Adjust padding
2020-11-23 14:21:36 -05:00
Albert Juhé Lluveras 5a38fca235 Fix Twenty Twenty One Price filter, Active filters and radio control styling (https://github.com/woocommerce/woocommerce-blocks/pull/3444)
* Fix price slider styling in Twenty Twenty One

* Fix price slider styling in Twenty Twenty One

* Fix radio control styling in Twenty Twenty One and remove usage of mixin

* Force 0 padding on active filters list
2020-11-23 17:30:27 +01:00
opr fcfe5ee7dc Stop hidden products from being linked in cart and checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/3415)
* Add catalog_visibility to CartItemSchema.php

This is used to get whether the product is visible in the catalogue, visible in the shop only, visible in search results only, or visible everywhere. We need to know this so we can pass it to the ProductImage and ProductName components.

* Remove links from CartLineItemRow if not visible in catalogue

Added catalog_visibility to lineItems prop, and when the product is not visible in the catalogue do not wrap product image in a link. Also pass down the hasLink prop to ProductName.

* Add hasLink prop to ProductName

When this prop is false we should not output the link around the product name. This is for when the product is hidden from the catalogue but we still want to show its name somewhere.

* Add tests and storybook for ProductName

* Add catalog_visibility check to OrderSummaryItem

When the catalogue visibility of a product is set to hidden or search, then the product name in the checkout sidebar should not be hyperlinked.

* Reverse logic for hiding link on product image & disabling link on name

Following a point from @budzanowski we do not need the hasLink prop, making use of disabled is probably a better idea.

* Remove tabindex from a in ProductName & output span if name is disabled

This change removes the need to pass a tabindex to the a in ProductName. This is because a disabled ProductName will now never output an a tag. When the ProductName is disabled a span is output instead, which has no tabindex by default.

This change also reverses the logic to decide whether the a or span should be output so as to make the code more readable and flow better.

* Update storybook and tests/snapshots for ProductName
2020-11-23 13:03:08 +00:00
Darren Ethier 36d4123ba2 if express payment is active, don’t show payment method options (https://github.com/woocommerce/woocommerce-blocks/pull/3432) 2020-11-20 12:45:12 -05:00
opr 5ded3a9058 Ensure "Add a note to your order" section is styled correctly when disabled (https://github.com/woocommerce/woocommerce-blocks/pull/3427)
* Pass disabled prop to FormStep in order-notes-step.js

This way we can add the disabled class to the div or fieldset rendered by FormStep.

* Add disabled class & style for disabled FormStep components

Allows us to style disabled elements that cannot have the disabled attribute (divs) the same way as disabled fieldsets are.

* Update test snapshot for FormStep

This is because we added a class to the div/fieldset element when it is disabled.

* Remove redundant selector from form-step styles

Because we now add the --disabled modifier to the class, we no longer need the disabled selector. The new class-name based selector covers both fieldsets and divs.
2020-11-20 10:48:26 +00:00
opr 897abcb73a Prevent checkout step heading text overlapping actual heading on small viewports (https://github.com/woocommerce/woocommerce-blocks/pull/3425)
* Change style rules for checkout step headings

This is required because when the checkout heading text is too long it collided and overlapped the heading content due to its absolute position. In this commit we add a grey line to the left of the checkout step heading to ensure consistency with the checkout step container's styling.

* Remove position rule from checkout-step heading content

This was no longer needed as it nothing relied on the position of this element.
2020-11-20 10:44:24 +00:00
Rua Haszard 8395954c7a Support a plain js config argument to payment method registration APIs (https://github.com/woocommerce/woocommerce-blocks/pull/3404)
* handle plain options passed to registerPaymentMethod:
- no need for a callback dance
- support the previous API: if a function is passed, call it as before

* update Stripe for new registerPaymentMethod interface

* update docs & all built-in payment methods to simpler API

* handle plain options arg to registerExpressPaymentMethod:
- add legacy fallback if passed a function
- update stripe express payment method
- update docs
- remove unused `assertValidPaymentMethodCreator` util

* use correct case for `JavaScript`

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* typedefs for payment registration options + tidies for regular methods

* typedef express payment options arg & tidy stripe/payment-request:
- use camelCase for config instance (not a constructor/type)

* mention typedefs in payment method dev docs

* use @wordpress/deprecated to warn if callback passed to payment register

* update unit tests for new payment method API

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-11-19 11:06:33 +13:00
Mike Jolley ec22a5c6c4 Cart and checkout should respect the global "Hide shipping costs until an address is entered" setting (https://github.com/woocommerce/woocommerce-blocks/pull/3383)
* Remove custom fieldconfig for shipping calculator so required fields for shipping are collected

* If the store config requires an address before shipping, do not return rates or totals

Totals, calculated by the cart, would be set to 0 in this scenario which could lead to customer confusion (why is the rate $10 but shipping shown as $0?)

* The shipping total row is missing a border

* Revert "If the store config requires an address before shipping, do not return rates or totals"

This reverts commit f3a4f24f5785392eb43bfc69a5548d398c47d8bb.

* Add hasCalculatedShipping to schema and hooks

* Show shipping notices with updated wording based on if shipping has calculated yet or not

* Refactor shipping row display to use new API props

* Remove block level isShippingCostHidden

* fix test

* Correct the math in the shipping preview in cart

* Document null

* Remove test—this option no longer exists

* Remove unused settings/constants
2020-11-17 11:58:38 +00:00
Albert Juhé Lluveras 109a7c3f54 Fix React hook dependency warnings in filter an All Products blocks (https://github.com/woocommerce/woocommerce-blocks/pull/3285)
* Fix wrong JSDocs

* Fix React hook dependency warnings in usePrevious hook

* Fix React hook dependency warnings in Filter an All Products blocks
2020-10-27 16:39:08 +01:00
Albert Juhé Lluveras 55e1a15149 Fix React hook dependency warnings in Cart & Checkout blocks + withAttributes HOC (https://github.com/woocommerce/woocommerce-blocks/pull/3314)
* Fix React hook dependency warnings in Cart & Checkout blocks

* Fix React hook dependency warnings in withAttributes HOC

* Fix select validation

* Fix test

* Remove unnecessary optional chaining

* Undo merge of two useEffects
2020-10-27 15:37:18 +01:00
Bartosz Budzanowski abed796bd6 Respect Enable Taxes setting for checkout block taxe display. (https://github.com/woocommerce/woocommerce-blocks/pull/3291)
* Respect Enable Taxes setting for checkout block taxes display.

* Refactor logic into a named const.
2020-10-26 11:34:30 +01:00
Albert Juhé Lluveras 10ceda5851 Use @wordpress/base-styles and @automattic/color-studio as a base for our styles (https://github.com/woocommerce/woocommerce-blocks/pull/3300)
* Use colors variables instead of hardcoded values when possible

* Update WC colors from @automattic/color-studio

* Decrease specificity of price-slider CSS selectors

* Update colors to WC purple

* Update bright colors

* Update grays

* Update blacks and whites

* Add @todo comment

* Remove unnecessary blank line

* Remove purple color from price slider handle

* Fix colors not shown in SVG background

* Remove unnecessary box-shadow declaration

* Add theming docs

* Refactor/remove SCSS variables

* Add @todo comment to breakpoints

* Update package-lock.json
2020-10-22 12:40:32 +02:00
Albert Juhé Lluveras 89a1ec7206 Ensure new payment methods are only displayed when no saved payment method is selected (https://github.com/woocommerce/woocommerce-blocks/pull/3247)
* Ensure new payment methods are only displayed when no saved payment method is selected

* Simplify logic

* Add tests

* Fix wrong props definition in JSDoc

* Use default parameter instead of default prop for functional component (Label)

* Remove usePaymentMethods mock

* Remove NoPaymentMethods mock

* Fix tests
2020-10-12 14:43:52 +02:00
Albert Juhé Lluveras d90d7428bd Restore saved payment method data after closing an express payment method (https://github.com/woocommerce/woocommerce-blocks/pull/3210)
* Restore saved payment method data after closing an exprss payment method

* Fix wrong JSDoc props

* Add tests
2020-10-08 11:21:47 +02:00
Albert Juhé Lluveras e01e191397 Fix wrong propType introduced in woocommerce/woocommerce-blocks#3226 (https://github.com/woocommerce/woocommerce-blocks/pull/3242) 2020-10-06 15:58:41 +02:00
Albert Juhé Lluveras 2f7b0ba3b4 Don't load contents of payment method hidden tabs (https://github.com/woocommerce/woocommerce-blocks/pull/3227) 2020-10-05 15:25:40 +02:00
Albert Juhé Lluveras e486b8b906 Refactor payment methods components (https://github.com/woocommerce/woocommerce-blocks/pull/3226)
* Move 'renderedTabs' to its own component

* Move getRenderedTab to its own component

* Remove 'getPaymentMethod' function

* Fix wrong typedef

* Remove unnecessary useRef

* Simplify NewPaymentMethodTab

* Drop 'New' prefix from components name

* Add JSDocs to new components

* Add propTypes to new components
2020-10-05 13:59:20 +02:00
Albert Juhé Lluveras 1f8ea4f494 Remove selectedToken state from PaymentMethods (https://github.com/woocommerce/woocommerce-blocks/pull/3135) 2020-09-29 10:15:45 +02:00
Rua Haszard 7441ce6eec use the "light" bg colour for dropdown list by default (https://github.com/woocommerce/woocommerce-blocks/pull/3189) 2020-09-28 11:25:22 +02:00
Darren Ethier 1e6abded42 re-enable @wordpress/no-unused-vars-before-return eslint rule and fix violations (https://github.com/woocommerce/woocommerce-blocks/pull/3202) 2020-09-26 17:00:54 -04:00
Darren Ethier ba6a2e2ace re-enable @wordpress/valid-sprintf eslint rule and fix violations (https://github.com/woocommerce/woocommerce-blocks/pull/3201) 2020-09-26 16:05:00 -04:00
Darren Ethier a6750e0388 Fix esLint rule violations for @wordpress/i18n-translator-comments rule. (https://github.com/woocommerce/woocommerce-blocks/pull/3200)
* re-enable linting for @wordpress/i18n-translator-comments rule

* fix violations for the `@wordpress/i18n-translator-comments` eslint rule
2020-09-26 15:38:17 -04:00
renovate[bot] 1dc8442a31 Update dependency wordpress-element to v2.17.1 (https://github.com/woocommerce/woocommerce-blocks/pull/3104)
* Update dependency wordpress-element to v2.17.1

* update experimental function to stable version

Co-authored-by: Renovate Bot <bot@renovateapp.com>
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-09-26 09:51:21 -04:00
Darren Ethier f915c7c8a3 re-enable dependency grouping linting and fix errors (https://github.com/woocommerce/woocommerce-blocks/pull/3167) 2020-09-21 09:43:10 -04:00
Darren Ethier 9115160c2f Enable and fix all jsdoc rule violations (https://github.com/woocommerce/woocommerce-blocks/pull/3168)
* add param jsdocs to satisfy jsdoc require-param rule

* Fix jsdoc-checktypes rule violations

* fix jsdoc/require-param-type rule violations

* fix jsdoc/check-param-names violations

* fix jsdoc/require-property-description rule violations

* fix rule violations for jsdoc/valid-types rule

* fix rule violations for jsdoc/require-property rule

* fix jsdoc/no-undefined-types rule violations

* fix jsdoc/check-types rule violations

* fix jsdoc/require-returns-description rule violation

* enable jsdoc/require-returns-type rule

* fix jsdoc/newline-after-description rule violations
2020-09-20 19:54:08 -04:00
Albert Juhé Lluveras 261844d05b Use noticeContexts from useEmitResponse instead of hardcoded values (https://github.com/woocommerce/woocommerce-blocks/pull/3161) 2020-09-18 14:39:32 -04:00
Albert Juhé Lluveras d641d2e1a4 Don't throw an error when registering a payment method fails (https://github.com/woocommerce/woocommerce-blocks/pull/3134)
* Show all payment methods when it's an admin and let the error boundary handle errors

* Use StoreNoticesContainer in Payment method error boundary so notices have styling

* Filter out saved payment methods for admin users if they don't accept payments

* Simplify update options logic

* For admins, only show payment methods that errored but canPay was not false

* Simplify how new payment method option is appended

* Wrap canMakePayment in a try catch block to handle payment methods that throw an error

* Add an id to payment method error boundary errors

* Add an error boundary to express payment methods

* Hardcode failing content and savePaymentInfo to false if the payment method failed

* Add some new comments

* Add a notice instead of registering the payment method if it fails and user is admin

* Throw error early if stripe failed to load

* Split express and standard payment method error notices

* Don't add payment methods in the editor and instead add a notice

* Fix error id

* Use noticeContext constant

* Add missing JSdoc param

* Remove unnecessary removeNotice
2020-09-18 12:27:54 +02:00
Albert Juhé Lluveras a285376e96 Fix State label for Spain (https://github.com/woocommerce/woocommerce-blocks/pull/3147) 2020-09-16 10:50:24 +02:00
Albert Juhé Lluveras 76ebf9c860 Merge ProductPrice atomic block and component (https://github.com/woocommerce/woocommerce-blocks/pull/3065)
* Merge ProductPrice atomic block and component

* Update assets/js/atomic/blocks/product-elements/price/block.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Update assets/js/atomic/blocks/product-elements/price/block.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* If product price component has alignment, make it a block

* Make ProductPrice propTypes more specific

* Add align prop to loading product price

* Add stories to ProductPrice component

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-09-14 12:56:10 +02:00
Darren Ethier 69ba8161b6 Add @woocommerce/eslint-plugin dependency (https://github.com/woocommerce/woocommerce-blocks/pull/3115)
* convert eslint config to use @woocommerce/eslint-plugin

- removes unnecessary dependencies
- adds e2e-tests/specs to eslint ignore (they are automatically generated)
- turns off rules that will be handled in subsequent pulls (to avoid a mammoth changeset for review).
- NOTE: prettier config needs left in because of a bug with the existing version of `@wordpress/eslint-plugin` pulled in (fixed in https://github.com/WordPress/gutenberg/pull/25068) so I left the file for now.

* prettier fixes.

* remove obsolete plugin and fixes for eslint update

This branch brings an update to eslint which also changes some syntax with plugins. So this commit:

- fixes featuer-flag plugin syntax.
- removed obsolete dependency-group plugin (which is now in the `@woocommerce/eslint-plugin` configuration.

* add to-do comment

* fixes for test runs

- this also converts our e2e test scripts to use `wp-script test:e2e`, an advantage of this is it will load CHROMIUM on demand for the e2e test run.

* fixes for test runs

- this also converts our e2e test scripts to use `wp-script test:e2e`, an advantage of this is it will load CHROMIUM on demand for the e2e test run.

* include prettier alias as a dependency

This has to be done because prettier is installed with storybook and thus the alias setup in `@wordpress/scripts` is over-ridden by the storybook import.

* another attempt at e2e-test-fix

* add some debugging and temporarily just add one e2e config test for travis

* more debugging

* try installing full puppeteer and see if fixes

* fix package-lock?

* setupSettings separately from other fixture loading

* add debugging of files

* add another console.log (hopefully trigger travis)

* split out blockPage creation to it’s own as well

* fixed! remove debugging and re-enable travis configs for entire test suite

* fix config and rename e2e-tests to e2e

- fixes the failing product-search test
- tests/e2e-tests was redundant, I changed to `tests/e2e` (this follows a file pattern change made in woocommerce core as well).

* add todo for some eslint properties

* remove unnecessary early function execution

* revert earlier commit and remove duplicate call to createBlockPages
2020-09-07 13:31:10 -04:00
Albert Juhé Lluveras a9bcdb7d08 Create DebouncedValidatedTextInput component (https://github.com/woocommerce/woocommerce-blocks/pull/3108)
* Fix wrong Form component name

* Split CheckoutForm into smaller components for each step

* Centralize call to useCheckoutAddress

* Create DebouncedValidatedTextInput component

* Rename some variables
2020-09-07 19:03:04 +02:00
Albert Juhé Lluveras 1e75a866d8 Split Checkout form component into smaller files (II) (https://github.com/woocommerce/woocommerce-blocks/pull/3106)
* Fix wrong Form component name

* Split CheckoutForm into smaller components for each step

* Centralize call to useCheckoutAddress
2020-09-07 17:43:05 +02:00
Albert Juhé Lluveras fa593359bf Fix Cart&Checkout layout broken in some themes (https://github.com/woocommerce/woocommerce-blocks/pull/3111) 2020-09-07 17:39:53 +02:00
Albert Juhé Lluveras dfd57b0ee8 useMemo for complex computations in Country/State inputs (https://github.com/woocommerce/woocommerce-blocks/pull/3107) 2020-09-03 10:02:26 +02:00
Albert Juhé Lluveras 80400e50da Split Checkout block component into smaller files (https://github.com/woocommerce/woocommerce-blocks/pull/3062)
* Rename CheckoutForm to Form

* Create CheckoutForm component

* Simplify directory structure

* Add docs about class name changes

* Add PropTypes to CheckoutForm

* Update skeleton class name

* Extract LoginPrompt

* Move loginToCheckoutUrl to a constant

* Move replaced class name docs to 3.4.0 specific file
2020-08-31 12:17:42 +02:00
Rua Haszard 77aa2a33a3 clarify intentions / purpose of different component folders in docs (https://github.com/woocommerce/woocommerce-blocks/pull/3025)
* add high-level docs about our components & remove stale detail info

* use current collection/folder naming in docs:
- let's rename js/components in a separate PR
- split paragraphs on to separate lines to improve future diffs

* rename storybook.md => components.md and update link/summary

* tweak component collection docs:
- base have more stringent requirements, since they can be used anywhere
- editor components are less strict and can assume editor context

* clarify js/base/components readme in line with main doc

* remove line about editor components being specialised to woo blocks
2020-08-27 08:15:16 +12:00
Albert Juhé Lluveras 8bb217cec6 Show express payment methods in the Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/3004)
* Shown express payment methods in Cart block

* Fixes

* Create usePositionRelativeToViewport hook

* Typo

* Style fixes

* Remove footer push div

* Styling fixes

* Improve code clarity

* Split ExpressCheckoutFormControl into two components

* Rename visibilityObserver to referenceElement

* Replace 'useEffect' with 'useLayoutEffect'

* Add tests for usePositionRelativeToViewport

* Self-closing div

* Add explanatory comment

* Create a shim for IntersectionObserver

* Update express payment components class names

* Add todo comment to remove IntersectionObserver shim when we drop IE11 support
2020-08-20 16:14:12 +02:00
Seghir Nadir 85ed96b58e Add dark colors support to Cart & Checkout controls (https://github.com/woocommerce/woocommerce-blocks/pull/2981)
* add dark styles setting

* add attributes to blocks

* add colors to input and select

* cover rest of items

* tweak select contrast

* fix ie11 issue

* fix focus

* include checkbox styles

* fix extra spacing after phone number

* add styling to quantity selector

* remove extra rule

* remove editor styles for radio control

* use border-color

* rename variables and classes and wording

* adjust colors

* provide tighter control over colors

* remove redudant outline rule

* add more variables

* add support for order note

* use variables for textarea

* move dark mode panel to last
2020-08-14 12:08:16 +01:00
Albert Juhé Lluveras a16af68975 Hide saved payment methods if their gateway is disabled (https://github.com/woocommerce/woocommerce-blocks/pull/2975)
* Hide saved payment methods if their gateway is disabled

* Fix wrong type-def

* Remove extra blank line

* Rename var

* Use FILTER_VALIDATE_BOOLEAN instead of comparing to 'yes'

* Use data from Payment Method context instead of reading setting from the server

* Use data from Payment Method context instead of reading setting from the server
2020-08-11 15:43:03 +02:00
Albert Juhé Lluveras 339c0532f1 Fix text input and select error styles on focus (https://github.com/woocommerce/woocommerce-blocks/pull/2974) 2020-08-11 11:55:26 +02:00
Seghir Nadir 145db3ff5d fix issue with no margins on phone input (https://github.com/woocommerce/woocommerce-blocks/pull/2989)
* fix issue with overlapping margins

* move styles out of select

* remove extra spacing

* remove extra spacing from cart

* move styles to state input and remove extra position.
2020-08-11 10:00:53 +01:00
Seghir Nadir fc9f6fe71a Use SVG for checkbox (https://github.com/woocommerce/woocommerce-blocks/pull/2320)
* use svg for checkbox

* update borders

* switch to rems

* define a rem function

* fix ie11 issue

* fix focus

* add ie hack

* fix spacing and switch to em

* switch to rem
2020-08-11 09:59:59 +01:00
Rua Haszard e18c036f5e use static pos for payment errors so they push out other content: (https://github.com/woocommerce/woocommerce-blocks/pull/2977)
- default styling for validation errors is absolute
- this requires the layout provides appropriate space for errors
- payment form is too compact to provide room for errors,
  - especially when checkout is narrow due to window or theme
2020-08-07 07:30:27 +12:00
Seghir Nadir 96819fc2d2 account for negative sale values (https://github.com/woocommerce/woocommerce-blocks/pull/2955) 2020-08-05 11:27:59 +01:00
Albert Juhé Lluveras 3d0d6cab87 Add autocapitalize attribute to Address Form fields (https://github.com/woocommerce/woocommerce-blocks/pull/2884)
* Add autocapitalize attribute to Address Form fields

* Set autocapitalize attribute to 'sentences' in address form
2020-08-03 10:53:42 +02:00
Albert Juhé Lluveras 311d8ddf12 Add 'Order notes' to Checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/2877)
* Add Checkout Order notes (UI)

* Add Checkout Order notes (context)

* Add missing useEffect dependencies

* Remove duplicate toggle in editor

* Minor fixes

* Check whether orderNotes have changed before creating a new state object

* Rename showCounter to showStepNumber

* Rename 'onChange' with 'onTextChange'

* Add comment and tests to FormStep component

* Rename 'with-counter' to 'with-step-number'

* Fix wrong prop

* Make it so order notes are persisted when toggling the checkbox

* Update type-defs

* Set showStepNumber default value to true
2020-07-31 17:17:01 +02:00
Mike Jolley 36c1bb7361 Add to cart context provider (https://github.com/woocommerce/woocommerce-blocks/pull/2903)
* Provider progress

* Revert nonce change for debugging

* Working emitters

* Fix dismiss link alignment in notices

* Fix button state and double adds

* Remove old context file

* Add type defs

* Fix context name

* Leftovers from merge

* Hooks up the variation picker to cart context

* Group event emitters in context

* Fix external product display

* Pass product through to VariationAttributes

* Pass around dispatchers

* Update assets/js/base/context/add-to-cart-form/form-state/reducer.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Update assets/js/atomic/blocks/product-elements/add-to-cart/product-types/variable/variation-attributes/attribute-select-control.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Update assets/js/base/context/add-to-cart-form/form-state/reducer.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* remove placeholder comment

* content->container

* Clarify variation method comment

* update comment

* Switch nesting of providers

* Variation attribute utils test coverage

* If nothing is selected yet, just return all variations.

* Comments to explain loops

* Use refs to avoid recalculation of attributes on every render

* Update memo usage

* typo

* move mock data to test file

* Switch to useShallowEqual

* trigger cart fragment refresh after add to cart

* Decode option entities

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-07-30 11:57:22 +01:00
Rua Haszard 2cc98391a0 add hover style to ensure consistent margin/padding for order summary so it doesn't jump on mouseover (https://github.com/woocommerce/woocommerce-blocks/pull/2921)
* add hover style to ensure consistent margin/padding for order summary

* decrease specificity of panel__button hover/active etc styles
2020-07-29 11:50:06 +02:00
Mike Jolley cd9f7e0ccb ⚛️ Introduce Product Element Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2871)
* Product selection when out of context for price and title blocks

* Move product element name/description/icons to constant files

* Add attributes and hocs to all elements

* Standalone block rendering

* Add a placeholder if title has no content

* Revert "Add a placeholder if title has no content"

This reverts commit 29115154b33eedc661ccd3cc758acdbc5041ffbc.

* parentClassName is not always present

* Loading state

* Wrap description in P

* Fixed loading styles when nested

* Maintain product shape in useProductData

* feature gate elements from showing in inserter

* fix feature flag

* include price PR

* edit withProductSelector to be a hoc

* fix lint issue

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2020-07-22 13:20:54 +01:00
Albert Juhé Lluveras ff2f135e7e Make stylesheets order consistent between build and dev (https://github.com/woocommerce/woocommerce-blocks/pull/2818)
* Add specific webpack config for styles

* Remove style.scss file from story

* Fix storybook

* Extract progressbarplugin config

* Add back ignore-loader

* Fix styling entries

* Cleanup

* Simplify webpack-entries.js

* Add appropiate exclude handles to styling config

* Add back MergeExtractFilesPlugin

* Unify style entries suffix

* Fix experimental flag

* Replace MergeExtractFiles plugin with RemoveFiles

* Prevent duplicate reviews frontend scripts

* Fix unnecessary files being created

* Remove editor.js file generate by MiniCssExtractPlugin

* Remove CSS generation from payment methods config

* Remove unnecessary config

* Simplify styling entries name

* Cleanup

* Refactor webpack-entries
2020-07-22 14:05:56 +02:00
Albert Juhé Lluveras a69a50856a Cart & Checkout: fix '0' visible when product stock was 0 and it allowed backorders (https://github.com/woocommerce/woocommerce-blocks/pull/2891) 2020-07-21 17:41:14 +02:00
Albert Juhé Lluveras 4ef64a4453 Fix Credit Card input font size in some themes (https://github.com/woocommerce/woocommerce-blocks/pull/2869)
* Fix Credit Card input font size in some themes

* Fix spacing between credit card icon and input label

* Fix min-width of credit card input fields

* Improvements to the way credit card input fields are resized

* Simplify min-width
2020-07-20 13:56:22 +02:00
Albert Juhé Lluveras d894fed1df Cart block: show products on backorder (https://github.com/woocommerce/woocommerce-blocks/pull/2833)
* Show backorder notice in the Cart block

* Don't render variation <div> if empty

* Create ProductBackorderNotification component

* Add product backorder notification to the checkout block

* Fix classname and comment

* Rename notification->badge and don't show low stock badge if backorder is shown

* Use ternary to dispaly backorder/low stock badge
2020-07-14 17:25:53 +02:00
Mike Jolley be513c8875 Lazy Loading Atomic Components (https://github.com/woocommerce/woocommerce-blocks/pull/2777)
* Implement lazy loading with basics spinner

* Add chunkFilename

* chunkFilename breaks render

* Suspense at inner block level

* Suspense for all products block

* Update assets/js/atomic/blocks/component-init.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Handle lazy components in registerBlockComponent

* update tests

* Update locks

* Update assets/js/blocks-registry/block-components/register-block-component.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-07-14 12:35:15 +01:00
Albert Juhé Lluveras 0f43c3af0f Remove classes from dashicons (https://github.com/woocommerce/woocommerce-blocks/pull/2848) 2020-07-10 14:20:57 -04:00
Albert Juhé Lluveras 8c06276b00 Unify Chip styles (https://github.com/woocommerce/woocommerce-blocks/pull/2765)
* Improve cross character used in dropdown selector

* Add is-open and has-checked classes to dropdown selector so we stop relying on complex pseudoselector combinations

* Update Chip component with new props

* Update Chip styles

* Update dropdown selector selected chip with the Chip component

* Update active filters chip with the Chip component

* Style fixes

* Update snapshots and add tests

* Change onRemove prop signature

* Fix wrong bottom margin

* Fix misaligned remove icon

* Update assets/js/base/components/chip/index.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Update assets/js/base/components/chip/index.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Add missing default prop

* Prettier

* Ensure showScreenReaderText is a bool

* Rename removeOnClick with removeOnAnyClick

* Update snapshots

* Fix Chip aria-label logic

* Split Chip and RemovableChip

* Replace chip close character with an icon

* Fix outdated comment

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-07-10 11:09:49 +02:00
Mike Jolley d25d233f27 Replace usage of `cart-checkout/button` with `@woocommerce/base-components/button` (https://github.com/woocommerce/woocommerce-blocks/pull/2781)
* Change to base component

* Remove todo
2020-06-25 16:50:48 +01:00
Albert Juhé Lluveras 3fae904643 Use WooCommerce thumbnail images in Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2755)
* Remove legacy files

* Use thumbnail product image for Cart, Checkout and Reviews blocks

* Add option to toggle between full size and cropped image to the Atomic Product image block
2020-06-23 13:25:28 +01:00
Albert Juhé Lluveras b74b85dc03 Remove text color from Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2745)
* Remove text color from Cart and Checkout blocks

* Fix Cart price column misalignement. woocommerce/woocommerce-blocks#2744
2020-06-23 11:13:53 +01:00
Albert Juhé Lluveras dfa6fca924 Cart & Checkout: show shipping method prices with taxes depending on settings (https://github.com/woocommerce/woocommerce-blocks/pull/2748) 2020-06-22 10:47:35 +02:00
Albert Juhé Lluveras 610e082f9c Update base/components classnames (https://github.com/woocommerce/woocommerce-blocks/pull/2711)
* Update base/components classnames

* Fix class name conflict

* Fix some class names mismatch

* Fix review loading placeholder styles

* Fix docs format

* Update old class name

* Fix price slider regression

* Fix load more button component missing legacy class

* Fix wrong loading mask styles classname

* Remove 'checkout' from 'wc-block-components-checkout-payment-methods__save-card-info' classname

* Make it explicit legacy classes will be removed in the next major version

* Make product variation data styles belong to product metadata

* Improve docs sentence
2020-06-17 11:53:42 +02:00
Mike Jolley 09aa20d0d3 Introduce Atomic Add to Cart Block (https://github.com/woocommerce/woocommerce-blocks/pull/2705)
* Form/button stucture

* Use registerBlockComponent

* Context for add to cart form

* Working cart button

* Tidy up button component

* Add todos

* Revert reg block

* Hide stock indicator if not purchasable

* Hide terms if empty

* Add url and type to API

* Skip default category from term response

* Rename form element

* Form for product types

* Tidy up context provider and expand todos

* No longer using qty icon

* Update todos

* Correct text domain

* registerExperimentalBlockType

* Duplicate method

* Remove prevent default

* Update docblock

* Description for button code
2020-06-17 10:52:03 +01:00
Albert Juhé Lluveras 2004c48c5e Remove background color from Express Checkout title (https://github.com/woocommerce/woocommerce-blocks/pull/2704)
* Remove background color from Express Checkout title

* Fix Express checkout title padding not visible on npm run build

* Add explanatory comment
2020-06-15 13:39:46 +02:00
Albert Juhé Lluveras f46bc68f6e Fix Cart and Checkout sidebar styling issues (https://github.com/woocommerce/woocommerce-blocks/pull/2694)
* Order summary: Add spacing between product name and price name

* Remove border from shipping options in the side bar

* Add a hasBorder prop to Panel

* Checkout Order summary: remove margin product description

* Fix padding when there are multiple packages and remove old code

* Simplify selector

* Add margin botton to no shipping options notice

* Make sure Checkout titles are aligned when there are no express payment methods

* Update step heading margins according to new designs
2020-06-12 14:07:02 +02:00
Albert Juhé Lluveras 1a0c50078a Add theming docs (https://github.com/woocommerce/woocommerce-blocks/pull/2691)
* Add theming docs

* Update some components to the new class name structure

* Add docs about class name updates

* Update coding guidelines

* Minor improvements

* Update docs/theming/class-names-update-280.md

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-06-11 19:38:31 +02:00
Albert Juhé Lluveras 9b05b19028 Add aria-expanded to Change address button (https://github.com/woocommerce/woocommerce-blocks/pull/2603) 2020-06-10 15:38:39 +02:00
Albert Juhé Lluveras f68f11c6ca Update Checkout step progress indicator design (https://github.com/woocommerce/woocommerce-blocks/pull/2649) 2020-06-08 13:13:34 +02:00
Albert Juhé Lluveras c4e7191269 Fix credit card validation errors alignment (https://github.com/woocommerce/woocommerce-blocks/pull/2662)
* Use same margin-bottom in credit card input as in checkout inputs

* Set cursor:text for Checkout input labels

* Increase line height of expiry and cvc input validation errors in large viewports

* Increase height of expiry and cvc input validation errors in small viewports
2020-06-08 12:55:10 +02:00
Albert Juhé Lluveras 40426cbf93 Fix styling issues introduced in woocommerce/woocommerce-blocks#2597 and woocommerce/woocommerce-blocks#2619 (https://github.com/woocommerce/woocommerce-blocks/pull/2652)
* Move order summary styles to component style.scss

* Fix wrong class name in Order summary

* Move express payment methods a little bit higher

* Fix shipping options panel misaligned in the Cart sidebar

* Add right padding to panel button so text doesn't overlap the arrow

* Fix wrong class name in Order summary (II)
2020-06-08 11:28:58 +02:00
Darren Ethier 2bbe2e63c6 Fix retrying after failed payment processed server side. (https://github.com/woocommerce/woocommerce-blocks/pull/2655)
* add state for selected saved token in payment data

* add handling for flipping payment status back to pristine when checkout has error

If payment status is successful client side, but the checkout state goes into an error after server side processing, then we reset payment status to pristine to allow for reprocessing of payment method client side.

This is skipped for saved payment method tokens because they effectively are _only_ processed server side.
2020-06-07 16:47:16 -04:00
Albert Juhé Lluveras eaeedd31e0 Update item count badge styles (https://github.com/woocommerce/woocommerce-blocks/pull/2619)
* Update item count badge styles

* Make sure item count badge doesn't break in multiple lines

* Make item count badge have white background

* Add docs

* Move order summary CSS properties outside of the sidebar class to reduce specificity

* Move Order summary to its own component
2020-06-05 17:03:48 +02:00
Mike Jolley da58a8b44f Add Inner Block Rendering and Atomic Block Styles (https://github.com/woocommerce/woocommerce-blocks/pull/2607)
* Register Atomic Blocks and save some block content

* renderInnerBlocks utility

* Frontend Rendering

* Clean up atomic block classnames

* Move shared styles

* Create a hoc for attribute mapping

* Rename some unpluralised class names

* Remove prefixes from atomic component class names

* Updated styles

* Update styles from master

* Revert product list styles

* 2020 fixes

* Separate renderFrontend from renderInnerBlocks

* Lazy loading of components

* Tweak loading classes

* FIx all products loading state

* Revert lazy implementation - creates too many unneccessary files due to webpack config

* Cleanup

* Remove wcBlocksBuildUrl

* Move call to register_atomic_blocks

* Remove duplicate key

* reuse render frontend

* Corectly handle frontend attribute mapping to keep editor working

* Style updates

* Update side effects

* Remove width style from rating to fix alignment

* Move ssr grid styles to main stylesheet

* Put back prefixed classnames

* 2020 styling fixes

* Create frontend files instead of doing it all in block map

* Update assets/js/atomic/utils/get-block-map.js

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/atomic/utils/render-parent-block.js

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

* Fix last child alignment regardless of block type

* More specificity fixes

* 2020 button alignment

* static fix to prevent offsets

* fix placeholder image in firefox

* Issues reported in feedback

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2020-06-05 13:18:16 +01:00
Albert Juhé Lluveras 77b68795d8 Update Cart & Checkout heading styles (https://github.com/woocommerce/woocommerce-blocks/pull/2597)
* Honor heading styles in Cart and Checkout blocks

* Replace Panel with DisclosureWidget and remove Card

* Remove panel-style from main entry

* Rename DisclosureWidget props

* Simplify TitleTag assign

* Add aria-expanded attribute

* Rename DisclosureWidget to Panel

* Make Panel button clickable area smaller

* Fix specificity issues with Twenty Twenty

* Reset italics in reset-typography mixin

* Make C&C titles font size large

* Add padding to shipping options when in the sidebar
2020-06-05 12:00:19 +02:00
Albert Juhé Lluveras 8a65d7297b Make sure Select styles don't change on hover (https://github.com/woocommerce/woocommerce-blocks/pull/2647) 2020-06-05 11:12:34 +02:00
Albert Juhé Lluveras 13e79f21b4 Fix product grid blocks markup & design inconsistencies (https://github.com/woocommerce/woocommerce-blocks/pull/2428)
* Fix Sale badge markup discrepancy. Fixes woocommerce/woocommerce-blocks#2107

* Fix product link markup discrepancy

* Use same class name for ratings markup in product grid blocks

* Remove editor specific class name for product title

* Unify price layout between product grid blocks and All Products block

* Change specificity raising classes to avoid editor class names

* Make small images fill the available width in product grid blocks

* Avoid increasing selector specificity in the frontend

* Undo AbstractProductGrid.php template changes

* Do not remove .wc-block-grid__product-rating__stars from CSS

* Add theming docs
2020-06-02 17:06:28 +02:00
Mike Jolley 28d516050e Add context support to Atomic Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2592)
* Bulk rename InnerBlockConfiguration to InnerBlockLayout context

* Refactor button to use context and handle null product data

* Move preview data to context

* Update blocks to support context

* fix button

* Update assets/js/atomic/blocks/product/title/block.js

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

* remove falsey check

* Update product retrieval code

* Update product prop usage

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2020-06-02 12:14:46 +01:00
Albert Juhé Lluveras a6da13920d Fix Cart sidebar styles after font size changes (https://github.com/woocommerce/woocommerce-blocks/pull/2593)
* Fix Cart sidebar styles after font size changes

* Margin/padding cleanup
2020-06-02 09:33:10 +02:00
Albert Juhé Lluveras 31b5f4e00c Fixes to Twenty Twenty product grid styles (https://github.com/woocommerce/woocommerce-blocks/pull/2573)
* Remove underline from discounted prices

* Fix position of on sale badge in Twenty Twenty

* Make sure we reset styles from Core

* Fix image on sale badge not correctly positioned

* Fix sale badge alignment when they are on in the right
2020-06-02 09:18:34 +02:00
Albert Juhé Lluveras 00b0a81874 Make filter font sizes named (https://github.com/woocommerce/woocommerce-blocks/pull/2594) 2020-06-01 06:45:40 +02:00
Mike Jolley 18480b0d68 Add layour editor to the single product block (https://github.com/woocommerce/woocommerce-blocks/pull/2586) 2020-05-29 12:28:04 +01:00
Albert Juhé Lluveras d1685bda7b Use named font sizes instead of values in px (https://github.com/woocommerce/woocommerce-blocks/pull/2533)
* Use named font sizes instead of values in px

* Convert rem mixin to em

* Remove unnecessary line-height

* 'Design' -> 'layout'

* Add comment to magic line-heihgt number

* Update a couple of class names to use BEM

* Use consistent name for SCSS variables

* Fix order summary line heights

* Update docs/contributors/coding-guidelines.md

Co-authored-by: Mike Jolley <mike.jolley@me.com>

Co-authored-by: Mike Jolley <mike.jolley@me.com>
2020-05-29 12:16:33 +02:00
Mike Jolley 2dc0e8112a Create shared contexts handle for inner blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2568)
* Create shared contexts

* At to jest config
2020-05-28 11:02:10 +01:00
Albert Juhé Lluveras bc51052b04 Checkout steps improvements (https://github.com/woocommerce/woocommerce-blocks/pull/2530)
* Don't render step heading content if there is no content

* Make checkout step headings h2

* Add empty alt value to form step counter
2020-05-27 16:48:23 +02:00
Darren Ethier a5b6061dcc Ensure all inline @todos in code are covered by issues and obsolete @todos removed. (https://github.com/woocommerce/woocommerce-blocks/pull/2557)
* Remove todos for colors (see woocommerce/woocommerce-blocks#1331)

* remove todo for payment method express payments placeholder

No placeholder is needed because we don’t want to show this at all if there are no payment methods setup (or initialized based on `canMakePayment`). The payment methods step will have instructions in the editor for users to setup their payment methods.

So this todo was invalid.

* Remove todo comment for useStoreOrder (see woocommerce/woocommerce-blocks#2555)

* remove obsolete todos for usePaymentMethodInterface

* changed todo into a Note for the useQueryState tests

With focused work happening on tests, this is better as a note that can be picked up when this file is touched again.

* remove obsolete todo from payment method registration validation

* remove todo covered by created issue (see woocommerce/woocommerce-blocks#2166)

* remove obsolete todo for stripe utils

* Convert todo to a Note for Checkout Block php registration

For now, I think having the comment block noting what is happening here is sufficient. Whether or not we extend the blocks to cover the other endpoints is something that will surface in future planning and putting in an issue right now coudl be premature (and likely just land the issue in the icebox)

* Remove todo related to ReserveStock covered by woocommerce/woocommerce-blocks#2556

* Remove todo in AbstractRoute covered by issue in WooCommerce project

see https://github.com/woocommerce/woocommerce/pull/26219 for the issue.

* Convert todo to note for wp_version check in Library class
2020-05-26 13:31:33 -04:00
Albert Juhé Lluveras 79359e7056 Fix Cart style discrepancies (editor-frontend) (https://github.com/woocommerce/woocommerce-blocks/pull/2486)
* Fix different heading size of Cart block between frontend and editor

* Increase Cart submit button specificity so styles are applied in the editor

* Ensure buttons don't inherit borders

* Simplify styles

* Create Title component

* Rename 'level' prop to 'headingLevel'
2020-05-25 18:45:38 +02:00
Darren Ethier ce1e334c56 Fix broken dynamic address fields dependent on locale for selected country. (https://github.com/woocommerce/woocommerce-blocks/pull/2547)
* add missing dependency

* Don’t include all defaultAddressFields in address field config
2020-05-25 07:00:26 -04:00
Darren Ethier a5bca5708c Reakit tab already handles selecting the default tab if it isn’t set. (https://github.com/woocommerce/woocommerce-blocks/pull/2545) 2020-05-22 15:32:41 -04:00
Darren Ethier 5668f58f2c Include `onSubmit` handler for CheckoutForm component. (https://github.com/woocommerce/woocommerce-blocks/pull/2532)
* include `onSubmit` handler for CheckoutForm component and implement

* remove redundant preventDefault
2020-05-22 10:51:38 -04:00
Albert Juhé Lluveras 6d1cb26d63 Import TwentyTwenty block styles from Core (https://github.com/woocommerce/woocommerce-blocks/pull/2513)
* Add TwentyTwenty styles from Core

* Increase product on sale selector specificity

* Add theme class name to admin

* Fix some more style discrepancies

* Use em instead of rem
2020-05-21 19:09:50 +02:00
Albert Juhé Lluveras 60c0ebfdb7 Fix misalignment between value and label in form components (https://github.com/woocommerce/woocommerce-blocks/pull/2518)
* Fix misalignment between value and label in form components

* Do the calculation in SCSS
2020-05-20 15:54:37 +02:00
Albert Juhé Lluveras 0dc7e9e6f1 Fix decimal ratings not correctly displayed (https://github.com/woocommerce/woocommerce-blocks/pull/2507)
* Fix decimal ratings not correctly displayed

* Fix aria label rounding ratings
2020-05-19 17:24:20 +02:00
Albert Juhé Lluveras 8f2003df4b Remove some unique font-size (https://github.com/woocommerce/woocommerce-blocks/pull/2498)
* Remove font-sizes which are already inherited

* Remove font sizes from buttons with no text

* Make summary item quantity font-size 12px
2020-05-19 08:06:35 -04:00
Albert Juhé Lluveras 1fea56d8cd Remove class 'button' from Button component (https://github.com/woocommerce/woocommerce-blocks/pull/2494) 2020-05-18 12:53:57 +02:00
Seghir Nadir c48518de54 Use Reakit in payment tabs (https://github.com/woocommerce/woocommerce-blocks/pull/2371)
* WIP

* convert to reakit

* rebase and fix styling issues

* add forget initialTabName

* delete button and force manual select

* fix git diff problem in package-lock

* directly render tabs

* fix regression

* gaurd against unset values

* update reakit and guard against empty tabs
2020-05-15 14:55:17 -04:00
Albert Juhé Lluveras 11981947c5 Add CSS resets for better theme compatibility (https://github.com/woocommerce/woocommerce-blocks/pull/2478) 2020-05-14 11:07:21 +02:00
Mike Jolley 24035a1508 Update Stripe Method to display generic icon and text in label, with cards below (https://github.com/woocommerce/woocommerce-blocks/pull/2466)
* Support card alignment as a prop

* Add generic card icon to stripe

* Add icons to stripe content

* Update styles

* Label element with icon whitelist

* Update assets/js/base/components/payment-methods/payment-methods.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Remove activePaymentMethod

* Remove spread operator

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-05-13 16:48:03 +01:00
Darren Ethier 0f53b24f1a Fix regression for payment methods in incognito mode. (https://github.com/woocommerce/woocommerce-blocks/pull/2473)
* ensure we set initial tab if it’s not set

* set appropriate defaults for supports if we don’t have payment method configuration object yet.
2020-05-13 05:34:05 -04:00
Mike Jolley 9a7658179b Refactor `usePaymentMethodRegistration` to ensure payment methods are populated once initialization is true (https://github.com/woocommerce/woocommerce-blocks/pull/2467)
* Refactor usePaymentMethodRegistration so initialisation happens at same point as dispatch

* Update NoPaymentMethods conditonal

* Suggested changes to payment init
2020-05-12 12:40:08 -04:00
Rua Haszard fd91263986 Allow shopper to save Stripe payment method in user account for subsequent purchases (https://github.com/woocommerce/woocommerce-blocks/pull/2453)
* always default "save my card for next time" checkbox to unchecked:

This is based on the previous checkout behaviour.
I.e. the shopper has to actively opt-in to save their card.

* Implement "save payment method for next purchase" in checkout:

- send "save card" option using existing post key
  - wc-stripe-new-payment-method
- comment out inappropriate use of "save" when using a saved card (tbc)

* don't hard code the payment gateway name in 'save payment method' key

* refactor "save payment info" checkbox so payment methods can opt-in:

- Add options.allowSavePaymentToken to payment method
registration / config.
- Opt-in in Stripe CC, it allows saved cards.
- Remove render of "save my card" checkbox from Stripe CC UI component.
- Render "save my card" checkbox automatically in payment method tab
(based on allowSavePaymentToken option).
+ todo/follow up comments

* rejig "save my payment method" behaviour so it's generic:

- Any payment method that supports "save" can opt-in:
  - options.allowSavePaymentToken = true/false
  - handle `wc-XXX-new-payment-method` key server side to persist
- Add support in payment context/state reducer for storing checkbox
state, expose value and action via context
- Convert state flag to appropriate API key/value in payment processor
- Remove previous stripe-specific implementation
+ bonus add comment to payment context about preserving state in
PRISTINE action

* rename payment method "allow save" option, more consistent with UI

* remove last vestiges of gateway-specific "save card" impl:

- No need to pass CheckboxControl to payment methods; checkbox is
now handled automatically by checkout.
- Remove shouldSavePayment prop passing through various layers of
stripe payment processing code. (Now handled in context/processor.)

* change new option property name and shape. Also adds validation.

* update type-defs

* use more reliable `activePaymentMethod` for saved payment method

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-05-12 11:12:28 -04:00
Mike Jolley 73abba295e Use display table instead of flex in radio control group (https://github.com/woocommerce/woocommerce-blocks/pull/2461)
* Use display table instead of flex

* Target direct child span only
2020-05-12 15:17:02 +01:00
Albert Juhé Lluveras 53c64600a3 Remove Shipping totals editor.scss file (https://github.com/woocommerce/woocommerce-blocks/pull/2465) 2020-05-12 15:56:09 +02:00
Mike Jolley 1d154364cb Introduce ContainerQueryContextProvider - hide order summary on mobile (https://github.com/woocommerce/woocommerce-blocks/pull/2432)
* Add ContainerQueryContextProvider

* Implement ContainerQueryContextProvider

* Rename based on feedback

* Update assets/js/type-defs/contexts.js

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/type-defs/contexts.js

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2020-05-11 17:07:22 +01:00
Darren Ethier 4ad741329b Fix saved payment method selection not working for purchases. (https://github.com/woocommerce/woocommerce-blocks/pull/2425)
* fix arguments

* only set payment status to pristine if it isn’t already successful

* add server side handling for saved tokens

* ensure correct gateway is selected when using saved card:
- reset the active payment method when user selects saved payment method
(card); this ensures that the correct gateway is used when switching
from another gateway to a saved card

* enhance radiocontrol to receive option specific change events.

* implement specific option change events

This commit:

- ensures selecting a saved payment option updates active payment method for the selected option.
- Sets the saved token key for the selected option correctly.

* remove unnecessary php side code

* fix bug with default saved payment option not applying:

When the payment options are initialised, we now call the onChange
handler for the default (`is_default`) option. This triggers payment
success() so checkout succeeds with default payment method, even if user
doesn't touch payment options.

* fix effect dependencies

Co-authored-by: Rua Haszard <rua.haszard@automattic.com>
2020-05-11 09:29:57 -04:00
Darren Ethier e7781ba407 Fixes regression with payment method validation (https://github.com/woocommerce/woocommerce-blocks/pull/2450)
* add typedefs for store notice context

* improve useStoreNotices hook so returned interfaces are fairly constant

* fix dependencies, defaults, and add types

* fix dependencies

* fix dependencies

* improve functions exposed on validation context so they are more constant

* fixing dependencies

* normalize tokenId to string everywhere

Assuming the token is a number is a bad idea because it is feasible that source for some payment methods could be a string. Also when retrieved as an input value, the id will be a string anyways.
2020-05-10 19:41:10 -04:00
Albert Juhé Lluveras e970e4e86f SCSS mixins cleanup (https://github.com/woocommerce/woocommerce-blocks/pull/2405)
* Cleanup some old mixins

* Make font-size() mixin use parameters with units

* Remove hover-state mixin

* Cleanup mixins file
2020-05-07 10:48:38 +02:00
Mike Jolley 4436bdd23f Allow text inputs to focus on mount (https://github.com/woocommerce/woocommerce-blocks/pull/2416) 2020-05-06 15:04:00 -04:00
Mike Jolley dd811b1491 Update Stripe/payment payment notices (https://github.com/woocommerce/woocommerce-blocks/pull/2417)
* Update notices to say `card` instead of `card's`

* Track isEmpty per field so placeholders are not visible when focusing and defocusing other fields

* Make payment notices non-dissmissable, and removed on payment method switch

* Don't add validation notices

* implement nullish coalescing operator

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-05-06 14:58:31 -04:00
Mike Jolley 74a4e55075 Remove API summaries in favour of client side code (https://github.com/woocommerce/woocommerce-blocks/pull/2387)
* Remove summary from API

* Add wordCountType to assets

* Update packages

* Remove summary from test data

* Featured product uses short desc

* Pass description instead of summary

* Use new Summary Component

* Component and tests

* Increased versititilty of methods

* Update assets/js/base/components/cart-checkout/product-summary/index.js

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>

* Extra tests for html tags

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-05-06 11:30:15 +01:00
Mike Jolley 87e8b26e6f Store billing address to local state and persist globally to prevent loss of data (https://github.com/woocommerce/woocommerce-blocks/pull/2374)
* Remove unused shippingAsBilling prop from billing data context

* Move functions out of component and add docblocks

* Local address state

* Refactor into new custom hook

* Remove TODO and code fixed in core

* useShallowEqual to prevent updates on all field changes

* Fix stale validation errors

* cleanup

* Should be setting local state not global state for email and phone

* Combine useEffects and pass correct deps

* Update assets/js/base/hooks/checkout/use-checkout-address.js

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>

* Prettier

* Move validation update check into updateValidationError

* Fix state updaters

* Fix context definition for setShippingAddress

* Fix validation updates

* errorId dep

* Reapply changes to checkout block

* Update equality checks

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2020-05-06 11:21:30 +01:00
Albert Juhé Lluveras 30c281c524 Use container queries to load Cart and Checkout responsive styles (https://github.com/woocommerce/woocommerce-blocks/pull/2370)
* Use container queries to load Cart and Checkout responsive styles

* Update package-lock.json

* Make form-step react to container queries instead of media queries

* Make sidebar layout inner padding relative to the full-width

* Make container queries breakpoints smaller
2020-05-05 10:10:02 +02:00
Rua Haszard 9d0217419c decode html entities in ProductName component (https://github.com/woocommerce/woocommerce-blocks/pull/2389) 2020-05-04 15:44:23 -04:00
Albert Juhé Lluveras b5497147d5 Fix long product names regression (https://github.com/woocommerce/woocommerce-blocks/pull/2391) 2020-05-04 17:15:32 +02:00
Mike Jolley bf8cff6f50 Rename the discount section when discount total is zero (https://github.com/woocommerce/woocommerce-blocks/pull/2367)
* Rename the discount section when discount total is zero

* Cleanup variable naming
2020-05-01 10:59:27 +01:00
Mike Jolley 5a39df880f Fix summary styles and margins/padding woocommerce/woocommerce-blocks#2340 (https://github.com/woocommerce/woocommerce-blocks/pull/2368) 2020-05-01 10:31:09 +01:00
Albert Juhé Lluveras 9e7623567e Make all font sizes accessible + add docs about font-size() mixin (https://github.com/woocommerce/woocommerce-blocks/pull/2291)
* Switch all font-sizes to use the mixin

* Add notice in coding-guidelines to use accessible font sizes

* Fix label alignment in forms with big font-sizes

* Fix Stripe input boxes font-size not being responsive

* Fix select overflowing in small font sizes

* Add rem function from woocommerce/woocommerce-blocks#2320

* Make the font-size() mixin set relative line-height values

* Convert several magic numbers to use the new mixins

* Update docs

* Update input/select paddings to use the rem mixin

* Add lineHeight comment

* Interpolate rem() mixin inside calc

* Make input padding use only relative units
2020-04-30 12:18:12 +02:00
Mike Jolley 1fd0fa79a9 Payment methods `placeOrderButtonLabel` config (https://github.com/woocommerce/woocommerce-blocks/pull/2362)
* Add payment method configs

* Remove submitLabel

* Enhance useCheckoutSubmit to handle button text

* copy paste error
2020-04-30 10:52:36 +01:00
Albert Juhé Lluveras fce0e2d71c Fix Cart block interaction in the editor (mobile) (https://github.com/woocommerce/woocommerce-blocks/pull/2354)
* Prevent SnackbarList from loading in the editor

* Fix snackbar styles leaking into the editor

* Prevent 'Proceed to Checkout' button being fixed to the bottom in the editor
2020-04-29 17:45:29 +02:00
Mike Jolley 95809b30bb Update payment method config to include icons (https://github.com/woocommerce/woocommerce-blocks/pull/2267)
* Remove strong and cleanup existing configs

* Fix TS validation for blocks-registry

* Allow label to be string

* Split up button and icons for cart

* Make icons and payment methods available on cart page

* Fix payment method enqueuing

* Icon normalization and Stripe implementation

* PayPal Icon

* adjust spacing

* Fix string handling

* Remove paypal icon config

* Check for an object before creating icon

* Add payment icons to Stripe label

* Update common-icons.js

* Update Cart.php

* Update jest.config.json
2020-04-29 11:57:58 +01:00
Albert Juhé Lluveras 60cf16a334 Fix low stock badge not breaking in a new line (https://github.com/woocommerce/woocommerce-blocks/pull/2348) 2020-04-29 12:57:04 +02:00
Mike Jolley ad93ddd891 Add PayPal Standard (https://github.com/woocommerce/woocommerce-blocks/pull/2288)
* Add paypal files

* Add PayPal Icon/resolve feedback
2020-04-28 11:13:48 +01:00
Mike Jolley e5589727fc Support itemized taxes (https://github.com/woocommerce/woocommerce-blocks/pull/2276) 2020-04-24 14:44:44 +01:00
Mike Jolley 7f85c1bcc0 Migrate REST API usage to the Store API (https://github.com/woocommerce/woocommerce-blocks/pull/2282)
* Remove unused wc/blocks/cart endpoint

* remove unused withProducts hoc

* Remove getProducts util

* Use store API products endpoint in product blocks

* Remove product endpoint tests

* Remove controller

* Switch attributes endpoint to store api

* Refactor withAttributes to use store API

* Migrate tags and cats to store API

* MIgrate variations to store api

* Migrate reviews to store API

* Drop dedicated variation endpoint

* Move tests

* Move cart init

* Fix reviews

* Comment out broken tests

* Remove old class based with-attributes test
2020-04-24 14:36:47 +01:00
Albert Juhé Lluveras 96e8ccf1a4 Cart & Checkout: Update styles to better match designs (https://github.com/woocommerce/woocommerce-blocks/pull/2283)
* Add ending dot to sentence

* Open links to products from Cart and Checkut blocks in new tabs

* Makes sure product names are broken if they overflow the container

* Use native find instead of lodash method

* Update styles to better match designs

* Revert "Open links to products from Cart and Checkut blocks in new tabs"

This reverts commit 9b64aa5f2e81bf0cf09d5640a3cfe1cc1085c046.

* Fix product name overflowing remove menu on mobile

* Remove @todo comments from form step CSS

* Make letter-spacinguse em instead of px

* IE11: Correctly align text in quantity selector

* Fix long product names overflowing in Checkout block on IE11
2020-04-24 13:23:25 +01:00
Mike Jolley 5a2ee88905 Fixes to totals recalculation and taxes (https://github.com/woocommerce/woocommerce-blocks/pull/2275)
* Hide tax totals row when taxes are disabled in core

* Trigger recalcs if hash changes

* move recalc until later on in rest call

* Unused class
2020-04-22 14:16:17 +01:00
Seghir Nadir 2e9b21ef8a Fix snackbar being too high and covering coupon section (https://github.com/woocommerce/woocommerce-blocks/pull/2255)
* fix snackbar issue

* fix some styles
2020-04-20 14:23:44 +01:00
Mike Jolley 21f75b61b0 Show feedback on buttons/checkout when processing (https://github.com/woocommerce/woocommerce-blocks/pull/2186)
* Allow buttons to show loading spinners

* Show spinner on cart checkout button press

* Disable fieldsets when processing

* Check icon when finished

* Style tweak to fix height

* Update events

* feedback

* Move button back
2020-04-15 17:09:15 +01:00
Albert Juhé Lluveras d5232c9903 Handle errors when loading payment methods (https://github.com/woocommerce/woocommerce-blocks/pull/2228)
* Handle errors when loading payment methods

* Use an error boundary

* Fix missing initial state in block error boundary

* Cleanup

* Only show internal user messages if it's admin or in editor

* Fixes

* Add friendly error message
2020-04-15 17:15:56 +02:00
Rua Haszard ace2d2bd81 show preview "saved payment methods" in editor (https://github.com/woocommerce/woocommerce-blocks/pull/2151)
* factor out editor preview data for saved payment methods to previews

* add missing imports lost in rebase

* use editorcontext to provide preview data to payment method context

* remove unused `activePaymentMethod` prop in CheckoutProvider and PaymentMethodDataProvider

* don't set the preview saved card as the default

* fix js error with cart in editor - fix EditorContext, pass previewData:
- editor context preview prop has changed;
  - update cart to pass { previewCart } in previewData prop
- correctly destructure cart from previewData in useStoreCart hook
- correct typedefs
  - EditorProvider props.previewData - now just Object
  - similar for EditorDataContext
- correct default for activePaymentMethod state - empty string as before

* preselect 'use a new payment method' in checkout block editor preview

* update unit tests for changes to editor context
2020-04-15 12:05:01 +12:00
Albert Juhé Lluveras 923eef90ee Fix build styles incosistencies (https://github.com/woocommerce/woocommerce-blocks/pull/2208)
* Prevent select label/value breaking in two lines

* Make sure frontend and base styles are loaded in the same order

* Use link-button mixin for address button

* Refactor shipping rates control CSS to decrease specificity and overwrites

* Refactor sidebar panel CSS to decrease specificity and overwrites

* Fix link-button vertical-align
2020-04-14 13:43:10 +02:00
Seghir Nadir a00d06b7f2 Use icons directly from stripe (https://github.com/woocommerce/woocommerce-blocks/pull/2188)
* use icons from stripe

* rename classes

* use object instead of array

* update jsdocs
2020-04-09 15:31:03 -04:00
Albert Juhé Lluveras c035a578a8 Fix currency format in On Sale badge (https://github.com/woocommerce/woocommerce-blocks/pull/2185)
* Fix currency format in On Sale badge

* Add back translators comment

* Use self-closing tag
2020-04-09 18:53:22 +02:00
Darren Ethier e21883d69c Refactor logic for handling active payment method with express payment methods via checkout (https://github.com/woocommerce/woocommerce-blocks/pull/2170)
* remove logic server side for getting payment method from paymentdata

* ensure stripe accounts for payment request type payment methods

* make sure legacy payment method handling always runs last

* add processedPaymentMethodId to payment method data context state

* switch checkout processor to use new processedPaymentMethod id for submission

* implement returning paymentMethodId from payment-request-express

* include paymentMethodId in stripe cc success return value

* include paymentMethodId in cheque success return value

* add active payment method setting and handling via checkout

express payment methods still need to implement:

- onClick when their button is clicked
- onClose when the express payment interface is closed (cancelled etc).

* don’t expose setActivePaymentMethod on the payment method interface

* remove/fix artifacts from earlier iterations of the pull

* rename `id` property to `name` property for payment method registration

* Revert "include paymentMethodId in cheque success return value"

This reverts commit fe4ee8aced6d67bbd9033263ce61844349d18250.

* Revert "include paymentMethodId in stripe cc success return value"

This reverts commit 359a1f0089866110ec204182f8ffa14ab099c425.

* Revert "implement returning paymentMethodId from payment-request-express"

This reverts commit 117c68980b0876dee0acc78cec7754ccfe2a9bb1.

* Revert "switch checkout processor to use new processedPaymentMethod id for submission"

This reverts commit c38a05b63626dfc1336c7bb0e86417b798a803d6.

* Revert "add processedPaymentMethodId to payment method data context state"

This reverts commit 3d7923e7297f3c76efde536d26eaf68464ba9583.

* improve isSuccess response check and variable name

* implement paymentMethodId config option

* doh php ain’t javascript

* add missing dependency from rebase
2020-04-09 11:22:34 -04:00
Seghir Nadir 9e1adb7ea8 fix broken labels on twentyTwenty (https://github.com/woocommerce/woocommerce-blocks/pull/2181) 2020-04-09 15:26:16 +01:00
Darren Ethier bfdfa2f603 Move calculating state outside of checkout state (https://github.com/woocommerce/woocommerce-blocks/pull/2163)
* remove calculating as a checkout status (making it separate)

* include checkout is calculating for determining whether to flip payment status to process

* only change payment method state for status changes if needed

* fix reducer for shipping state

* include checkoutIsCalculating for determining whether to show validation errors in checkout block

* change where currentStatus is defined

* fix bug with saved payment method option
2020-04-08 11:46:34 -04:00
Mike Jolley 4a8609737d Increase specificity of wc-block-totals__change-address-button (https://github.com/woocommerce/woocommerce-blocks/pull/2162) 2020-04-08 17:23:17 +02:00
Mike Jolley 55d0067426 Update previews and editor styles for cart and checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/2160)
* Update cart block editor styles to more closely match frontend

* Checkout editor styles

* Add image assets for previews and correct totals

* Add new previews

* Cart Preview

* Checkout preview

* Remove optional chaining
2020-04-08 16:03:39 +01:00
Mike Jolley d73d9ca12e Refactor some of the shipping hooks/context usage (https://github.com/woocommerce/woocommerce-blocks/pull/2146)
* Counting helpers for shipping rates and packages

* Use new helpers

* Make shipping calculator use shipping context directly

* Totals should use current address

* Avoid useShippingRates

* Return rates and other items from useShippingRatse in useStoreCart instead

* Update tests

* Merge conflict

* Merge conflict
2020-04-08 12:20:41 +01:00
Albert Juhé Lluveras db4f7820c6 Use new util functions in ShippingRatesControl (https://github.com/woocommerce/woocommerce-blocks/pull/2153)
* Use new util functions in ShippingRatesControl

* Import from base-utils
2020-04-08 11:19:05 +01:00
Mike Jolley 0000cac384 Don't show "select" labels for shipping or payment method steps if there is only one option (https://github.com/woocommerce/woocommerce-blocks/pull/2133)
* Only show descriptions if shipping/payment methods > 1

* Hide descriptions if no description text is set

* Fix object length

* methods->options

* Counting helpers for shipping rates and packages

* Use new helpers
2020-04-08 10:00:31 +02:00
Albert Juhé Lluveras 5bcdc8f84a CheckboxControl: stop using Gutenberg's CheckboxControl (https://github.com/woocommerce/woocommerce-blocks/pull/2137)
* CheckboxControl: stop using Gutenberg's CheckboxControl

* Simplify styles and make them work fine in the editor
2020-04-07 16:37:03 +01:00
Seghir Nadir 5160d9d794 Disable continue to checkout if Item quantity is being updated and immediately remove items. (https://github.com/woocommerce/woocommerce-blocks/pull/2106)
* disable continue to checkout if item is being removed

* rename isPending and selectors/actions to isPendingDelete

* switch itemPendingDelete params order

* change to watching quantity changes not removal

* yield RECEIVE_REMOVED_ITEM

* update types and add return to select

* update tests

* switch params back

* only delete item after response from server

* update tests

* handle errors and unrelated unmounts

* disable row if is loading
2020-04-07 12:03:22 +01:00
Albert Juhé Lluveras 8c7d4805a4 Show validation errors again (https://github.com/woocommerce/woocommerce-blocks/pull/2124)
* Make validation errors appear

* Make validation errors appear all at once

* Simplify diff

* Expose shippingErrorStatus from shipping context

* Memoize currentErrorStatus

* Pass currentErrorStatus to observers

* Add missing type-def property

* Fix typo in constant name

* Refactor emitEvent so false responses don't return true

* Make onCheckoutProcessing observers return errorMessage and validationErrors properties
2020-04-06 16:36:19 -04:00
Seghir Nadir 0ca78dd654 Remove Keep me updated (https://github.com/woocommerce/woocommerce-blocks/pull/2057)
* remove checkbox of keep me updated

* remove double margin on useSameForBilling
2020-04-06 16:57:38 +01:00
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
Albert Juhé Lluveras 8a78371703 Checkout: fix skeleton and responsive styles (https://github.com/woocommerce/woocommerce-blocks/pull/2109) 2020-04-03 14:17:09 +01:00
Seghir Nadir c361a158c4 Respect needs_shipping in Cart and Checkout (https://github.com/woocommerce/woocommerce-blocks/pull/2101)
* replace SHIPPING_ENABLED with needsShipping

* rename needsShipping variable

* only show shipping in checkout sidebar if we need shipping
2020-04-02 18:10:36 +01:00
Albert Juhé Lluveras 73d1432b02 Hook up checkout validation with context (https://github.com/woocommerce/woocommerce-blocks/pull/2033)
* Hook up checkout validation with context

* Make sure hasValidationErrors is up to date in onCheckoutProcessing

* Move validation check inside CheckoutProcessor's processCheckout

* Make sure all checkout form fields have a unique ID

* Don't clear checkout context errors in shipping context

* Move CheckoutProcessor to the top so scrollToTop works

* Do not disable Place Order Button if there are errors

* Split checkValidation and processCheckout in Checkout Provider

* Refactor event emitter to use Maps

* Save payment method errors to validation context

* Show an notice when a payment method has an error

* Make sure JS errors during payment are displayed

* Remove error notice when payment method doesn't return an error anymore

* Make sure payment methods know if shipping and billing addresses are the same

* Make sure checkout is only processed if payment methods didn't fail

* Make sure state input also has an id

* Clear input and select errors on unmount

* Pass id to CountryInput and StateInput

* Fix function name

* Add missing default context values

* Move onCheckoutCompleteError effect to CheckoutBlock

* Remove conditional from shipping setHasError
2020-04-02 11:27:54 +02: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 d3fdc4b358 Finish wiring up shipping data context provider and add disabled state to checkout submit button (https://github.com/woocommerce/woocommerce-blocks/pull/2070)
* add selecting rate resolution state to the cart store

* expose whether rate is being selected on useSelectShippingRate

* Cleanup and refactor ShippingDataProvider

- remove un-needed component and move shipping rates into context provider
- remove error handling (currently the ui/ux for the checkout should result in no errors and any api errors are non-recoverable).
- Add logic for shipping rate selection into context provider and add event emitters for it.
- increment/decrement checkout calculation counts when shipping rates are being selected.

* dispatch checkout error if there is an error

* disable place order button if checkout is calculating or has error

* update doc block

* fix convention for js comment blocks
2020-03-31 11:40:27 -04:00
Seghir Nadir 0046b73bbf delete passed arg to useShippingRates since it's not needed 2020-03-31 13:22:41 +01:00
Albert Juhé Lluveras 5e78c47e4d Move some base components to subfolders (https://github.com/woocommerce/woocommerce-blocks/pull/2034) 2020-03-30 15:04:27 +02:00
Albert Juhé Lluveras e6f6dc9915 Cart and Checkout accessibility fixes (https://github.com/woocommerce/woocommerce-blocks/pull/2041)
* Make Product Price component accessible

* Render checkout form step number before the content instead of after

* Announce changes in the Shipping Rates Control results

* Render product name before product price in the Checkout sidebar

* Verify error element id exists before using it in describedBy

* Avoid reading 'Choose a shipping method' if no shipping methods are available

* Hide product image from screen readers if there is no alt text and make link not focusable

* Move Checkout block buttons below the sidebar

* Simplify selector

* Remove ternary to make code easier to understand

* Fix rebase issue

* Fix step number not visible for payment methods
2020-03-30 14:43:42 +02: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
Seghir Nadir f3af7f7dfe fix rates not updating if you change coupon (https://github.com/woocommerce/woocommerce-blocks/pull/2026) 2020-03-26 13:43:11 +01:00
Albert Juhé Lluveras 4b80ef79ef Fix blocks not being added in WP <= 5.2 (https://github.com/woocommerce/woocommerce-blocks/pull/2001)
* Only update grid default attributes on WP >= 5.3

* Use @wordpress/compose from external in Reviews sort-select

* Import withInstanceId from external only on legacy builds

* FallbackModule: add extensions to paths if it's missing

* Use path package to extract path extension

* Make all components import from the base withInstanceId HOC
2020-03-26 13:39:54 +01: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
Albert Juhé Lluveras c7e20c29d9 Decode address entities in shipping calculator (https://github.com/woocommerce/woocommerce-blocks/pull/2009)
* Fix wrong optional label for city

* Decode all address entities in shipping calculator

* Move decodeEntities to useShippingRates

* Move decodeEntities to useShippingAddress
2020-03-24 11:28:19 +01:00
Seghir Nadir 2ba75fdc25 Refactor useBillingData to useCheckoutContext and hooking it up to form (https://github.com/woocommerce/woocommerce-blocks/pull/2002)
* Add line pricing for cart items in the API (https://github.com/woocommerce/woocommerce-blocks/pull/1979)

* Add line pricing for cart items

* Update checkout linePrice

* Fix tests

* Update schema - add dinero

* Implement dinero in cart totals

* Update preview and remove line totals

* Update package lock

* Update checkout review

* Fix preview and default data shapes

* return first and last name in shipping address

* remove shippingAsBilling option from editor settings

* remove billing data from store

* move to context

* hook billing to hook and sync with shipping

* add email to billingData

* hydrate billing data

* some refactors

* move hydrated billing data to reducer initial state and fix stale dependencies

* fix stale useCallback

* better checks in php types

* get isEditor from context

* update typedefs

* skip state update if nothing changed

* fix rebase

* update snapshots

* rebase package

* wrap setEmail in useCallback

* remove ValidationContextProvider

* fix docs

Co-authored-by: Mike Jolley <mike.jolley@me.com>
2020-03-23 21:13:41 +01:00
Albert Juhé Lluveras 2593fcf7da Add Checkout form validation (https://github.com/woocommerce/woocommerce-blocks/pull/1993)
* Add Checkout form validation

* Add back validation when filling the address without having set a country

* Split TextInput and Select so they can be used with or without validation

* Cleanup

* Only display the missing country error if city, state or postcode are entered

* Fix CSS specificity conflict

* Remove unnecessary semicolon

* Rename areThereValidationErrors to hasValidationErrors
2020-03-23 12:22:00 +01: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 8ca9fc9b6f Update empty states (https://github.com/woocommerce/woocommerce-blocks/pull/1996)
* Add empty state template

* Checkout empty state

* Update other icons

* Blank alt
2020-03-19 15:50:36 +00: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 dadebfebbc Add line pricing for cart items in the API (https://github.com/woocommerce/woocommerce-blocks/pull/1979)
* Add line pricing for cart items

* Update checkout linePrice

* Fix tests

* Update schema - add dinero

* Implement dinero in cart totals

* Update preview and remove line totals

* Update package lock

* Update checkout review

* Fix preview and default data shapes
2020-03-17 15:34:33 +00:00
Darren Ethier ad4c981793 Add validation context provider and implement validation for shipping country and coupons. (https://github.com/woocommerce/woocommerce-blocks/pull/1972)
* add errormessage handling to countryinput (along with storybook)

* add types for react

* Add validation context and implement

* implement validation context for country field validation

* tweak ValidationInputError so that it can receive property name for getting error from

* improve storybook webpack config to pull from tsconfig.json

* update storybook story to cover changes with context

* Wrap Checkout Provider with Validation Context Provider

* add screen-reader-text style to storybook

* add styles for input error validation to text input

* improve styling for ValidationInputError component

* add validation error handling to TotalsCouponCode component

And story

* make sure errors are cleared on successful receive/remove item

* dispatch loading cancellation on catching errors

This is needed because loading would be cancelled before the error is thrown so any error handling after the thrown error will not be able to rely on loading.

* implement validation setting for coupon errors

* add error color to labels on inputs too

* fix borders back and force border color

* remove extra structure and improve validation error with alignment for coupon code

* add aria-describedby for text inputs

* add back in validation context provider to fix rebase issue

* rework validation so it works for both checkout and cart

* Some styling tweaks

* more style fixes

* remove unnecessary method

* make sure new function is included in context defaults

* package.lock update? seems harmless so rolling with it.
2020-03-17 12:45:33 +01:00
Darren Ethier cdfb457341 Add snackbar notices to notices system and implement for coupon ui/ux (https://github.com/woocommerce/woocommerce-blocks/pull/1973)
* add snackbarnotices to notices system

* implement snackbar notices for coupon code ui

* improve styles with mobile styles as well

* some more css fixes

* use native filter

* remove usage of lodash filter and dont’ output container if there are no regular notices

* remove unnecessary duplication of styles

- load default snackbar styles from WordPress components
- override for frontend to make them fixed to the window (including mobile treatement).

* simplify css class generation (save some bytes)

* improve proptypes definition

h/t: @aljullu

* consistent style handle name

* increase bundle size budget
2020-03-16 16:57:12 -04: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
Seghir Nadir 3e7a2d41e4 disable coupon button if the field is empty (https://github.com/woocommerce/woocommerce-blocks/pull/1977) 2020-03-16 14:15:35 +01:00
Albert Juhé Lluveras 361d924c11 Fix layout issues after merges (https://github.com/woocommerce/woocommerce-blocks/pull/1968)
* Fix address form layout broken because select was occupying too much space

* Fix shipping rates appearing in the Checkout sidebar

* Center button text
2020-03-16 14:13:04 +01:00
Darren Ethier 80f692404f Refactor Cart to include shippingAddress (https://github.com/woocommerce/woocommerce-blocks/pull/1960)
* Include shipping and billing address data in cart schema

* update cart hook (and data api) with new properties from endpoint

* add use-shipping-address hook and implement in use-shipping-rates

* update usages of useShippingRates through code

* update tests for use-shipping-rates

* update use-payment-method-interface and typedef to remove country field

This is provided reliably via the shippingAddress now.

* restore pluck comparison to effect.

Also added some clarification docs for why `iniitalAddress` is not included in the effect dependencies.

* remove billingAddress from cart schema

* clear city and postcode when changing country

* Update REST Api schemas aftere rebase

- CustomerSchema no longer exists
- Added ShippingAddressSchema implemented by Cart and Order schemas
- fix broken js because of bad merge conflict resolution.

* remove duplicate keys
2020-03-13 15:04:03 -04:00
Albert Juhé Lluveras 5d1d8f0394 Add Order Summary card to Checkout sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/1959)
* Add missing props to sidebar-layout components

* Move specific CSS class to checkout block

* Add comment on top of @wordpress/components styles in webpack entry

* Make it so our styles load after vendor styles

* Remove unnecessary @todo comment

* Add Order Summary card to Checkout sidebar

* Improve responsive layout

* Increase cart.js bundlewatch size

* Remove wrong comment

* Remove unnecessary usage of useStoreCartItemQuantity

* Refactor layout so the product description can occupy more width

* Move paddings to the button so focus styles look better
2020-03-13 16:49:33 +01: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
Mike Jolley 128ac6d63d Refactor cart shipping settings and shipping calculator (https://github.com/woocommerce/woocommerce-blocks/pull/1943)
* Move cart attributes to attributes file

* Stop feedback prompt jumping around; consolodate strings

* Update option labels and descriptions

* Match checkout save function

* hasShippingRate helper

* Refactor full cart/frontend views for shipping calc

* Add hasShippingAddress to useShippingRates hook

* Initial shipping calculator in totals row implementation

* Create cart context

* Update preview data to match API response

* Use context provider for cart

* Provide default cart item for placeholder with correct shape

* Remove outdated shape validation from cartlineitemrow

* Use preview data in editor context

* Tidy up components

* Tests/lint

* Update assets/js/base/components/totals/totals-shipping-item/has-shipping-rate.js

Co-Authored-By: Seghir Nadir <nadir.seghir@gmail.com>

* No need to camel case previewdata

* Use isValidElement

* Implement EditorContext

* Use select if no post is given

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2020-03-13 13:41:59 +00:00
Albert Juhé Lluveras 1c81066bc4 CSS editor fixes for Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/1949)
* Set min-height to 0 for Country & State hidden inputs

* Fix button styles broken in the Cart block in editor

* Avoid having editor.scss specific stylesheets for button and totals

* Move Button inside cart-checkout subfolder
2020-03-13 12:02:08 +00:00
Seghir Nadir f55adc41cb Fix select rates when multiple packages exists (https://github.com/woocommerce/woocommerce-blocks/pull/1945)
* Select rates when multiple packages exists

* switch to using package_id

* update docs

* ponyfill fromEntries

* revert useShippingRates fromEntries fix
2020-03-12 10:59:43 +01:00
Albert Juhé Lluveras 2147e8a22a Add checkout sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/1921) 2020-03-12 10:41:35 +01:00
Darren Ethier 09248192c2 Fix invalid coupon thrown error and form not connected console warning. (https://github.com/woocommerce/woocommerce-blocks/pull/1952)
* remove throwing errors if there’s an error in state.

These type of errors should be surfaced to user as needed via an error notice, not as a blocking error boundary. Error boundary should only be for non-recoverable errors.

* prevent default behaviour for applyCoupon button
2020-03-11 16:23:14 -04: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 e6dfe243f9 Switch out usage from withComponentId to tree-shaken withInstanceId (https://github.com/woocommerce/woocommerce-blocks/pull/1923) 2020-03-10 14:40:30 +00:00
Darren Ethier 2aa2093dfb Add contexts for checkout (https://github.com/woocommerce/woocommerce-blocks/pull/1915)
- restructures `@woocommerce/base-context` imports so it pulls from `index.js` in the `base/context` folder. That way tree-shaking will be used if possible. This also helps with organizing the folder structure a bit better for the new contexts.
- Fixes all the various imports through the code due to the above change.
- Adds `CheckoutContextProvider`, `useCheckoutContext` and related files.
- Adds `PaymentMethodDataProvider`, `usePaymentMethodDataContext` and related files.
- Adds `ShippingMethodDataProvider`, `useShippingMethodDataContext` and related files.
- Adds typedefs used for the various context interfaces.
2020-03-10 09:39:21 -04:00
Seghir Nadir 5ca0593fbd Default to the first state when selecting a country with states (https://github.com/woocommerce/woocommerce-blocks/pull/1919)
* default to the first state

* Update assets/js/base/components/state-input/state-input.js

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

Co-authored-by: Albert Juhé Lluveras <aljullu@gmail.com>
2020-03-10 13:27:58 +01:00
Mike Jolley 514642395a Prevent wp.components loading on frontend (https://github.com/woocommerce/woocommerce-blocks/pull/1918)
* Avoid importing @wordpress/components in icon library

* Avoid @wordpress/compose and @wordpress/components in `base`

* Move hocs used on frontend to base

* Revert "Move hocs used on frontend to base"

This reverts commit bf09016fdc2fc1bea2f465018fecc76945f69d5e.
2020-03-10 11:20:40 +00:00
Seghir Nadir 952638a3ed Link shipping form fields to shipping rates to load them. (https://github.com/woocommerce/woocommerce-blocks/pull/1890)
* add plukedAddress util function in order to use it for shallowEqual

* refactor useShipping so it accepts and returns the address

* refactor fields

* fix test and return shippingRates to hook

* remove unneeded shippingAddress from ShippingRatesControl

* move keys logic to hook

* refactor tests again

* increase cart size
2020-03-10 11:55:19 +01: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
Mike Jolley 168ce52935 Include address fields in the AddressForm component (https://github.com/woocommerce/woocommerce-blocks/pull/1892)
* Move default address fields to blocks; normalise address i18n

* Use optionalLabel and other props from addressFields

* Fix apartment field display

* Country address fields

* Fix default field order

* Update for countries with no states

* Add type defs
2020-03-09 14:23:16 +00:00
Albert Juhé Lluveras b7da7ad198 Make Shipping packages collapsible in Cart page (https://github.com/woocommerce/woocommerce-blocks/pull/1867)
* Make Shipping packages collapsible in Cart page

* Fix Cart block radio controls not looking properly in the editor

* Simplify CSS
2020-03-09 12:28:26 +01:00
Seghir Nadir e769516758 better default to array and use length as condition (https://github.com/woocommerce/woocommerce-blocks/pull/1891) 2020-03-06 15:40:07 +00:00
Albert Juhé Lluveras 427a229591 Split Full Cart sidebar totals into several components (https://github.com/woocommerce/woocommerce-blocks/pull/1885) 2020-03-06 12:27:54 +00:00
Mike Jolley 1942491822 Checkout Block: Add Legal links (https://github.com/woocommerce/woocommerce-blocks/pull/1881)
* Create policy component

* Create page constants

* Add toggle options

* Update assets/js/base/components/checkout/policies/style.scss

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

* Update assets/css/editor.scss

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

* Feedback

* update snapshot

Co-authored-by: Albert Juhé Lluveras <aljullu@gmail.com>
2020-03-06 12:20:17 +00:00
Mike Jolley 0a722b1708 Cart and checkout error boundaries (https://github.com/woocommerce/woocommerce-blocks/pull/1853)
* Add error boundries

Revert block error move

webpack config

fix path

* type in config

* change text allowed type

* Pass error boundary props to renderfrontend

* Editor error boundaries

* Add errorMessagePrefix

* merge rules

* Remove <disabled>

* Update reload page link
2020-03-06 11:43:40 +00:00
Albert Juhé Lluveras 20da4900c2 Add styling to checkboxes (https://github.com/woocommerce/woocommerce-blocks/pull/1880)
* Add styling to checkboxes

* Add resets for some themes

* Simplify props
2020-03-06 11:26:03 +01:00
Seghir Nadir 2c8388f0a8 Update and select shipping rates dynamically (https://github.com/woocommerce/woocommerce-blocks/pull/1794)
* add select shipping endpoint to router

* add select shipping method

* add selected rates to cart

* better select rates

* move schema function to seperate function

* move validation to Cart Controller

* fix wrong session key

* Update shipping/cart endpoints (https://github.com/woocommerce/woocommerce-blocks/pull/1833)

* Items should not have keys in API response

* Include package ID in response (this is just a basic index)

* /cart/select-shipping-rate/package_id

* Add package_id to package array

* Update responses and add shipping-rates to main cart endpoint

* update-shipping endpoint

* Add querying selected shipping rate to the store (https://github.com/woocommerce/woocommerce-blocks/pull/1829)

* add selecting shipping to store

* directly call useSelectShippingRate

* refactor cart keys transformation to reducer

* remove selecting first result and accept selecting

* move update shipping to new endpoint

* pass selected rates down

* select shipping right directly and fix editor issues

* fix some broken prop types

* key -> package id

* Update and fix cart/shipping-rate tests

* fix case for when rates are set

* Update useShippingRates test

* add args to rest endpoint

* move selecting shipping rate logic to hook

* fix some naming issues

* update propTypes

* update action call

* fully watch cart state

* address review issues

* fix prop type issues

* fix issue with rates not loading in checkout

* remove extra package for shipping

* move ShippingCalculatorOptions to outside

Co-authored-by: Mike Jolley <mike.jolley@me.com>
Co-authored-by: Albert Juhé Lluveras <aljullu@gmail.com>
2020-03-05 20:54:05 +01:00
Mike Jolley 52feba4f85 Add skeleton markup to the cart block (https://github.com/woocommerce/woocommerce-blocks/pull/1866)
* Add skeleton markup

* Add shipping title to skeleton and match styling/spacing

* Combine skeleton and loading styles
2020-03-05 14:15:28 +00:00
Mike Jolley dd54ce1136 Checkout form options to control field visibility (https://github.com/woocommerce/woocommerce-blocks/pull/1868)
* Fix background overlap of feedback box

* TS notices

* Add company name toggle

* Implement new attributes and toggles in editor

* Handle field config in address component

* Remove other hoc rule from tsconfig

* map -> forEach

* Remove return from forEach

* Export and extend field config

* Fix optional text for all field types

* unit text

* Update snapshot
2020-03-05 13:06:47 +00:00
Albert Juhé Lluveras 2544ffd7d1 Option to 'use shipping address for billing': add attribute and make it work in the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/1857)
* Create useShippingAsBilling attribute

* Fix missing prop

* Refactor FormStep so stepNumber is generated by CSS instead of being passed as a prop

* Add billing address form

* Add text before controls

* Remove old @todo comment
2020-03-04 15:13:38 +00:00
Albert Juhé Lluveras e2f769eedf Do not allow focus on Country and State input hidden fields (https://github.com/woocommerce/woocommerce-blocks/pull/1842) 2020-03-04 14:35:18 +00:00
Albert Juhé Lluveras e97ffd2821 Hide package name when there is only one (https://github.com/woocommerce/woocommerce-blocks/pull/1852) 2020-03-03 12:38:21 +00:00
Albert Juhé Lluveras 81c09d180b Create AddressForm component and change its fields dynamically based on country (https://github.com/woocommerce/woocommerce-blocks/pull/1847) 2020-03-03 11:46:53 +01:00
Mike Jolley d3a9dc3d6b Create Context Provider for Notices w/ Notices API (https://github.com/woocommerce/woocommerce-blocks/pull/1843)
* Working on store provider

* Working on store provider

* Reducer implementation

* Implement core/notices

* Add notices to store coupon hook with context

* Improve store notice text and styling

* Improve JS side API for notices

* Wrap functions with context additon

* Update test to []

* Implement props feedback and useInstanceId

* Update assets/js/base/context/store-notices-context.js

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

* Update assets/js/base/context/store-notices-context.js

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

* remove instance id

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-03-03 10:26:02 +00:00
Rua Haszard 201cb4ff50 Support updating quantity of cart items & sold_individually product option (https://github.com/woocommerce/woocommerce-blocks/pull/1824)
* first cut - removing an item from cart:
- add actions to cart store for removing an item and keeping track of
pending removal API call
- add reducer logic for storing pending state on an item, and removing
an item
- expose removeCartItem on new useStoreCartItems hook
- hook it up to remove link / trashcan icon in row item

* disable cart quantity picker/remove link while API request in progress:
- expose cart item pending status from store using selector
- use selector to disable quantity related components in line item row

* add typedef for cart items store object provided by hook

* allow user to change quantity of cart items (first cut):
- add action for replacing a cart item in the store
- add generator action for changing quantity
- expose change quantity action on useStoreCartItems hook
- hook up to quantity UI in cart block
(work in progress)

* post-rebase fixes & fix broken typedef:
- rework cart item change quantity callback - now supplies item key like
remove callback
- fix hook StoreCartItem return value typedef - single item with
specified key, was array of all items
- add quantity JSDoc for changeCartItemQuantity action
- remove changeQuantity callback from UI (currently infinite looping)

* fix bug in recieveCartItem reducer - check keys for equality:
- was key === object

* fix invalid url in POST cart/items/quantity request

* hook up cart line item quantity to API:
- remove internal state/ref for QuantitySelector, is now a controlled
component
- call changeQuantity action from QuantitySelector change callback

* QuantitySelector no longer needs a ref to wrangle number input value

* hoist quantity state out of QuantitySelector into story (fix storybook)

* add product sold_individually option to cart item API response

* limit sold_individually items to 1 per cart/order:
- support optional max value in QuantitySelector
- set maximum dependent on sold_individually API field

* prevent user from requesting zero x cart item (API 500 errors):
- add minimum limit to QuantitySelector
- default limit to 1
+ fix bug with limiting to maximum value in number input change handler

* remove useStoreCartItems, zombie hook coming back from rebase 🧟‍♂️

* address various review feedback:
- inline undefined check, don't use lodash
- quantityInputOnKeyDown callback hook depends on canIncrease/canDecrease
- also removed undefined check for minimum, as minimum has default 0

* use safer typeof check for presence of maximum prop
2020-03-03 14:08:19 +13:00
Rua Haszard bb637bbaa3 support disabled QuantitySelector [in progress] (https://github.com/woocommerce/woocommerce-blocks/pull/1823)
* add basic story for QuantitySelector (so can easily test disabled)

* add disabled prop to QuantitySelector:
- apply to all input controls
- add storybook knob for testing
- use disabled grey for number edit when disabled

* fix indentation of jsdoc comment (linter is coming)

* use self-closing tag in QuantitySelector story

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

Co-authored-by: Albert Juhé Lluveras <aljullu@gmail.com>
2020-02-28 09:52:18 +13:00
Albert Juhé Lluveras 185149f2bd Persist previous shipping rates while loading and show its package name (https://github.com/woocommerce/woocommerce-blocks/pull/1806)
* Persist previous shipping rates while loading

* Refactor ShippingRatesControl LoadingMask

* Show package name

* Simplify CSS to avoid using the adjacent selector

* Add comment to explain why 'selected' is hardcoded in the editor

* Rename package 'index' to 'key'
2020-02-27 19:28:36 +01:00
Mike Jolley d4e843fd65 Update snapshot to fix broken tests 2020-02-27 11:53:12 +00:00
Mike Jolley 6ac5b8288f Add chip component for coupons in the cart (https://github.com/woocommerce/woocommerce-blocks/pull/1807)
* Chip componet and styling

* Tests

* Move coupon code for API requests to body - fixes issues with coupon codes containing special characters

* Implement chip component in cart page

* Revert "Move coupon code for API requests to body - fixes issues with coupon codes containing special characters"

This reverts commit ac5a72f55d51d939bb989f3936e28cf993af19a6.

* Update comment

* prevent overflow

* Add screen reader text for coupon name

* Adjust icon alignment and padding/hit box

* update string
2020-02-26 17:09:18 +00:00
Albert Juhé Lluveras 7603b1391f Checkout block: don't show message of missing shipping options if they are already set (https://github.com/woocommerce/woocommerce-blocks/pull/1804)
* Checkout block: don't show message of missing shipping options if they are already set

* Use 'wc_get_shipping_method_count' to check if shipping methods are created

* Fix frontend error

* Check  exists before calling a method on it

* Fix Configure Shipping Options button mispositioned in last Gutenberg release
2020-02-26 15:50:53 +00:00
Albert Juhé Lluveras 1deb0f853c Fix radio control styles in editor (https://github.com/woocommerce/woocommerce-blocks/pull/1817) 2020-02-26 13:02:48 +00:00
Albert Juhé Lluveras 11f5210297 Wrap Coupon code input/button in a <form> element (https://github.com/woocommerce/woocommerce-blocks/pull/1818)
* Wrap Coupon code input/button in a <form> element

* Add back row class
2020-02-26 13:48:16 +01:00
Mike Jolley 6d7fdf50e0 Allow coupons to be applied and removed from the cart (https://github.com/woocommerce/woocommerce-blocks/pull/1790)
* useStoreCartCoupons hook

* Apply coupon w/ basic error handling for the fetch

* Basic store specifically for cart data

* Working on error states

* Show error on coupon fail

* removeCoupon action

* Added extra endpoints for more efficient cart queries

* Apply/remove coupons working

* Track applying/removing state

* StoreCartCoupon typedef

* Use coupon code on index

* Remove custom controls definition

* Adjust storecartcoupons mapper and remove ref

* Move cartData defaults and remove ref

* Call API directly, avoid schema lookup

* Improved selectors

* StoreCart typedef

* Split up cart state data and add more typedefs

* Add API tests for apply/remove coupon

* Jest tests

* Move default cart data to constant

* Comment indentation
2020-02-25 11:36:53 +00:00
Albert Juhé Lluveras d803f6cc64 Add product name and quantity to cart shipping rates endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/1783)
* Add product name and quantity to cart shipping rates endpoint

* Make text accessible

* Add styling

* Create Packages component

* Add preview shipping rates to editor

* Add onChange default value

* Order props

* Use CSS instead of JS to render commas between package elements

* Change quantity type to number instead of integer
2020-02-25 10:32:59 +01:00
Albert Juhé Lluveras 4a5ad79823 Add style to radio control (https://github.com/woocommerce/woocommerce-blocks/pull/1789) 2020-02-24 13:30:09 +00:00
Albert Juhé Lluveras f0239d6378 Make Shipping Calculator Button type="submit" (https://github.com/woocommerce/woocommerce-blocks/pull/1785) 2020-02-21 16:26:27 +00:00
Mike Jolley 3e6f8fe6a6 Add isLoading property (https://github.com/woocommerce/woocommerce-blocks/pull/1788) 2020-02-21 14:08:57 +00:00
Mike Jolley 806cd76987 Display selected shipping location in cart block (https://github.com/woocommerce/woocommerce-blocks/pull/1767)
* county->state clarity

* Show formatted address
2020-02-19 17:14:41 +00:00
Seghir Nadir 90a7579461 Add Shipping settings to Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/1561)
* add cart settings

* address typos

* update how settings should work

* get settings from woo and pass them to frontend

* reapply condition

* fix issue with attributes not presisting

* abstract shipping control

* rename constants

* update props in frontend

* fix bug with attributes not presisting

* conditionally display prices

* use country to decide to show prices

* disable shipping if shipping is not enabled

* enable coupons by default
2020-02-19 17:33:10 +01:00
Mike Jolley 2a25cfd0ed Implement browser autocomplete for checkout address fields (https://github.com/woocommerce/woocommerce-blocks/pull/1755)
* Add autocomplete support for textinput

* Add autocomplete fields to forms

* Prefix default ids

* Hack for autocomplete on custom select components

* Restore labels and avoid reset of state

* State field autocomplete

* Fix calculator autocomplete

* Simplify existance of hidden field

* move label on autofill preview in chrome

* Put back state clearance

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2020-02-19 15:10:26 +00:00
Albert Juhé Lluveras 7b53486be3 Add loading state to shipping rates selector (https://github.com/woocommerce/woocommerce-blocks/pull/1764)
* Add loading state to shipping rates selector

* Add screenReaderLabel specific for ShippingRatesControl

* Rename LoadingComponent to LoadingMask
2020-02-19 11:51:15 +01:00
Mike Jolley 45119716ed Add catalog visibility arg to product query attributes (https://github.com/woocommerce/woocommerce-blocks/pull/1753)
* Add catalog visibility arg to product query attributes

* catalog visibility
2020-02-17 16:16:01 +00:00
Albert Juhé Lluveras 6736a9d94a Add ShippingCalculator component (https://github.com/woocommerce/woocommerce-blocks/pull/1559)
* Create ShippingCalculatorAddress block

* Make 'change address' button to open/close the address form

* Create ShippingCalculator component

* Use CountryInput and CountyInput instead of TextInputs

* Fix city value not being set

* Fix shipping rate not appearing when there was only one option

* Unify postalCode and postCode to postcode

* Rename 'county' to 'state'

* Add reset styles for popular themes

* Increase cart-frontend.js max size
2020-02-17 12:12:15 +01:00
Albert Juhé Lluveras 69f49760a8 Create CountyInput component (https://github.com/woocommerce/woocommerce-blocks/pull/1727)
* Split CountryInput and Select

* Create County Input

* Show text input when there are no county options

* Reset county value when changing country

* Fix keyboard navigation

* Hide checkmark

* Add reset styles for several popular themes

* Add country prop to ShippingCountyInput
2020-02-14 13:30:33 +01:00
Albert Juhé Lluveras a30615e2cb Hook up shipping methods to API (https://github.com/woocommerce/woocommerce-blocks/pull/1468)
* Create ShippingMethodsControl component

* Hook up shipping methods to API

* Add support for several packages

* Add tests to useShippingRates

* Fix shipping_rates property name

* Only show the products list if there are several packages

* Use <FormattedMonetaryAmount> to display shipping rate prices

* Make 'country' optional in CartShippingRates

* Make CartShippingRate API return currency info

* Minor improvements

* Fix shipping fields hidden in editor

* Fix missing currency in Checkout shipping rates selector

* Add links to issues in @todo comments

* Improve ShippingRatesControl useEffect

* Remove unnecessary tab

* Remove unnecessary id in RadioControl

* API: Add error when country is invalid

* Debounce shipping rates API requests

* 'Country key' -> 'Country code'

* Don't display radio input when there is only one option

* Add message when there are no results

* Minor enhacements

* Remove unnecessary Fragment

* Simplify RadioControlOption export

* Refactor 'renderOptions' and split it into several components

* Prevent Card sidebar from taking too much width

* Move country request check outside of the loop

* Fix failing test
2020-02-14 04:43:13 +01:00
Albert Juhé Lluveras 85291159ae Fix Reviews blocks loading @wordpress/element in the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/1719) 2020-02-11 15:41:50 +01:00
Seghir Nadir bfb2f33bfd add new icons and remove old ones (https://github.com/woocommerce/woocommerce-blocks/pull/1644)
* add new icons and remove old ones

* add docs

* add notes and remove gridicons

* update to folderStarred

* typos

* reorder imports

* update prop name to srcElement

* validate element

* fix bad import

* lowecase folderStarred

* add propTypes
2020-01-31 19:20:33 +01:00
Mike Jolley ca8efd7c3e Add API fetch error handling (https://github.com/woocommerce/woocommerce-blocks/pull/1687)
* initial experiment for fetch error handling

* throw error from api response error (this allows for catching it in the stream)

* Add ERROR action type

* Controls: resolve with an error response object rather than throw exception

* remove try catch from resolver; just yield correct object based on presence of any errors

* Make the use collection hook return an error.

* Small tidy up in use-store-products

* Throw exception from Use Collection - useState is needed for the exception to work inside a hook (see comments)

* Show error code from API in error message

* Update assets/js/base/components/block-error-boundary/block-error.js

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

* Update assets/js/base/components/block-error-boundary/style.scss

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

* Remove comment

* Handle api error in boundry

* Use reject in promise

* Return error message by default which may be undefined (this is ok)

* Update mocks so tests pass again

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
Co-authored-by: Albert Juhé Lluveras <aljullu@gmail.com>
2020-01-31 13:01:34 +00:00
Rua Haszard 7f44458418 Basic storybook implementation (https://github.com/woocommerce/woocommerce-blocks/pull/1636)
* install & configure storybook (via magic npx script)

* fix indentation in storybook generated files

* eslint ignore generated storybook files (for now at least)

* unhide storybook folder, consistent with Gutenberg project

* demo story for one of our components (with no css/styles)

* hack in scss webpack config & add story for button:
- fixes scss imports breaking storybook build
- note scss / styling doesn't work yet
+ organise our component stories into folder

* git ignore storybook-static build folder

* pin dependencies for storybook

* piggy-back off main webpack config for storybook module.rules (for scss)

* use gutenberg (wp-components) styles in storybook

* use system font for storybook, consistent with wp-admin/gberg and reasonable default for components in front end

* add --ci flag to prevent storybook opening new browser tab…
- see also https://github.com/storybookjs/storybook/issues/6201

* rename default stories to Default (following Gutenberg pattern)

* add story for ErrorPlaceholder

* failing ProductPreview story (committing to PR as an example for discussion)

* storybook for components/icons

* fix aliased dependencies in components for storybook:
append our webpack aliases to storybook webpack config

* basic story for PriceSlider (looks right but interaction broken)

* fix PriceSlider user interaction:
- PriceSlider expects client to handle onChange and pass in new min/max

* add comment about priceslider max/min (todoish)

* remove default stories from storybook scaffolding

* organise stories by module (aka folder in codebase)

* package-lock update after rebase

* remove unnecessary ignores (default stories are gone)

* delete experimental/risky/broken stories:
- icons components are changing in woocommerce/woocommerce-blocks#1644
- we need to refactor/do more work to get ProductPreview working (settings globals)

* remove unnecessary import

* clarify PriceSlider component intended usage comment in story

* remove redundant wrapper divs from stories

* add common storybook addons (used by Gutenberg storybook)

* rebuild package.lock after rebase

* remove unnecessary wrapper div

* package fixes after rebase

* add configuration for storybook source loader

* add decorators for a11y and knobs plugins

* remove unnecessary react import & import useState from WP

Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-01-31 09:59:14 +13:00
Albert Juhé Lluveras c8f297a700 All Products & filters accessibility improvements (https://github.com/woocommerce/woocommerce-blocks/pull/1656)
* Add aria-label to All Products ratings

* Add specific screen reader text to some buttons

* Increase All Products regular price color constrast

* Remove invalid CSS declaration

* Make styleint-disable comment more specific

* Attributes Filter: make input non-focusable if we display the 'change filter' button

* Improve translator documentation

* Hide price slider from screen readers if price inputs are enabled

* Linting fixes

* Price slider: make it non-focusable if input fields are displayed

* All Products: announce how many products were found

* All Products: announce when a filter is removed

* Revert "All Products: announce when a filter is removed"

This reverts commit 2c861bf1b988155313ad44bafbcaf3f4f1549296.

* Pagination component: improve screen reader texts

* Filter submit button: improve screen reader texts

* Remove unnecessary text

* Improve comment

* Use %d for numeric values

* Add label and screenReaderLabel props to FilterSubmitButton component
2020-01-30 11:04:39 +01:00
Mike Jolley b65b93e7e7 Rename the "Align Buttons" option for the All Products Block (https://github.com/woocommerce/woocommerce-blocks/pull/1659)
* Allow css to work for any element

* Rename option to specific last block rather than button
2020-01-29 10:28:40 +00:00
Mike Jolley dcf5bfa67e Fix RTL price slider display issues (https://github.com/woocommerce/woocommerce-blocks/pull/1651)
* Fix slider image direction with RTL

* Fix track position under RTL
2020-01-27 15:16:19 +00:00
Albert Juhé Lluveras 7f048ec9c4 Product grid blocks: display rating stars in the editor (https://github.com/woocommerce/woocommerce-blocks/pull/1650) 2020-01-27 13:56:32 +01:00
Seghir Nadir 7e81841e83 Fix issue in order by date (https://github.com/woocommerce/woocommerce-blocks/pull/1598)
* fix order by of date order in products
2020-01-20 00:00:43 +01:00
Albert Juhé Lluveras 09f2c626f9 Make TextInput respect prefers-reduced-motion preference (https://github.com/woocommerce/woocommerce-blocks/pull/1588)
* Make TextInput respect prefers-reduced-motion preference

* Reverse prefers-reduced-motion check
2020-01-18 10:39:13 +01:00
Albert Juhé Lluveras cad3e72769 Create CountryInput component (https://github.com/woocommerce/woocommerce-blocks/pull/1585)
* Create initial CountryInput component

* Create ShippingCountryInput

* Create BillingCountryInput

* Make backgrounds white

* Correctly align options

* Add CSS resets for 20xy themes

* Fix wrong defaults in countries constants

* Make CountryInput respect 'prefers-reduced-motion'

* Reverse prefers-reduced-motion check

* Set max-width to CountryInput dropdown

* Use decodeEntities to print country names

* Avoid unnecessary JSON enconding and later parsing

* Make sure country name is also encoded when selected

* Fix countries default value
2020-01-17 17:58:08 +01:00
Mike Jolley 86b8b7779c Add Quantity selector component for cart line items (https://github.com/woocommerce/woocommerce-blocks/pull/1558)
* Implement quantity selector component

* Improve default appearance

* Remove underline

* Add aria speak

* Improved keycode handling

* Add focus styles to buttons and inputs

* Increase constrast
2020-01-15 11:32:54 +00:00
Rua Haszard 86dca691e5 show discount on cart line items & price styling (https://github.com/woocommerce/woocommerce-blocks/pull/1548)
* show discount on cart line items (no styling)

* style line item discount badge + use correct colors for prices

* show full price inline on mobile

* move all responsive tweaks for cart prices to explicit breakpoints

* add nowrap to FormattedMoneyAmount so prices don't ever wrap

* fix misaligned full price on mobile when prices are large (edge case):
- if price strings are long, the full price stacks above line total
- previous right-margin on full price showed prices misaligned

* allow client code to add class(es) to FormattedMonetaryAmount

* add nowrap so discount badge doesn't wrap

* remove unnecessary span from discount badge +
+ more explicit `display` style for different price column elements
2020-01-15 09:52:42 +13:00
Albert Juhé Lluveras 11a033d862 Make RadioControl id optional (https://github.com/woocommerce/woocommerce-blocks/pull/1563) 2020-01-14 21:21:29 +01:00
Albert Juhé Lluveras 1dfcb18a90 Make TextInput id optional (https://github.com/woocommerce/woocommerce-blocks/pull/1560) 2020-01-14 20:10:50 +01:00
Seghir Nadir 5c82b2d718 add fieldset and legend to FormStep component (https://github.com/woocommerce/woocommerce-blocks/pull/1400)
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
2020-01-13 10:21:20 -05:00
Albert Juhé Lluveras bd2b8cb279 Add Cart totals to Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/1411)
* Add Cart totals to Cart block

* Accessibility improvements

* Load vendors styles separately

* Use same shipping placeholders for cart and checkout

* Refactor how we import @wordpress/components styles so only panel styles are imported

* Remove style-loader from vendors styles build process

* Add htmlFor attribute to TotalsCouponCodeInput

* Update totalItems shape to match API

* Fix wrong total items shape using numbers instead of strings

* Rename wc-blocks classes to wc-block

* Remove unnecessary parseInt()

* Add radix to parseInt()

* Rename totalRows to totalRowsConfig

* Move placeholder content out of the component

* Use Card component for cart's sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/1423)

* Use Card component for cart's sidebar

* Split RadioControl component

* No need to use Label in RadioControlOption

* Remove no longer valid @todo comment

* Use 'checked' prop instead of 'selected' in RadioControlOption

* Rename wc-blocks classes to wc-block

* Rename wc-blocks classes to wc-block (II)

* Make sure radio control ids are unique using withComponentId

* Load PanelBody and PanelRow from last version of @wordpress/components

* Create vendors-frontend.js file

* Load wordpress-component instead of @wordpress/components from <Button> component

* Only load 'withRestApiHydration' HOC

* Make vendors-frontend a dependency of cart-frontend script

* Revert "Only load 'withRestApiHydration' HOC"

This reverts commit 9f9b9759a98047b26e7d8f04189ffe78c1d5bb06.

* Fix fieldset background
2020-01-10 15:37:27 +01:00
Rua Haszard 0763655d42 Cart block: line-items front end initial work (https://github.com/woocommerce/woocommerce-blocks/pull/1333)
* render block on front end, add `Shopping cart` heading (baby steps)

* fake data for editing full cart + show line count in header

* add note about core/html using `is-active` class for toggle state

* reinstate work-in-progress full cart component (lost in rebase)

* reinstate full cart from master

* component for full cart title & item count + margin tweaks:
- add margin between main cart & sidebar
- add margin after cart block

* add cart items sample data + factor sample product image to module

* use sample cart data for item count

* basic table of cart line items (no styling)

* prettification

* show images for cart line items + initial table styling

* cart quantity selector component (work in progress)

* use state for cart product quantity, allow incr/decr from UI (WIP)

* replace WIP custom quantity control with number edit (temporary)

* correctly format cart line item total price

* align cart item columns with headings + indent image on desktop

* tweak css for cart line item padding on mobile so it's more explicit

* show cart line item full price if discounted

* add placeholder for cart remove item link

* switch cart table to flex layout (was table)…
This will allow us to move things around for mobile/responsive layout.

* only show cart items table header on desktop

* more cart items styling - row borders, appropriate padding +
+ move image width to variable
+ fix class name plurality for row (item not items)

* use standard $gap instead of 1em for padding/margins

* responsive (mobile) layout for cart line items:
- shift line $ total to bottom right
- stack quantity selector in product info column

* remove extraneous cart table padding on mobile

* comment about unused styles for quantity selector component

* add follow up issue for todo

* remove inappropriate href

* render srcset & sizes for cart line item product image

* remove todo comment

* switch back to table markup for cart items (in progress):
- table is more semantic, associates headers with columns

* cart line items column widths - product column is larger (60%)

* reinstate table row borders

* bottom-align line item price on mobile

* cart contents heading should be H2 + prettify

* remove unused QuantitySelector code/styles, rename main class in line with BEM

* defaults for QuantitySelector props

* variable/property name tidies - match conventions/API

* fix bug: line total price is only bottom-align on small screen

* move QuantitySelector to root of components, intended to be generally useful

* use lineItem directly for cart, specify shape in PropTypes

* rename cart components to align with "line item" rather than "product"

* rejig class names to better align with new component names & BEM style

* show cart item image correct size:
- use single column for product image and info, with flex container
- specify image width (rem instead of px)

* fix safari issue - cart product images displaying vertically stretched

* shift product name left margin from image, to account for no-image case

* experiment: bump bundlewatch size limit for cart temporarily:
- our fake data inline image is heavy
- when we switch to real API we will no longer need it

* fix issue introduced when moving margin from image to details div:
- product details needs margin on left (not right)

* fix react props issues:
- explicitly destructure image props for srcSet (vs srcset)
- use API key field for line item key instead of id, fix duplicate test id
- CartLineItemsTable takes an array of lineItems (incorrect PropTypes)

* remove redundant divs + use conventional `null` (when no full price)

* override editor styles to ensure cart product image is correct size

* move cart items editor style override to editor.css

* add an explicit readable heading for cart heading to match visual layout
2020-01-10 11:50:14 +13:00
Albert Juhé Lluveras 24fba4880b Fix minor issues with TextInput component (https://github.com/woocommerce/woocommerce-blocks/pull/1523)
* Set default value to TextInput component

* Set TextInput label transition origin

* Set default onChange function prop to noop

* Fix wrong propType name

* Remove default onChange and set it required
2020-01-09 19:06:49 +01:00
Darren Ethier b68b66542b add padding zeros to displayed prices (https://github.com/woocommerce/woocommerce-blocks/pull/1520) 2020-01-08 15:10:29 -05:00
Albert Juhé Lluveras 4be59b5ad1 Add ESLint radix rule (https://github.com/woocommerce/woocommerce-blocks/pull/1512) 2020-01-08 10:48:43 +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
Albert Juhé Lluveras e082a14e3b Rename checkout classes from 'wc-blocks-xyz' to 'wc-block-xyz' (https://github.com/woocommerce/woocommerce-blocks/pull/1449)
* Rename checkout classes from 'wc-blocks-checkout' to 'wc-block-checkout'

* Rename form components classes from 'wc-blocks-checkout' to 'wc-block-checkout'

* Rename 'wc-components' class names to 'wc-block'
2020-01-03 15:23:49 +01:00
Albert Juhé Lluveras 5701f7d6c9 Price filter: allow any numeric input (https://github.com/woocommerce/woocommerce-blocks/pull/1457)
* Price filter: allow any numeric input in inputs

* Price filter: allow negative numbers in input fields (https://github.com/woocommerce/woocommerce-blocks/pull/1458)

* Price filter: allow negative numbers in input fields

* Always update input fields based on minPrice and maxPrice

* Don't default values to 0
2020-01-02 14:07:59 +01:00
Albert Juhé Lluveras a538771bc1 Make price slider accurately represent the selected price independently from step (https://github.com/woocommerce/woocommerce-blocks/pull/1453) 2020-01-02 12:10:41 +01:00
Seghir Nadir aaddf13494 Add type to checkout input fields (https://github.com/woocommerce/woocommerce-blocks/pull/1401)
* add input type

* fix css issues with types and better change default position
2019-12-19 13:59:34 +01:00
Seghir Nadir ca506d0a48 fix translation quantities (https://github.com/woocommerce/woocommerce-blocks/pull/1415)
* fix translation quantities

* update i18n comments and add variable
2019-12-19 10:22:53 +01:00
Mike Jolley 6a47b2232a More API price formatting and currency handling (https://github.com/woocommerce/woocommerce-blocks/pull/1394)
* Consistent currency data and formatting for product prices

* Consistent get_store_currency_properties usage

* Update tests with schema changes

* min_price and max_price to subunit format

* Product query of min and max prices using subunit

* Cart item totals

* Collection data schema object and currency data inclusion

* Handle subunits and new API in product prices

* Update price slider to format numbers using library and new API responses for subunits

* Product query of min and max prices using subunit

* Fix indents in readme

* Add todo for currency formatting

* Handle step for subunits, fixes min/max constraints

* Handle subunit conversion on display, using consistent currency object and wrapped NumberFormat component.

* Prettier ran

* Update usePriceConstraints tests so rounding doesn't make all values be 0

* Rename to minorUnitValue

* Move currencyToNumberFormat to index file

* siteCurrencySettings to constant rather than function

* remove cents term

* cents->minor unit

* typo in todo note

* Switch to FormattedMonetaryAmount

* Formatting

* wrong case
2019-12-18 11:29:20 +00:00
Seghir Nadir d58712ee2b Add Checkout Form components (https://github.com/woocommerce/woocommerce-blocks/pull/1351)
* initial commit at fields

* add radio control

* change input to be uncotrolled

* tweak styles

* populate block with boilerplate

* update aria in radio

* remove comment

* fix typo

* add missing colors

* put reminder to put Disabled back

* wrap text in i18n __

* reorder styles

* rename wc-components to wc-blocks

* use value instead of index for keys

* add no shipping placeholder

* change isEditor default to false

* fix problem with responsive
2019-12-16 23:13:41 +01:00
Albert Juhé Lluveras af5af78266 Price filter: preserve previous constraints while loading (https://github.com/woocommerce/woocommerce-blocks/pull/1386)
* Typo

* Save previous constraint while loading

* Add tests for formatPrice

* Small code refactor

* Refactor usePriceConstraints to DRY and add tests

* Add base-hooks to jest config
2019-12-16 17:48:02 +01:00
Darren Ethier 80d76944cc account for default orderby changes in editor (https://github.com/woocommerce/woocommerce-blocks/pull/1385) 2019-12-16 07:35:13 -05:00
Darren Ethier 5ac157b14a Normalize set minPrice and maxPrice values by step (https://github.com/woocommerce/woocommerce-blocks/pull/1379)
* normalize set minPrice and maxPrice values by step

* follow standards for comment blocks
2019-12-13 16:54:35 -05:00
Albert Juhé Lluveras 5485e4c51c Use wc_review_ratings_enabled() API function to check if review ratings are enabled (https://github.com/woocommerce/woocommerce-blocks/pull/1374) 2019-12-13 18:13:11 +01:00
Albert Juhé Lluveras 810341d084 Add Cart block checkout button (https://github.com/woocommerce/woocommerce-blocks/pull/1366) 2019-12-12 20:46:56 +01:00
Albert Juhé Lluveras b5791d9c53 Rename SubmitButton to FilterSubmitButton (https://github.com/woocommerce/woocommerce-blocks/pull/1369) 2019-12-12 20:16:39 +01:00
Mike Jolley 5a1bbbefb9 Update NPM dependencies and script dependency handling (https://github.com/woocommerce/woocommerce-blocks/pull/1337)
* Update NPM packages

* Switch JSON dependencies to new PHP files

* include->require

* include->require

* Remove from package and run audit fix

* Update wp-prettier

* Use version from asset file

* Fix eslint issues and test failures

* Update OriginalComponent docblocks

* Props are objects, not arrays

* Array to Object

* fix tests throwing unhandled rejection errors in node.

These tests were all testing Promise.rejects but then not properly catching the reject in the assertions.

* exclude rule for no short array syntax allowed

This is a WordPress core standard that we choose to ignore because it’s silly in our context to follow that rule (and we’re being consistent with WooCommerce Admin).
2019-12-10 12:17:46 -05:00
Albert Juhé Lluveras 0fa4dd05a5 Add 'Go' button to Attribute Filter (https://github.com/woocommerce/woocommerce-blocks/pull/1332)
* Add 'Go' button to Attribute Filter

* Code cleanup

* Fixes

* Avoid onSubmit being called in the editor

* Update attributes help texts

* Fix wrong input check box width
2019-12-06 16:36:55 +01:00
Seghir Nadir 58d4d73b51 Introduce Checkout Form skeleton and Checkout Form Step Component (https://github.com/woocommerce/woocommerce-blocks/pull/1329)
* introduce form steps

* add last step

* add prop types

* fix css color variable naming

* add label for a11y

* use :last-child

* white space

* use direct args in classnames

* typo

* rename ids for steps

* fix line height to match title

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

* heading-content

* rename css var

* move vars to file

* move components within file

* move imports

* rename prop name to kebabCase

* update prop name

* make components responsive with storefront

* fix some compatiblity problems with 2020

* battle in the CSS ground

* move import to correct place

* turn stepHeadingContent to render prop

* styling
2019-12-06 14:18:55 +01:00
Albert Juhé Lluveras aa43840f13 Add 'AND' display format to Attribute filter dropdown (https://github.com/woocommerce/woocommerce-blocks/pull/1309)
* Add 'AND' display format to Attribute filter dropdown

* Add translators comments

* Remove 'assertive' from speak calls

* Wrap some functions in useCallback

* Only filter available filters if style=list and query=and

* Show placeholder in AND query type

* Add default cursor to list-item elements

* Fix issues with 20xx themes

* Fix issues with 20xx themes (II)
2019-12-05 14:58:44 +01:00
Albert Juhé Lluveras 41374cf5ea Fix price slider layout in narrow columns 2019-12-03 21:18:11 +01:00
Albert Juhé Lluveras f7c807a0c6 Add dropdown display style to Attribute Filter block (https://github.com/woocommerce/woocommerce-blocks/pull/1255)
* Add dropdown display style to Attribute Filter block

* Unify filter blocks margin

* Show attribute label inside dropdown input

* Minor CSS reorganization

* Refactor code to smaller files

* Preserve input values on blur

* Only save data-display-style if it's different than 'list'

* Remove inputRef prop in DropdownSelectorInputWrapper

* Accessibility: fix missing label

* Prevent input field being unselected when removing an item with the backspace

* Remove isLoading styles and don't set isDisabled when it's not actually disabled

* Accessibility: increase color contrast

* Add package-lock.json

* Prevent input field being unfocused when removing an item with its chip card

* Don't show menu when input is unfocused
2019-12-03 14:39:11 +01:00
Darren Ethier 1670757534 Remove with-query-string-values hoc implementation (https://github.com/woocommerce/woocommerce-blocks/pull/1287)
* remove with-query-string-values hoc implementation

* remove unnecessary passed in props and clean up proptypes

* remove dead code
2019-12-02 07:52:10 -05:00
Seghir Nadir 998d3920c9 Fix color on pagination caused by Twenty Twenty (https://github.com/woocommerce/woocommerce-blocks/pull/1257)
* fix color on pagination caused by twentytwenty
2019-11-26 12:45:00 +01:00
Albert Juhé Lluveras 4652ce1547 Honor CSS classes in editor (https://github.com/woocommerce/woocommerce-blocks/pull/1227)
* Honor CSS classes in editor

* Remove is-loading classes from editor

* Make sure we always destructure all attributes
2019-11-21 08:50:30 +01:00
Mike Jolley 0272c4472b Add no result templates (https://github.com/woocommerce/woocommerce-blocks/pull/1178)
* All Products block with filters: avoid showing loading placeholders if there are no results

* Hide sort select and show message when no products are available

* Add no result templates

* Remove product-grid

* Move images to assets dir

* Update images

* Switch functions to Components

* Capitals

* add missing context
2019-11-19 15:47:46 +00:00
Albert Juhé Lluveras dceb2c6a0f All Products: avoid pagination disappearing when switching pages/changing sort value (take 2) (https://github.com/woocommerce/woocommerce-blocks/pull/1201)
* Use same query for headers collection

* All Products: avoid pagination disappearing when switching pages/changing sort value (take 2)

* Cleanup

* fixes after rebase

* Make it work after last rebase

* only do page change when queryState.page has changed.

* Fix woocommerce/woocommerce-blocks#1198 again

* Remove previousPage and isInitialized checks
2019-11-19 16:14:34 +01:00
Darren Ethier 2ca9f5eca2 Fix: Page selection will reset to 1 after deselecting filterable item, re-sorting products, and selecting new page. (https://github.com/woocommerce/woocommerce-blocks/pull/1205)
* initial commit

* change initialization state when user triggered page change
2019-11-19 06:20:23 -05:00
Darren Ethier 652aa0caa2 Fix paging issues (https://github.com/woocommerce/woocommerce-blocks/pull/1202) 2019-11-19 04:55:16 -05:00
Darren Ethier 3189a9483b Implement useProductLayoutContext for layout prefix in atomic blocks. (https://github.com/woocommerce/woocommerce-blocks/pull/1183)
* implement product layout context for product button

* convert product image component to functional component

- also implements useProductLayoutContext

* ensure edit context for AllProducts block has appropriate providers wrapping it.

* update price block with useProductLayoutContext

* convert ProductRating block to functional component and add useProductLayoutContext

* add useProductLayoutContext to ProductSummary

* update sale badge component adding useProductLayoutContext

* add useProductLayoutContext to ProductTitle component

* update ProductListItem component to add useProductLayoutContext

* update ProductList component to add useProductLayoutContext
2019-11-18 15:25:29 +01:00
Mike Jolley d613d2fde6 Active filters block (https://github.com/woocommerce/woocommerce-blocks/pull/1168)
* Basic block construction

* Register on PHP side

* wc-active-filters script

* Price utils

* Refactor price slider so state reflects the query

Moves some logic from the component to the block so that min and max price can change (via query) and be reflected by the price sliders.

This allows the active filters block to change the query and have those new values reflected by the slider.

* Fix type checking of numbers

* Styles for filter block

* Improved attribute helper for getting attribute taxonomy data from ID/taxonomy

* Refactor attribute filter to use updateAttributeFilter helper

* Disable checkboxes when loading to avoid multiple queries

* Add todos - this is blocked

* Remove checked state from Attribute Filter so it gets updated from the store (https://github.com/woocommerce/woocommerce-blocks/pull/1170)

* isLoading check

* active price filtering rendering

* Block heading

* Implement block options; chip display with clear button

* Clear all should remove all attributes

* Enable previews

* Introduce a component to look up terms from slugs using collections (which are cached)

* Correct all docblocks

* activePriceFilters null return

* renderRemovableListItem

* Remove useMemo for hasFilters

* Switch classnames notation

* Ensure slug is array in removeAttributeFilterBySlug

* null -> undefined return types for attributes

* Remove fragment

* Check we have a termObject in ActiveAttributeFilters

* Refactor formatPriceRange return statements

* Ensure query array index will exist

* Only sort when adding a query

* Remove aria-label with dupe text

* hasFilters is function

* Update useQueryStateByKey usage

* More doc block fixes

* Update getAttributeFromTaxonomy return and docblock

* getAttributeFromID return/docblock
2019-11-15 14:41:23 +00:00
Albert Juhé Lluveras 0739e4c536 Add block error boundary to JS-rendered blocks (https://github.com/woocommerce/woocommerce-blocks/pull/1166)
* Add block error boundary to All Products and Reviews blocks

* Add block error boundary to Price Filter and Attributes Filter blocks

* Add image

* Make block error component use props instead of hardcoded values

* Add props to BlockErrorBoundary

* Change 'text' prop to 'content'

* Add docs to proptypes

* Replace 'content' prop with 'text'
2019-11-15 15:15:55 +01:00
Darren Ethier 534d8f6fdd Add context for query state context string. (https://github.com/woocommerce/woocommerce-blocks/pull/1172)
* ensure useProductLayoutContext actually returns the context!

* add query state context and export provider and hook.

* implement useQueryStateContext in existing querySTate hooks and refactor other implementations

* add back in documentation removed in rebase

* default layout context to empty string (no need to add additional classes by default

* fix jsdoc
2019-11-14 12:16:27 -05:00
Darren Ethier 7ae6d78ea5 Add context value validation for context apis that receive an object. (https://github.com/woocommerce/woocommerce-blocks/pull/1174)
* add a context value validator and tests

This handles validation incoming value prop on a context provider with an object.

* implement context validator and fix related bugs

* rename context to better match it’s purpose

* correct spelling

* Update assets/js/base/context/utils.js

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

* tighten up the iteration
2019-11-14 09:51:32 -05:00
Mike Jolley 8f0bef5516 Use placeholder when contraints are invalid (https://github.com/woocommerce/woocommerce-blocks/pull/1145)
* Use placeholder when contraints are invalid

* Update assets/js/base/components/price-slider/style.scss

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

* Update assets/js/base/components/price-slider/style.scss

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

* Move hasValidConstraints
2019-11-11 11:05:18 +00:00
Mike Jolley c038a7fed4 Filter all products block by attribute (https://github.com/woocommerce/woocommerce-blocks/pull/1127)
* Block setup

* Working filtering and intersection of arrays

* Implement block settings and no attribute placeholder

* Correctly toggle counts

* Implement filtering

* Fix price slider constraints

* Fix price slider constraints

* Edit mode

* Rename ProductAttributeControl to ProductAttributeTermControl

* Attribute ID saving

* fix incorrect test fixtures

* fix incorrect regex for parsing model (or resource names) from the route.

* Fix query classes for some endpoints

* Style improvements

* Update inline comments

* use previous tests

* Show attribute control in sidebar

* Remove displayStyle option

* Sort attributes by name

* Show more/less toggle

* Use renderFrontend

* Only sort when adding values

* Rename memo placeholder

* More specific CSS for pointer

* Update assets/js/base/hooks/use-query-state.js

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

* Remove always true taxonomy check

* Update assets/js/blocks/attribute-filter/block.js

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

* Remove lodash join

* native js for string casting

* Move internal deps

* hyphenate attributes

* Correct data set names

* Remove unwanted dependency

* Moving imports

* Missing deps

* replace yoda conditonal

* Missing deps

* Missing deps

* Check value exists

* Remove undefined filter

* renderedOptions usememo

* Set defaults in checkbox list

* Show more/less refactor

* Use getAdminLink

* Fix object length check

* Correct AND query handling for counts

* useQueryStateByContext

* Add store rest endpoints

* Update assets/js/base/components/checkbox-list/index.js

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

* Update assets/js/base/components/checkbox-list/index.js

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

* Update assets/js/base/components/checkbox-list/index.js

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

* Update assets/js/blocks/attribute-filter/block.js

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

* Feedback

* feedback

* API readme

* Fix API relation queries for multiple attributes

* Prevent all options flashing visible during loads

* null check

* Improve loading state

* Remove null options change - it's no longer needed
2019-11-11 10:32:56 +00:00
Albert Juhé Lluveras 2f04c61223 Update dependencies order (https://github.com/woocommerce/woocommerce-blocks/pull/1146)
* Update dependencies order

* Create eslint WooCommerce plugin with dependency group rule

* Update WCPackageLocality definition so it only includes External and Internal

* Rename WPPackageLocality to WCPackageLocality

* Delete old typedef
2019-11-08 17:30:11 +01:00
Darren Ethier 0b61988487 Add anti yoda conditional eslint rule (https://github.com/woocommerce/woocommerce-blocks/pull/1142)
* add anti yoda rule

* apply eslint fix to all existing yoda conditional uses
2019-11-07 09:45:45 -05:00
Albert Juhé Lluveras 1bd60ebaab Use renderFrontend function to render the Price Filter block in the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/1136)
* Fix minor issues in comments

* Use renderFrontend function for price filter
2019-11-07 11:18:56 +00:00
Mike Jolley c824b481e2 Fix price slider constraints (https://github.com/woocommerce/woocommerce-blocks/pull/1125)
* Fix price slider constraints

* Update inline comments

* use previous tests
2019-11-06 13:25:37 -05:00
Darren Ethier 8625e418a9 Install dompurify and use to sanitize product title for review blocks (https://github.com/woocommerce/woocommerce-blocks/pull/1117)
* install dompurify and use to sanitize product title for reviews

* remove dompurify

* remove dompurify implementation and add jsdoc covering what data is trusted
2019-11-01 18:00:19 -05:00
Mike Jolley 83925b48e6 New block: Filter Products by Price (https://github.com/woocommerce/woocommerce-blocks/pull/853)
* Basic component setup

* Working slider

* Validation

* styling

* Update webpack config to fix ie11

* ie progress

* styling improvements

* improve events

* IE shim

* Fix samsung internet styles

* Add aria

* remove old methods

* event handling

* Tweak size and width of inputs

* reset progress

* shorthand notation for setstate

* Inline comment for textare usage

* Remove pointless comparison

* destruct from state

* zindex comment

* Move out currency settings and validation

* enforce int for min and max state

* Use woocommerce/settings

* showInputFields prop

* Filter Products by Price: Block creation (https://github.com/woocommerce/woocommerce-blocks/pull/865)

* Prevent interaction with slider

* Show input fields toggle

* Placeholder content and icons

* Update dependency rimraf to v2.7.0 (https://github.com/woocommerce/woocommerce-blocks/pull/858)

* placeholder styling

* remove unnecessary config (https://github.com/woocommerce/woocommerce-blocks/pull/862)

* Filter button and styling

* Show/hide placeholder based on product count

* Update dependency rimraf to v2.7.1 (https://github.com/woocommerce/woocommerce-blocks/pull/867)

* Use correct parameter order for implode. Solves deprecation notice in PHP 7.4 (https://github.com/woocommerce/woocommerce-blocks/pull/857)

* Add description to blocks added in last releases (https://github.com/woocommerce/woocommerce-blocks/pull/869)

* Limit max width

* Prevent wrap

* handles src file

* Introduce withCategory HOC for featured category block (https://github.com/woocommerce/woocommerce-blocks/pull/846)

* Introduce withCategory hoc

* Refactor featured category to use new hoc

* Update docblocks

* Add README note for PHP deprecation notices

* Remove screen-reader-text css rules (https://github.com/woocommerce/woocommerce-blocks/pull/849)

* Align stars left (https://github.com/woocommerce/woocommerce-blocks/pull/866)

* bool

* Create Reviews by Product block (https://github.com/woocommerce/woocommerce-blocks/pull/658)

* Create Reviews by Product block

* Honor Content settings

* Fix wrong className

* Load new wc-packages file

* Add reviews-by-product JS files to webpack config

* Cleanup

* Remove error messages

* Add Reviews by Product icon

* Update sort options

* Allow additional CSS classes attribute

* Refactor block styles

* Fix wrong default for reviews_orderby

* Don't enforce CSS chunks

* Add reviews count to Reviews by Product controls (https://github.com/woocommerce/woocommerce-blocks/pull/671)

* Add label to Reviews by Product controls count (https://github.com/woocommerce/woocommerce-blocks/pull/677)

* Add reviews count to Reviews by Product controls

* Add label to Reviews by Product controls count

* Add label to Reviews by Product controls count

* Update components package

* Review ordering and placeholders (https://github.com/woocommerce/woocommerce-blocks/pull/688)

* Add support for comment_count ordering and add to productcontrol

* Add a placeholder if rating count is 0

* Update assets/js/components/utils/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/blocks/reviews-by-product/block.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* grammar

* Fix some linting errors and warnings (https://github.com/woocommerce/woocommerce-blocks/pull/693)

* Create Reviews by Product block placeholder (https://github.com/woocommerce/woocommerce-blocks/pull/691)

* Create Reviews by Product block placeholder

* Reviews by Product: load and render reviews with JS (https://github.com/woocommerce/woocommerce-blocks/pull/696)

* Reviews by Product: load and render reviews with JS

* Add dangerouslySetInnerHTML explanatory comment

* Fix wrong dependency source

* Debounce getReviews call when creating the Reviews by Product block

* Rename 'Reviewer Picture' with 'Avatar' (https://github.com/woocommerce/woocommerce-blocks/pull/702)

* Lint errors

* Replace stringify query with addQueryArgs (https://github.com/woocommerce/woocommerce-blocks/pull/707)

* Add reviews endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/705)

* Prevent state updates on unmounted components (https://github.com/woocommerce/woocommerce-blocks/pull/715)

* Add Order by and Load more controls in Reviews by Product frontend (https://github.com/woocommerce/woocommerce-blocks/pull/716)

* Export IconReviewsByProduct (https://github.com/woocommerce/woocommerce-blocks/pull/721)

* Fix Reviews by Product layout in IE11 (https://github.com/woocommerce/woocommerce-blocks/pull/723)

* Set minimum to per page input field (https://github.com/woocommerce/woocommerce-blocks/pull/731)

* Hide avatars in Reviews by Products if 'show_avatars' settings is false (https://github.com/woocommerce/woocommerce-blocks/pull/730)

* Blocks API - Reviews endpoint with rating sort and category filtering (https://github.com/woocommerce/woocommerce-blocks/pull/726)

* Move file to correct location

* We are only using the reviews endpoint not revioews/id

* Remove sensistive data and make endpoint public

* Allow guest access to approved reviews

* Add support for rating sorting

* category filtering

* update arg name

* fix category query

* Reviews by Product: add placeholders when loading reviews (https://github.com/woocommerce/woocommerce-blocks/pull/732)

* Add placeholder animation (https://github.com/woocommerce/woocommerce-blocks/pull/733)

* Hook up Reviews by Product 'Order by' with endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/736)

* Hook up Reviews by Product 'Order by' with endpoint

* Use onChange instead of onBlur in select control

* Reviews by Product: Hide ratings if they are disabled in settings (https://github.com/woocommerce/woocommerce-blocks/pull/740)

* Hide ratings in Reviews by Product if disabled in settings

* Hide order by select if ratings are disabled

* Reviews by Product cleanup (https://github.com/woocommerce/woocommerce-blocks/pull/773)

* Fix wrong method name

* Reduce the number of dependencies used in Reviews by Product (https://github.com/woocommerce/woocommerce-blocks/pull/774)

* Reduce the number of dependencies used in Reviews by Product

* Use 'withComponentId' HOC

* Remove debounce

* Fix wrong proptype

* Get rid of JS warning

* Load render from react-dom

* Add formatted_date_created item schema (https://github.com/woocommerce/woocommerce-blocks/pull/788)

* Fix import of WithComponentID

* Add new settings to Reviews by Product block (https://github.com/woocommerce/woocommerce-blocks/pull/787)

* Add new settings to Reviews by Product block

* Remove helpText and add notices

* Use RangeControl for numeric settings

* Prevent fetching new reviews if all were already fetched

* Enable product image in reviews

* Remove unnecessary catch

* Refactor getReviews

* Move getReviews back to block's code

* Cleanup

* Fix wrong order in editor

* Hide 'Load More Reviews' if showLoadMore is false

* Move getReviews to utils.js

* Add @woocommerce/navigation to package.json

* Make notices non-dismissable

* Reviews by Product: prevent importing all HOCs and import only withComponentId (https://github.com/woocommerce/woocommerce-blocks/pull/811)

* Reviews by product: Update review styling and content (https://github.com/woocommerce/woocommerce-blocks/pull/806)

* Add new settings to Reviews by Product block

* Remove helpText and add notices

* Use RangeControl for numeric settings

* Prevent fetching new reviews if all were already fetched

* Enable product image in reviews

* Remove unnecessary catch

* Refactor getReviews

* Move getReviews back to block's code

* Cleanup

* Fix wrong order in editor

* Hide 'Load More Reviews' if showLoadMore is false

* Move getReviews to utils.js

* Add @woocommerce/navigation to package.json

* Make notices non-dismissable

* Review design/layout

* verified icons

* Read more component

* remove comment

* expanded -> isExpanded

* Localise and change default elipses

* Simplify ReadMore

* Support children rather than passing content

* remove outside

* remove list style

* Update assets/js/components/read-more/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/components/read-more/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* merge set state

* Add missing parameter doc in renderReview (https://github.com/woocommerce/woocommerce-blocks/pull/820)

* Fix Reviews by Product order by select not honoring default setting (https://github.com/woocommerce/woocommerce-blocks/pull/818)

* Read more component - change how clamped content is shown (https://github.com/woocommerce/woocommerce-blocks/pull/821)

* Pass review as components

* Build summary from content and track both

* Toggle display after inital load

* remove unused variable

* remove componentDidUpdate

* Simplify clampLines

* Put back componentDidUpdate, but store final summary in state

* clampEnabled

* Call clampLines from componentDidMount (https://github.com/woocommerce/woocommerce-blocks/pull/826)

* truncate html tests

* implement trimHTML and pass test

* Feedback

* test short content

* Use withProduct HOC in ReviewsByProductEditor (https://github.com/woocommerce/woocommerce-blocks/pull/828)

* Use withProduct HOC

* Convert ReviewsByProductEditor to a functional component

* Add loading and error states

* Prevent loading screen appearing when changing products

* Reviews: only save wrapper element to post (https://github.com/woocommerce/woocommerce-blocks/pull/830)

* Fix bundlesize config not picking frontend files (https://github.com/woocommerce/woocommerce-blocks/pull/840)

* Reviews by Product: split 'block.js' into smaller chunks (https://github.com/woocommerce/woocommerce-blocks/pull/841)

* Split 'block.js' into smaller chunks

* Move frontend blocks to their specific folder

* Order imports

* Typo

* Add frontend components proptypes

* Fix indentation

* Call 'this.getDefaultArgs' directly inside 'getReviews'

* Move access to wc_product_block_data to the top of the file

* Rename 'frontend' folder to 'base'

* Rename base components and move styles to their folder

* Fix Reviews by Product using rating count instead of review count (https://github.com/woocommerce/woocommerce-blocks/pull/860)

* Improve Reviews by Product accessibility (https://github.com/woocommerce/woocommerce-blocks/pull/861)

* Improve Reviews by Product accessibility

* Make 'onClick' prop not required in <LoadMoreButton>

* Wrap Reviews by Product editor block with <Disabled>

* Reviews: fix reviews without rating not appearing when sorting by rating (https://github.com/woocommerce/woocommerce-blocks/pull/863)

* Update assets/css/style.scss

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Pin dependencies (https://github.com/woocommerce/woocommerce-blocks/pull/872)

* Update dependency webpack to v4.39.2 (https://github.com/woocommerce/woocommerce-blocks/pull/855)

* Update dependency @woocommerce/components to v3.2.0 (https://github.com/woocommerce/woocommerce-blocks/pull/875)

* Update Reviews styles so it looks the same in the editor and the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/871)

* Update Node.js to v10.16.3 (https://github.com/woocommerce/woocommerce-blocks/pull/874)

* Move wc_product_block_data variables to constants file (https://github.com/woocommerce/woocommerce-blocks/pull/870)

* Update dependency webpack-cli to v3.3.7 (https://github.com/woocommerce/woocommerce-blocks/pull/880)

* Add changelog script (https://github.com/woocommerce/woocommerce-blocks/pull/878)

* Add changelog script

* Adapt changelog script to WooCommerce Blocks

* Minor improvements

* Update dependency lint-staged to v9.2.3 (https://github.com/woocommerce/woocommerce-blocks/pull/879)

* Pin dependencies (https://github.com/woocommerce/woocommerce-blocks/pull/883)

* Update dependency eslint to v6.2.0 (https://github.com/woocommerce/woocommerce-blocks/pull/881)

* Reviews by category block (https://github.com/woocommerce/woocommerce-blocks/pull/804)

* Create Reviews by Product block

* Honor Content settings

* Fix wrong className

* Load new wc-packages file

* Add reviews-by-product JS files to webpack config

* Cleanup

* Remove error messages

* Add Reviews by Product icon

* Update sort options

* Allow additional CSS classes attribute

* Refactor block styles

* Fix wrong default for reviews_orderby

* Don't enforce CSS chunks

* Add reviews count to Reviews by Product controls (https://github.com/woocommerce/woocommerce-blocks/pull/671)

* Add label to Reviews by Product controls count (https://github.com/woocommerce/woocommerce-blocks/pull/677)

* Add reviews count to Reviews by Product controls

* Add label to Reviews by Product controls count

* Add label to Reviews by Product controls count

* Update components package

* Review ordering and placeholders (https://github.com/woocommerce/woocommerce-blocks/pull/688)

* Add support for comment_count ordering and add to productcontrol

* Add a placeholder if rating count is 0

* Update assets/js/components/utils/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/blocks/reviews-by-product/block.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* grammar

* Fix some linting errors and warnings (https://github.com/woocommerce/woocommerce-blocks/pull/693)

* Create Reviews by Product block placeholder (https://github.com/woocommerce/woocommerce-blocks/pull/691)

* Create Reviews by Product block placeholder

* Reviews by Product: load and render reviews with JS (https://github.com/woocommerce/woocommerce-blocks/pull/696)

* Reviews by Product: load and render reviews with JS

* Add dangerouslySetInnerHTML explanatory comment

* Fix wrong dependency source

* Debounce getReviews call when creating the Reviews by Product block

* Rename 'Reviewer Picture' with 'Avatar' (https://github.com/woocommerce/woocommerce-blocks/pull/702)

* Lint errors

* Replace stringify query with addQueryArgs (https://github.com/woocommerce/woocommerce-blocks/pull/707)

* Add reviews endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/705)

* Prevent state updates on unmounted components (https://github.com/woocommerce/woocommerce-blocks/pull/715)

* Add Order by and Load more controls in Reviews by Product frontend (https://github.com/woocommerce/woocommerce-blocks/pull/716)

* Export IconReviewsByProduct (https://github.com/woocommerce/woocommerce-blocks/pull/721)

* Fix Reviews by Product layout in IE11 (https://github.com/woocommerce/woocommerce-blocks/pull/723)

* Set minimum to per page input field (https://github.com/woocommerce/woocommerce-blocks/pull/731)

* Hide avatars in Reviews by Products if 'show_avatars' settings is false (https://github.com/woocommerce/woocommerce-blocks/pull/730)

* Blocks API - Reviews endpoint with rating sort and category filtering (https://github.com/woocommerce/woocommerce-blocks/pull/726)

* Move file to correct location

* We are only using the reviews endpoint not revioews/id

* Remove sensistive data and make endpoint public

* Allow guest access to approved reviews

* Add support for rating sorting

* category filtering

* update arg name

* fix category query

* Reviews by Product: add placeholders when loading reviews (https://github.com/woocommerce/woocommerce-blocks/pull/732)

* Add placeholder animation (https://github.com/woocommerce/woocommerce-blocks/pull/733)

* Hook up Reviews by Product 'Order by' with endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/736)

* Hook up Reviews by Product 'Order by' with endpoint

* Use onChange instead of onBlur in select control

* Reviews by Product: Hide ratings if they are disabled in settings (https://github.com/woocommerce/woocommerce-blocks/pull/740)

* Hide ratings in Reviews by Product if disabled in settings

* Hide order by select if ratings are disabled

* Reviews by Product cleanup (https://github.com/woocommerce/woocommerce-blocks/pull/773)

* Fix wrong method name

* Reduce the number of dependencies used in Reviews by Product (https://github.com/woocommerce/woocommerce-blocks/pull/774)

* Reduce the number of dependencies used in Reviews by Product

* Use 'withComponentId' HOC

* Remove debounce

* Fix wrong proptype

* Get rid of JS warning

* Load render from react-dom

* Add formatted_date_created item schema (https://github.com/woocommerce/woocommerce-blocks/pull/788)

* Inital block setup

* Fix import of WithComponentID

* Render the category reviews

* Add new settings to Reviews by Product block (https://github.com/woocommerce/woocommerce-blocks/pull/787)

* Add new settings to Reviews by Product block

* Remove helpText and add notices

* Use RangeControl for numeric settings

* Prevent fetching new reviews if all were already fetched

* Enable product image in reviews

* Remove unnecessary catch

* Refactor getReviews

* Move getReviews back to block's code

* Cleanup

* Fix wrong order in editor

* Hide 'Load More Reviews' if showLoadMore is false

* Move getReviews to utils.js

* Add @woocommerce/navigation to package.json

* Make notices non-dismissable

* Reviews by Product: prevent importing all HOCs and import only withComponentId (https://github.com/woocommerce/woocommerce-blocks/pull/811)

* Reviews by product: Update review styling and content (https://github.com/woocommerce/woocommerce-blocks/pull/806)

* Add new settings to Reviews by Product block

* Remove helpText and add notices

* Use RangeControl for numeric settings

* Prevent fetching new reviews if all were already fetched

* Enable product image in reviews

* Remove unnecessary catch

* Refactor getReviews

* Move getReviews back to block's code

* Cleanup

* Fix wrong order in editor

* Hide 'Load More Reviews' if showLoadMore is false

* Move getReviews to utils.js

* Add @woocommerce/navigation to package.json

* Make notices non-dismissable

* Review design/layout

* verified icons

* Read more component

* remove comment

* expanded -> isExpanded

* Localise and change default elipses

* Simplify ReadMore

* Support children rather than passing content

* remove outside

* remove list style

* Update assets/js/components/read-more/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/components/read-more/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* merge set state

* Add missing parameter doc in renderReview (https://github.com/woocommerce/woocommerce-blocks/pull/820)

* Fix Reviews by Product order by select not honoring default setting (https://github.com/woocommerce/woocommerce-blocks/pull/818)

* Read more component - change how clamped content is shown (https://github.com/woocommerce/woocommerce-blocks/pull/821)

* Pass review as components

* Build summary from content and track both

* Toggle display after inital load

* remove unused variable

* remove componentDidUpdate

* Simplify clampLines

* Put back componentDidUpdate, but store final summary in state

* clampEnabled

* Call clampLines from componentDidMount (https://github.com/woocommerce/woocommerce-blocks/pull/826)

* truncate html tests

* implement trimHTML and pass test

* Feedback

* test short content

* Use withProduct HOC in ReviewsByProductEditor (https://github.com/woocommerce/woocommerce-blocks/pull/828)

* Use withProduct HOC

* Convert ReviewsByProductEditor to a functional component

* Add loading and error states

* Prevent loading screen appearing when changing products

* Reviews: only save wrapper element to post (https://github.com/woocommerce/woocommerce-blocks/pull/830)

* Update based on product reviews

* Cleanup after master merge

* Implement content hiding and placeholder states for reviews blocks

* Output product names and adjust css

* Review permalink

* Remove old read-more component which was moved

* showProductName is already part of passed attributes

* CSS tweaks for missing elements

* Move dir

* Move product reviews block

* Move shared uitils

* update paths

* frontend paths

* Update paths

* shared attributes

* switch to constants

* Shared review block code

* Replace constants

* Fix hidden content bug

* star alignment

* Update dependency eslint to v6.2.1 (https://github.com/woocommerce/woocommerce-blocks/pull/890)

* remove JSON parse

* remove comment

* No need for important rules

* Fix error appearing on Reviews by Product when there were no reviews (https://github.com/woocommerce/woocommerce-blocks/pull/884)

* Fix error appearing on Reviews by Product when there were no reviews

* Revert "Fix error appearing on Reviews by Product when there were no reviews"

This reverts commit 73e95b39aa9a318888d08bb51faeff8bb51259d7.

* Move withProduct() HOC to editor-block.js

* Revert "Move withProduct() HOC to editor-block.js"

This reverts commit ae9515792d4870cc5cf1d92a2d6acc91198b5f62.

* Move renderNoReviews back to edit.js

* Move no reviews placeholder to its own component

* Remove usage of 'RawHTML'

* Fix propTypes

* Remove unnecessary escapeHTML

* revise labels

* Move component to base

* Add price text

* Update design to latest figma

* update from master

* Fixed merge conflicts with settings

* Fix formatting

* Update to use react hooks

* Progress hooking up price slider

* Fixes usage of data store for min/max

* Added loading state

* Fix useQueryStateByKey setter

* Product list integration

* Inital state and preventing too many queries

* Style fixes

* Button loading styles

* Package conflict

* useCallback

* Remove duplication

* variable name feedback

* Implement useCallback on functions

* useMemo for getProgressStyle

* Block feedback

* Use get_block_asset_build_path

* Remove old settings from merge conflict

* Move sketch file to .prefixed dir

* Removed render methods

* Exclude price filter from legacy build

* Feedback
2019-11-01 13:56:14 +00:00
Mike Jolley f851a6ef9b All Products with Inner Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/1032)
* Inital block creation

* Update labels

* Columns, rows, sample data json

* Output data from API

* thumbnail_html

* Split into smaller components of grid

* Price handling

* Image handling

* Remove !

* frontend

* Work on cart api

* Cart error handling and product type conditions

* innerblock progress

* Implement layoutConfig as set from innerblocks shape.

Note:

- this is just a poc
- where things are configured likely needs changed
- will still need to work out how this gets persisted for the frontend and how things get displayed there (but likely will work fairly similar in terms of mapping to components).

* use correct prop name

* Working edit button

* Clean up block controls and edit view

* Add link with innerblocks

* update link description

* correctly handle components with inner blocks as children

* Re-organise atomic components and blocks into own directories

* Unique keys for components

* Fix default layout when inserting block for first time

* Working layoutconfig save

* Save attributes

* Move sale badge to image component

* Add disabled to render preview and blocks

* icons

* Editor view styling

* Update withComponetId to stop component ID incrementing too many times

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

* Improve key generation

* done/cancel buttons on edit

* Create withProducts HOC for All Products block (https://github.com/woocommerce/woocommerce-blocks/pull/994)

* Create withProducts HOC for All Products block

* Add order select and pagination to All Products block

* Go to first page when changing order

* Add HOC test

* Make sure block is updated whem columns/rows change in the editor

* Fix 'SALE' badge positioning

* Remove unnecessary key

* Honor 'perPage' value when generating placeholders

* Make placeholder sizes match rendered block item

* Several CSS improvements

* Remove unused CSS properties

* Move getProducts to hocs utils

* Remove All Products sample-data.json

* Fix order select wrong margin in the editor

* Refactor how loading image gets its size

* Clear products when loadProducts start

* Enhance pagination logic

* Fix placeholder width

* Fix regular_price check

* Set product link max-width

* Implement querystrings for the All Products block (https://github.com/woocommerce/woocommerce-blocks/pull/997)

* Implement querystrings for the All Products block

* Create withWindow HOC

* Add with-window tests

* Use renderFrontend util in All Products block (https://github.com/woocommerce/woocommerce-blocks/pull/1003)

* Add with-window tests

* Use renderFrontend util in All Products block

* Rename properties and components from 'order' to 'sort' (https://github.com/woocommerce/woocommerce-blocks/pull/1012)

* Rename properties and components from 'order' to 'sort'

* Rename onOrderChange to onSortChange

* Remove unnecessary stylint-disable-line (https://github.com/woocommerce/woocommerce-blocks/pull/1016)

* Create withBrowserLocation and withBrowserHistory HOC (https://github.com/woocommerce/woocommerce-blocks/pull/1022)

* Create withBrowserWindowProp HOC

* Remove unnecessary expect's

* Always pass window prop to propMap if it exists

* Scroll to top when switching pages in All Products block (https://github.com/woocommerce/woocommerce-blocks/pull/1011)

* Scroll to top when switching pages in All Pages block

* Improve keyboard navigation in the All Products block

* Create withScrollToTop HOC

* Fix variable name typo

* Update paths with aliases

* Avoid first and last page being included in pagination 'pagesToDisplay' (https://github.com/woocommerce/woocommerce-blocks/pull/1015)

* Update lock

* constants

* linting

* Clean up styling

* Prettier

* Block options for title/image

* Prettier

* Remove shared content controls

* Update atomic block descriptions

* Summary block

* Prettier

* Impoved template edit appearance and added inline tips

* Apply prettier

* Reset and cancel buttons

* Improved keys

* Tweak tip placement

* Remove incorrect comments

* Remove disabled ofr non interactive elements

* Fragment not needed

* Update assets/js/atomic/components/product-list/title/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Move componentId hoc

* Comment

* Implement onImageLoaded

* Pagination: disable first/last page if they are active (https://github.com/woocommerce/woocommerce-blocks/pull/1041)

* Update assets/js/atomic/components/product-list/rating/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Sale badges refactoring

Adds sale badges blocks and improves how the default blocks are defined.

* revert changes in withComponentId

* fix flexbox alignment

* Create withQueryStringValues HOC and use it in ProductGrid component (https://github.com/woocommerce/woocommerce-blocks/pull/1040)

* Create withQueryStringValues HOC and use it in ProductGrid component

* Add tests

* Add comment explaining urlParameterSuffix

* Don't destructure props if only used once

* Move dependencies check outside the HOC

* Update test description

* Remove HOCs no longer used

* Update assets/js/atomic/blocks/product-list/image/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/atomic/components/product-list/sale-badge/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/atomic/utils/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/atomic/utils/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Feedback

* Grid to List

* Improved badge handling

* update package-lock after merge from master

* Add wp.data store for schema and lists. (https://github.com/woocommerce/woocommerce-blocks/pull/1008)

* install @wordpress/data-controls and deepFreeze

* add schema store

* add query-state store

* add collections store

* add bundle entry point (and export store keys and constants)

* add master README.md for new stores

* add bundle configuration and register asset php side

* Add missing param name

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

* code style fixes

* remove unnecessary period from test description

* Simplify conditional

* reorder imports (code style)

* reorder imports and codestyle

* refactor using lodash for state utils

* reorder imports

* reorder imports

* reorder dependencies

* reorder dependnecies an remove duplication block

* remove errant tab

* reorder dependencies

* Modify collections store to add headers to the store state. (https://github.com/woocommerce/woocommerce-blocks/pull/1073)

* add control for getting unparsed response from apiFetch

* Modify action so it recieves a response object.

* modify reducer to handle response object

* improve selectors to make headers accessible

- modifys existing `getCollection` to retrieve items from state.
- adds `getCollectionHeader` selector

* update resolvers to handle full response from request

- also adds resolver for `getCollectionHeader`

* update docs for changes

* Improve spacing in doc

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

* Fix spacing in inline docs

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

* change `getFromState` to receive an object instead of arguments list.

* Prepare All Products block to accept extension inner blocks (https://github.com/woocommerce/woocommerce-blocks/pull/1047)

* Simplify BLOCK_MAP

* Prepare All Products block to accept extension inner blocks

* Change filter name

* Update filter name

* Add check that block exists in BLOCK_MAP

* Create REVERSED_BLOCK_MAP instead of searching blocks each time

* Change how child blocks are registered for All Products block

* Refactor All Products block so reverse map isn't needed

* Remove getDefaultBlocks

* Make sure getRegisteredInnerBlocks always returns an object and add checks to registerInnerBlock

* Add missing blockName arg

* Add inline docs to block registry

* Move 'blockName' prop to context

* Typos

* Improve registerInnerBlock error messages and create a validation function

* Refactor context

* Rename validateOption to assertOption

* refactor where new context lives and add alias for base-context

* fix doc block

* remove todo block (there’s an issue for it)

* rename context

* Update assets/js/atomic/components/product-list/sale-badge/index.js

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

* HeadingToolbar comment

* Tweak bool comparison

* Improve how default layouts are set so all blocks can be removed and the no-content message is correct

* Sale centering

* Fix default template

* Product example switch to preview

* Update preview schema and image data to match latest schema

* Add @woocommerce/atomic-components alias

* Alias for previews to prevent need for relative paths

* Drop `align` for sale block

Align disrupts other blocks in unexpected and unavoidable ways. Drop support so the sale block is a block level item.

* Rename atomic components and blocks (and create ProductLayoutContext) (https://github.com/woocommerce/woocommerce-blocks/pull/1089)

* rename atomic blocks and components to be more generic (drop list)

* create new context for productlayout and implement provider

* Rename ProductSalesBadge to ProductSaleBadge

* Add php5.3 restriction for All Products block (https://github.com/woocommerce/woocommerce-blocks/pull/1090)

* enable legacy builds and add handling for AllProducts to be wp5.3 only

* fix legacy builds

* Prevent filemtime notice

* Implement new data stores with All Products block (https://github.com/woocommerce/woocommerce-blocks/pull/1067)

* add new hooks and tests and alias for hooks

* various fixes for stores after implementation tests

* implement new stores for ProductList component

* add doc blocks for useStoreProducts hooks

* fix typo in property on returned object
2019-10-28 09:53:09 -04:00
Darren Ethier f3bd3e6a09 Introduce legacy build system and new aliases (https://github.com/woocommerce/woocommerce-blocks/pull/1018)
* install directory-named-webpack-plugin

* create new plugin for fallback legacy imports

* implement webpack configuration for fallback legacy imports and legacy builds

Note: legacy builds are currently disabled, we can enable by just commenting out when we need them.

* removed unused webpack plugin experimented with in earlier iteration

* prettier fixes

* add legacy folder with readme for explanation

* add some info on legacy builds to `CONTRIBUTING.md`

* refactor imports to use new aliases

* fix link in doc

* update jest test config for new aliases

* use native string.startsWith instead of custom function

* reformat file for spacing/code style

* add slash to alias

* clean up webpack config and make things more dry

* update indent style for json files to be tab not spaces

- adjusts editorconfig rules
- reformat jest.config.json

* simplify conditional
2019-10-06 08:36:15 -04:00
Albert Juhé Lluveras 85df274523 Reformat files with new tabwidth (https://github.com/woocommerce/woocommerce-blocks/pull/953)
* Reformat files with new tabwidth

* Review featured product background position so it doesn't break
2019-09-09 12:52:48 +02:00
Albert Juhé Lluveras 6ab7834f59 Install prettier and reformat files (https://github.com/woocommerce/woocommerce-blocks/pull/945)
* Install prettier

* Reformat all files

* Add prettier to precommit hook

* Update prettier settings to match Gutenberg code standards

* Reformat files with new settings

* Improve legibility in some line breaks
2019-09-05 17:09:31 +02:00
Albert Juhé Lluveras 73f8f15bb3 Create Pagination and ProductOrderSelect components (https://github.com/woocommerce/woocommerce-blocks/pull/926)
* Create ProductOrderSelect component

* Create Pagination component

* Add description to props

* Use BEM class name

* Use < > instead of ← →

* Update product order select options to match Shop core page

* Refactor pagination so it behaves like core pagination

* Update snapshots
2019-09-03 16:41:05 +02:00
Mike Jolley ea0ce0e915 Fix wcSettings conflicts with wc-admin (https://github.com/woocommerce/woocommerce-blocks/pull/916)
* Add inline settings script later than init

* Rename to shared-settings for clarity - other extensions filter these

* Implement block settings

* tweak used hooks

* update comment

* Shared settings should be dependency

* Make Webpack output shared and block settings (https://github.com/woocommerce/woocommerce-blocks/pull/918)
2019-08-27 16:25:32 +01:00
Albert Juhé Lluveras d1db64362a Cleanup withComponentId from base components (https://github.com/woocommerce/woocommerce-blocks/pull/907) 2019-08-27 12:24:50 +02:00
Albert Juhé Lluveras 4a1171364d Create OrderSelect and Label components (https://github.com/woocommerce/woocommerce-blocks/pull/905)
* Create Label and OrderSelect components

* Update review list item so it uses 'classnames'

* Split review order select styles from generic component

* Update snapshots

* Refactor Label so we don't need to check Symbol

* Add description to Label and OrderSelect components

* Use prop-types instead of prop-types-elementtype

* Simplify Label propTypes

* Update package-lock
2019-08-23 18:35:34 +02:00
Albert Juhé Lluveras 9d8d083363 All Reviews block (https://github.com/woocommerce/woocommerce-blocks/pull/902)
* Make all reviews block share the same frontend script

* Create 'All Reviews' block

* Create All Reviews no reviews placeholder

* Create EditorContainerBlock and move some shared logic there

* Update icon

* Address PR feedback
2019-08-23 16:48:48 +02:00
Darren Ethier 72f0ed470f Refactor: Introduce `wc-block-settings` bundle serving as `@woocommerce/settings` external. (https://github.com/woocommerce/woocommerce-blocks/pull/903)
* export new @woocommerce/settings external on `wc.blockSettings` global

- This handles reading data from the dom and assigning it to the global used in all packages dependent on `@woocommerce/settings` which is registered as an external pointing to the global.
- ensures that server data is only loaded on a route if needed.

* switch all direct imports of constants to use new `@woocommerce/settings` external

* enqueu new `wc-block-settings` script and attach inline data to it.

* fix test configuration and adjust test to use new external

* fix bad merge resolution after rebase

* switch constants import to `@woocommerce/settings` external after rebase

* reorder imports for convention

* improve method name
2019-08-22 16:56:47 -04:00
Albert Juhé Lluveras 46934d2946 Create withReviews base HOC (https://github.com/woocommerce/woocommerce-blocks/pull/877)
* Create withReviews base HOC

* Add tests

* Make Reviews by Category use withReviews HOC

* Move componentDidUpdate and debounce dependency to decouple HOC from components

* Spaces

* Rename 'delayMethod' to 'delayFunction'

* Refactor withReviews HOC

* Update tests

* Minor fixes

* Undo fix being handled in woocommerce/woocommerce-blocks#884

* Remove hardcoded from withReviews

* Update delay comment

* Use callbacks instead of announceUpdates prop

* Move props check to a 'shouldReplaceReviews' method

* Fix productId propType

* Move per_page and offset args to 'getArgs'

* Update withReviews displayName

* Fix tests

* Add callback propsTypes

* Use is-shallow-equal
2019-08-22 13:36:20 +02:00
Mike Jolley 3a9c5ba1cd Reviews by category block (https://github.com/woocommerce/woocommerce-blocks/pull/804)
* Create Reviews by Product block

* Honor Content settings

* Fix wrong className

* Load new wc-packages file

* Add reviews-by-product JS files to webpack config

* Cleanup

* Remove error messages

* Add Reviews by Product icon

* Update sort options

* Allow additional CSS classes attribute

* Refactor block styles

* Fix wrong default for reviews_orderby

* Don't enforce CSS chunks

* Add reviews count to Reviews by Product controls (https://github.com/woocommerce/woocommerce-blocks/pull/671)

* Add label to Reviews by Product controls count (https://github.com/woocommerce/woocommerce-blocks/pull/677)

* Add reviews count to Reviews by Product controls

* Add label to Reviews by Product controls count

* Add label to Reviews by Product controls count

* Update components package

* Review ordering and placeholders (https://github.com/woocommerce/woocommerce-blocks/pull/688)

* Add support for comment_count ordering and add to productcontrol

* Add a placeholder if rating count is 0

* Update assets/js/components/utils/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/blocks/reviews-by-product/block.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* grammar

* Fix some linting errors and warnings (https://github.com/woocommerce/woocommerce-blocks/pull/693)

* Create Reviews by Product block placeholder (https://github.com/woocommerce/woocommerce-blocks/pull/691)

* Create Reviews by Product block placeholder

* Reviews by Product: load and render reviews with JS (https://github.com/woocommerce/woocommerce-blocks/pull/696)

* Reviews by Product: load and render reviews with JS

* Add dangerouslySetInnerHTML explanatory comment

* Fix wrong dependency source

* Debounce getReviews call when creating the Reviews by Product block

* Rename 'Reviewer Picture' with 'Avatar' (https://github.com/woocommerce/woocommerce-blocks/pull/702)

* Lint errors

* Replace stringify query with addQueryArgs (https://github.com/woocommerce/woocommerce-blocks/pull/707)

* Add reviews endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/705)

* Prevent state updates on unmounted components (https://github.com/woocommerce/woocommerce-blocks/pull/715)

* Add Order by and Load more controls in Reviews by Product frontend (https://github.com/woocommerce/woocommerce-blocks/pull/716)

* Export IconReviewsByProduct (https://github.com/woocommerce/woocommerce-blocks/pull/721)

* Fix Reviews by Product layout in IE11 (https://github.com/woocommerce/woocommerce-blocks/pull/723)

* Set minimum to per page input field (https://github.com/woocommerce/woocommerce-blocks/pull/731)

* Hide avatars in Reviews by Products if 'show_avatars' settings is false (https://github.com/woocommerce/woocommerce-blocks/pull/730)

* Blocks API - Reviews endpoint with rating sort and category filtering (https://github.com/woocommerce/woocommerce-blocks/pull/726)

* Move file to correct location

* We are only using the reviews endpoint not revioews/id

* Remove sensistive data and make endpoint public

* Allow guest access to approved reviews

* Add support for rating sorting

* category filtering

* update arg name

* fix category query

* Reviews by Product: add placeholders when loading reviews (https://github.com/woocommerce/woocommerce-blocks/pull/732)

* Add placeholder animation (https://github.com/woocommerce/woocommerce-blocks/pull/733)

* Hook up Reviews by Product 'Order by' with endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/736)

* Hook up Reviews by Product 'Order by' with endpoint

* Use onChange instead of onBlur in select control

* Reviews by Product: Hide ratings if they are disabled in settings (https://github.com/woocommerce/woocommerce-blocks/pull/740)

* Hide ratings in Reviews by Product if disabled in settings

* Hide order by select if ratings are disabled

* Reviews by Product cleanup (https://github.com/woocommerce/woocommerce-blocks/pull/773)

* Fix wrong method name

* Reduce the number of dependencies used in Reviews by Product (https://github.com/woocommerce/woocommerce-blocks/pull/774)

* Reduce the number of dependencies used in Reviews by Product

* Use 'withComponentId' HOC

* Remove debounce

* Fix wrong proptype

* Get rid of JS warning

* Load render from react-dom

* Add formatted_date_created item schema (https://github.com/woocommerce/woocommerce-blocks/pull/788)

* Inital block setup

* Fix import of WithComponentID

* Render the category reviews

* Add new settings to Reviews by Product block (https://github.com/woocommerce/woocommerce-blocks/pull/787)

* Add new settings to Reviews by Product block

* Remove helpText and add notices

* Use RangeControl for numeric settings

* Prevent fetching new reviews if all were already fetched

* Enable product image in reviews

* Remove unnecessary catch

* Refactor getReviews

* Move getReviews back to block's code

* Cleanup

* Fix wrong order in editor

* Hide 'Load More Reviews' if showLoadMore is false

* Move getReviews to utils.js

* Add @woocommerce/navigation to package.json

* Make notices non-dismissable

* Reviews by Product: prevent importing all HOCs and import only withComponentId (https://github.com/woocommerce/woocommerce-blocks/pull/811)

* Reviews by product: Update review styling and content (https://github.com/woocommerce/woocommerce-blocks/pull/806)

* Add new settings to Reviews by Product block

* Remove helpText and add notices

* Use RangeControl for numeric settings

* Prevent fetching new reviews if all were already fetched

* Enable product image in reviews

* Remove unnecessary catch

* Refactor getReviews

* Move getReviews back to block's code

* Cleanup

* Fix wrong order in editor

* Hide 'Load More Reviews' if showLoadMore is false

* Move getReviews to utils.js

* Add @woocommerce/navigation to package.json

* Make notices non-dismissable

* Review design/layout

* verified icons

* Read more component

* remove comment

* expanded -> isExpanded

* Localise and change default elipses

* Simplify ReadMore

* Support children rather than passing content

* remove outside

* remove list style

* Update assets/js/components/read-more/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/components/read-more/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* merge set state

* Add missing parameter doc in renderReview (https://github.com/woocommerce/woocommerce-blocks/pull/820)

* Fix Reviews by Product order by select not honoring default setting (https://github.com/woocommerce/woocommerce-blocks/pull/818)

* Read more component - change how clamped content is shown (https://github.com/woocommerce/woocommerce-blocks/pull/821)

* Pass review as components

* Build summary from content and track both

* Toggle display after inital load

* remove unused variable

* remove componentDidUpdate

* Simplify clampLines

* Put back componentDidUpdate, but store final summary in state

* clampEnabled

* Call clampLines from componentDidMount (https://github.com/woocommerce/woocommerce-blocks/pull/826)

* truncate html tests

* implement trimHTML and pass test

* Feedback

* test short content

* Use withProduct HOC in ReviewsByProductEditor (https://github.com/woocommerce/woocommerce-blocks/pull/828)

* Use withProduct HOC

* Convert ReviewsByProductEditor to a functional component

* Add loading and error states

* Prevent loading screen appearing when changing products

* Reviews: only save wrapper element to post (https://github.com/woocommerce/woocommerce-blocks/pull/830)

* Update based on product reviews

* Cleanup after master merge

* Implement content hiding and placeholder states for reviews blocks

* Output product names and adjust css

* Review permalink

* Remove old read-more component which was moved

* showProductName is already part of passed attributes

* CSS tweaks for missing elements

* Move dir

* Move product reviews block

* Move shared uitils

* update paths

* frontend paths

* Update paths

* shared attributes

* switch to constants

* Shared review block code

* Replace constants

* Fix hidden content bug

* star alignment
2019-08-19 15:13:07 +01:00
Albert Juhé Lluveras a6a131f8fd Move wc_product_block_data variables to constants file (https://github.com/woocommerce/woocommerce-blocks/pull/870) 2019-08-17 11:14:11 +02:00
Albert Juhé Lluveras fb842d2596 Update Reviews styles so it looks the same in the editor and the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/871) 2019-08-16 16:12:06 +01:00
Albert Juhé Lluveras ad38f9d327 Create Reviews by Product block (https://github.com/woocommerce/woocommerce-blocks/pull/658)
* Create Reviews by Product block

* Honor Content settings

* Fix wrong className

* Load new wc-packages file

* Add reviews-by-product JS files to webpack config

* Cleanup

* Remove error messages

* Add Reviews by Product icon

* Update sort options

* Allow additional CSS classes attribute

* Refactor block styles

* Fix wrong default for reviews_orderby

* Don't enforce CSS chunks

* Add reviews count to Reviews by Product controls (https://github.com/woocommerce/woocommerce-blocks/pull/671)

* Add label to Reviews by Product controls count (https://github.com/woocommerce/woocommerce-blocks/pull/677)

* Add reviews count to Reviews by Product controls

* Add label to Reviews by Product controls count

* Add label to Reviews by Product controls count

* Update components package

* Review ordering and placeholders (https://github.com/woocommerce/woocommerce-blocks/pull/688)

* Add support for comment_count ordering and add to productcontrol

* Add a placeholder if rating count is 0

* Update assets/js/components/utils/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/blocks/reviews-by-product/block.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* grammar

* Fix some linting errors and warnings (https://github.com/woocommerce/woocommerce-blocks/pull/693)

* Create Reviews by Product block placeholder (https://github.com/woocommerce/woocommerce-blocks/pull/691)

* Create Reviews by Product block placeholder

* Reviews by Product: load and render reviews with JS (https://github.com/woocommerce/woocommerce-blocks/pull/696)

* Reviews by Product: load and render reviews with JS

* Add dangerouslySetInnerHTML explanatory comment

* Fix wrong dependency source

* Debounce getReviews call when creating the Reviews by Product block

* Rename 'Reviewer Picture' with 'Avatar' (https://github.com/woocommerce/woocommerce-blocks/pull/702)

* Lint errors

* Replace stringify query with addQueryArgs (https://github.com/woocommerce/woocommerce-blocks/pull/707)

* Add reviews endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/705)

* Prevent state updates on unmounted components (https://github.com/woocommerce/woocommerce-blocks/pull/715)

* Add Order by and Load more controls in Reviews by Product frontend (https://github.com/woocommerce/woocommerce-blocks/pull/716)

* Export IconReviewsByProduct (https://github.com/woocommerce/woocommerce-blocks/pull/721)

* Fix Reviews by Product layout in IE11 (https://github.com/woocommerce/woocommerce-blocks/pull/723)

* Set minimum to per page input field (https://github.com/woocommerce/woocommerce-blocks/pull/731)

* Hide avatars in Reviews by Products if 'show_avatars' settings is false (https://github.com/woocommerce/woocommerce-blocks/pull/730)

* Blocks API - Reviews endpoint with rating sort and category filtering (https://github.com/woocommerce/woocommerce-blocks/pull/726)

* Move file to correct location

* We are only using the reviews endpoint not revioews/id

* Remove sensistive data and make endpoint public

* Allow guest access to approved reviews

* Add support for rating sorting

* category filtering

* update arg name

* fix category query

* Reviews by Product: add placeholders when loading reviews (https://github.com/woocommerce/woocommerce-blocks/pull/732)

* Add placeholder animation (https://github.com/woocommerce/woocommerce-blocks/pull/733)

* Hook up Reviews by Product 'Order by' with endpoint (https://github.com/woocommerce/woocommerce-blocks/pull/736)

* Hook up Reviews by Product 'Order by' with endpoint

* Use onChange instead of onBlur in select control

* Reviews by Product: Hide ratings if they are disabled in settings (https://github.com/woocommerce/woocommerce-blocks/pull/740)

* Hide ratings in Reviews by Product if disabled in settings

* Hide order by select if ratings are disabled

* Reviews by Product cleanup (https://github.com/woocommerce/woocommerce-blocks/pull/773)

* Fix wrong method name

* Reduce the number of dependencies used in Reviews by Product (https://github.com/woocommerce/woocommerce-blocks/pull/774)

* Reduce the number of dependencies used in Reviews by Product

* Use 'withComponentId' HOC

* Remove debounce

* Fix wrong proptype

* Get rid of JS warning

* Load render from react-dom

* Add formatted_date_created item schema (https://github.com/woocommerce/woocommerce-blocks/pull/788)

* Fix import of WithComponentID

* Add new settings to Reviews by Product block (https://github.com/woocommerce/woocommerce-blocks/pull/787)

* Add new settings to Reviews by Product block

* Remove helpText and add notices

* Use RangeControl for numeric settings

* Prevent fetching new reviews if all were already fetched

* Enable product image in reviews

* Remove unnecessary catch

* Refactor getReviews

* Move getReviews back to block's code

* Cleanup

* Fix wrong order in editor

* Hide 'Load More Reviews' if showLoadMore is false

* Move getReviews to utils.js

* Add @woocommerce/navigation to package.json

* Make notices non-dismissable

* Reviews by Product: prevent importing all HOCs and import only withComponentId (https://github.com/woocommerce/woocommerce-blocks/pull/811)

* Reviews by product: Update review styling and content (https://github.com/woocommerce/woocommerce-blocks/pull/806)

* Add new settings to Reviews by Product block

* Remove helpText and add notices

* Use RangeControl for numeric settings

* Prevent fetching new reviews if all were already fetched

* Enable product image in reviews

* Remove unnecessary catch

* Refactor getReviews

* Move getReviews back to block's code

* Cleanup

* Fix wrong order in editor

* Hide 'Load More Reviews' if showLoadMore is false

* Move getReviews to utils.js

* Add @woocommerce/navigation to package.json

* Make notices non-dismissable

* Review design/layout

* verified icons

* Read more component

* remove comment

* expanded -> isExpanded

* Localise and change default elipses

* Simplify ReadMore

* Support children rather than passing content

* remove outside

* remove list style

* Update assets/js/components/read-more/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* Update assets/js/components/read-more/index.js

Co-Authored-By: Albert Juhé Lluveras <contact@albertjuhe.com>

* merge set state

* Add missing parameter doc in renderReview (https://github.com/woocommerce/woocommerce-blocks/pull/820)

* Fix Reviews by Product order by select not honoring default setting (https://github.com/woocommerce/woocommerce-blocks/pull/818)

* Read more component - change how clamped content is shown (https://github.com/woocommerce/woocommerce-blocks/pull/821)

* Pass review as components

* Build summary from content and track both

* Toggle display after inital load

* remove unused variable

* remove componentDidUpdate

* Simplify clampLines

* Put back componentDidUpdate, but store final summary in state

* clampEnabled

* Call clampLines from componentDidMount (https://github.com/woocommerce/woocommerce-blocks/pull/826)

* truncate html tests

* implement trimHTML and pass test

* Feedback

* test short content

* Use withProduct HOC in ReviewsByProductEditor (https://github.com/woocommerce/woocommerce-blocks/pull/828)

* Use withProduct HOC

* Convert ReviewsByProductEditor to a functional component

* Add loading and error states

* Prevent loading screen appearing when changing products

* Reviews: only save wrapper element to post (https://github.com/woocommerce/woocommerce-blocks/pull/830)

* Fix bundlesize config not picking frontend files (https://github.com/woocommerce/woocommerce-blocks/pull/840)

* Reviews by Product: split 'block.js' into smaller chunks (https://github.com/woocommerce/woocommerce-blocks/pull/841)

* Split 'block.js' into smaller chunks

* Move frontend blocks to their specific folder

* Order imports

* Typo

* Add frontend components proptypes

* Fix indentation

* Call 'this.getDefaultArgs' directly inside 'getReviews'

* Move access to wc_product_block_data to the top of the file

* Rename 'frontend' folder to 'base'

* Rename base components and move styles to their folder

* Fix Reviews by Product using rating count instead of review count (https://github.com/woocommerce/woocommerce-blocks/pull/860)

* Improve Reviews by Product accessibility (https://github.com/woocommerce/woocommerce-blocks/pull/861)

* Improve Reviews by Product accessibility

* Make 'onClick' prop not required in <LoadMoreButton>

* Wrap Reviews by Product editor block with <Disabled>

* Reviews: fix reviews without rating not appearing when sorting by rating (https://github.com/woocommerce/woocommerce-blocks/pull/863)
2019-08-15 16:55:57 +02:00