Commit Graph

452 Commits

Author SHA1 Message Date
Raluca Stan 051bb64138 Fix wide appender buttons overlap in Cart & Checkout blocks in the Editor (https://github.com/woocommerce/woocommerce-blocks/pull/5801)
* Add the correct appender button for non empty groups

* Revert "Add the correct appender button for non empty groups"

This reverts commit 4b41d7d7f82461813b3464d1b4f931c442bce3be.

* Force position relative for custom InnerBlocks.ButtonBlockAppender  appenders.

Removing InnerBlocks.ButtonBlockAppender  from renderAppender = {InnerBlocks.ButtonBlockAppender } results in the black appender button beeing shown only when the block is selected, and we need the appender to be visible by default.
2022-02-10 11:33:48 +01:00
Saad Tarhi d53551d4a7 Fix/cart button focus hover states (https://github.com/woocommerce/woocommerce-blocks/pull/5712)
* Add hover & focus styles for component buttons

We are using an old version of the "@wordpress/component" package,
that's why we are not getting the latest style fixes from Gutenberg.

The reason to not using the latest version is that we had some issues
with the bundle size.

The current solution is to set our own focus & hover styles

* Replace raw value with Sass variable

* Fix hover style for the mini cart block

We don't have the outlined button yet. This styles is unique for the
mini cart button.

To refactor this code, maybe we should create a reusable outlined button

* Add variant to the Woo Block Button component

To refactor our code, adding a "variant" prop looks logical since we are
have already "contained" & "outlined" buttons. So, for future need for an
outlined button, no need to manually apply the same style again.

The "contained" variant is set by default for legacy reasons. Our Button
component was first built as a contained one.

* Fix height difference: oulined & contained buttons

The outlined buttons have more height because of the added border value.

To fix it we can replace the border with the inner shadow.

Co-authored-by: Saad Tarhi <saad.tarhi@automattic.com>
2022-02-09 18:32:05 +01:00
Luigi Teschio 62cabea003 Set focus on Empty Mini Cart Contents Block (https://github.com/woocommerce/woocommerce-blocks/pull/5744)
* Set focus on Empty Mini Cart Contents Block woocommerce/woocommerce-blocks#4618

Set focus on Empty Mini Cart Contents Block

* fix useEffect logic
2022-02-09 10:51:30 +01:00
Alex Florisca 16d5e773bc Reformatted prettier files (https://github.com/woocommerce/woocommerce-blocks/pull/5735) 2022-02-07 16:59:44 +00:00
Mike Jolley 2b5f115d41 Remove custom `Icon` component in favour of `@wordpress/icons` where possible (https://github.com/woocommerce/woocommerce-blocks/pull/5599)
* Remove atom icon

* Swap icon usage to WordPress package

* remove unused icons from library

* Use @wordpress/primitives

* Product cats block to listView

* On-sale to use percent instead of tag icon

* add to cart button use button icon

* on sale products block icon

* Handpicked products use stack icon

* Products by stock box icon

* Make sparkles woo purple

* Fix icon name

* Correct more tag name

* fix path to icons

* Update snaps

* Update readme to explain updated usage

* Import SVG and path from primitives

* Missing isFeaturePluginBuild

* Update assets/js/icons/README.md

Co-authored-by: Raluca Stan <raluca.stan@automattic.com>

* Update assets/js/icons/README.md

Co-authored-by: Raluca Stan <raluca.stan@automattic.com>

* Update assets/js/icons/README.md

Co-authored-by: Raluca Stan <raluca.stan@automattic.com>

* update lock

Co-authored-by: Raluca Stan <raluca.stan@automattic.com>
2022-02-01 16:54:38 +00:00
Tung Du 995d41e2a9 Fix: Empty Mini Cart contents overflow issue (https://github.com/woocommerce/woocommerce-blocks/pull/5635)
* fix: add wrapper for empty mini cart contents inner blocks. Allow inner content to be scrollable

* fix overflow issue for the editor

* add padding for the empty cart view
2022-02-01 17:19:41 +01:00
Manos Psychogyiopoulos 6ed7034223 Add inner wrapper div in 'td.wc-block-cart-item__product' (https://github.com/woocommerce/woocommerce-blocks/pull/5240)
* Add inner wrapper div in td.wc-block-cart-item__product

Adding this wrapper element is necessary in order to be able to "fake" item grouping in a theme-agnostic manner: https://user-images.githubusercontent.com/1783726/118831630-97855600-b8c8-11eb-8906-c7f9ada769e7.png

* Whoops

* Remove classnames function

* Update indentation for QuantitySelector

Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
2022-01-31 15:18:29 +00:00
Thomas Roberts c7aa3a75b9 Update tests to use `useEvent` (https://github.com/woocommerce/woocommerce-blocks/pull/5573)
* Update payment-method-data-context tests to use userEvent

* Update mini cart block tests to use userEvent

* Update payment methods tests to use userEvent
2022-01-31 10:53:21 +00:00
Thomas Roberts a46f13c6c5 Move Checkout block attributes into metadata (`block.json`) (https://github.com/woocommerce/woocommerce-blocks/pull/5594)
* Add block title to AbstractBlock class

* Add block title to Checkout block

* Include all block.json files in tsconfig

* Add get_block_title method to Checkout.php

* Remove redundant block_title field

* Add block.json and remove static attributes from attributes.ts

* Register block using attributes from block.json

* Add metadata_path to AbstractBlock

* Add function to AssetsApi to get the metadata path from the plugin root

* Register the block using metadata if it's set in the block's class

* Remove get_block_title method

* Only add supports and attributes to the block when not registering with metadata

* Change get_block_metadata to get_block_metadata_path

* Change indentation to tabs in block.json

* Update comment to clarify why attributes and supports are set later

* Check if path to metadata is not empty instead of set and not empty

* Move checkout block out of cart-checkout directory

* Update get_block_metadata_path function to find block.json automatically

* Remove metadata path from AbstractBlock

* Check if there's a metadata file and register blocks with metadata if so

* Move deprecated attributes out of metadata and into attributes.ts

* Re-add deprecated attributes to checkout index

* Move order notes test

* Move test for checkout phone number in edito

* Fix indentation in checkout/block.json

* Move checkout terms tests

* Try forcing storefront theme in e2e tests

* Revert "Try forcing storefront theme in e2e tests"

This reverts commit 5b0fd47a2c39aadb0141a4ed28cbc0e6baa89625.

* Try capturing screenshot on test failures

* Try uploading error in try catch

* Try uploading artefacts on error

* Test uploading artefacts

* Screenshot just before looking for edit post layout

* Revert "Screenshot just before looking for edit post layout"

This reverts commit 61dff027789ce13a0d84e7b6f11e431637c5a450.

* Revert "Test uploading artefacts"

This reverts commit adf5cc55bcdb677f889bf5a62803b4150d98e665.

* Revert "Try uploading artefacts on error"

This reverts commit 7441a832a113a95fef89cc1b8db6dc79271be516.

* Revert "Try uploading error in try catch"

This reverts commit ca412ce505d56286b164f588a201a451f6bceeb6.

* Revert "Try capturing screenshot on test failures"

This reverts commit 0de6e97df19b116091a7bb3b8652713867d2d80f.

Co-authored-by: Alex Florisca <alex.florisca@automattic.com>
2022-01-28 16:37:06 +00:00
Thomas Roberts b7560ebed5 Add tests for Checkout Terms block (https://github.com/woocommerce/woocommerce-blocks/pull/5621)
* Install @wordpress/block-editor package

* Add test for checkout terms frontend block

* Add tests for checkout terms in editor

* Add tests for Checkout Terms in editor

* Use void 0 as function's return type

* Update tests to use toBeInTheDocument and split checkbox test in two

* Use void 0 for empty function
2022-01-27 12:34:52 +00:00
Tung Du 6f4c00a2fd Fix: Exclude Mini Cart and other blocks inside the Mini Cart Contents block (https://github.com/woocommerce/woocommerce-blocks/pull/5616) 2022-01-27 17:10:53 +07:00
Niels Lange 59c8ddc531 Show single express payment button in full width (https://github.com/woocommerce/woocommerce-blocks/pull/5601)
* Show single express payment button in full width

* Change :first-child:nth-last-child(1) to :only-child
2022-01-24 10:22:02 +07:00
Tung Du 718f2dbc6f Mini Cart Contents: Support link and text colors (https://github.com/woocommerce/woocommerce-blocks/pull/5566) 2022-01-22 00:39:04 +07:00
Thomas Roberts aaaf6787a3 Add tests for phone field on checkout (https://github.com/woocommerce/woocommerce-blocks/pull/5604) 2022-01-21 13:24:48 +00:00
Thomas Roberts 0d7b8ab95a Add tests for order notes component (https://github.com/woocommerce/woocommerce-blocks/pull/5605) 2022-01-21 12:07:36 +00:00
Thomas Roberts c950f29400 Remove extra padding for cart sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/5430)
Co-authored-by: Alex Florisca <alex.florisca@automattic.com>
2022-01-13 17:10:18 +00:00
Raluca Stan b1bef86632 Fix Using / for division is deprecated warnings seen when building the project (https://github.com/woocommerce/woocommerce-blocks/pull/5556) 2022-01-13 15:01:36 +01:00
Luigi Teschio cba17c2ef9 Mini Cart block: re-enable background support woocommerce/woocommerce-blocks#4965 (https://github.com/woocommerce/woocommerce-blocks/pull/5539)
Mini Cart block: re-enable background support woocommerce/woocommerce-blocks#4965
2022-01-11 15:08:16 +01:00
Mike Jolley a1695861f2 Add minimum quantity, maximum quantity, and step (multiple_of) to the Cart Block and Store API (https://github.com/woocommerce/woocommerce-blocks/pull/5406)
* add min and step to Store API

* add min and step support

* typo

* Update assets/js/base/components/quantity-selector/index.tsx

* Update assets/js/base/components/quantity-selector/index.tsx

* Fix debounce callback

* Style qty input to show steps

* Implement quantity_limits in API

* Quantity validation

* Update product API

* Normalize on + -

* Separate add to cart events from cart item events in regards to limits

* Prevent qty change for editable line items

* Unify filters

* Remove step number indicator from buttons ¯\_(ツ)_/¯

* Normalize on mount

* Update docs

Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>
2022-01-11 11:09:59 +00:00
Mike Jolley e19abbc0c2 Remove Built-in Stripe Integration in favour of Stripe Extension (https://github.com/woocommerce/woocommerce-blocks/pull/5449)
* Remove Stripe from PHP side

* Remove stripe from client

* fix const name in tests

* Update docs
2022-01-11 10:53:38 +00:00
Tung Du 14c1017feb Mini Cart Contents block improvements (https://github.com/woocommerce/woocommerce-blocks/pull/5446) 2022-01-08 08:19:01 +07:00
Tung Du 4b159f0fcd Allow inserting blocks to filled mini cart (https://github.com/woocommerce/woocommerce-blocks/pull/5527) 2022-01-08 07:51:20 +07:00
Luigi Teschio 549e10fabb Mini Cart Block: The color of the badge reflects the global style (https://github.com/woocommerce/woocommerce-blocks/pull/5477)
* Mini Cart Block: the color of the badge reflects the global style woocommerce/woocommerce-blocks#4965

Mini Cart Block: the color of the badge reflects the global style woocommerce/woocommerce-blocks#4965

* disable background
2022-01-06 09:47:34 +01:00
Malith Senaweera 65835d3689 Fix duplicated error notices (https://github.com/woocommerce/woocommerce-blocks/pull/5476)
* Fix duplicated error notices

StoreNoticeProvider is already being used within Block component. This
removal prevents duplicated error notices within the Payment Options
section

* Move StoreNoticeProvider from payment block

Remove StoreNoticeProvider from payment block and move it to the parent
frontend block to avoid unnecessarily loading the notice provider
2022-01-04 17:37:46 +00:00
Thomas Roberts a8e094473c Revert "Remove extra padding for cart sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/5247)" (https://github.com/woocommerce/woocommerce-blocks/pull/5429)
This reverts commit a60cd66692.
2021-12-30 12:24:18 +00:00
Thomas Roberts 20cac18474 Don't show shipping price when no options are available (https://github.com/woocommerce/woocommerce-blocks/pull/5444)
* Add isCheckout prop to NoShippingPlaceholder and TotalsShipping

* Pass isCheckout to TotalsShipping in Checkout sidebar

* Show the NoShippingPlaceholder if no rates are found

* Show better error message when no shipping is available in checkout
2021-12-23 13:24:08 +00:00
Tung Du b2eecf3bb0 Fix: Mini Cart: Default content for empty state (https://github.com/woocommerce/woocommerce-blocks/pull/5421) 2021-12-22 18:03:58 +07:00
Alex Florisca a60cd66692 Remove extra padding for cart sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/5247) 2021-12-21 13:46:49 +00:00
Niels Lange ee45d9d9cf Remove full-width mode from cart and checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/5315) 2021-12-20 11:27:51 +00:00
Tung Du 50066455c0 Fix: Mini Cart block: divide contents into three inner blocks (https://github.com/woocommerce/woocommerce-blocks/pull/5386)
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2021-12-20 14:57:55 +07:00
Tung Du b0623a8b52 Mini Cart: only display the editing link to users with site editing permission (https://github.com/woocommerce/woocommerce-blocks/pull/5372) 2021-12-14 07:54:23 +07:00
Tung Du 0350268b82 Switch to correct view if inner block is selected (https://github.com/woocommerce/woocommerce-blocks/pull/5358) 2021-12-14 07:46:10 +07:00
Seghir Nadir 772ee23faa Update item quantity if server result is different from client (https://github.com/woocommerce/woocommerce-blocks/pull/5352)
* respect when quantity changes from up

* add test
2021-12-10 16:26:57 +01:00
Mike Jolley 70106d45d3 Revise checkout payment statuses to avoid data loss on error (https://github.com/woocommerce/woocommerce-blocks/pull/5350)
* Clarify docs for STARTED

* Clarify docs for setActivePaymentMethod

* Remove useActivePaymentMethod hook (this held state for active methods and tokens)

* Update type defs

* Enhance setActivePaymentMethod action to accept method data

* SET_ACTIVE_PAYMENT_METHOD action

* Add setActivePaymentMethod dispatcher and make "started" status only

* Update setActivePaymentMethod usage in express methods

* Set radio control defaults

* Consolodate tokens and methods

* Update assets/js/base/context/providers/cart-checkout/payment-methods/reducer.ts

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

* Spacing

* Split saved cards tests from regular, since saved cards are checked by default

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2021-12-10 16:26:16 +01:00
Niels Lange 6a74887464 Limit CSS styles to WooCommerce Block icons only (https://github.com/woocommerce/woocommerce-blocks/pull/5363)
* Limit CSS styles to WooCommerce Block icons only

* Update assets/css/editor.scss

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

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2021-12-10 21:32:44 +07:00
Luigi Teschio 13deb1b09e Mini Cart Block: render the empty state set on template parts (https://github.com/woocommerce/woocommerce-blocks/pull/5338)
* add view switcher for mini cart contents block

* editor view switcher

* update mini cart template file

* render the empty state template parts for the Mini Cart Block woocommerce/woocommerce-blocks#4674

render the empty state template parts for the Mini Cart Block woocommerce/woocommerce-blocks#4674

* update selector

* allow empty mini cart block to add all blocks

* fix tests; improve code style

* install @wordpress/block-editor package

* fix warning on frontend side

* block-editor package is not necessary

* merge attributes object

Co-authored-by: Tung Du <dinhtungdu@gmail.com>
2021-12-10 12:11:59 +01:00
Albert Juhé Lluveras 29fa0a61e6 Fix Mini Cart template part link on WP 5.9 (https://github.com/woocommerce/woocommerce-blocks/pull/5348)
* Fix link to edit the Mini Cart template part in WP 5.9

* Use wp_is_block_theme() function

* Add protection against overwriting isSiteEditorAvailable setting

* Rename isSiteEditorAvailable to isBlockTheme
2021-12-10 11:23:16 +01:00
Seghir Nadir 8e62dea95d Wait until carts load before calling `canMakePayment` (https://github.com/woocommerce/woocommerce-blocks/pull/5337)
* wait till cart loads before calling canMakePayment

* fix tests
2021-12-08 13:41:31 +00:00
Mike Jolley cfeb5558b7 Update WordPress Monorepo packages with React 17x support (https://github.com/woocommerce/woocommerce-blocks/pull/5223)
* Use npm 14

* Update WP packages

* Update non-dev wordpress dependencies

* Remove usage of @automattic/data-stores

* Moves tag, search-list-control components back into private `editor-components` to mitigate dependency conflicts with`@woocommerce/components`

* Fix tests with act()

* package-lock

* fix broken maps

* Patch 14x package

* update locks

* Revert nvmrc change

* Fix tests due to debounce

Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>
2021-12-07 15:47:50 +00:00
Tung Du 185f1d5bd9 Fix: Mini Cart block button should be disabled in the editor (https://github.com/woocommerce/woocommerce-blocks/pull/5308) 2021-12-07 21:29:56 +07:00
Tung Du 90a54b6cf0 Mini Cart Contents block: implement view switcher in editor (https://github.com/woocommerce/woocommerce-blocks/pull/5304) 2021-12-07 21:07:53 +07:00
Albert Juhé Lluveras b927ca6a9f Convert renderFrontend to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/5238)
* Rename render-frontend file to tsx

* Add types to renderFrontend

* Reorder code

* Use PascalCase for types

* add generics

* fix TS error

* restore interface

Co-authored-by: Luigi <gigitux@gmail.com>
2021-12-07 11:07:32 +01:00
Albert Juhé Lluveras 48a29c5bba Refactor Mini Cart contents block unmount to fix ESLint warning (https://github.com/woocommerce/woocommerce-blocks/pull/5216) 2021-12-03 11:37:15 +01:00
Luigi Teschio 2358c0c90b Mini Cart block: Add label for tax when it should be visible in accordance with WC settings (https://github.com/woocommerce/woocommerce-blocks/pull/5184)
* Mini Cart block: Add label for tax when it should be visible in accordance with WC settings woocommerce/woocommerce-blocks#4849

Mini Cart block: Add label for tax when it should be visible in accordance with WC settings

* improve the tax label handling

* fix code after conflict

* fix tax label handling when it is added the first product

* add another check for avoid PHP error

* rename variables; add test for the function getSettingWithCoercion

* add margin-right for tax-label; add test to check if type guard works correctly
2021-12-03 10:45:06 +01:00
Luigi Teschio 67ad9e4f27 Mini Cart Block: add link to edit template part from sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/5201)
* Mini Cart Block: add link to edit template part from sidebar woocommerce/woocommerce-blocks#5186

Mini Cart Block: add link to edit template part from sidebar

* fix e2e tests
2021-11-30 10:42:07 +01:00
Mike Jolley c067e990b4 Introduce `<Noninteractive>` component to disable form elements non-visually (https://github.com/woocommerce/woocommerce-blocks/pull/5157)
* Noninteractive component based on Disabled

* Implement in cart/checkout

* Pass down props

* Update 'use-debounce' library

* aria disabled
2021-11-26 14:47:37 +00:00
Tung Du 1225b2680b Mini Cart block: allow left, right and center alignment (https://github.com/woocommerce/woocommerce-blocks/pull/5171) 2021-11-23 06:40:24 +07:00
Seghir Nadir d345a0004a replace synchronizeBlocksWithTemplate with createBlocksFromInnerBlocksTemplate (https://github.com/woocommerce/woocommerce-blocks/pull/5040) 2021-11-22 12:45:48 +00:00
M. L. Giannotta 06f635bcf7 Checkout Terms Block: Fix Terms and Conditions checkbox position in editor (https://github.com/woocommerce/woocommerce-blocks/pull/5150) (https://github.com/woocommerce/woocommerce-blocks/pull/5191)
Within the editor, the checkbox appeared aligned at the bottom of the paragraph, while
on the front-end it would appear aligned at the top. The alignment was actually correct
but a top margin was assigned to checkboxes in the backend.

Instead of removing that globally, this commit resets it for checkboxes within the checkout
block.
2021-11-22 11:12:13 +01:00
Mike Jolley 3b1bedd15f Checkbox Component Styling Fix (https://github.com/woocommerce/woocommerce-blocks/pull/5164)
* Wrap label in div to prevent clickable area growing too large

* Prevent pointer events on svg

* Double gap in editor
2021-11-22 09:52:43 +01:00