Commit Graph

763 Commits

Author SHA1 Message Date
Niels Lange 9678673497 Allow rendering HTML in shipping package names (https://github.com/woocommerce/woocommerce-blocks/pull/7147)
* Allow renderiung HTML in shipping package names

* Sanitize HTML to render

* Create reusable util sanitizeHTML

* Solve TS error

* Remove __experimentalApplyCheckoutFilter
2022-09-26 23:16:44 +07:00
Hsing-yu Flowers c2c639dee1 Sanitize store notices html (https://github.com/woocommerce/woocommerce-blocks/pull/7145)
Sanitizing the merchant store link in the error message added in WooPay when in some
cases the customer could run into an issue where we need to tell them an error occurred
and they have to go back to the merchant store and re-initialize WooPay to fix it.

Because previously we were only expecting strings, the text was not sanitized.
2022-09-23 20:48:28 +02:00
Alex Florisca 79b1d4a38a Revert "Add static class name for product-details (https://github.com/woocommerce/woocommerce-blocks/pull/6914)" (https://github.com/woocommerce/woocommerce-blocks/pull/7191)
This reverts commit d6d94ae622.
2022-09-21 15:20:00 +01:00
Niels Lange 3d55668983 Create Cross-Sells product list (https://github.com/woocommerce/woocommerce-blocks/pull/6645)
* Create Cross-Sells product list

* Show “Read more” button for out-of-stock cross-sells products

* Update assets/js/blocks/cart/inner-blocks/cart-cross-sells-products/block.tsx

Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>

* Update assets/js/blocks/cart/cart-cross-sells-product-list/index.tsx

Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>

* Remove obsolete isLoading and placeholderRows

* Fix TS errors

* Rename crossSellsProduct to product

* Fix critical error

* Lock “Cart Cross-Sells products” inner block

* Update assets/js/blocks/cart/inner-blocks/cart-cross-sells-products/block.json

Co-authored-by: Saad Tarhi <saad.trh@gmail.com>

* Prevent moving of the Cross-Sells block

Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
2022-09-21 13:04:15 +07:00
Paulo Arromba 8a5dd65bc1 fix: Markup is visible in checkout error notices (https://github.com/woocommerce/woocommerce-blocks/pull/6800)
* Enabled __unstableHTML hidden option for HTML rendering within notices.

* Fixed margin-bottom for HTML notice content

* Fixed margin-top for HTML notice content

* Attempt to fix a broken e2e test
2022-09-20 16:54:25 +01:00
Albert Juhé Lluveras 16feccdd74 Fix invisible Reset filter button in some themes (https://github.com/woocommerce/woocommerce-blocks/pull/7111) 2022-09-13 09:32:11 +02:00
Lucio Giannotta 5dd05d7ab2 Improve public-facing texts and labels (https://github.com/woocommerce/woocommerce-blocks/pull/7045)
We noticed that oftentimes our labels and text tend to be overly
technical or unclear. We decided to do a bulk pass to improve
the readability to non-technical users.
2022-09-12 10:39:26 +02:00
Niels Lange 2f52565c75 Correct broken *.md links (https://github.com/woocommerce/woocommerce-blocks/pull/7108) 2022-09-12 11:29:24 +07:00
Alba Rincón cc0f9906d2 Add Apply button placeholders to filters and adjust title margins (https://github.com/woocommerce/woocommerce-blocks/pull/7077)
* Adjust filter titles margins

* Show the Apply button placeholder and adjust title margins

* Add placeholder for the Apply button on filter by price

* Add placeholder for the Apply button on filter by attr

* Update stock filter snapshot

* Move the apply button placeholder to inside the FilterSubmitButton component

* Fix the placeholder button height

* Fix apply button on editor

* Change loading class to be is-loading
2022-09-09 13:28:04 +02:00
Tom Cafferkey dd11b23bef Active Filters Loading Placeholders (https://github.com/woocommerce/woocommerce-blocks/pull/7083)
* Active Filters Loading Placeholders

* Use flexbox for active filters loading placeholders

* Clear all placeholder loading styles

* Ensure active filters which arent attribute filters render null when in a loading state

* Refactor loading placeholders and state setting

* Add useIsMounted to shared hooks and check productAttributes only when mounted

* Add componentHasMounted to useMemo deps

* Check URL for attribute filter hint

* Check URL for attribute filter hint

* Remove border-radius from placeholder for clear all button

* Fix filter loading when no filters are active on shop page
2022-09-09 11:59:29 +01:00
Albert Juhé Lluveras 380f270975 Make Active filters texts bigger (https://github.com/woocommerce/woocommerce-blocks/pull/7087) 2022-09-09 09:53:27 +02:00
Alba Rincón 9f0d1cd86e Compare count with null to avoid rendering a 0 when count is 0 (https://github.com/woocommerce/woocommerce-blocks/pull/7073) 2022-09-08 10:41:11 +02:00
Alba Rincón a15ffff043 Update `filter by attribute` skeleton design (https://github.com/woocommerce/woocommerce-blocks/pull/6990)
* Update filter by attribute skeleton design

* Update filter by attribute skeleton design

* Start using the FilterTitlePlaceholder

* Fix title animation

* Show two placeholder lines on checkboxes

* Fix dropdown border

* Fix gap

* Fix border radius for dropdown

* Don't show placeholder when changing other filters

* Improve filter title margins
2022-09-06 15:17:11 +02:00
Alba Rincón f141a75acc Update `filter by price` skeleton design (https://github.com/woocommerce/woocommerce-blocks/pull/6997)
* Update filter by price skeleton design

* Improve skeleton colors

* Update skeleton when no apply button

* Update skeleton with apply button

* Avoid showing a very wide placeholder when the filter title is very long

* Start using the FilterTitlePlaceholder component for the placeholder

* Add comment to isUpdating

* Remove unneeded styles

* Fix title animation
2022-09-02 15:52:52 +02:00
Alba Rincón 3421857599 Fix stock filter placeholder (https://github.com/woocommerce/woocommerce-blocks/pull/7009)
* Set max-height to avoid showing a big placeholder on longer titles

* Avoid showing placeholder when no there are no products

* Extract the placeholder to a separate component

* Adjust width

* Adjust border radius

* Pass the title to adjust the placeholder width/height

* Rename component
2022-08-31 10:43:26 +02:00
Alex Florisca d6d94ae622 Add static class name for product-details (https://github.com/woocommerce/woocommerce-blocks/pull/6914)
* Add a static class name for the product details item instead of the translatable string

* Update Jest snapshot

Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
2022-08-29 11:46:33 +01:00
Daniel W. Robert b2f98c2f51 Layout Updates to Active Filters Block (https://github.com/woocommerce/woocommerce-blocks/pull/6905)
* Reverse ordter of filter item name and close btn.

* Update layout & typography styles for block items

* Update chip ui view styles.

Additionally, add editor styles to have the editor match the rendered
frontend.

* Update additional remove button styles.

- Add hover state to remove button on chip layout.
- Update disabled styles to remove button in both layouts (mainly relevant
to the editor view).

* Adjust remove button colors.

Set hover states to shades of grey. Also set chip color and text to
match selected text color of the block.

* Update e2e test to account for new element order.

Since we're moving the remove button in the list view from the last
child node to the first child node, we need to adjust the expected order
of the active filter item text.

* Design and copy updates on the block settings

Co-authored-by: Alba Rincón <albarin@users.noreply.github.com>
Co-authored-by: Alba Rincón <alba.rincon@automattic.com>
2022-08-26 09:11:23 -04:00
Tung Du 6327094a49 Style the Filter by Price block based on the wrapper width (https://github.com/woocommerce/woocommerce-blocks/pull/6943) 2022-08-24 16:10:21 +07:00
Alba Rincón aae8c5d357 Update filter button styles (https://github.com/woocommerce/woocommerce-blocks/pull/6958)
* Update filter button styles

* Address feedback: use mixings

* Improve the editor selector for stock apply button

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

* Reduce vertical margin and input width

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2022-08-23 12:38:39 +02:00
Tom Cafferkey a07cc3c978 Update Filter by Stock block (https://github.com/woocommerce/woocommerce-blocks/pull/6883)
* Update Filter by Stock controls and UI to include custom checkbox and settings.

* Include and style Filter by Stock reset button

* Make checkbox accessible via keyboard

* Update snapshot tests for Filter Products by Stock component

* Update E2E tests with new label value

* Update label test for Apply Filters in E2E tests

* Specify checkbox type so styles are not overridden in the editor

* Update E2E test label for filter button

* Update label selector to search for containing text rather than exact match

* Escape quotation marks for label query in E2E shopper tests for Filter by Stock

* Correct typo on Filter by Stock controls

* Replace custom checkbox with CheckboxControl component from the checkout package.

* Remove opacity on product count for checkbox label so its the same color as the label.

* Update snapshot tests with new component usage for filter by stock

* Update block title from Filter Products by Stock to Filter by Stock

* Update reset button behaviour to clear selections immediately regardless of whether the Apply Filters button is active or not.

* Pass option value as ID to satisfy E2E tests

* Update snapshot tests for stock filter

* Reset checked state on reset for when they have filters checked but not applied.
2022-08-19 09:04:04 +01:00
Tung Du 401e7b5a70 Price Filter Block Design update (https://github.com/woocommerce/woocommerce-blocks/pull/6877)
* make toggle control full width

* add inlineInput attribute

* add inlineInput sidebar setting

* add inlineInput help text

* style the filter button

* style price input

* wip: reset button

* clicking on reset button will reset the price query

* support inline input fields

* price text styling update

* fix reset button font size

* add loading placeholder to all elements

* fix filter button style

* update range slider thumb and track style

* fix loading placeholder for non empty query

* move reset button into FilterSubmitButton component

* try: render placeholder serverside

* update filter button label

* Revert "try: render placeholder serverside"

This reverts commit 98f08efdb8048b8f78c7476b774d1128c1d31295.

* remove LoadingPlaceholder component

* remove Price: prefix from the current displayed price range

* update labels

* extract reset button as a dedicated component

* update price text section

* update reset button behavior

* avoid breaking filter submit button style for other filter blocks

* rename block to Filter by Price

* fix e2e test

* remove border support

* adjust padding for elments

* rename panel title

* Make the inline option enabled by default and fix frontend rendering

* Make the `Price Range Selector` uppercase

* Show `Reset` button only when a selection has been made

* Revert the `save` change to avoid the 'Block Recovery Prompt'

Co-authored-by: Alba Rincón <alba.rincon@automattic.com>
2022-08-16 19:58:55 +02:00
Thomas Roberts de9b044eba Only show items if there are multiple packages in the cart (https://github.com/woocommerce/woocommerce-blocks/pull/6899) 2022-08-16 17:19:40 +01:00
Thomas Roberts d45ef84219 Add dismissible compatibility notice to sidebar when editing Cart and Checkout (https://github.com/woocommerce/woocommerce-blocks/pull/6869)
* Add default page notice

* show notice all inner blocks

* support flow when page isnt saved

* switch from where we get the current post id

* update lock

* fix types

* Remove old compatibility notices from Cart and Checkout

* Move useCompatibilityNotice to sidebar-compatibility-notice directory

* Remove old CartCheckoutCompatibilityNotice

* Create sidebar compatibility notice hoc

* Add isCartOrCheckoutOrInnerBlock function

* Refactor defaultNotice to use new isCartOrCheckoutOrInnerBlock func

* Remove BlockSettings from checkout edit and export from checkout-shared

* Change so component still renders, it is just hidden with display: none

This is required because when it returns null the component gets skipped from being added to the Slot, then when it does return a component, then it gets rendered at the bottom of the Slot. By ensuring it always renders we can have it at the top all the time.

* Set the priorities of the hoc filters so compat notice renders first

* Make isCartOrCheckoutInnerBlock a hook

* Remove old compatibility notice related tests

* Remove BlockSettings from Cart

* Remove withDefaultNotice hoc

* Include DefaultNotice in compatibility notice

* Remove DefaultNotice from Checkout

* Rename withSidebarCompatibilityNotice to withSidebarNotices

This is because it includes the sidebar compatibility notice and the default notices

* Remove useIsCartOrCheckoutOrInnerBlock hook

* Remove compatibility notice code from tests

* Revert DefaultNotice back to the old one

* Remove unused components

* Remove withBlockSettings HOC and fix TS types

This is an abstraction that is no longer required, we can just include BlockSettings in the Cart and Checkout blocks

* Remove CartCheckoutFeedbackPrompt from BlockSettings

It will be included in sidebar-notices instead

* Fix TS Types in DefaultNotice

* Add BlockSettings to cart and checkout edit

* Editor: Add feedback box to the Cart & Checkout Inner Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/6881)

* Show "Feedback prompt" for all inner blocks

* Fix the "feedback" notice position for these blocks

The "checkout fields", "checkout billing address" and
"checkout shipping address" have the addressFields option which
gets rerendered and placed at the bottom of the inspector controls.

* Tidy up the address-fields hoc

* Use correct block name to check for billing or shipping address

* Revert "Editor: Add feedback box to the Cart & Checkout Inner Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/6881)"

This reverts commit 5f3d6cf15ce08d9c303e62ec3e0d0315ead1281f.

* Add hack to get feedback prompt to render last

* Fix TS errors for context and attributes

* Include CartCheckoutFeedbackPrompt in accountcontrols & addresscontrols

* Do not include feedback prompt if on an address block or contact info

* Remove unused hoc for address fields

Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>
Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
2022-08-12 15:23:08 +01:00
Daniel W. Robert 5c40b83480 Add Style Attributes Hooks to blocks/hooks Directory. (https://github.com/woocommerce/woocommerce-blocks/pull/6870)
* Copy style-attributes file to desired directory.

Add a copy of the style-attributes file in blocks/hooks to the desired
base/hooks directory with the other hooks.

* Remove relative imports in favor of global aliases

Utilizes the custom global project aliases in place of using relative
imports.

Note: seeing some linting issues with the aliases. This seems to be the
case elsewhere so it is likely not a blocker for this effort, however,
it may be worth looking into as a follow-up.

* Adjust all imports to use @woocommerce/base-hooks.

Replace all instances of relative file paths to hooks/style-attributes
to use the custom global alias.

* Remove the hooks dir in `assets/js/blocks/`.

Now that everything is using the `@woocommerce/base-hooks` custom global
alias and we have the `style-attributes` hooks file in the base/hooks
directory, we no longer need the `style-attributes` hooks file in the
aforementioned `assets/js/blocks` directory.

* Split style-attributes.ts out into separate files.

Moved the four hooks in style-attributes.ts out into their own, separate
hook file to be consistent with the rest of our custom hooks.

Additionally, moved the helper function (parseStyle) out into a separate
export in base/utils.
2022-08-10 20:04:12 -04:00
Tarun Vijwani d258a0696c Update billing address when shipping address gets change in Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/6823) 2022-08-10 17:03:28 +05:30
Tung Du b5cc976905 E2E: Try improving product list loading state detection and fix Site Editor URL (https://github.com/woocommerce/woocommerce-blocks/pull/6811)
* e2e:try: detect loading state for product list

* fix: always use site-editor.php

* wait for price filter to be applied before checking the result
2022-08-03 16:22:37 -04:00
Thomas Roberts 0fc1ee46bd Ensure package names display correctly if only one item is in package (https://github.com/woocommerce/woocommerce-blocks/pull/6815)
* Check package length >= 1 to show package name

* Check shipping rates length in order shipping packages slot

* Fix TS error where boolean value could be undefined

* Show items if there is more than one shipping rate
2022-08-02 04:51:21 -07:00
Tung Du 0ee5dbbc18 Fix: Replace DropdownSelector with FormTokenField from Gutenberg (https://github.com/woocommerce/woocommerce-blocks/pull/6647) 2022-08-01 19:00:59 +07:00
Seghir Nadir 008c63b0dc Refactor external dispatch actions from being called inside useSelect (https://github.com/woocommerce/woocommerce-blocks/pull/6718)
* refactor coupon functions outside of useSelect

* fix test
2022-07-29 16:20:48 +01:00
Thomas Roberts 488ff13ca9 Update the `previewCart` property we use to get `hasCalculatedShipping` in `useShippingData` and fix broken JS tests (https://github.com/woocommerce/woocommerce-blocks/pull/6781)
* Require the rest of the @woocommerce/block-settings module in block.test.js

* Use correct property from previewCart for hasCalculatedShipping
2022-07-28 02:22:42 -07:00
Thomas Roberts 3fbd497d28 Add gap between pakage panels (https://github.com/woocommerce/woocommerce-blocks/pull/6740) 2022-07-26 23:00:38 -07:00
Thomas Roberts 6bf8f07c39 Ensure shipping rate names show when multiple packages are used (https://github.com/woocommerce/woocommerce-blocks/pull/6753)
* Get shipping rates from preview cart in editor

* Set showItems in ShippingRatesControl to true if multiple packages

* Move dependency in useShippingData to correct section

* Ensure getting packageData.shipping_rates.length won't error
2022-07-26 23:00:17 -07:00
Tung Du c10e91e7e1 Fix: navigate through Mini Cart contents with keyboard (https://github.com/woocommerce/woocommerce-blocks/pull/6731)
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2022-07-25 12:39:47 +07:00
Paulo Arromba ffbc39bfd3 fix: fixed colors for error input and labels on dark palette mode themes and dark controls. (https://github.com/woocommerce/woocommerce-blocks/pull/6292) 2022-07-06 15:03:15 +01:00
github-actions[bot] 4e6da0b80d Release: 8.0.0 (https://github.com/woocommerce/woocommerce-blocks/pull/6652)
* Empty commit for release pull request

* Empty commit for release pull request

* Update readme.txt

* Update phpcs.xml

* Add testing notes and ZIP for release 8.0.0

* Update testing notes

* Update testing notes

* Revert woocommerce/woocommerce-blocks#6591

* Update testing notes

* Update readme.txt

* Update ZIP for release 8.0.0

* Change version from 8.0.0-dev to 8.0.0

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
2022-07-05 18:41:05 +02:00
Tarun Vijwani e6dfd66d5d Update billing address when shipping address gets change in Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/6591)
* update billing address when shipping address gets change in Cart block

* Add a new line to test linting error

* Remove a new line to test linting error

* Fix linting error

* Fix linting error

* Fix linting error by adding a space and removing a comma

* Fix linting error by replacing a space with tab

Co-authored-by: Niels Lange <info@nielslange.de>
2022-07-04 12:22:32 +02:00
Tarun Vijwani a1526ed660 Make form components require onChange and have a default value (https://github.com/woocommerce/woocommerce-blocks/pull/6636) 2022-07-01 21:50:44 +04:00
Tung Du 138df96762 Fix: Convert Active Filters Block codebase to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/6580) 2022-06-21 21:53:49 +07:00
Tung Du 27224fd46e Fix: Convert Filter Products by Attribute Block to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/6545)
* wip: convert attribute filter to ts

* change query to optional

* update SearchListControlProps and SearchListItemType

* get default attribute from metadata

* update types

* convert attributes utils to ts

* convert attribute query utils to ts

* fix type error, remove type casting

* revert type change for SearchListItemType

* apply new format
2022-06-15 19:50:42 +07:00
Michael P. Pfeiffer 521f93619b Upgrade wp-prettier to 2.6.2 and reformat the codebase (https://github.com/woocommerce/woocommerce-blocks/pull/6566)
* Remove mixed tabs and spaces in tsconfig.json

* Update formatting in json files

* Upgrade wp-prettier to 2.6.2
2022-06-15 11:56:52 +02:00
Tung Du 6531c4cb0b Fix: Convert Filter Products by Price Block to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/6514) 2022-06-14 15:48:49 +07:00
Tung Du 876e955125 Fix: Convert Filter Products by Stock to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/6533) 2022-06-13 08:39:09 +07:00
Niels Lange d7d043cb5b Rename billingData to billingAddress (https://github.com/woocommerce/woocommerce-blocks/pull/6369)
* Rename billingData to billingAddress

* Add unit test to ensure billingData remains accessible

* add integration tests for slots

* Keep billingData in usePaymentMethodRegistration for backwards compatibility

* Gate `billingData` in deprecation gate

* Replace deprecation call

Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>
2022-06-10 18:59:25 +02:00
Tung Du 111b4eca48 Convert `useCollectionData` hook to TS (https://github.com/woocommerce/woocommerce-blocks/pull/6535) 2022-06-09 16:05:11 +07:00
Albert Juhé Lluveras 40231ea1f9 Revert "Remove Combobox patch (https://github.com/woocommerce/woocommerce-blocks/pull/6465)" (https://github.com/woocommerce/woocommerce-blocks/pull/6531)
This reverts commit 4976afad58.
2022-06-07 14:09:50 +02:00
Michael P. Pfeiffer d17bb32c02 Filter Products by Price: Decrease step sequence from 10 to 1 (https://github.com/woocommerce/woocommerce-blocks/pull/6486) 2022-05-31 12:44:50 +02:00
Albert Juhé Lluveras 4976afad58 Remove Combobox patch (https://github.com/woocommerce/woocommerce-blocks/pull/6465) 2022-05-26 12:31:29 +02:00
Saad Tarhi 25cb047483 Remove `useStoreSnackbarNotices` and interact directly with data store instead (https://github.com/woocommerce/woocommerce-blocks/pull/6411)
* Use wp store directly instead of React Context

We are using now actions directly from wp store in 'useStoreCartCoupons'
hook to apply and remove coupon.

* Remove unused "useStoreSnackbarNotices" related
files

* Add NoticeContext TS definition

* Remove the Provider references and refactor code

* Fix snackbar notice creation bug

* Fix "clear out snackbar coupon notice" bug

* Update "notices" API documentation

Remove snackbar hooks mentions since it's not used anymore
2022-05-25 22:00:47 +01:00
Thomas Roberts 4a7b8ae1cf Revert "Add `requireExactMatch` prop to `ComboBox` to prevent wrong country/state values being sent to the server (https://github.com/woocommerce/woocommerce-blocks/pull/6426)" (https://github.com/woocommerce/woocommerce-blocks/pull/6447)
This reverts commit b1f4e35c00.
2022-05-24 10:49:17 +02:00
Thomas Roberts b1f4e35c00 Add `requireExactMatch` prop to `ComboBox` to prevent wrong country/state values being sent to the server (https://github.com/woocommerce/woocommerce-blocks/pull/6426)
* Add requireExactMatch prop to ComboBox & only run onChange if value matches

* Set requireExactMatch to true for Country and State inputs

* Add unit tests for ComboBox

* Update expected value for onChange call

* Re-add autocomplete option to country input

* Use correct case for autoComplete in country input
2022-05-18 18:32:42 +01:00