Commit Graph

2517 Commits

Author SHA1 Message Date
Sam Seay eabb27c72b
[Experimental] Add block text color support to interactivity filter blocks (#43068)
* [Experimental] Render headings as inner blocks of collection filters (#43109)
2023-12-29 03:06:35 +13:00
Niels Lange 8e7c5cca1c
Show rating stars for the cross-sells products (#43069)
* Show rating stars for the cross-sells products

* Fix typo introduced in #43116 (#43148)

* Fix typo introduced in #43116

* Add changefile(s) from automation for the following project(s): @woocommerce/product-editor

---------

Co-authored-by: github-actions <github-actions@github.com>

---------

Co-authored-by: github-actions <github-actions@github.com>
2023-12-28 16:20:07 +07:00
Karol Manijak 37155abb0c
New flow of adding Product Collection and basic set of Collections (#42696)
* Migrate PR to Core

* Migrate test changes

* Add Custom Collection with inherit query attribute disabled

* Update copy of Product Catalog collection

* Don't choose default active collection in polaceholder and remove highlight

* Remove inherit query option from inspector controls

* Add collection names to Product Catalog and Custom one

* Unify Collection Chooser between Modal and Placeholder

* Bring back util removed by accident

* Replace the translations domain with woocommerce

* Remove leftovers after merge

* Add pagination and no results to Product Catalog and Custom collections

* Revert textdomain change

* Fix lint error

* Add changelog entry

* Change collection label

* Bring back Inherit query from template

* Remove Custom collection and bring back single Product Collection

* Simplify applying collection

* Make sure Inherit query from template is enabled in archive templates by default and disbaled in posts/pages

* Change incorrect Playwright locator

* Add test for Product Catalog inheriting the query in product archive

* Add tests for recommendation collection hiding the predefined filters

* Add reviews to multiple products

* Update expected products in Top Rated

* Remove rating creation in test env and skip undeterministic tests

* Add skip to Best Sellers test

* Update README.md

* Add more keywords to collections, like 'product collection' to recommendation collections

* Rephrase the README note about Collections registration

* Simplify types

* Rename unchangeableFilters to hideControls

* Fix typo in file name

* Remove 'pattern' references from toolbar files

* Replace hardcoded SCSS color with wc variable

* Remove changelog file from different PR

* Move hideControls to Product Collection ayttributes

* Improve responsiveness of columns in Product Collection Placeholder

* Use admin color pallette in Product Collection Placeholder

* Move Inherit query from template to the top of Inspector Controls

* Change the Collection prefix to woocommerce rather than woocommerce-blocks

* Simplify Placeholder and Modal styles
2023-12-27 11:07:27 +01:00
Tung Du 0c5d01a6ac
Interactive Price Filter: use `context` instead of `state` (#42980)
* feat: use context instead of state

* fix: temporary move the context to inner element for diffing to work

* fix: update context before navigation for optimistic UI
2023-12-22 22:05:31 +07:00
Sam Seay 3eeeddfdb3
[Experimental] Interactivity Dropdown multi-select mode, ratings filter and introduce each directive (#42981)
---------
Co-authored-by: David Arenas <david.arenas@automattic.com>
2023-12-22 13:34:28 +13:00
Manish Menaria ba4f3d4d29
Add price range filter to Product Collection block (#42858)
* Add price range filter to Product Collection block

This update introduces a price range filter feature to Product Collection. Changes include:

1. Constants Update:
   - Added `priceRange` as undefined in `DEFAULT_QUERY` and `DEFAULT_FILTERS` in `constants.ts`.

2. Style Adjustments:
   - Added CSS for `.wc-block-product-price-range-control` in `editor.scss` to align the input text to the end.

3. Component Integration:
   - In `inspector-controls/index.tsx`, the `PriceRangeControl` component is now imported and integrated.

4. New Components:
   - `PriceTextField.tsx` and `PriceRangeControl/index.tsx` have been created to handle price range inputs in the Product Collection block.

5. Backend Integration:
   - `PriceRange` interface added in `types.ts` for type support.
   - In `ProductCollection.php`, a filter (`add_price_range_filter`) is added to modify the main query based on the price range, including adjustments for tax considerations.

Overall, this enhancement allows users to filter products within a specific price range. The backend adjustments ensure that the filtering respects tax settings and displays accurate prices.

* Fix formatting

* Fix: Price range filter not working on Editor

* Improve: Share logic between Frontend & Editor

* Add changelog

* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce

* Remove duplicate changelog file

* Enhanced Input Control for Price Fields

Key changes include:

1. **Switch to Input Control**: Replaced the NumberControl component with the more versatile InputControl. This offers better handling of currency formatting and user input.

2. **Currency Formatting Logic**: Added robust logic for formatting numbers according to the currency settings. This includes handling thousand separators, decimal places, and currency symbols.

3. **String-to-Number Conversion**: Implemented a function to convert user-entered strings back to numbers, accounting for currency symbols and separators. This ensures accurate parsing of user input for processing.

4. **Input Handling Improvements**: Modified the onChange handlers for minimum and maximum price inputs. Now, they correctly handle edge cases like undefined or zero values, maintaining consistency in the user interface and data processing.

* Refactor price range query handling

1. Introduction of a new method `get_price_range_query_args()` to encapsulate the logic for handling price range queries, especially for the two edge cases:
   - Prices excluding tax displayed including tax.
   - Prices including tax displayed excluding tax.

2. Removal of direct conditionals in the `get_query_results()` method, replacing them with a call to the new `get_price_range_query_args()` method. This makes the code more modular and easier to understand.

This refactor enhances readability and maintainability of the code, ensuring that special cases in price range filtering are handled more effectively.

* Remove unnecessary suffix prop

* Refactor PriceTextField formatting logic for currency

1. Conditional application of thousand separators: The code now checks for the existence of `currency.thousandSeparator` before applying it. This prevents potential errors when the separator is undefined.

2. Simplified decimal separator handling: Introduced a fallback for the decimal separator, defaulting to a period ('.') if not specified by the currency settings.

3. Enhanced readability and documentation: Added comments to clarify the purpose of code blocks, especially where currency symbols are added or removed, and where value normalization occurs.

4. Function renaming for clarity: Renamed `formatValueWithCurrencySymbol` to `formatCurrency`, which better reflects its purpose.

* Fix onBlur issue with PriceTextField component

Refactored the PriceTextField component to utilize useState for better state management. This change introduces a local state variable, 'newValue', to store the current value. The state updates occur in the handleOnChange function, ensuring that the component's state is managed efficiently. Additionally, a new function, handleOnBlur, is implemented to handle the onBlur event, updating the component's state when focus is lost. The handleEnterKeyPress function captures the 'Enter' key press, providing a more user-friendly experience by allowing users to confirm their input with the Enter key.

* Fix linting error

---------

Co-authored-by: github-actions <github-actions@github.com>
2023-12-21 12:45:20 +05:30
Niels Lange 49d6b2058a
Link cross-sells product image to product page (#42904)
* Link cross-sells product image to product page

* Add changelog entry

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
2023-12-21 11:13:47 +07:00
Daniel Dudzic 7122669d44
Product Gallery: Simplify the Product Gallery Pop-up (#42797)
* Product Gallery Pop-up: Simplify the pop-up for v1

* Product Gallery Pop-up: Update the Product Gallery template part contents

* Product Gallery Pop-up: Add changelog entry

* Product Gallery: Fix CSS linting errors

* Product Gallery Pop-up: Add an additional changelog entry

* Product Gallery Pop-up: Update changelog message

* Product Gallery Pop-up: Fix logic error
2023-12-20 19:03:01 +01:00
Karol Manijak 4fec136da1
Trigger event `experimental__woocommerce_blocks-cart-add-item` in the SSR Product Button vis Interactivity API (#42946)
* Trigger event experimental__woocommerce_blocks-cart-add-item in the SSR Product Button vis Interactivity API

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

* Update code comment and add reference to the followup issue

---------

Co-authored-by: github-actions <github-actions@github.com>
2023-12-20 13:50:43 +01:00
Thomas Roberts 7768ef5b5c
Prevent "Use same address for billing" being checked by default if addresses differ (#42967)
* Don't access the keys of what is now just an array

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

---------

Co-authored-by: github-actions <github-actions@github.com>
2023-12-20 14:47:59 +07:00
Albert Juhé Lluveras 06e5b43d52
Reviews by Product block: fix encoded in input aria-label (#42944)
* Reviews by Product block: fix encoded in input aria-label

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

---------

Co-authored-by: github-actions <github-actions@github.com>
2023-12-19 13:05:18 +01:00
Tung Du c651b10b3d
Add: Active Filters block powered by Interactivity API (#42008)
* add: active filters block

* update text domain

* chore: linting

* use template string instead of concat

* add experimental flag to register block type calls

* chore: update comments

* feat: register active rating filter data

* fix: unique navigation id when collection filters are added outside product collection

* fix: active filter rating id

* fix: return the href

* chore: phpcs
2023-12-19 17:29:33 +07:00
Tarun Vijwani 82a6611144
Move the switch to classic shortcode block button to separate component (#42724)
* Move the switch to classic shortcode block button to separate component

- Move modal component file from incompatible-extension-notice component folder to switch-to-classic-shortcode-button folder.
- Rename modal component file to model-content component file.
- Move the switch to classic shortcode block button to separate component folder

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

* Update class names in switch-to-classic-shortcode-button component

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

* Update plugins/woocommerce-blocks/assets/js/editor-components/switch-to-classic-shortcode-button/editor.scss

Co-authored-by: Niels Lange <info@nielslange.de>

* Refactor SwitchToClassicShortcodeButton component

* Fix css lint erros

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
2023-12-19 11:44:09 +04:00
Daniel Dudzic 11b8276a29
Product Gallery: Add Group block labels (#42868)
* Product Gallery: Add Group block labels

* Product Gallery Group Labels: Add changelog entry

* Product Gallery Group Labels: Add an additional changelog entry

* Product Gallery Group block labels: Update changelog message
2023-12-18 22:24:30 +01:00
Seghir Nadir 8ecfcfb9a0
Add Checkbox support for Additional Fields in Checkout Block (#42780)
* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073

* revert test to what it was

* Default to text, if the type supplied is not supported throw an error

* Add type for options

* Return null if somehow the select made it through without options

* Make select fields type enum and add options to schema

* Lint fixes

* Update plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/address-form/address-form.tsx

Co-authored-by: Niels Lange <info@nielslange.de>

* Update plugins/woocommerce/src/Blocks/Domain/Services/CheckoutFields.php

Co-authored-by: Niels Lange <info@nielslange.de>

* Update checks to log errors and fail gracefully

* Add field id to class names

* Fix lint error

* Fix short array use

* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073

* Default to text, if the type supplied is not supported throw an error

* Lint fixes

* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073

* add support for registering checkboxes

* remove extra error log

* add styling

* fix rebase conflit

* fix rebase conflit 2

* fix linter errors

* address review comments

* add warning for checkbox

* fix changes

---------

Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
2023-12-18 13:21:36 +01:00
Alba Rincón d5a46a1cfb
Remove padding for the products query when background is added (#42817)
* Remove padding for the products query with background

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

---------

Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
2023-12-18 11:14:43 +01:00
Sam Seay 6d4c69850c
Experimental Collection Rating Filter (#41999)
Introduce Experimental Collection Rating Filter, CheckboxList interactivity component.
2023-12-18 22:47:24 +13:00
Roy Ho d15bfd2398
Product Gallery: reset main image when variations are cleared (#42830)
* Product Gallery: reset main image when variations are cleared

* Add changelog for woo core

* Update event name to be more descriptive
2023-12-15 13:22:10 -08:00
Thomas Roberts 0c6a943c42
Add select field type for custom checkout fields (#42758)
Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>
Co-authored-by: github-actions <github-actions@github.com>
2023-12-15 06:39:22 -08:00
Seghir Nadir 12572ce08c
Introduce Additional Fields extensibility API (#42695)
* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073

* add changelog

* Auto load the Blocks/Domain/Services/functions.php file

* add changelog

* revert test to what it was

* Update text domain for translations

* Ensure address data is added on the cart block too

* fix lint problem

---------

Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
2023-12-15 13:45:38 +01:00
Roy Ho 255f1ff919
Product gallery/legacy/transform (#42719)
* Product Image Gallery: Add transform to Product Gallery block

* Single Product Template: Transform to blocks with new Product Gallery block

* Ensure we first check for block existance

* Add changelog

* Add/delete changelog file
2023-12-14 05:47:48 -08:00
Mike Jolley 2abd0422a8 Allow HTML in built in payment method descriptions 2023-12-13 14:37:21 +00:00
Christopher Allford ec9b7852f9
Fixed Blocks Linting Errors (#42727) 2023-12-12 15:05:20 -08:00
Ron Rennick 4fddface47
update text domain in plugins/woocommerce-blocks (#42717)
Co-authored-by: Ron Rennick <ronald.rennick@automattic.com>
2023-12-12 14:12:36 -08:00
Christopher Allford e34361695d Fixed Image Asset Paths 2023-12-09 21:26:49 -08:00
Christopher Allford cf357e809b Fixed Blocks Asset Constant Path 2023-12-09 21:20:21 -08:00
Christopher Allford 1d056b3b37 Update Blocks Text Domain 2023-12-09 05:44:54 -08:00
Arsany Benyamine 0672f73723 replace old props with variant prop (https://github.com/woocommerce/woocommerce-blocks/pull/11933)
Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
2023-12-09 00:30:33 +01:00
Tarun Vijwani 62dbd8f70d Convert PaymentMethodErrorBoundary to Class component (https://github.com/woocommerce/woocommerce-blocks/pull/12088)
* Convert PaymentMethodErrorBoundary to class component

* Remove unused expressPaymentMethodId variable
2023-12-08 16:28:55 +00:00
Mike Jolley 1535caac84 Update product category controls to use typescript (https://github.com/woocommerce/woocommerce-blocks/pull/11909)
* ProductControl is now defined in typescript. Remove todo

* Update components to typescript

* Update lifecycle test
2023-12-08 11:39:31 +00:00
Karol Manijak 31905b97f2 Make Featured Category centred horizontally (https://github.com/woocommerce/woocommerce-blocks/pull/12063) 2023-12-08 10:11:34 +01:00
Roy Ho 4992b77e49 Remove styling from sale badge (https://github.com/woocommerce/woocommerce-blocks/pull/12077)
Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
2023-12-07 18:24:18 -08:00
Tarun Vijwani 29b4217f15 Update the border colors in the Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/11474)
* Change border color to Gutenberg 100 for Cart and Checkout blocks

* Change form input color to Gutenberg 900 for Cart and Checkout blocks

* Fix additional border colors of Checkout block

* Update borders and form field colors in Cart Block

* Change border color to $universal-border-light

* Change border color for cart line items to $universal-border-light

* Change  form input fields border color to $universal-border-dark

- Add $universal-border-dark color variable for woocommerce/woocommerce-blocks#1e1e1e on white.

* Fix colors of text area border and form steps

* Change  form input fields border color to $universal-border-dark

- Add $universal-border-dark color variable for woocommerce/woocommerce-blocks#1e1e1e on white.

* Fix form steps

* Update universal dark border rgba value

- Update universal dark border rgba value from rgba(0, 0, 0, 0.882) to rgba(17, 17, 17, .80) to keep it consistent with universal-border colors

* Update $universal-border-light color

* Update the opacity of the borders

* Update the border color to rgba (17, 17, 17, 0.12)

* Roll back $universal-border-light value to the original value: 0.115

* Remove Opacity and pass it as argument in with-translucent-border

- We have with-translucent-border option that accepts border and opacity for pseudo elements.

* Remove additional spaces

* Replace with-translucent-border with normal border

- Since we're are not mixing the opacity to the border color so we don't need to use mixin with-translucent-border.

* Fix applied css and add low contrast Color usage details

-  Fix minor CSS as per the standards.
- Add comments for universal border colors that they're low contrast colors and should be used for decorative elements only

* Fix border gap and double border for multiple shipping packages

* Fix payment method borders and Cart line items borders

- Change border bottom to border-top for cart line items.
- Fix payment method radio control borders.

* Fix local pickup border

- Local pickup was using  with-translucent-borders so it has some opacity, changed it to border-bottom.

* Add border-bottom to cart items

* Remove additional border from Cart items

* Fix radio and checkbox borders as per the design

* Fix shipping method borders and background color as per the design.

* Force align left on the description for the local pickup options.

* Update border color in quantity selector component

* Fix Shipping options radio selection alignment

- Add left padding to wc-block-components-shipping-rates-control__package element.

* Update colors and variables

* Change checkbox and radio button colors

- Change checkbox and radio button colors from  rgba(25, 23, 17, 0.3) to  rgba(25, 23, 17, 0.48).

* Remove bottom property from express payment style
2023-12-07 21:37:48 +04:00
Niels Lange ab766273ff Fix font weight of cart totals title in site editor (https://github.com/woocommerce/woocommerce-blocks/pull/12051)
* Fix font weight of cart totals title in site editor

* Set explicit font-weight for th in cart line items
2023-12-07 15:55:47 +07:00
Mike Jolley 14cdc5e6f5 Use locale in isAddressComplete (https://github.com/woocommerce/woocommerce-blocks/pull/11888) 2023-12-06 16:33:15 +00:00
Karol Manijak 71640ef347 Restructure Product Collection editor files (https://github.com/woocommerce/woocommerce-blocks/pull/11981)
* Move Product Collection editor experience components into /edit directory

* Move Product Collection Inner Blocks structure to constants

* Improve the Product Collection's variations names
2023-12-06 15:50:24 +01:00
Niels Lange 69ef1b96e8 Enable new notice styles for all themes (https://github.com/woocommerce/woocommerce-blocks/pull/12043)
* Enable new notice styles

* Fix Twenty Twenty-One button background color issue
2023-12-06 15:46:22 +07:00
Luigi Teschio 1f410bdd04 fix: Product Collection: Featured Products 5 Columns improve spacing (https://github.com/woocommerce/woocommerce-blocks/pull/12041) 2023-12-06 09:05:49 +01:00
Roy Ho 6df846d11a Product gallery/fix/view all link (https://github.com/woocommerce/woocommerce-blocks/pull/11995)
* Center align view all link

* Add thumbnail count specific styling

* Product Gallery Thumbnails: Improve the responsiveness of the View All overlay text

---------

Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
2023-12-05 16:25:41 +01:00
Albert Juhé Lluveras 9371318292 Revert "Remove unused Add to Cart product element (https://github.com/woocommerce/woocommerce-blocks/pull/11948)" (https://github.com/woocommerce/woocommerce-blocks/pull/12033)
This reverts commit 6a397d65f9.
2023-12-04 17:28:58 +01:00
Darren Ethier 795f008952 Implement the Block Hooks API to automatically inject the Mini-Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/11745)
* Change the default for Mini Cart block

The Block Hooks API currently doesn’t allow for setting the default state of the block injected into content so this ensures the mini-cart block has a better default state for injection. The current default (displaying total value in cart) takes up more width increasing the risk of poor layout.

* Utilize Block Hooks to automatically inject mini-cart block.

* include experimental prefix on filters

* Fix filter name.

* remove experimental prefix.

On thinking about this, I don’t think these need to be experimental. They are intentionally provided as escape hatches for hosts/themes that want to opt-in/out so we’ll have to support them when this is shipped (at least until its no longer needed!)

* fix variable name!

* fix unit tests because of new default

* remove another incorrect text expectation

Defaults for the block affect this expectation.

* fix E2E tests

* Mini Cart Block: improve E2E test

* fix: improve check for the Product Collection block

---------

Co-authored-by: Luigi Teschio <gigitux@gmail.com>
2023-12-04 17:27:27 +01:00
Tung Du 2bc48e4e4a Fix: Ensure new filter blocks work with inherited query context (https://github.com/woocommerce/woocommerce-blocks/pull/12022)
* make the collection filters block available globally

* make query optional

* remove unnecessary editor contextual
2023-12-04 21:05:09 +07:00
Niels Lange 1c7d995e97 Decrease modal width (https://github.com/woocommerce/woocommerce-blocks/pull/12003) 2023-12-02 02:54:39 +00:00
Seghir Nadir 226d7de6d6 import checkbox from single place (https://github.com/woocommerce/woocommerce-blocks/pull/12015) 2023-12-01 19:40:04 +01:00
Seghir Nadir 42ee5522f9 Remove page view tracking in favor of jetpack (https://github.com/woocommerce/woocommerce-blocks/pull/12010) 2023-12-01 08:26:01 -08:00
Paulo Arromba 4e6fb96c8e Update Feedback link on Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/12006)
* Update feedback link

* Remove default url link, and make the param required
2023-12-01 13:01:42 +00:00
Paulo Arromba a07e3815c1 Update feedback link (https://github.com/woocommerce/woocommerce-blocks/pull/11999) 2023-12-01 10:16:57 +00:00
Manish Menaria 630c79adf7 Product Collection - Fix HTML Entity Decoding in Taxonomy Controls (https://github.com/woocommerce/woocommerce-blocks/pull/11982) 2023-12-01 15:11:41 +05:30
Niels Lange 7ea98576bc Limit number of visible incompatible extensions in sidebar notice (https://github.com/woocommerce/woocommerce-blocks/pull/11972)
* Limit number of visible incompatible extensions in sidebar notice

* Adjust link text

* Ensure text-decoration works in Safari

* Minor CSS tweaks

* Refactor constant names

* Adjust chevron position for opened state

* Revert "Adjust chevron position for opened state"

This reverts commit ff5142427738626837be887dd8d7e5d94c2432d4.
2023-11-30 06:37:19 -08:00
Niels Lange e1efae2fe2 Improve readability of order note (https://github.com/woocommerce/woocommerce-blocks/pull/11944) 2023-11-29 21:39:07 +07:00