Commit Graph

2737 Commits

Author SHA1 Message Date
Alexandre Lara 3ecd34e01a Upgrade webpack to version 5 (https://github.com/woocommerce/woocommerce-blocks/pull/8013)
* Upgrade terser-webpack-plugin to version 4.2.3

* Upgrade webpack-bundle-analyzer to 4.7.0

* Upgrade to Webpack version 5

* Upgrade @wordpress/dependency-extraction-webpack-plugin to 4.6.0

* Upgrade dependency copy-webpack-plugin to version 11.0.0

* Upgrade dependency terser-webpack-plugin to version 5.3.6

* Replace webpack-rtl-plugin with the new @automattic/webpack-rtl-plugin

* Replace module.issuer with the new ModuleGraph API

There is a warning appearing in the console when running the application. This is due to the fact that the module.issuer has been deprecated on Webpack 5 and replaced with the new ModuleGraph API. This commit replaces the deprecated API with the new one.

* Upgrade babel and babel plugins to latest version

* Replace jsonpFunction with the new uniqueName property

Add a unique name of the webpack build to avoid multiple webpack runtimes to conflict when using globals. It defaults to output.library name or the package name from package.json in the context, if both aren't found, it is set to an ''.

* Replace cacheDirectory inline configuration with options.cacheDirectory

* Upgrade @wordpress/e2e-tests dependency to version 5.6.0

* Remove babel-plugin-transform-react-jsx dependency

Remove babel-plugin-transform-react-jsx dependency because it is already included in @wordpress/babel-preset-default

* Remove unnecessary Babel dependencies

Remove some unnecessary babel dependencies that are already included in the @babel/preset-env package.

* Upgrade puppeteer dependency to version 16.2.0

* Remove caret from package.json dependencies

* Fix Storybook build error

This commit fixes the Storybook build error that was being caused because of Storybook by default uses Webpack 4, but since we are currently upgrading our webpack to version 5, we need to install some required dependencies and also explicitly tell Storybook to use Webpack 5.

* Fix package-lock.json after merging with trunk

* Add own webpack-rtl-plugin implementation to the project

Before upgrading Webpack to version 5, we were using the original `webpack-rtl-plugin` released by Romain Berger; unfortunately, this plugin is not compatible with Webpack 5, so we replaced it with `@automattic/webpack-rtl-plugin`. The problem is that `@automattic/webpack-rtl-plugin` by default generates files with the '.rtl.css' suffix and does not provide a way to change that.

This commit adds our own implementation of the `webpack-rtl-plugin` (adapted from `@automattic/webpack-rtl-plugin`) that is compatible with Webpack 5 and allows us to change the suffix of the generated files to follow the recommended way defined by Wordpress (https://codex.wordpress.org/Right-to-Left_Language_Support)

* Change conditional clause to be multiline

* Fix package-lock.json after merge with trunk

* Fix package-lock.json after merge with trunk

* Rename files to fix ESLint errors

This commit renames files that have the .js extension but contain JSX code. This is causing ESLint to throw errors because by default our Eslint configuration expects only files with the .jsx extension to contain JSX code.

* Fix package-lock.json file

* Add is-plain-obj module to the transformIgnorePatterns of jest config

* Update package-lock.json

* Fix package-lock.json

* Upgrade @wordpress/i18n dependency to version 4.31.0

* Update package-lock.json

* Update composer lock file

* Fix Webpack config for Webpack 5

* Add the package-lock.json

* Remove unsupported config from webpack

* Fix error with Webpack build

* Add wait for network idle to the tests

* Attempt to fix e2e test

* Restore promise.all

* Upgrade puppeteer to v17.1.3

* Upgrade expect-puppeteer

* Update expect-puppeteer

* Downgrade expect-puppeteer

* Revert "Upgrade puppeteer to v17.1.3"

This reverts commit 61ed52a56f131961f3970b6fb22cdd8b540bada3.

* Upgrade Puppeteer to version 17.1.3

* Fix executionContext.frame is not a function error

* Fix e2e tests

* Remove isExperimentalBuild from Product Gallery inner blocks

* Upgrade Webpack and Webpack-cli to latest version

* Upgrade postcss and mini-css plugins

* Fix error with mini-cart block

* Fix styling error with filter blocks

* Fix issue when running unit tests

* Fix storybook script not loading

* Fix a11y issue in Storybook

* Fix error when multiple isExperimentalBuild was being used

* Prevent error when layout is not present in the attributes object

* Update `chunkIds` to `named` in Webpack

* Add cache groups to the Webpack configs
2023-09-20 17:31:52 -03:00
Mike Jolley edf4a95b23 Feature Branch: Blockified Order Confirmation (https://github.com/woocommerce/woocommerce-blocks/pull/10056)
* Main block types for confirmation

* Initial blocks

* Styling and placeholders

* Make blocks experimental

* Update summary icon

* Add name/description for status block and missing text descriptions in the block.

Closes woocommerce/woocommerce-blocks#10057

* Order confirmation: Convert Order Details Templates to Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/10095)

* Move code from templates into the details block

* Details -> Totals

* Downloads block

* Sample content for downloads block

* Add block icon

* Add conversion template (https://github.com/woocommerce/woocommerce-blocks/pull/10077)

* Update inner block name

* Add default title constant

* Revert "Add default title constant"

This reverts commit 1dd3bbfecc1be83c367b1ab064f5032ea58cb678.

* Add global styles for order confirmation status block (https://github.com/woocommerce/woocommerce-blocks/pull/10164)

* Implement style controls

* Prevent link color spilling over onto wrapper

* Add styles and remove class names

* Remove __experimentalWritingMode

* Add global styles for order confirmation summary block (https://github.com/woocommerce/woocommerce-blocks/pull/10179)

* Styles for summary

* Remove __experimentalWritingMode

* Add table styles for order details (https://github.com/woocommerce/woocommerce-blocks/pull/10185)

* Add table styles for order details

* __experimentalFontWeight

* Add link styles

* Handle preview link styles

* Unauthenticated views for Order Confirmation template (https://github.com/woocommerce/woocommerce-blocks/pull/10414)

* Different views by permission

* check user id matches when logged out

* Add order confirmation wrapper block (https://github.com/woocommerce/woocommerce-blocks/pull/10286)

* Add a heading wrapper block

* Register the BillingWrapper Block server side

* Fix exception 'render_content' error

* Add the Billing Wrapper Block to the template

* Fix wrong block name error

* Fix php error

* Conditionally render Billing Address within the Wrapper

* Fix parent rendering

* Clean up code (remove billing address from the template)

* Update titles, descriptions, and icons of the billing Block and inner block

* Fix broken block by removing the "parent" keyword

* Use a user-friendly title and description for the Billing Wrapper

* Update Billing Wrapper Block's title case

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

* Fix PHP failing unit test

---------

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

* Remove "thanks" for authenticated page

* Introduce shipping wrapper based on billing wrapper

Closes woocommerce/woocommerce-blocks#10053

* Order confirmation block: Verify email address for guest customers (https://github.com/woocommerce/woocommerce-blocks/pull/10567)

* Add verify step for guest orders

* Render content to pass through block content

* Revert package changes

* Customer orders cannot use email to verify

* Add style controls for order shipping and billing address blocks (https://github.com/woocommerce/woocommerce-blocks/pull/10633)

* Order confirmation block styling (https://github.com/woocommerce/woocommerce-blocks/pull/10780)

* Add missing heading to order details

* Summary block spacing

* Update css variables

* table styles

* Inherit border styles for cells

* Alignment and address styles

* Add downloads wrapper

* Style controls

* Fix typo

* Update Download Wrapper's Icon

* Fix TS error

* Disable Download Block's server side rendering in the editor

This fixes the loading after each style change from the style controls

* Clean up Downloads render functions

* Fix client side Downloads Block's table border

* Download + Total wrappers and tables styling

* small screen

* Remove server side render for previews

---------

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

* Shorten template description

* Update test address data

* Avoid leaking order key in permission form

* Remove todo

* Make email form required.

* Remove edit page link

* Remove empty columns from address wrapper

* Remove IIFE

* typo

* Update description to mention billing

* Adjust link scss

* Fix wrapper markup and spacing controls

* Add link preview in editor

* Add initial E2E setup for the Order Confirmation Block (https://github.com/woocommerce/woocommerce-blocks/pull/10840)

* Fix WC_DateTime check

* Move form outside of block markup

* Add additional information block (https://github.com/woocommerce/woocommerce-blocks/pull/10842)

* Add block which contains hooks

* Use skeleton for placeholder instead of illustration

* Remove duplicate methods

* Remove duplicate align tag

* Update meta styles

* Tests for order confirmation conditional blocks (https://github.com/woocommerce/woocommerce-blocks/pull/10972)

* Add tests for conditional blocks

* Move setup into test

* Add E2E to the the Order Confirmation Block (https://github.com/woocommerce/woocommerce-blocks/pull/10863)

* Add editor util functions

* Update editor template E2E test

* Add the "exact" property for consistency

* Skip test

Can't get the element in the page. More investigation needed! Skipping
for now.

* Fix "transformIntoBlocks" logic

* Add tests for logged in user

* Fix "beforeAll" config

* Confirm downloads section is visible when logged in

* Create "verifyOrderConfirmationDetails" util function

* Add logged in test case

* Add Guest user test case

* Fix editor e2e testing

* Apply a proper teardown

* Fix failing tests after logout

* Ensure we are logged in before visiting the editor

* Ensure to have shipping selected

* Wait for changes to be saved on the editor

* Ensure shipping options is selected

* Remove comment

* Ensure we are logged in before going to the admin page

* Mark the Order Confirmation as a side effect test

* OrderConfirmation blocks are not experimental

* resolve merge conflict

* Revert package lock changes

* Fix enqueue_assets

* Fix CSS 404s

* Make template tests more robust

* Fix page URL for default confirmation page

* Try afterEach to log back in

* Skip guest/logout use cases

Login out causes other tests to fail. We will implement these case when
the multiple sign in roles are introduced in the codebase.

* Remove tests requiring login out & add comments

* Remove unused util functions

* Hide confirmation blocks from post editor

---------

Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
2023-09-20 13:56:00 +01:00
Sam Seay 767a093b6a Refactor frontend, frontend-container-block (of reviews) to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/10787)
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
2023-09-20 04:21:26 +00:00
Mike Jolley 68064c115b Refactor Cart and Checkout Page Templates (https://github.com/woocommerce/woocommerce-blocks/pull/10773)
* Rename checkout template slug

* Remove redirect and custom title

* Classic shortcode block for checkout

* Empty title

* WIP placeholder

* Change blockified template

* Prefix cart and checkout templates with "Page: "

* Template migration routine

* Apply same treatment to cart template

* Notices

* Update placeholder text

* Classic shortcodes block

* Page content wrapper for templates

* Update default

* Do not save attributes

* Update templates

* Remove cart classic template

* Reverted endpoints for Cart & Checkout templates. This reverts PR 9406

* Migrate page content wrapper.

* Removed useless method arg. Minor tweaks.

* Skip migration if the theme has a template file for this page.

* Removed impossible condition.

* Migrate page content wrapper.

* Remove TemplateNotice in favour of DefaultNotice

* Documentation links in shortcode placeholder

* Hide cart and checkout page selector when using block themes

* Unused var

* Add tests for template changes

* Revert changes to classic-template

* Allow frontend redirect

* Unused file

* Bump version for updater

* Support x template naming as well as page-x

* Need to add item to cart to test checkout

* Fix header test by fixing utility for adding to cart

* Remove permalink tests

* Click body

* Wait for content to finish loading

* Wait for add to cart response when adding to cart without item name

* Wait for save before visiting frontend

* Set content instead of inserting block

* Perform test in site editor rather than page editor

* Prevent notice to set the default cart/checkout page from showing on the site editor.

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
2023-09-19 10:58:18 +01:00
Manish Menaria 890c5dbcac Transfer layout options from Toolbar to Inspector controls (https://github.com/woocommerce/woocommerce-blocks/pull/10922)
In this update, the layout options for the Product Collection block are transferred from the Toolbar to the Inspector controls. Below is the breakdown of the changes:

1. **Constants Update**
    - `LayoutOptions` enumeration has been imported into `constants.ts`, facilitating a more structured approach to managing layout types (grid and stack).
    - The default display layout type has been updated from 'flex' to reference `LayoutOptions.GRID`.
    - The `getDefaultQuery` function now uses the `getDefaultValueOfInheritQueryFromTemplate` utility to set the default `inherit` value. (This is mainly done to fix a bug)

2. **Display Layout Control Removal**
    - The `display-layout-control.tsx` file has been removed, discontinuing the previous method of layout management.

3. **New Layout Options Control**
    - A new component `LayoutOptionsControl` has been introduced in the `layout-options-control.tsx` file, utilizing the experimental `ToggleGroupControl` and `ToggleGroupControlOption` components from the WordPress package to provide a more intuitive layout selection experience.
    - The `types.ts` file has been updated to define the `LayoutOptions` enum, effectively mapping 'flex' to 'GRID' and 'list' to 'STACK'.

4. **Inspector Controls Update**
    - In `inspector-controls/index.tsx`, the obsolete `DisplayLayoutControl` has been replaced with the new `LayoutOptionsControl`, integrating it into the `ProductCollectionInspectorControls` component.
    - The `BlockControls` wrapper has been removed, and layout options have been relocated to the Inspector controls, presented as a toggle group within the ToolsPanel.

5. **Inherit Query Control Modification**
    - The `inherit-query-control.tsx` file sees a change in the reset value for the `inherit` query attribute to employ a default value which fix one bug.

These changes aim to streamline the user experience by relocating the layout options from the Toolbar to the Inspector controls, offering a centralized location for block settings. Leveraging an enum for layout options fosters code readability and maintainability.

Do note that the update uses experimental components, hence it would be prudent to keep an eye on potential alterations or deprecations in upcoming WordPress releases.
2023-09-15 15:38:48 +05:30
Luigi Teschio 11062e8600 Product Gallery Block: Add Product Gallery template to allow users to edit full mode view (https://github.com/woocommerce/woocommerce-blocks/pull/10823)
* Product Gallery: add support for On Sale Badge Block

* add align support

* Add E2E tests

* set margin via Block Styles

* disable experimental flag

* add next previous block

* restore support file

* fix TS error

* fix layout

* change product

* change product

* Product Gallert Block: Add zoom on hover

* set to true by default

* remove block is already registered error

* remove unecessary await

* Improve zoom logic

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>

* Product Gallery Full view mode: Add the logic to render the dedicated template

* use template-part instead template

* add E2E tests

* update selectors

* add feature flag product gallery template part

* fix E2E tests

* remove not necessary file

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
2023-09-15 08:54:49 +00:00
Karol Manijak 4418cb7d67 Hide unexpected bullet point in Product Collection on Storefront (https://github.com/woocommerce/woocommerce-blocks/pull/10945) 2023-09-15 08:07:54 +02:00
Karol Manijak 25c0b47721 Add pattern chooser in Product Collection (https://github.com/woocommerce/woocommerce-blocks/pull/10876)
* Enable Product Collection patterns in inserter and kick off the layout control button

* Add Choose Pattern button

* Move Toolbar settings to related directory

* Display Pattern Selection modal with available patterns after clicking the button

* Make Pattern Chooser always visible

Patterns can be changed no matter if the Inherit Query from Template option in enabled or not

* Add pattern replacement mechanism

* Switch from Gutenberg styles to internal ones
2023-09-14 14:19:16 +02:00
Roy Ho 3c0498e891 Add collection filters block (https://github.com/woocommerce/woocommerce-blocks/pull/10726)
Co-authored-by: Tung Du <dinhtungdu@gmail.com>
2023-09-14 11:13:33 +07:00
Daniel Dudzic 9db927de30 Product Gallery Thumbnails: Interactivity API directives (https://github.com/woocommerce/woocommerce-blocks/pull/10776)
* Fix "On sale" badge class for shop

* Add class to sale badge

* Move the thumbnails featching logic to an utils file. Add context directive with thumbnails data to the Product Gallery block. Add on-click directives to the Thumbnails block

* Product Gallery Thumbnails: Remove the legacy thumbnail markup

* Product Gallery Thumbnails: Add Large Image replacing

* update the main image when the thumbnail is clicked

* add E2E tests

* fix typo

* fix warning on the frontend

* address feedback

* update E2E test

* improve comment

* fix indentation

* improve E2E test

* improve flaky test

* improve E2E test

* improve comments

* improve E2E test

* try now

* add comment

* skip test

* reset script

* update todo comment

---------

Co-authored-by: Alba Rincón <alba.rincon@automattic.com>
Co-authored-by: Alba Rincón <albarin@users.noreply.github.com>
Co-authored-by: Luigi <gigitux@gmail.com>
2023-09-12 09:36:44 +02:00
Daniel Dudzic 75bba1d55d Product Gallery: Lock the Sale Badge and the Next/Prev Buttons (https://github.com/woocommerce/woocommerce-blocks/pull/10869)
* Fix "On sale" badge class for shop
* Add class to sale badge
* Apply styleProps.styles to elements using them
* Product Gallery: Lock the Sale Badge and the Next/Prev Buttons
2023-09-11 11:37:27 +00:00
Karol Manijak 7948c52b16 Change default number of columns in Related Products (https://github.com/woocommerce/woocommerce-blocks/pull/10875)
* Change default number of columns in Related Products

* Add default attributes to Product Template in Single Product template

* Revert adding attributes
2023-09-10 10:26:56 +02:00
Luigi Teschio 3c7b47b7d1 Product Gallery: fix warning (https://github.com/woocommerce/woocommerce-blocks/pull/10839)
* Product Gallery: fix warning

* address feedback

* fix logic

* rename function
2023-09-08 16:06:48 +02:00
Karol Manijak e6bd74fd3c Fix JS Lint issues (https://github.com/woocommerce/woocommerce-blocks/pull/10866) 2023-09-07 12:01:15 +02:00
Tom Cafferkey 145fdf5e9b Product Image: Fix bug that prevented block styles being applied within the editor. (https://github.com/woocommerce/woocommerce-blocks/pull/10859) 2023-09-07 09:08:31 +01:00
Luigi Teschio 43c56e5383 Product Gallery Block: Add zoom on hovering on the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/10791)
* Product Gallery: add support for On Sale Badge Block

* add align support

* Add E2E tests

* set margin via Block Styles

* disable experimental flag

* add next previous block

* restore support file

* fix TS error

* fix layout

* change product

* change product

* Product Gallert Block: Add zoom on hover

* set to true by default

* remove block is already registered error

* remove unecessary await

* Improve zoom logic

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>

* Product Gallery Block: Add E2E tests for zoom while hovering setting (https://github.com/woocommerce/woocommerce-blocks/pull/10795)

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
2023-09-05 15:22:17 +02:00
Alexandre Lara 2ebe7bd0c9 Product Gallery > Pager block: Fix block alignment (https://github.com/woocommerce/woocommerce-blocks/pull/10782)
* Fix block alignment with Large Image block

* Prevent error when layout is not present in the attributes object

* Add Large Image and Pager to its own group

* Fix issue when moving around the thumbnails block

* Fix e2e tests for Product Gallery block

* Change ancestor block for the Pager block
2023-09-05 09:52:19 -03:00
Luis Herranz 3a30f22dfa Product button: sync temporary number of items on instantiation (https://github.com/woocommerce/woocommerce-blocks/pull/10604)
* Add data-wc-key

* Add layout-init to sync temporary value

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2023-09-05 14:37:38 +02:00
Sam Seay abd41cae11 Fixes for jest transpilation issues. (https://github.com/woocommerce/woocommerce-blocks/pull/10788)
* Fix bug where is-plain-obj is not transpiled by Jest, update lock.
* Update packages.
* Mock useSelect for a handful of RichText selectors in test.
* Resolve react to single version to avoid invalid hook errors.
* Patch trim-html locally to avoid a bug in the released npm source.
* Mock out resizeObserver to avoid https://github.com/FezVrasta/react-resize-aware/issues/58
* Don't transpile config package: https://github.com/node-config/node-config/issues/628
2023-09-05 04:03:35 +00:00
Lucio Giannotta 578ba4725e Fix customer account icon not scaling in certain environments (https://github.com/woocommerce/woocommerce-blocks/pull/10533)
Customer Account block icon size is based on the parent `font-size`
in order to make sure they stay harmoniously together.
However, the `box-sizing` could be set by some other actor
and mess with the size of the icon.
2023-09-02 16:07:01 +02:00
Luigi Teschio 22b9f6a952 Product Gallery Block: add support for the on Sale Badge block (https://github.com/woocommerce/woocommerce-blocks/pull/10764)
* Product Gallery: add support for On Sale Badge Block

* add align support

* Add E2E tests

* set margin via Block Styles

* disable experimental flag

* add next previous block

* restore support file

* fix TS error

* fix layout

* change product
2023-08-31 18:15:31 +02:00
Alexandre Lara e9ff849e08 Add woocommerce namespace to Product Gallery block (https://github.com/woocommerce/woocommerce-blocks/pull/10769) 2023-08-31 12:13:40 -03:00
Sam Seay 44f48e41e9 Refactor errors util to TypeScript, minor typing fixes (https://github.com/woocommerce/woocommerce-blocks/pull/10754) 2023-08-30 18:56:28 +12:00
Lucio Giannotta 5c4a757b6e Convert `product-control` to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/10552)
The main aim of this PR was to convert the product-control component to TypeScript. However, since the component is coupled with many other parts (it is itself wrapped into 4 HOCs), many refactoring changes were needed to make the types work.

In particular:

* Add `convertProductResponseItemToSearchItem` utility function

The function allows to clean up the `ProductResponseItem` in order
to make its shape compatible with the `SearchListItem`, instead of
passing the entire object.

Because data from the object might need to be used in certain
circumstance (e.g. render functions), the data is now allowed to be
scoped within a `details` key.

This commit also converts `utils/products` to TypeScript.

* Fix `ProductResponseItem` type missing `slug`

The `slug` is returned by the API but didn't appear in the type def.

* Improve certain HOCs types

The `withSearchedProducts` and `withTransformSingleSelectToMultipleSelect`
HOCs are now typed in such a way that it is clear what incoming props
they expect and what they inject.

* Refactor `ProductAttrributeTermControl` for further type safety

Make sure that `count` is always a `number` as required by the
component types.

* Refactor `search-list-control.tsx` and `item.tsx`

The new `SearchItem` allows for the `details` key to be passed.
All the components are now aware of it.
2023-08-29 08:01:31 +02:00
Lucio Giannotta a898a5b5ee Fix inconsistent padding in Customer Account block (https://github.com/woocommerce/woocommerce-blocks/pull/10476) 2023-08-29 07:32:48 +02:00
Luigi Teschio c126731347 Product Gallery Block: Next/Previous block (https://github.com/woocommerce/woocommerce-blocks/pull/10235)
* Add Product Gallery Next Previous block

* update description

* update registration

* improve style

* use context instead of attributes

* add eslint and ts lint exception

* improve CSS

* E2E Next Previous block (https://github.com/woocommerce/woocommerce-blocks/pull/10329)

* Add E2E tests

* fix e2e tests path after rebase

* add screenshots

* improve E2E test

* improve E2E test

* improve E2E test

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>

* fix webpack conf

* Next Previous Button block - Add layout support (https://github.com/woocommerce/woocommerce-blocks/pull/10668)

* Add layout support

* Product Gallery Next Previous: Fix block crashing in the editor when vertical alignment has not been customized yet

* Product Gallery Next Previous: Position fixes for the Next/Previous button both in the editor and frontend

* add E2E test

* fix import

---------

Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>

* Next Previous Buttons: hide buttons when the product has only one image (https://github.com/woocommerce/woocommerce-blocks/pull/10743)

* Next Previous Buttons: hide buttons when the product has only one image

* update URL

* fix import

* set default value

* fix E2E test

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
2023-08-28 18:32:45 +02:00
Karol Manijak 31e9854316 Add Product Collection Full Grid pattern (https://github.com/woocommerce/woocommerce-blocks/pull/10665)
* Add initial look of Full Grid Product Collection pattern

* Refactor textAlign property of Product Button so it uses flex rather than text-align

* Update Product Button text align after the fix

* Remove debug log (https://github.com/woocommerce/woocommerce-blocks/pull/10719)

* Add Product Collection Grid pattern (https://github.com/woocommerce/woocommerce-blocks/pull/10660)

* Dispatch the `wc-blocks_render_blocks_frontend` event when rendering the empty cart block (https://github.com/woocommerce/woocommerce-blocks/pull/10619)

* E2E: Refactor Mini Cart to be ready for fully parallel (https://github.com/woocommerce/woocommerce-blocks/pull/10704)

* Revert dequeue add-to-cart-variation script which is needed to properly handle variable products in single product page (https://github.com/woocommerce/woocommerce-blocks/pull/10723)

* Update alignment options to new setting

---------

Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Tung Du <dinhtungdu@gmail.com>
2023-08-28 15:58:17 +05:30
Alexandre Lara c718a056b8 Product Gallery block: Add support to Interactivity API (https://github.com/woocommerce/woocommerce-blocks/pull/10716)
* Add support to Interactivity API

* Fix php cs errors

* Rename numberOfThumbnailImages to numberOfThumbnails

* Use frontend.tsx with InteractivityAPI

* Replace viewScript in block.json
2023-08-25 15:42:31 -03:00
Karol Manijak dad3a41caa Fix UI misalignment of Filter by Price in TT1 theme (https://github.com/woocommerce/woocommerce-blocks/pull/10732)
* Fix UI misalignment of Filter by Price in TT1 theme

* Fix frontend Firefox styles

* Simplify the styles and fix them in Editor (Firefox/Safari)

* Align the background color and sizing in Firefox
2023-08-25 16:26:18 +02:00
Karol Manijak 95fb51be4d Enable Product Collection as a core feature (https://github.com/woocommerce/woocommerce-blocks/pull/10524)
* Enable Product Collection as a core feature

* Fix: disable product query title and summary variations from inserter in favour of Product Collection ones (https://github.com/woocommerce/woocommerce-blocks/pull/10548)

* Limit the scope of Product Query's Product Title and Product Summary

* Add missing piece after refactoring

* Enable manual migration of Products to Product Collection (https://github.com/woocommerce/woocommerce-blocks/pull/10655)

* Refactor block variation registration in product-collection (https://github.com/woocommerce/woocommerce-blocks/pull/10701)

This commit refactors the product-collection block's variation registration.

Changes:
- The `product-summary` and `product-title` variations have been encapsulated within their own respective functions: `registerProductSummaryVariation` and `registerProductTitleVariation`.
- Imported and invoked these new functions in the main `index.tsx` of the product-collection block, ensuring the variations are registered.

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2023-08-25 15:58:11 +02:00
Thomas Roberts 542a04d282 Dispatch the `wc-blocks_render_blocks_frontend` event when rendering the empty cart block (https://github.com/woocommerce/woocommerce-blocks/pull/10619) 2023-08-24 01:37:14 -07:00
Karol Manijak de625c7f48 Remove debug log (https://github.com/woocommerce/woocommerce-blocks/pull/10719) 2023-08-24 09:29:50 +02:00
Sam Seay a753a0f1d2 Add a generic arg to useCollection to improve typing of results. (https://github.com/woocommerce/woocommerce-blocks/pull/10696)
Closes woocommerce/woocommerce-blocks#5726
2023-08-24 04:49:41 +00:00
Sam Seay 9e24b0d91d Convert frontend-block.js to frontend-block.tsx and replace propTypes with TypeScript definitions (https://github.com/woocommerce/woocommerce-blocks/pull/10677) 2023-08-23 18:00:14 +12:00
Alexandre Lara 47c197d165 Product Gallery block: Add Pager block (https://github.com/woocommerce/woocommerce-blocks/pull/10320)
* Add block foundation

* Add block styles

* Add Dots Pager

* Move icons to the block folder

* Add block settings

* Add Pager to Product Gallery template

* Add setting to change Pager display mode

* Change the block description

* Fix the block icon color when selected

* Fix php cs errors

* Fix php cs errors

* Fix css lint errors

* Fix eslint error

* Move enum to its own file

* Remove unnused call to request context

* Add block template

* Fix php cs errors

* fix php cs errors

* improve docs

* Remove duplicate HTML element and added classnames for single product block (https://github.com/woocommerce/woocommerce-blocks/pull/10374)

* Show only products with rating (https://github.com/woocommerce/woocommerce-blocks/pull/10434)

* Add Product Gallery Thumbnails block (https://github.com/woocommerce/woocommerce-blocks/pull/10442)

* WIP Product Gallery: Add the Thumbnails block

* Product Gallery Thumbnails: Add block settings

* Add template for the Product Gallery block

* Add template for the Product Gallery block. Add the rest of the files.

* Product Gallery Thumbnails: Add context settings sharing between the Product Gallery and Thumbnails block.

* Product Gallery Thumbnails: Add UI functionality and frontend functionality. Add settings for the Thumbnails in both places - Product Gallery and the Thumbnails block.

* Product Gallery Thumbnails: Move the static template ouside of the component

* Make sure the context is set before accesing the array values

* Product Gallery Thumbnails: Move the setGroupAttributes() function outside of the component

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Update the Features Flags and Experimental Interfaces doc

* Product Gallery Thumbnails: Fix TS error

* Product Gallery Thumbnails: Remove unused stylesheet

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Remove unused context and fix the thumbnails bottom position styling on the frontend.

* Product Gallery Thumbnails: Allow the user to move the horizontal thumbnails above the large image and don't overwrite that automatically

* Product Gallery Thumbnails: Add code comments and remove the incorrect conditional check when moving thumbnails up and down

* Product Gallery Thumbnails: Fix the eslint dependency error

* Product Gallery Thumbnails: Refactor Product Gallery edit code and move the logic to a utils file

* Product Gallery Thumbnails: Update the utils file

* Product Gallery Thumbnails: Update the utils file. Fix comment indentation

* Product Gallery Thumbnails: Fix undefined variable html when only 1 product image is set

* Product Gallery: Rename clientId to productGalleryClientId

* Product Gallery Thumbnails: Combine the useEffect code having the same dependencies

* Product Gallery Thumbnails: Combine all useEffect code together

* Product Gallery Thumbnails: Add a ThumbnailsPosition enum

* Product Gallery Thumbnails: Update the thumbnailsPosition to an enum

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Add missing dependency

* Product Gallery Thumbnails: Uppercase the enum and fix the thumbnails position bug when initially adding the Product Gallery block

* Product Gallery: Add crop, zoom and full-screen settings

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Revert back to ts-ignore

* Revert "Product Gallery: Add crop, zoom and full-screen settings"

This reverts commit 840654197619e2611029b81990493387ae0b543d.

* Remove propTypes (https://github.com/woocommerce/woocommerce-blocks/pull/10432)

* Fix badge wrong spacing on the newest arrivals pattern (https://github.com/woocommerce/woocommerce-blocks/pull/10446)

* Product Gallery: Add Crop, Zoom and Full-screen settings (https://github.com/woocommerce/woocommerce-blocks/pull/10445)

* WIP Product Gallery: Add the Thumbnails block

* Product Gallery Thumbnails: Add block settings

* Add template for the Product Gallery block

* Add template for the Product Gallery block. Add the rest of the files.

* Product Gallery Thumbnails: Add context settings sharing between the Product Gallery and Thumbnails block.

* Product Gallery Thumbnails: Add UI functionality and frontend functionality. Add settings for the Thumbnails in both places - Product Gallery and the Thumbnails block.

* Product Gallery Thumbnails: Move the static template ouside of the component

* Make sure the context is set before accesing the array values

* Product Gallery Thumbnails: Move the setGroupAttributes() function outside of the component

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Update the Features Flags and Experimental Interfaces doc

* Product Gallery Thumbnails: Fix TS error

* Product Gallery Thumbnails: Remove unused stylesheet

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Remove unused context and fix the thumbnails bottom position styling on the frontend.

* Product Gallery Thumbnails: Allow the user to move the horizontal thumbnails above the large image and don't overwrite that automatically

* Product Gallery Thumbnails: Add code comments and remove the incorrect conditional check when moving thumbnails up and down

* Product Gallery Thumbnails: Fix the eslint dependency error

* Product Gallery Thumbnails: Refactor Product Gallery edit code and move the logic to a utils file

* Product Gallery Thumbnails: Update the utils file

* Product Gallery Thumbnails: Update the utils file. Fix comment indentation

* Product Gallery Thumbnails: Fix undefined variable html when only 1 product image is set

* Product Gallery: Rename clientId to productGalleryClientId

* Product Gallery Thumbnails: Combine the useEffect code having the same dependencies

* Product Gallery Thumbnails: Combine all useEffect code together

* Product Gallery Thumbnails: Add a ThumbnailsPosition enum

* Product Gallery Thumbnails: Update the thumbnailsPosition to an enum

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Add missing dependency

* Product Gallery Thumbnails: Uppercase the enum and fix the thumbnails position bug when initially adding the Product Gallery block

* Product Gallery: Add crop, zoom and full-screen settings

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Revert back to ts-ignore

* Revert "Product Gallery: Add crop, zoom and full-screen settings"

This reverts commit 840654197619e2611029b81990493387ae0b543d.

* Product Gallery: Add crop, zoom and full-screen settings

* Product Gallery: Remove the redundant React Fragment

* Remove nested filled and empty cart blocks in cart template (https://github.com/woocommerce/woocommerce-blocks/pull/10447)

* improve migration to blockified templates (https://github.com/woocommerce/woocommerce-blocks/pull/10415)

* fix compatibility with WP 6.2 (https://github.com/woocommerce/woocommerce-blocks/pull/10449)

* Add Product Gallery Pager to template

* Add Pager settings to Product Gallery block

* Remove save function and rename icon

* Use nullish coalescing operator for the block context

---------

Co-authored-by: Roy Ho <roykho77@gmail.com>
Co-authored-by: Alba Rincón <albarin@users.noreply.github.com>
Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
2023-08-22 16:26:46 -03:00
Karol Manijak cdd5c4e68b Make View Cart link displayed below the Add to Cart button (https://github.com/woocommerce/woocommerce-blocks/pull/10675) 2023-08-21 13:52:08 +02:00
Alexandre Lara 94c5dcefce Fix icon color when block is selected in List View (https://github.com/woocommerce/woocommerce-blocks/pull/10652) 2023-08-18 18:03:53 +00:00
Karol Manijak 2bd1d31602 Add logic of Upgrade Notice after upgrading Products to Product Collection (https://github.com/woocommerce/woocommerce-blocks/pull/10267)
* WIP of Upgrade Notice state

* Extend the state options with seeing option

* Move the logic to the dedicated folder

* Subscribe only if not reverted

* Refactor the way UpgradeNotice is rendered

* Simplify the logic of keeping the Upgrade Notice state in local storage

* Improve types organisation

* Lift the functions interacting with local storage to the Inspector Controls of Product Colelction

* Simplify logic of showing Upgrade Notice

* Disable auto migration

* Refactoring

* Use useLocalStorageState hook

* Fix incorrect merge

* Final improvements

* Allow to display Upgrade Notice after revert and manual upgrade

* Fix incorrect merge

* Improve the unsubscribe process

* Trigger auto-update from Product Collection only

* Remove weird console.log

* Abstract manual update from Product Query

* Fix the taxQuery migration from Product Collection to Products

* Product Collection - logic to hide upgrade notice (https://github.com/woocommerce/woocommerce-blocks/pull/10494)

* Add timestamp to each upgrade notice status change

* Revert back only Product Collections converted from Products block

* Make the time threshold configurable

* Add logic that hides the Upgrade Notice after some amount of displays

* Fix the taxQuery migration from Product Collection to Products

* Change the way to count Product Collection entries

* Fix the problem of multiple display counter increments with Product Collection

* Update Upgrade Notice visibility conditions

* Add contiions to unmark Product Collection as converted from Products

* Change variable name

* Change variable t to time name for better readibility. Improve types

* Replace useState with useRef

* Remove unecessary props passed to UpgradeNotice
2023-08-18 08:25:15 +02:00
Alba Rincón 748015b675 Fix "On sale" badge class (https://github.com/woocommerce/woocommerce-blocks/pull/10634)
* Fix "On sale" badge class for shop

* Add class to sale badge
2023-08-17 15:46:11 +02:00
Roy Ho c9f32707d0 Product-details: Add margin spacing controls (https://github.com/woocommerce/woocommerce-blocks/pull/10440)
* Product-details: Add margin spacing controls

* Add additional div to allow custom styling
2023-08-16 05:48:18 -07:00
Karol Manijak f290966ddf Open links from the Editor in the top frame, not editor iframe (https://github.com/woocommerce/woocommerce-blocks/pull/10515)
* Open links from the Editor in the top frame, not editor iframe

* Remove leftover

* Change the _top to _blank for external links
2023-08-16 11:03:50 +02:00
Mike Jolley 6b083aa641 Convert product tag control to functional component (https://github.com/woocommerce/woocommerce-blocks/pull/10529) 2023-08-15 17:40:05 +01:00
Raluca Stan fe8679c135 Fix express button display in the Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/10534)
* Fix express button display in the Cart block

When multiple buttons are displayed they don't appear stacked. This PR fixes a regression;

* Fix editor experience
2023-08-14 14:04:27 +02:00
Alexandre Lara f9ee3cfd70 Product Gallery block: Fix incorrect icon color when block is selected (https://github.com/woocommerce/woocommerce-blocks/pull/10426)
* Fix incorrect icon color when Product Gallery is selected

* Fix incorrect icon color when block is selected

* Remove unnecessary style

* Fix icon alignment

* Fix alignment for the icon

* Fix icon alignment
2023-08-11 11:59:35 -03:00
Alba Rincón 70c1a70243 Fix the `on sale` badge for product blocks (https://github.com/woocommerce/woocommerce-blocks/pull/10550)
* Fix the `on sale` badge for product blocks

* Fix in the editor
2023-08-11 16:08:26 +02:00
Luigi Teschio b90e0ffdc9 Interactivity API and Product Button (https://github.com/woocommerce/woocommerce-blocks/pull/10006)
* Update Interactivity API JS files

* Disable TS checks in the Interactivity API for now

* Add new SSR files

* Replace wp_ prefixes with wc_ ones

* Replace wp- prefix with wc-

* Replace guternberg_ prefix with woocommerce_

* Remove file comments from Gutenberg

* Rename files with `wp` prefix

* Fix code to load Interactivity API php files

* Remove TODO comments

* Replace @wordpress with @woocommerce

* Update Webpack configuration

* Fix directive prefix

* Remove interactivity folder from tsconfig exclude

* Add client-side navigation meta tag code

* Remove unneeded blocks.php file

* Fix store tag id

* Register Interactivity API runtime script

* Fix Interactivity API runtime registering

* Remove all files related to directive processing in PHP

* Move json_encode to Store's render method

* WIP

* WIP

* WIP

* WIP

* Preserve previous context

* Ignore Minicart block on client-side navigation

* Refresh page on store updatRefresh page on store updatee

* Refactor logic

* Add console error when a path is missing

* fix PHP lint error

* WIP store

* use store approach

* update jest configuration

* restore Mini Cart changes

* move cart store subscription to interactivity package

* move interactivity flag

* format HTML

* move addToCartText to the context

* Load product-query stylesheet when rendering the Products block

* update sideEffects array

* fix catch

* rename moreThanOneItem to isThereMoreThanOneItem

* improve how scripts are enqueued

* update default value for the filter woocommerce_blocks_enable_interactivity_api

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

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

* Update assets/js/interactivity/cart/cart-store.ts

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

* fix block.json

* remove updateStore function

* restore interactivity api changes

* import cart store

* show notice when there is an error

* add logic to dequeue script on classic themes and block themes

* imrpove logic about notice

* Interactivity API: add `afterLoad` callbacks to `store()` function (https://github.com/woocommerce/woocommerce-blocks/pull/10338)

* show notice when there is an error

* Add initial implementation for store callbacks

* Run `afterLoad` callbacks after `init`

* Move cart state subscription to Product button

* Remove cart-store from Interactivity API internals

* Change callbacks with options and save only afterLoad callbacks

* ProductButton: Add animation (https://github.com/woocommerce/woocommerce-blocks/pull/10351)

* implement animation

* improve logic

* refactor logic

* refactor code

* address feedback about code style

* add support for woocommerce_add_to_cart_quantity

* Fix animation flickering

* Introduce wp-effect, reduce the amount of numberOfItem variables to 2 and consolidate animation status

* add support for added class

* Remove unnecessary selector

* Don't fetch cart if it was already fetched

* remove added class

---------

Co-authored-by: Luis Herranz <luisherranz@gmail.com>

---------

Co-authored-by: Luigi <gigitux@gmail.com>
Co-authored-by: Luis Herranz <luisherranz@gmail.com>

* update deepsignal

* remove added class

* update deepsignal

* Interactivity API and Product Button: Add E2E tests (https://github.com/woocommerce/woocommerce-blocks/pull/10036)

* Add FrontendUtils class

* fix conflicts

* use locator

* restore click usage

* Product Button: Add E2E test

* fix util

* fix E2E tests

* remove comment

* Add E2E test to ensure that woocommerce_product_add_to_cart_text works

* update sideEffects array

* add zip and unzip as package

* fix wp-env configuration

* fix E2E test

* add report

* try now

* try now

* try now

* fix E2E test

* E2E: Add documentation for testing actions and filters. Fixes woocommerce/woocommerce-blocks#10135 (https://github.com/woocommerce/woocommerce-blocks/pull/10206)

* update description

* fix label

* rename files

* make requestUtils private

* remove page.goto

* use toHaveCount

* use productsToDisplay variable

* fix E2E tests

* rename class utils

---------

Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>

---------

Co-authored-by: David Arenas <david.arenas@automattic.com>
Co-authored-by: Luis Herranz <luisherranz@gmail.com>
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
2023-08-10 14:02:33 +00:00
Mike Jolley 4fd16267be Refactor Push Changes Readability and Performance (https://github.com/woocommerce/woocommerce-blocks/pull/10315)
* Add local state to address-form

* Update test with valid postcode and required fields

* Push changes refactoring

* Avoid loops due to retrying same data

* Callbacks to prevent rerenders

* Move validation functions

* Filter incoming values to only those included as fields to prevent errors

* Keep track of country changes to prevent excessive updates of addressFormFields.

* Use helpers in test

* Fill company

* Revert local state in address form

* Update address form to remove validation handling for postcode (country clears the field).

* Revert "Update test with valid postcode and required fields"

This reverts commit 718a6006df24f6e957297ad4d1ef9d6f690793bd.

* Clear postcode when country changes if invalid

* Revalidate fields when country changes

* Comment for pick

* Revert unneccessary test change

* Revery moving of functions to reduce diff size

* Increase push timeout in tests

* Revert test changes
2023-08-09 18:24:51 +01:00
Mike Jolley ab945e4a98 Performance: Optimise select shipping API calls (https://github.com/woocommerce/woocommerce-blocks/pull/10472)
* Support disabled inputs with styling

* Remove 1000ms debounce on selecting shipping rates and disable input when selecting

* Optimise rest api loading

* Fix analytics init

* Comments

* Unused after refactor

* More robust switching to prevent loop

* revert shipping controller change

* Remove ShippingAssets

* update test

* Comments
2023-08-08 11:56:19 +01:00
Mike Jolley 427fe33af3 Fix wcSettings inconsistent property naming style (https://github.com/woocommerce/woocommerce-blocks/pull/10439)
* Mass convert all snake case settings keys to camel case

* Handling for payment method data props
2023-08-07 11:30:53 +01:00
Luigi Teschio 48493a8fbb classicBlock: add defensive type handling (https://github.com/woocommerce/woocommerce-blocks/pull/10475) 2023-08-04 16:16:19 +02:00
Lucio Giannotta 76b82000b3 Fix border color class names not being applied correctly (https://github.com/woocommerce/woocommerce-blocks/pull/10468) 2023-08-04 14:04:24 +02:00
Hritik Chaudhary 869528a330 remove proptypes from payment-method-card and payment-method-error-bo… (https://github.com/woocommerce/woocommerce-blocks/pull/9817)
* proptype removal

* updated payment-method-error-boundary.tsx

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-08-03 12:06:52 +01:00
Mike Jolley 2d530a7d5e Refactor ValidatedTextInput and AddressForm usage (https://github.com/woocommerce/woocommerce-blocks/pull/10309)
* Refactor ValidatedTextInput and AddressForm usage

* Remove formatting from onChange

* update useeffect dependencies

* Update validation text

* Style fields without floats (https://github.com/woocommerce/woocommerce-blocks/pull/10310)
2023-08-03 12:02:20 +01:00
David Arenas 84f4cec592 Interactivity API: Update interactive regions during client-side navigation (https://github.com/woocommerce/woocommerce-blocks/pull/10200)
* Update router to hydrate only interactive regions

* Rename link directive to navigation-link

* Add navigation directives to Query and Pagination blocks

* Enable the Interactivity API by default

* Remove client-side navigation meta tag

* Cache initial regions

* Move data-wc-interactive from query to query-pagination

* Add woo prefix to navigation id

* Add keys and move wc-interactive back to the query block

* Reuse root fragments for each interactive region

* Fix navigation-id retrieval
2023-08-03 10:55:13 +02:00
Daniel Dudzic 6dc1deef9e Product Gallery: Add Crop, Zoom and Full-screen settings (https://github.com/woocommerce/woocommerce-blocks/pull/10445)
* WIP Product Gallery: Add the Thumbnails block

* Product Gallery Thumbnails: Add block settings

* Add template for the Product Gallery block

* Add template for the Product Gallery block. Add the rest of the files.

* Product Gallery Thumbnails: Add context settings sharing between the Product Gallery and Thumbnails block.

* Product Gallery Thumbnails: Add UI functionality and frontend functionality. Add settings for the Thumbnails in both places - Product Gallery and the Thumbnails block.

* Product Gallery Thumbnails: Move the static template ouside of the component

* Make sure the context is set before accesing the array values

* Product Gallery Thumbnails: Move the setGroupAttributes() function outside of the component

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Update the Features Flags and Experimental Interfaces doc

* Product Gallery Thumbnails: Fix TS error

* Product Gallery Thumbnails: Remove unused stylesheet

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Remove unused context and fix the thumbnails bottom position styling on the frontend.

* Product Gallery Thumbnails: Allow the user to move the horizontal thumbnails above the large image and don't overwrite that automatically

* Product Gallery Thumbnails: Add code comments and remove the incorrect conditional check when moving thumbnails up and down

* Product Gallery Thumbnails: Fix the eslint dependency error

* Product Gallery Thumbnails: Refactor Product Gallery edit code and move the logic to a utils file

* Product Gallery Thumbnails: Update the utils file

* Product Gallery Thumbnails: Update the utils file. Fix comment indentation

* Product Gallery Thumbnails: Fix undefined variable html when only 1 product image is set

* Product Gallery: Rename clientId to productGalleryClientId

* Product Gallery Thumbnails: Combine the useEffect code having the same dependencies

* Product Gallery Thumbnails: Combine all useEffect code together

* Product Gallery Thumbnails: Add a ThumbnailsPosition enum

* Product Gallery Thumbnails: Update the thumbnailsPosition to an enum

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Add missing dependency

* Product Gallery Thumbnails: Uppercase the enum and fix the thumbnails position bug when initially adding the Product Gallery block

* Product Gallery: Add crop, zoom and full-screen settings

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Revert back to ts-ignore

* Revert "Product Gallery: Add crop, zoom and full-screen settings"

This reverts commit 840654197619e2611029b81990493387ae0b543d.

* Product Gallery: Add crop, zoom and full-screen settings

* Product Gallery: Remove the redundant React Fragment
2023-08-02 10:43:08 +00:00
Alba Rincón a8873c3fa3 Remove propTypes (https://github.com/woocommerce/woocommerce-blocks/pull/10432) 2023-08-02 09:48:26 +02:00
Daniel Dudzic d6e4dd5eb3 Add Product Gallery Thumbnails block (https://github.com/woocommerce/woocommerce-blocks/pull/10442)
* WIP Product Gallery: Add the Thumbnails block

* Product Gallery Thumbnails: Add block settings

* Add template for the Product Gallery block

* Add template for the Product Gallery block. Add the rest of the files.

* Product Gallery Thumbnails: Add context settings sharing between the Product Gallery and Thumbnails block.

* Product Gallery Thumbnails: Add UI functionality and frontend functionality. Add settings for the Thumbnails in both places - Product Gallery and the Thumbnails block.

* Product Gallery Thumbnails: Move the static template ouside of the component

* Make sure the context is set before accesing the array values

* Product Gallery Thumbnails: Move the setGroupAttributes() function outside of the component

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Update the Features Flags and Experimental Interfaces doc

* Product Gallery Thumbnails: Fix TS error

* Product Gallery Thumbnails: Remove unused stylesheet

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Remove unused context and fix the thumbnails bottom position styling on the frontend.

* Product Gallery Thumbnails: Allow the user to move the horizontal thumbnails above the large image and don't overwrite that automatically

* Product Gallery Thumbnails: Add code comments and remove the incorrect conditional check when moving thumbnails up and down

* Product Gallery Thumbnails: Fix the eslint dependency error

* Product Gallery Thumbnails: Refactor Product Gallery edit code and move the logic to a utils file

* Product Gallery Thumbnails: Update the utils file

* Product Gallery Thumbnails: Update the utils file. Fix comment indentation

* Product Gallery Thumbnails: Fix undefined variable html when only 1 product image is set

* Product Gallery: Rename clientId to productGalleryClientId

* Product Gallery Thumbnails: Combine the useEffect code having the same dependencies

* Product Gallery Thumbnails: Combine all useEffect code together

* Product Gallery Thumbnails: Add a ThumbnailsPosition enum

* Product Gallery Thumbnails: Update the thumbnailsPosition to an enum

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Add missing dependency

* Product Gallery Thumbnails: Uppercase the enum and fix the thumbnails position bug when initially adding the Product Gallery block

* Product Gallery: Add crop, zoom and full-screen settings

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Revert back to ts-ignore

* Revert "Product Gallery: Add crop, zoom and full-screen settings"

This reverts commit 840654197619e2611029b81990493387ae0b543d.
2023-08-02 07:09:51 +00:00
Daniel Dudzic 69f1c53a41 Revert "Add Product Gallery Thumbnails block (https://github.com/woocommerce/woocommerce-blocks/pull/10247)" (https://github.com/woocommerce/woocommerce-blocks/pull/10441)
This reverts commit 51344c3fed.
2023-08-01 19:03:12 +02:00
Daniel Dudzic 51344c3fed Add Product Gallery Thumbnails block (https://github.com/woocommerce/woocommerce-blocks/pull/10247)
* WIP Product Gallery: Add the Thumbnails block

* Product Gallery Thumbnails: Add block settings

* Add template for the Product Gallery block

* Add template for the Product Gallery block. Add the rest of the files.

* Product Gallery Thumbnails: Add context settings sharing between the Product Gallery and Thumbnails block.

* Product Gallery Thumbnails: Add UI functionality and frontend functionality. Add settings for the Thumbnails in both places - Product Gallery and the Thumbnails block.

* Product Gallery Thumbnails: Move the static template ouside of the component

* Make sure the context is set before accesing the array values

* Product Gallery Thumbnails: Move the setGroupAttributes() function outside of the component

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Update the Features Flags and Experimental Interfaces doc

* Product Gallery Thumbnails: Fix TS error

* Product Gallery Thumbnails: Remove unused stylesheet

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Remove unused context and fix the thumbnails bottom position styling on the frontend.

* Product Gallery Thumbnails: Allow the user to move the horizontal thumbnails above the large image and don't overwrite that automatically

* Product Gallery Thumbnails: Add code comments and remove the incorrect conditional check when moving thumbnails up and down

* Product Gallery Thumbnails: Fix the eslint dependency error

* Product Gallery Thumbnails: Refactor Product Gallery edit code and move the logic to a utils file

* Product Gallery Thumbnails: Update the utils file

* Product Gallery Thumbnails: Update the utils file. Fix comment indentation

* Product Gallery Thumbnails: Fix undefined variable html when only 1 product image is set

* Product Gallery: Rename clientId to productGalleryClientId

* Product Gallery Thumbnails: Combine the useEffect code having the same dependencies

* Product Gallery Thumbnails: Combine all useEffect code together

* Product Gallery Thumbnails: Add a ThumbnailsPosition enum

* Product Gallery Thumbnails: Update the thumbnailsPosition to an enum

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Fix TS errors

* Product Gallery Thumbnails: Add missing dependency

* Product Gallery Thumbnails: Uppercase the enum and fix the thumbnails position bug when initially adding the Product Gallery block

* Product Gallery: Add crop, zoom and full-screen settings

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Replace ts-ignore with ts-expect-error

* Product Gallery Thumbnails: Revert back to ts-ignore
2023-08-01 12:23:53 +00:00
Alexandre Lara 720f65ca36 Fix color when selecting Large Image block (https://github.com/woocommerce/woocommerce-blocks/pull/10425) 2023-07-31 17:04:10 -03:00
Luigi Teschio e0296c15fd fix unit test (https://github.com/woocommerce/woocommerce-blocks/pull/10409) 2023-07-31 12:26:20 +00:00
Luigi Teschio be7fb56637 Register Legacy block for all taxonomy-product_ template (https://github.com/woocommerce/woocommerce-blocks/pull/10382)
* WIP

* improve logic

* improve unit test
2023-07-31 12:23:49 +02:00
Patricia Hillebrandt 3ec684818e Fix: WooCommerce Blocks causing malfunction of the navigation block on WordPress 6.3 (https://github.com/woocommerce/woocommerce-blocks/pull/10388)
* Make sure the revert button is registered and enqueued for usage exclusively in the site editor.

* Register and enqueue the styles for the revert button.

* Rename the files.

* Revert "Rename the file renames."

This reverts commit c0330ce70fec20bea1f957eddcf458881e16242c.

* Add plugin-proposal-optional-chaining to the WebPack plugins config.

* Rename the files.

* Remove unnecessary dependencies as those are already provided via : more specifically, get_script_data.

* Address CR.
2023-07-31 07:03:10 +00:00
Roy Ho 7d17febec4 Add selection button to featured items when id not found (https://github.com/woocommerce/woocommerce-blocks/pull/10387) 2023-07-28 07:23:43 -07:00
dependabot[bot] 0706ebac63 Bump use-debounce from 7.0.1 to 9.0.4 (https://github.com/woocommerce/woocommerce-blocks/pull/9306)
* Bump use-debounce from 7.0.1 to 9.0.4

Bumps [use-debounce](https://github.com/xnimorz/use-debounce) from 7.0.1 to 9.0.4.
- [Release notes](https://github.com/xnimorz/use-debounce/releases)
- [Changelog](https://github.com/xnimorz/use-debounce/blob/master/CHANGELOG.md)
- [Commits](https://github.com/xnimorz/use-debounce/commits/9.0.4)

---
updated-dependencies:
- dependency-name: use-debounce
  dependency-type: direct:production
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* Fix mocked function

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Mike Jolley <mike.jolley@me.com>
2023-07-27 16:10:43 +01:00
Alex Florisca 1e2e0fbe9c Update express checkout title, description, icon (https://github.com/woocommerce/woocommerce-blocks/pull/10237)
* Change icon, title and description of the Express Checkout Block

* Fix icon style

* Update icon and add styles

* change icon for express payments in cart
2023-07-27 09:08:29 +01:00
Tung Du b5100e9d99 Fix: incorrect default number of products in editor when inheriting query (https://github.com/woocommerce/woocommerce-blocks/pull/10303) 2023-07-27 10:06:16 +07:00
Roy Ho a57642318a Change custom toolbar item to use toolbar button (https://github.com/woocommerce/woocommerce-blocks/pull/10246) 2023-07-26 06:19:41 -07:00
Karol Manijak e09962d65a Optimise imports of Product Query variation (https://github.com/woocommerce/woocommerce-blocks/pull/10340)
* Optimise imports of Product Query variation

* Lint: add whitespace
2023-07-26 11:08:01 +02:00
Albert Juhé Lluveras ce16b98893 Fix SearchListControl styles (II) (https://github.com/woocommerce/woocommerce-blocks/pull/10308) 2023-07-24 11:30:54 +02:00
Alba Rincón b8f798b017 Use the `Single Product` block for the `Product Details Product Listing` pattern (https://github.com/woocommerce/woocommerce-blocks/pull/9978)
* Show alignment toolbar also when the block is in the single product block

* Start using `Single Product` for the `Product Details Product Listing` pattern

* Use counter and stars blocks in the pattern

* Undo button change

* Make the new rating blocks not experimental

* Add Beta to the average rating block

* Add blocks to block types controller
2023-07-24 11:02:24 +02:00
Roy Ho ef7b811e4b Remove border control (https://github.com/woocommerce/woocommerce-blocks/pull/10277) 2023-07-21 05:46:55 -07:00
Roy Ho 37e197c149 Move sale badge to top right of product image (https://github.com/woocommerce/woocommerce-blocks/pull/10297) 2023-07-21 05:45:09 -07:00
Darren Ethier f708593adb Add Color Panel (https://github.com/woocommerce/woocommerce-blocks/pull/10062)
* Add new ColorPanel component

* Implement new ColorPanel component for the Mini-Cart

* Move ColorPanel types into their own types.ts file alongside the ColorPanel component

* Add useColorPanelStyles hook

* Rename classes to className

* Disable @wordpress/no-unsafe-wp-apis

* Fix tests: Move defaultColorItem object to utils file

* Remove unnecssary types from QuantityBadge

* Fix conflicts

* Remove context

* Fix color picker JS error

* Migrate attribute data to be compatible with ColorPanel component

* Fix incompatible attributes

* Remove useColorPanelStyles hook

* migrateAttributesToColorPanel JS unit tests

* PHP MiniCartUtils tests

* Remove unncessary code for classNames in MiniCart edit

---------

Co-authored-by: tjcafferkey <tjcafferkey@gmail.com>
2023-07-21 10:35:32 +01:00
Karol Manijak 7018ff47b6 Add manual path to upgrade Products block (https://github.com/woocommerce/woocommerce-blocks/pull/10268)
* Add option to manually update Products block to Product Collection

* Disable manual upgrade of Products yet

* Manual update flag doesn't have to be dependant on auto update

* Removed commented out console info logs

* Disable option to upgrade Products block

* Change the way to bold text in Upgrade Notices so it's translatable

* Change the way UpgradeNotice is rendered conditionally
2023-07-21 08:22:49 +02:00
Alexandre Lara f6b84e02e2 Add to Cart Form: Fix broken styles for the block when using inside the Single Product Block (https://github.com/woocommerce/woocommerce-blocks/pull/10282)
* Fix broken styles for Add to Cart Form block

* Fix PHP CS error
2023-07-20 09:28:15 -03:00
Brian d46997a84f fix woocommerce/woocommerce-blocks#10027 (https://github.com/woocommerce/woocommerce-blocks/pull/10150) 2023-07-20 04:40:40 -07:00
Mike Jolley bd537e1008 Get latest cart when triggering events (https://github.com/woocommerce/woocommerce-blocks/pull/10254) 2023-07-19 10:42:25 +01:00
Alba Rincón 5eef9bff65 Add new `Product Average Rating` block (https://github.com/woocommerce/woocommerce-blocks/pull/10207)
* Add new Product Average Rating block

* Add new blocks to the feature flag docs

* Translate 'No ratings'

* Fix condition

* Small improvements after review

* Avoid duplication of styles

* Update supports in php class
2023-07-19 11:21:30 +02:00
Karol Manijak 67dbd22dfe Fix incorrect filter application in Product Collection (https://github.com/woocommerce/woocommerce-blocks/pull/10263)
* Fix the incorrectly applied filter in Product Collection

* Get the block name from metadata
2023-07-19 11:15:37 +02:00
Manish Menaria 1ea6355a04 Enable auto-expand for product selection in HandPickedProductsControl (https://github.com/woocommerce/woocommerce-blocks/pull/10250)
This commit adds a new `__experimentalExpandOnFocus` attribute to the component within the `HandPickedProductsControl`. The value is set to `true`, enabling automatic expansion of the list when the user focuses on the product selection field.

This change aims to improve the user experience by making it easier for the user to see all available options when they focus on the selection list.
2023-07-19 12:07:24 +05:30
Albert Juhé Lluveras 4e68edff91 Remove work-around code in EditableButton component to fix typing Space (https://github.com/woocommerce/woocommerce-blocks/pull/10248) 2023-07-18 18:04:50 +02:00
Roy Ho cd666ee081 Add class specificity to fix indent (https://github.com/woocommerce/woocommerce-blocks/pull/10245) 2023-07-18 06:21:13 -07:00
Albert Juhé Lluveras bf20e670dd Create Mini-Cart template part area (https://github.com/woocommerce/woocommerce-blocks/pull/10203)
* Create Mini-Cart template part area

* Update Mini-Cart template part name to exclude it

* Update src/BlockTemplatesController.php

Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>

* Update src/BlockTemplatesController.php

Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>

* Keep both variations of the template part name when excluding them

* Revert "Keep both variations of the template part name when excluding them"

This reverts commit c3f293511536d1ebbac0f50caaf74cded28d0025.

---------

Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
2023-07-18 09:12:43 +02:00
Karol Manijak 333c850567 Newest Products: fix Stock Status filter (https://github.com/woocommerce/woocommerce-blocks/pull/10201)
* Newest Products: fix Stock Status filter

* Change the default of Product Stock Control to ALL available stock statuses
2023-07-18 08:39:09 +02:00
Albert Juhé Lluveras 55a6e38598 Prevent Mini-Cart template part preview in Site Editor being too high (https://github.com/woocommerce/woocommerce-blocks/pull/10204)
* Prevent Mini-Cart template part preview in Site Editor being too high

* Remove Mini-Cart Contents styles related to Style Book
2023-07-14 16:12:40 +02:00
Albert Juhé Lluveras a3ac0e2c62 Fix SearchListControl styles (https://github.com/woocommerce/woocommerce-blocks/pull/10192)
* Fix SearchListControl checkbox styles

* Encode SearchListControl labels

* Fix SearchListControl styling

* Update snapshots
2023-07-14 13:50:23 +02:00
Daniel Dudzic 2240504d51 Mini Cart: Fix styling of the Start Shopping button in the drawer. Fixes woocommerce/woocommerce-blocks#10035 (https://github.com/woocommerce/woocommerce-blocks/pull/10169) 2023-07-14 11:47:23 +00:00
Karol Manijak 041d4ad4b1 Stop reading Product IDs from asset store in filter blocks (https://github.com/woocommerce/woocommerce-blocks/pull/10195)
* Remove queries that fetch all products for manipulating the results returned by the Store API for certain use-cases.

* Remove the code that's supposed to read product ids for filter context and logic around that in useCollectionData

* Fix incorrect merge

---------

Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
2023-07-14 11:18:10 +02:00
Alba Rincón 3d8331363c `Rating Stars` block improvements (https://github.com/woocommerce/woocommerce-blocks/pull/10148)
* Rating start block improvements

Fix classes, register in single product, remove unused code

* Allow to use block on product & product collection

* Fix star missalignment

* Restrict the block to be insertable only in single product
2023-07-14 09:41:58 +02:00
Alba Rincón d82a4b671f Add new `Ratings counter` block (https://github.com/woocommerce/woocommerce-blocks/pull/10114)
* Add new rating counter block

* Fix colors and register globally

* Add missing import

* Remove unused file

* Reorder blocks alphabetically

* Remove unnecessary html

* Change registration, fix classes

* Fix margin

* Remove icon from block.json, add ancestors

* Move icon and remove unused constants

* Fix classes

* Remove condition

* Allow to use block on product & product collection

* Enable block only on single product

* Move ancestors to block.json
2023-07-14 08:57:19 +02:00
Manish Menaria bd892c4781 Add E2E tests for 'Inherit query from template' control in Product Collection block (https://github.com/woocommerce/woocommerce-blocks/pull/10174)
Key updates:

1. Additional CSS class to Inherit Query Control: A CSS class named `wc-block-product-collection__inherit-query-control` has been added to the ToggleControl component. This provides a precise target for E2E tests and potential custom styles.

2. E2E tests for 'Inherit query from template' control: Numerous scenarios have been covered to ensure the control's correct behavior. These scenarios include verifying visibility under different circumstances and checking its functionality in a Product Catalog template.

3. E2E test code enhancements: The E2E test code now exports the `SELECTORS` object to assist in locating different elements during the tests. This includes the new 'Inherit query from template' control. The `setShowOnlyProductsOnSale()` function has been refactored to improve readability and provide more granular control over its operations.

4. Test scenario for 'Show only products on sale': The existing E2E test for this functionality has been extended to check that it retains its state when the 'Inherit query from template' control is toggled.

These changes increase the robustness of our E2E tests, providing better coverage for the 'Inherit query from template' control in the Product Collection block.
2023-07-14 10:52:19 +05:30
Karol Manijak de0cc88147 Automatic migration path from Products to Product Collection - step 3 - allow reverting migration (https://github.com/woocommerce/woocommerce-blocks/pull/10144)
* Add logic to revert migration from Product to Product Collection
2023-07-12 17:01:49 +02:00
Alex Florisca 52506cbe81 Fix margin issue with the Proceed to checkout button on the site editor (https://github.com/woocommerce/woocommerce-blocks/pull/10182)
* Fix margin issue with the Proceed to checkout button on the site editor

* Remove unecessary selector
2023-07-12 15:28:37 +01:00
Patricia Hillebrandt 64405c7a43 Mini Cart block > Update block registration to rely on a metadata file. (https://github.com/woocommerce/woocommerce-blocks/pull/10168)
* Introduce the block.json file for the mini-cart block.

* Update the index.tsx file to use the new metadata file for registering the mini cart.
2023-07-12 16:20:19 +02:00
Karol Manijak dbfa57bd67 Automatic migration path from Products to Product Collection - step 2 - display notice (https://github.com/woocommerce/woocommerce-blocks/pull/10139)
* Display upgrade notice after successful replacement
2023-07-12 11:19:35 +02:00
Karol Manijak 9b0c610ced Automatic migration path from Products to Product Collection - step 1 - automatic migration (https://github.com/woocommerce/woocommerce-blocks/pull/10115)
* Foundation of the Products block replacement with Product Collection

* Provide logic to replace Products with Product Collection

* Make sure the blocks can be replaced

* Add types and refactor replacement a bit

* Fix the query attributes transform

* Add upgrade Notice to the Product Collection block

* Force upgrade notice to be displayed at the top of the Inspector Controls

* Externalise migration code so it can be reused in both ways

* Add util to get block IDs byt its name

* Add a way to revert the Product Collection blocks to Products

* Move the subscription to another place where it's triggered only once

* Add default values

* Remove attributes from Products block if they're not used to avoid incorrect query

* WIP logic of unseen/seen/reverted notice

* Change the state reading

* Revert changes regarding notice displaying logic

* Change the logc of firing replacement and bail early if there's no core/query blocks

* Add todos

* Implement inner blocks migration

* Implement the revert transformation of inner blocks

* Refactor types

* Add layout transformation from Products to Product Collection

* Add layout migration from Product Collection to Products

* Disable migration by default

* Simplify some parts of code

* Remove additional keyword from Product Collection to move it to another PR

* Adjust the logic to introduce the first step: conversion from Products to Product Collection

* Disable automatic migration
2023-07-12 10:01:36 +02:00
Luigi Teschio 98a61d3a4d Enable declaration-block-no-duplicate-properties stylelint rule (https://github.com/woocommerce/woocommerce-blocks/pull/10163) 2023-07-11 13:03:05 +00:00
Luigi Teschio 45d994d47f Revert "Fix image over content (https://github.com/woocommerce/woocommerce-blocks/pull/10092)" (https://github.com/woocommerce/woocommerce-blocks/pull/10160)
This reverts commit b82c0de69d.
2023-07-11 12:16:12 +00:00
Karol Manijak c55343b736 Product Collection - refactor inspector controls props (https://github.com/woocommerce/woocommerce-blocks/pull/10154)
* Refactor Columns Control inspector controls in Product Collection

* Refactor Order By inspector controls in Product Collection

* Reorder imports in Product Collection Inspector Controls

* Refactor On Sale inspector controls in Product Collection

* Refactor Stock Status inspector controls in Product Collection

* Refactor Keyword inspector controls in Product Collection

* Unify interface of query controlling Inspector Controls

* Unify interfaces of Inspector Controls that modify Query in Product Collection

* Unify other Query modifying Controls

* Simplify types
2023-07-11 13:05:49 +02:00
Karol Manijak fd378be6eb Add "grid" and "list" view switch for Product Collection (https://github.com/woocommerce/woocommerce-blocks/pull/10145)
* Add Display Layout controls to Product Collection

* Adjust the layout type name

* Add explicit display layout types

* Change the function name to setDisplayLayout so it's more explicit

* Pass only the necessary props to nested inspector controls

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2023-07-10 13:39:09 +02:00
Manish Menaria 708ed47a85 Enhance: Bring back user to 1st page when filters are changed (https://github.com/woocommerce/woocommerce-blocks/pull/9952)
* Add support for filter blocks

This commit updates the `ProductCollection` block implementation to add support for filter blocks, including the Price filter, Attributes filter, Rating filter, and In stock filter.

The changes include:

1. Adding a new property `$attributes_filter_query_args` to store the query arguments related to the filter by attributes block.

2. Adding a new method `add_support_for_filter_blocks()` to enable support for filter blocks. This method sets the necessary asset data to enable filtering and refreshes the page when a filter is applied.

3. Adding new methods to handle specific filter queries, including `get_filter_by_price_query()`, `get_filter_by_attributes_query()`, `get_filter_by_stock_status_query()`, and `get_filter_by_rating_query()`. These methods generate the respective queries based on the applied filters.

4. Refactoring the `get_final_query_args()` method to include the newly added filter queries using the `get_queries_by_applied_filters()` method.

These changes enhance the functionality of the `ProductCollection` block by allowing users to filter products based on price, attributes, rating, and stock status.

* Go to first page when filters are updated

* Enhance ProductCollection block to support filter blocks

This commit enhances the ProductCollection block to support various filter blocks such as Price filter block, Attributes filter block, Rating filter block, and In stock filter block.

The `build_query` method has been refactored into two separate methods: `build_frontend_query` and `get_final_frontend_query` to make the code more modular and readable. The `add_support_for_filter_blocks` method has been modified to support the generation of product IDs for filter blocks.

The method `update_rest_query` has been renamed to `update_rest_query_in_editor` for better clarity and understanding of its function. Similarly, `get_final_query_args` has been refactored to include the `$is_exclude_applied_filters` parameter which helps in generating product IDs for the filter blocks.

Moreover, the filter hook `pre_render_block` has been added to support the filtering of blocks before they are rendered.

This update will enhance the user experience by providing more filtering options in the ProductCollection block.

* Remove changes related to redirect to 1st page

* Go to first page when filters are updated

This commit refactors the changeUrl function in the `filters.ts` file. The purpose of this refactor is to remove the page number from the URL whenever filters are changed. This ensures that the user is always taken to the first page of results.

The commit includes the following changes:
- Added comments explaining the different page number formats in the URL.
- Updated the `newUrl` parameter by removing the page number using regular expressions.
- The page is then reloaded with the updated URL using `window.location.href`.

These changes improve the URL handling in the `changeUrl` function and enhance the user experience when interacting with filters.

* Optimize URL updates to prevent unnecessary page reloads

This commit optimizes the `changeUrl` utility function to prevent unnecessary page reloads.

Changes:
1. It checks if there are no query parameters in the URL and the URL ends with a '?'.
2. If these conditions are met, it removes the trailing '?' from the URL.

The reason for this change is that a '?' in the URL typically indicates that query parameters will follow. If there are no query parameters, the '?' is unnecessary and can cause the page to reload, which can negatively affect performance. Therefore, by removing the '?', we prevent this unnecessary page reload.

* Simplify trailing '?' removal in URL handling

This commit simplifies the removal of trailing '?' characters from URLs.
The previous implementation checked if there were any query parameters
before removing a trailing '?'.

However, upon review, it was determined that this check was unnecessary,
as a trailing '?' could be removed safely even if query parameters were
present, without any negative impact.

This change simplifies the code and prevents unnecessary computation
checking for the existence of query parameters.
2023-07-10 11:34:11 +05:30
Karol Manijak bf157c5996 Add additional Products (Beta) keyword to Product Collection so it appear next to Products in the inserter (https://github.com/woocommerce/woocommerce-blocks/pull/10112) 2023-07-07 15:50:29 +02:00
Daniel Dudzic f6a4b3c143 Product Gallery: Add Large Image inner block (https://github.com/woocommerce/woocommerce-blocks/pull/10045)
* Product Gallery: Add an new block base code

* Product Gallery: Add experimental flag

* Product Gallery: Add Large Image block code

* Product Gallery Large Image: Remove unsed types

* Product Gallery: Move the block from registerBlockType to registerBlockSingleProductTemplate

* Product Gallery: Update icon

* Product Gallery: Add missing icon import

* Product Gallery Large Image: Add experimental mode check

* Product Gallery Large Image: Deregister unnecessary block settings

* Product Gallery Large Image: Add experimental flag to the Product Gallery Large Image and remove the icon override

* Product Gallery Large Image: Add zoom and correct styling

* Product Gallery Large Image: Remove commented out unnecessary code

* Product Gallery Large Image: Re-add the removed action after capturing the large image html

* Product Gallery Large Image: Update Large Image icon and description. Move metadata to the block.json file.
2023-07-06 15:08:39 +00:00
Alba Rincón 3ccfec1eee Fix `Product Rating` styles & alignment (https://github.com/woocommerce/woocommerce-blocks/pull/10097)
* Fix alignment not working on the editor

* Fix style regression on rating
2023-07-06 09:25:29 +02:00
Mike Jolley 599274e3d6 Fix cart and checkout conditionals when using a block based theme and templates (https://github.com/woocommerce/woocommerce-blocks/pull/10098)
* Update conditionals to deal with templates instead of cart/checkout page objects

* Include notice style in main entrypoint
2023-07-05 04:02:27 -07:00
Karol Manijak 283dfc652f Add feedback form to the Product Collection block (https://github.com/woocommerce/woocommerce-blocks/pull/10079)
* Add feedback form to the Product Collection block

* Change the airtable link to the new one related to Product Collection
2023-07-05 10:34:25 +02:00
Alba Rincón b82c0de69d Fix image over content (https://github.com/woocommerce/woocommerce-blocks/pull/10092) 2023-07-05 10:30:20 +02:00
Luigi Teschio 7ca65db5b0 Fix filter count display toggle (https://github.com/woocommerce/woocommerce-blocks/pull/10096)
* fix save method

* improve check

* Only display counts if showCounts is true

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
2023-07-05 08:51:02 +02:00
Tarun Vijwani 6b8e4c38e0 Fix notice banner links for Legacy notices (https://github.com/woocommerce/woocommerce-blocks/pull/9996) 2023-07-04 04:16:26 -07:00
Albert Juhé Lluveras df3ff6793e Per block stylesheets (https://github.com/woocommerce/woocommerce-blocks/pull/9831)
* Clean up blank lines

* Update Webpack config

* Update PHP logic to load block styles

* Style fixes

* Style fixes (II)

* Style fixes (III)

* Style fixes (IV)

* Fix missing stylesheets in the Site Editor

* Fix wrong return values in some PHP method docs

* Fix missing ProductPrice stylesheet causing 404 in tests

* Fix missing ProductGallery stylesheet causing 404 in tests
2023-07-04 13:06:48 +02:00
Alba Rincón 25a5737ec7 Fix image not rendering on the editor and empty styles (https://github.com/woocommerce/woocommerce-blocks/pull/10089) 2023-07-04 11:02:35 +02:00
Daniel Dudzic 3700c1c42d Product Gallery: Add an new block base code (https://github.com/woocommerce/woocommerce-blocks/pull/9937)
* Product Gallery: Add an new block base code

* Product Gallery: Add experimental flag

* Product Gallery: Move the block from registerBlockType to registerBlockSingleProductTemplate

* Product Gallery: Update icon
2023-07-03 14:21:31 +00:00
Roy Ho 48f7a9fdda Remove attributes data from save function for active filters (https://github.com/woocommerce/woocommerce-blocks/pull/10047) 2023-07-03 06:52:31 -07:00
Roy Ho f8cf9fe97a Remove attributes data from save function for filter by price (https://github.com/woocommerce/woocommerce-blocks/pull/10039) 2023-07-03 05:39:45 -07:00
Niels Lange 0b01b8c60d Remove the word ‘beta’ from the compatibility notice (https://github.com/woocommerce/woocommerce-blocks/pull/10019)
* Remove the word ‘beta’ from the compatibility notice

* Optimise wording
2023-07-03 12:56:12 +02:00
Daniel Dudzic 8cacfce738 Rating: Fix TS error (https://github.com/woocommerce/woocommerce-blocks/pull/10001) 2023-07-03 10:50:06 +00:00
Alba Rincón b1bc51e3f0 Add new `Product Rating Stars` block (https://github.com/woocommerce/woocommerce-blocks/pull/10005)
* Add new `Product Rating Stars` block

* Make block experimental

* Fix dep
2023-07-03 11:48:50 +02:00
Alba Rincón fd86fd2e57 Add size settings to the `Product Image` block (https://github.com/woocommerce/woocommerce-blocks/pull/10034)
* Add height & width setting to the image sidebar settings

* Extract settings and add scale options

* Add width settings

* Apply settings on the frontend

* Style placeholder image

* Replace post featured image with product image

* Allow the width to be wider than container

* Fix image on top of other elements
2023-07-03 11:33:44 +02:00
Mike Jolley a6b8e0e542 Hide "collection from" text when a location has an incomplete address. (https://github.com/woocommerce/woocommerce-blocks/pull/9808)
* Hide "collection from" text when a location has an incomplete address.

* Fix display on confirmation page

* has_valid_pickup_location helper

* Missing isset

* Update test

* Fix pickup text assertion

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-07-03 10:10:18 +01:00
Hritik Chaudhary c1f2949a5d Converted product-tag and removed its proptypes (https://github.com/woocommerce/woocommerce-blocks/pull/9758)
* Converted product-tag and removed its proptypes

* addressed review comments

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-07-03 10:54:46 +02:00
Albert Juhé Lluveras b5080e379d Prevent prefetched Cart payload causing wrong values with cached Mini-Cart block (https://github.com/woocommerce/woocommerce-blocks/pull/10029)
* Prevent prefetched Cart payload causing wrong values with cached Mini-Cart block

* Pass Cart Totals object entirely

* Code cleanup

* Fixes and code cleanup

* Update Mini-Cart local storage when adding or removing products from cart
2023-06-30 16:05:27 +02:00
Luigi Teschio cf8b73d79f Single Product Block: avoid to register incompatibility blocks with the Single Product Block on the post/page editor (https://github.com/woocommerce/woocommerce-blocks/pull/10044) 2023-06-30 14:06:12 +02:00
Alexandre Lara 388605027b Product Image Gallery block: Fix overflow when multiple images are used (https://github.com/woocommerce/woocommerce-blocks/pull/10013)
* Fix Product Image Gallery block overflow when multiple images are used

* Increase css specificity for the Product Image Gallery images

* Fix whitespace

* Fix style issue when using smaller images in the product image gallery
2023-06-29 20:24:33 +02:00
Paulo Arromba f1df8fb975 Add Cart/Checkout/Order-Received Templates (https://github.com/woocommerce/woocommerce-blocks/pull/9301)
* WIP: dirty attempt to dry run Cart & Checkout templates

* Added Cart and Checkout to the template hierarchies

* Merge branch 'trunk' into poc/cart_and_checkout_fse_templates

* Updated cart & Checkout templates

* Order Received FSE template (https://github.com/woocommerce/woocommerce-blocks/pull/8937)

* Order Received template bootstrap

* typo

* WIP: new block

* add logic here

* Order received classic template

* reverted constants.ts

* Added the post title (buggy)

* Corrected page title

* Updated constants.ts

* Fixed template typo

* removed placeholder for order received block

* add order-received template description

* updated placeholder description

* Formatting fixes

* Template description.

* replaced hardcoded string with OrderReceivedTemplate::SLUG

---------

Co-authored-by: Luigi <gigitux@gmail.com>

* Code formatting (https://github.com/woocommerce/woocommerce-blocks/pull/8350)

* Code formatting

* page_template_hierarchy priority to 1 (https://github.com/woocommerce/woocommerce-blocks/pull/9323)

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

* Migrate Cart and Checkout Pages to the Template Editor when using a FSE theme (https://github.com/woocommerce/woocommerce-blocks/pull/9339)

* Introduce woocommerce_blocks_template_content hook

* Migrate cart and checkout page content to the template editor

* Add redirection from edit page to edit template

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

* Removed header and footer from checkout template. (https://github.com/woocommerce/woocommerce-blocks/pull/9378)

* Removed header and footer from checkout template.

* Removed header and footer from checkout template migration

* Permalink solution for the checkout endpoint/template (https://github.com/woocommerce/woocommerce-blocks/pull/9406)

* Checkout endpoint work

* Move setting field to util

* Include link to edit the template

* Remove todo

* Refactor checkout templates to share logic (https://github.com/woocommerce/woocommerce-blocks/pull/9411)

* Sync endpoints with pages (https://github.com/woocommerce/woocommerce-blocks/pull/9426)

* Switch to page syncing

* Update settings descriptions

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

* Migrate pages to templates once (https://github.com/woocommerce/woocommerce-blocks/pull/9488)

* Migrate content on init, once

* Skip migration if page does not exist

* Put back HTML for header and footer parts

* Fix page redirect due to wrong ID

* fix loading template part

* Removed unnecessary var

* update cart and checkout html templates

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

* Include a notice to redirect user to template editor (https://github.com/woocommerce/woocommerce-blocks/pull/9508)

* Template Placeholder Design for the Order Received Template (https://github.com/woocommerce/woocommerce-blocks/pull/9602)

* Load frontend styles in editor iframe

* Update placeholder to include skeleton and updated icons

* Update classic template configs

* 1px border for .wp-block-woocommerce-classic-template__placeholder-copy

* Show copy on focus

* Sample data

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

* Add simplified header on checkout template (https://github.com/woocommerce/woocommerce-blocks/pull/9607)

* Added simplified header on checkout template

* Moved simplified header to template part

* updated constants.ts

* added template part to checkout.html

* Add missing translation

* frontpage_template_hierarchy no longer needed

* Allow plugin based template parts (https://github.com/woocommerce/woocommerce-blocks/pull/9667)

* Merge branch 'trunk' into add/9288_cart-checkout-order-received_fse_templates

* Synced templates on blockified folder

* Add blockified order-received.html

* removed WooCommerce prefix

* Refactor/rebrand order received template to order confirmation (https://github.com/woocommerce/woocommerce-blocks/pull/9734)

* rebrand order received to order confirmation

* updated descriptions for templates

* updated descriptions for order confirmation placeholder

* Resolve merge conflict

* Resolve merge conflicts

* Resolve more merge conflicts after rebase

* Fix formatting

* Use patterns for localisation (https://github.com/woocommerce/woocommerce-blocks/pull/9883)

* e2e tests for cart and checkout templates (https://github.com/woocommerce/woocommerce-blocks/pull/9939)

* Merge branch 'trunk' into poc/cart_and_checkout_fse_templates

* Merge branch 'trunk' into add/9288_cart-checkout-order-received_fse_templates

* Resolve merge conflicts

* Add e2e for permalink settings

* Test that templates exist

* Add test to check that templates can be edited

* Add tests to confirm templates can be edited

* Ensure cart has contents before running tests on frontend views

* Commend out problem test

* Make sure search has multiple results

* Remove useThrottle - bad rebase

* Revert changes to docs after rebase

* Revert function call for noReviewsPlaceholder

* Bad rebase

* Reverts

* Remove revertTemplate

* Spacing

* Wait for networkidle after navigation

* Always wait for network

* Use button roles in site editor

* More specific button locator

* Update option comparison

* Fix template content

* Disable failing tests

* Disable failing classic template tests

* Use enterEditMode

* More enterEditMode usage

* enterEditMode

* Use test.skip

* More robust selectors

* Alt iframe selector

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

* Skip flakey test

---------

Co-authored-by: Luigi <gigitux@gmail.com>
Co-authored-by: Mike Jolley <mike.jolley@me.com>
2023-06-29 14:41:22 +01:00
Roy Ho 6d36b2547b Make filter by rating preview consistent with default settings (https://github.com/woocommerce/woocommerce-blocks/pull/10007)
* Make filter by rating preview consistent with default settings

* Remove unneeded classnames
2023-06-29 06:15:52 -07:00
Albert Juhé Lluveras 559f712e35 Avoid usage of __experimentalUseFocusOutside (https://github.com/woocommerce/woocommerce-blocks/pull/10017)
* Avoid usage of __experimentalUseFocusOutside

* Remove unnecessary fix in QuantitySelector

* Add explanatory comment
2023-06-28 14:43:03 +02:00
Thomas Roberts d76fa0a6cc Prevent saved payment methods showing if their main method `canPay` function returns `false` (https://github.com/woocommerce/woocommerce-blocks/pull/9917)
* Change type of payment requirements to string[]

* Add CanMakePaymentArgumentCart type and update CanMakePaymentArgument

* Add getCanMakePaymentArg function to get the arg, allows reusability

* Check saved methods gateway's to see if they can make payment

* Make canMakePaymentArg a dependency of the useMemo

* Remove await from sync function call

* Update variable names to better reflect what they store

* Add tests to ensure saved payment methods don't show if canPay is false

* Rename save-payment-method-options to tsx

* Update saved payment method options to TS

* Fix TS error in saved-payment-method-options test
2023-06-28 01:43:38 -07:00
Daniel Dudzic 254c7e8086 Product Rating: Remove empty markup if no ratings are present (https://github.com/woocommerce/woocommerce-blocks/pull/9822)
* Product Rating: Remove empty markup if no real or mocked ratings are present

* Fix TS errors

* Remove unrelated TS fixes
2023-06-27 19:14:47 +00:00
Patricia Hillebrandt ff04f46ed0 Remove opinionated style for the price list in grouped products from the Add to Cart with Options block. (https://github.com/woocommerce/woocommerce-blocks/pull/9988) 2023-06-27 16:34:06 +02:00
Alexandre Lara 00725124b8 Product Rating block: Fix reviews count not showing on Single Product page (https://github.com/woocommerce/woocommerce-blocks/pull/9995)
* Fix reviews count not showing on Single Product page

* Fix css style
2023-06-27 07:50:48 -03:00
Siddharth Thevaril 09439560b2 move to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/9801)
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2023-06-27 12:48:26 +02:00
Tung Du f364aa41fb Product Image: use WC Core function to render image (https://github.com/woocommerce/woocommerce-blocks/pull/9984) 2023-06-27 17:31:19 +07:00
David Arenas 5a3f6e2e2e Update the Interactivity API files to include latest changes (https://github.com/woocommerce/woocommerce-blocks/pull/9924)
* Update Interactivity API JS files

* Disable TS checks in the Interactivity API for now

* Add new SSR files

* Replace wp_ prefixes with wc_ ones

* Replace wp- prefix with wc-

* Replace guternberg_ prefix with woocommerce_

* Remove file comments from Gutenberg

* Rename files with `wp` prefix

* Fix code to load Interactivity API php files

* Remove TODO comments

* Replace @wordpress with @woocommerce

* Update Webpack configuration

* Fix directive prefix

* Remove interactivity folder from tsconfig exclude

* Add client-side navigation meta tag code

* Remove unneeded blocks.php file

* Fix store tag id

* Register Interactivity API runtime script

* Fix Interactivity API runtime registering

* Remove all files related to directive processing in PHP

* Move json_encode to Store's render method
2023-06-27 12:22:12 +02:00
Albert Juhé Lluveras 9283b6c48b Add back filter blocks frontend scripts (https://github.com/woocommerce/woocommerce-blocks/pull/9954) 2023-06-22 16:09:37 +02:00
Roy Ho aff69cda89 Add/attributes filter count display toggle (https://github.com/woocommerce/woocommerce-blocks/pull/9833)
* Default show product counts to false for filter by attributes block

* Default show product counts to false for filter by stock block

* Default show product counts to false for filter by rating block

* Refactor deprecation

* Refactor deprecation

* Refactor deprecation
2023-06-22 06:38:28 -07:00
Roy Ho a81a8b830d Allow customer account block to center align (https://github.com/woocommerce/woocommerce-blocks/pull/9750)
* Allow customer account block to center align

* Convert to using Flexbox

* Use mixins to DRY

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2023-06-22 05:41:06 -07:00
Hritik Chaudhary 73c7312969 removed proptypes from feedback-promt (https://github.com/woocommerce/woocommerce-blocks/pull/9838) 2023-06-21 18:02:19 +02:00
DAnn2012 2de1129e9d Removed the second keyword (which previously denoted the text domain) from two blocks (https://github.com/woocommerce/woocommerce-blocks/pull/9816)
* Update block.json

* Update block.json
2023-06-21 14:30:57 +02:00
Daniel Dudzic d981395148 Mini Cart: Hide template part from the block inserter. Closes woocommerce/woocommerce-blocks#9753 (https://github.com/woocommerce/woocommerce-blocks/pull/9906) 2023-06-20 22:28:16 +02:00
Luigi Teschio e285dd0879 Products Block: fix grid view with Gutenberg 16 (https://github.com/woocommerce/woocommerce-blocks/pull/9916)
* Revert "fix products block layout on gutenberg 16 (https://github.com/woocommerce/woocommerce-blocks/pull/9886)"

This reverts commit 53665a5bde.

* add post_template_has_support_for_grid_view setting
2023-06-20 14:12:30 +00:00
Albert Juhé Lluveras 99dd12e6c7 Mini-Cart: don't include shipping price (https://github.com/woocommerce/woocommerce-blocks/pull/9914) 2023-06-20 14:41:37 +02:00
Niels Lange 532393fe07 Reference Mini Cart drawer preview dynamically (https://github.com/woocommerce/woocommerce-blocks/pull/9912)
* Reference Mini Cart drawer preview dynamically

* Update assets/js/blocks/mini-cart/edit.tsx

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

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2023-06-20 11:52:53 +02:00
Luigi Teschio 53665a5bde fix products block layout on gutenberg 16 (https://github.com/woocommerce/woocommerce-blocks/pull/9886) 2023-06-20 08:56:55 +02:00
Manish Menaria a6c1a2de52 Add E2E tests for Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9825)
* Add E2E tests for Product Collection Block

This commit does the following changes:

1. Adjusts the .gitignore file to ignore the test-results and artifacts directories under all subdirectories named 'e2e-pw'.

2. Adds new E2E tests for the Product Collection block, specifically testing:
   - If the block renders correctly, including validating the number of product images, titles, prices, and 'Add to Cart' buttons.
   - If the sidebar settings correctly control the number of displayed columns.

3. Implements the 'ProductCollectionPage' class, providing methods to perform actions such as creating a new post, inserting a block, publishing a post, and locating various elements on the page.

4. Adjusts the directory structure for the E2E tests to improve organization and readability.

* Minor improvements

* Update E2E tests for Product Collection block sidebar settings

This commit updates the E2E tests for the sidebar settings of the Product Collection block. The changes include:

1. Refactoring the test assertions to use property accessors instead of method calls for the `ProductCollectionPage` class. This improves readability and consistency.

2. Updating the `ProductCollectionPage` class to initialize locators for editor and frontend elements separately. This allows easier differentiation between editor and frontend locators.

The test file `sidebar-settings.block_theme.spec.ts` has been deleted, as its functionality is now covered by the updated tests in `product-collection.block_theme.spec.ts`.

* Don't update package.json files

* Don't update gitignore file

* Add E2E test for order by control

This commit updates the E2E tests for the sidebar settings and order by control of the Product Collection block. The changes include:

1. Refactoring the test assertions and descriptions for improved readability and clarity.

2. Adding a new test case to verify the correct sorting of products by title in descending order.

3. Updating the `ProductCollectionPage` class to include a new method `setOrderBy()` to set the order by value in the order by control.

4. Adding a new method `waitForProductsToLoad()` in the `ProductCollectionPage` class to wait for the products to load in the block.

These changes ensure that the sidebar settings and order by control are functioning correctly in the Product Collection block.

* Minor improvements

* Add tests for "on sale" filter

* Add tests for Hand picked products filter

This commit updates the E2E tests for the handpicked products filter in the Product Collection block. The changes include:

1. Adding a new test case to verify that products can be filtered based on the selection in the handpicked products option.

2. Adding a new method `addFilter()` to the `ProductCollectionPage` class to select a filter option from the dropdown.

3. Adding a new method `setHandpickedProducts()` to the `ProductCollectionPage` class to set the handpicked products in the block settings.

These changes ensure that the handpicked products filter is functioning correctly in the Product Collection block.

* Verify that on sale filter works on frontend

Adding assertions to verify the count and presence of on-sale products in the frontend after publishing.

* Add tests for Keyword filter

This commit updates the E2E tests for the keyword filter in the Product Collection block. The changes include:

1. Adding assertions to verify that the products are correctly filtered based on the keyword entered.

2. Adding assertions to verify the filtered products in the frontend after publishing.

These changes ensure that the keyword filter in the Product Collection block is functioning correctly.

* Use fixture to setup product collection page

This commit refactors the E2E tests for the Product Collection block to improve test structure and readability. The changes include:

1. Refactoring the test structure using the `test.extend` function to define shared setup and teardown logic.

2. Moving the creation of the `ProductCollectionPage` instance to the shared setup logic.

3. Using the `pageObject` fixture in each test to access the `ProductCollectionPage` instance.

4. Removing duplicate code for creating the `ProductCollectionPage` instance.

These changes enhance the maintainability and readability of the E2E tests for the Product Collection block.
2023-06-20 10:56:12 +05:30
Thomas Roberts 3ebcd7f601 Add `CartEventContext` and dispatch events when pressing proceed to checkout button (https://github.com/woocommerce/woocommerce-blocks/pull/7809)
* Add CartEventsContext with onProceedToCheckout event

* Wrap Cart in CartEventsProvider

* Dispatch onProceedToCheckout event when button is pressed

* Update type of children on CartEventsProvider

* Add test for ProceedToCheckout block

* Add tests for CartEventProvider

* Remove superfluous div

* Fix incorrect nesting after rebase

* Wrap mini cart in CartEventsProvider

* Dispatch onProceedToCheckout event when clicking button in mini cart

* Add tests for mini cart onProceedToCheckout emitter

* Make observer fail so navigation isn't attempted

* Prevent console error on navigation

* Try preventing navigation in unit tests

* Try preventing navigation in unit tests

* Try preventing navigation in unit tests

* Try preventing navigation in unit tests

* Try preventing navigation in unit tests

* Try preventing navigation in unit tests

* Try preventing navigation in unit tests
2023-06-19 08:44:37 -07:00
Luigi Teschio bc6dc106ab Mini Cart Block: show the total price, including tax, according to the option (https://github.com/woocommerce/woocommerce-blocks/pull/9878)
* Mini Cart Block: show the total price, including tax, according to the option

* Fix tests in PR 9878 (https://github.com/woocommerce/woocommerce-blocks/pull/9880)

* add unit test

---------

Co-authored-by: Karol Manijak <karol.manijak@automattic.com>
2023-06-19 17:14:35 +02:00
Alexandre Lara 48696c6727 Fix PropType warning and error when adding All Reviews block to Editor (https://github.com/woocommerce/woocommerce-blocks/pull/9869) 2023-06-19 15:39:54 +05:30
Daniel Dudzic de425c9efb Mini Cart: Add Price, Icon and Product Count color settings (https://github.com/woocommerce/woocommerce-blocks/pull/9647)
* Mini Cart: Update color settings to include Price, Icon and Product Count.

* Fix color settings in the editor.

* Mini Cart: Add color settings for the Price, Icon and Product Count.

* Mini Cart: Remove unnecessary color settings.

* Remove unnecessary code comments.

* Update color settings labels.

* Add price color to the tax label.

* Add missing docs comment

* Fix TS errors

* Fix TS error

* Adjust type declaration

* Add TS error comments

* Change @ts-to-do to @ts-expect-error

---------

Co-authored-by: tjcafferkey <tjcafferkey@gmail.com>
2023-06-19 11:42:37 +02:00
Alexandre Lara 8a6e1cdb76 Adjust PropTypes definition and fix block error when store has no reviews (https://github.com/woocommerce/woocommerce-blocks/pull/9868) 2023-06-19 12:37:57 +05:30
Manish Menaria eec844f447 Add Display Settings Toolbar to the Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9747)
This commit introduces the 'Display Settings' toolbar for the 'Product Collection' block in the Gutenberg editor.
- A new component 'DisplaySettingsToolbar' is added in 'display-settings-toolbar.tsx'. It includes controls for changing the number of items per page, the offset, and the maximum number of pages to show in the block. The toolbar only shows up when the 'inherit' query attribute is set to false.
- The 'DisplaySettingsToolbar' component is then integrated into the main 'edit.tsx' file through 'ToolbarControls'.
- Styles have also been added to 'editor.scss' to ensure the popover content of the display settings toolbar has an appropriate minimum width.
2023-06-19 10:37:05 +05:30
Brian 8dacf20cef Update Keywords for Customer Account Block in block.json (https://github.com/woocommerce/woocommerce-blocks/pull/9815)
Co-authored-by: Karol Manijak <karol.manijak@automattic.com>
Co-authored-by: Niels Lange <info@nielslange.de>
2023-06-18 19:42:08 +02:00
Alexandre Lara c5e8cc2256 Refactor: Convert with-transform-single-select-to-multiple-select.js to with-transform-single-select-to-multiple-select.tsx and replace propTypes with TypeScript definitions (https://github.com/woocommerce/woocommerce-blocks/pull/9798)
* Transform file from Javascript to Typescript

* Add SelectOption type and default value to selected prop
2023-06-16 16:24:12 -03:00
Alexandre Lara e5dd772c94 Convert Product On Sale block file from JS to TS (https://github.com/woocommerce/woocommerce-blocks/pull/9834) 2023-06-16 13:43:54 -03:00
Alexandre Lara ba47d5dc40 Refactor: Convert All Products block file from Javascript to Typescript and replace propTypes with TypeScript definitions (https://github.com/woocommerce/woocommerce-blocks/pull/9802)
* Convert All Products block from Javascript to Typescript

* Replace BlockAttributes type with local interface
2023-06-16 12:48:47 -03:00
Mike Jolley ee4e0fac18 Keep change button visible even if prefersCollection is true (https://github.com/woocommerce/woocommerce-blocks/pull/9809) 2023-06-16 12:21:19 +01:00
Alba Rincón 8a67ae2f80 Convert `edit.js` to `edit.tsx` and replace `propTypes` with TypeScript definitions (https://github.com/woocommerce/woocommerce-blocks/pull/9823)
* Remove proptypes

* Refactor after review
2023-06-16 09:30:54 +02:00
Alba Rincón 2460a04abd Remove propTypes (https://github.com/woocommerce/woocommerce-blocks/pull/9824) 2023-06-15 16:21:02 +02:00
Daniel Dudzic cc6a9eab48 Mini Cart: Fix icon render (https://github.com/woocommerce/woocommerce-blocks/pull/9828) 2023-06-14 18:42:56 +02:00
Roy Ho 31138031f6 Convert grid-layout-control to use Typescript (https://github.com/woocommerce/woocommerce-blocks/pull/9811) 2023-06-14 07:07:28 -07:00
Roy Ho 6270c39de8 Convert inner-block-layout-context to typescript (https://github.com/woocommerce/woocommerce-blocks/pull/9799)
* Convert inner-block-layout-context to typescript

* Add isLoading context
2023-06-14 06:36:39 -07:00
Hritik Chaudhary 563b439f25 Migrate Block Title component to TypeScript (https://github.com/woocommerce/woocommerce-blocks/pull/9712)
Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Alba Rincón <albarin@users.noreply.github.com>
Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2023-06-13 16:30:57 +05:30
Daniel Dudzic 0a23aca517 Mini Cart: Add an alternative icon setting (https://github.com/woocommerce/woocommerce-blocks/pull/9570)
* Mini Cart: Add an icon setting with 3 alternative icon options. Closes woocommerce/woocommerce-blocks#8556.

* Mini Cart: Fix Mini-cart icons in the toggle setting.

* Minor type fixes.

* Clean up type definitions.

* Move alt icon logic to a separate function.

* Fix cart icons sizes

* Add a negative margin to the mini cart icon
2023-06-12 22:23:52 +02:00
Alexandre Lara 06a9b274c1 WooCommerce Classic Template block: Fix error on clearing customizations on Woo Templates (https://github.com/woocommerce/woocommerce-blocks/pull/9759)
* Fix Classic Template block error on clearing customizations on template

* Add link to issue in JS Doc
2023-06-12 13:55:20 -03:00
Hritik Chaudhary e17221ac79 Removed proptypes and js to ts conversion for Product Categories (https://github.com/woocommerce/woocommerce-blocks/pull/9755)
* Removed proptypes from product-categories

* deleted js file
2023-06-12 18:52:21 +02:00
Albert Juhé Lluveras a89a229b37 Prevent Mini-Cart table to show horizontal scrollbar (https://github.com/woocommerce/woocommerce-blocks/pull/9676) 2023-06-09 10:48:23 +02:00
Roy Ho 8e94500136 Use correct SVG for RTL display (https://github.com/woocommerce/woocommerce-blocks/pull/9756) 2023-06-08 11:29:34 -07:00
Roy Ho bb60a90f5c Convert product-orderby-control to use typescript (https://github.com/woocommerce/woocommerce-blocks/pull/9751) 2023-06-08 05:56:57 -07:00
Manish Menaria d91385e3b9 Product Collection: Hand picked products control in sidebar settings (https://github.com/woocommerce/woocommerce-blocks/pull/9733)
* Add support for hand-picked products in Product Collection block

This commit introduces the ability to manually select specific products in the Product Collection block.

Changes include:
- Added `woocommerceHandPickedProducts` to the `ProductCollectionQuery` and `DEFAULT_FILTERS` in `constants.ts`.
- Created a new control file `hand-picked-products-control.tsx` which introduces a token field where the user can search for and select specific products.
- Included `HandPickedProductsControl` in the Product Collection block's inspector controls in `index.tsx`.
- Updated `ProductCollectionQuery` in `types.ts` to accommodate handpicked products.
- Updated the PHP `ProductCollection` class to handle the hand-picked products query parameters.

These changes allow users to hand-pick products to be displayed in the Product Collection block. This allows for greater customization of the products shown in the block.

* Enhance handling of hand-picked products

- A Set data structure is now used to store 'newHandPickedProducts' instead of an Array, which will help prevent duplicate entries.
- Additionally, the suggestions for products to be hand-picked now excludes already selected products, enhancing the user experience by avoiding redundancy in the suggestions list.
- Lastly, the function name 'displayTransform' has been changed to 'transformTokenIntoProductName' to more accurately reflect its purpose, which is to transform a token into a product name.

* Update import & export of HandPickedProductsControl
2023-06-08 06:03:01 +00:00
Manish Menaria 1814bc95e5 Product Collection: Add author filter in sidebar settings (https://github.com/woocommerce/woocommerce-blocks/pull/9736)
* Add author filter to ProductCollection block

This commit adds an author filter to the ProductCollection block in WooCommerce Blocks.

- A new file, `author-control.tsx`, has been created inside the `inspector-controls` directory of the `product-collection` block. This file contains the React component for the author filter, which fetches the list of authors from the WordPress database using `useEntityRecords`. The filter provides an interface for selecting authors whose products should be displayed in the ProductCollection block.

- The author filter is added to the main component of the `inspector-controls` in `index.tsx`.

- In `ProductCollection.php`, the 'author' parameter is now included in the product query. This allows products from a specific author to be displayed in the ProductCollection block, depending on the user's selection in the Gutenberg editor.

This addition enhances the functionality of the ProductCollection block by allowing site administrators to create more customized and targeted displays of products.

* Update error handling

* Refactor 'Author' interfaces and fix offset calculation

This commit refactors the 'Author' interfaces in the 'author-control.tsx' file. The interface 'AuthorsMapping' has been removed and its properties have been merged into 'AuthorsInfo' for simplicity and maintainability.

In the PHP file 'ProductCollection.php', the offset calculation logic has been improved to handle pagination correctly. Now, the offset is calculated as '(per_page * (page - 1)) + offset', which correctly accounts for both the page number and the offset when determining the starting point for the product query.
2023-06-08 11:10:05 +05:30
Alba Rincón 06a0ab94ce Render the single product title as an h1 (https://github.com/woocommerce/woocommerce-blocks/pull/9748) 2023-06-07 15:47:56 +02:00
Roy Ho 70e3533467 Prevent showing edit product details link when in multiple products context (https://github.com/woocommerce/woocommerce-blocks/pull/9741) 2023-06-07 05:43:04 -07:00
Hritik Chaudhary af09b0c9b8 Removed proptypes from grid-content-control (https://github.com/woocommerce/woocommerce-blocks/pull/9713)
Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Alba Rincón <albarin@users.noreply.github.com>
2023-06-07 13:22:50 +02:00
Thomas Roberts aa1fe5c308 Add text limit to payment method descriptions in the page editor (https://github.com/woocommerce/woocommerce-blocks/pull/9708)
* Convert summary/utils to TS

* Add @wordpress/wordcount type defs

* Move trimWords, trimCharacters, remoteTags & appendMoreText to own file

* Add tests for trimWords and related functions

* Trim payment method description if it is longer than 30 words
2023-06-07 02:29:15 -07:00
Roy Ho dc6fa4a8c9 Fix value without onchaning warning (https://github.com/woocommerce/woocommerce-blocks/pull/9727) 2023-06-06 06:04:40 -07:00
Hritik Chaudhary 93119e9de6 Remove propTypes definitions from All Reviews block (https://github.com/woocommerce/woocommerce-blocks/pull/9631)
* converted all-reviews block to tsx and removed proptypes

* Update assets/js/blocks/reviews/all-reviews/index.tsx

Co-authored-by: Niels Lange <niels.lange@a8c.com>

* Update assets/js/blocks/reviews/all-reviews/edit.tsx

Co-authored-by: Niels Lange <niels.lange@a8c.com>

* Update assets/js/blocks/reviews/all-reviews/block.tsx

Co-authored-by: Niels Lange <niels.lange@a8c.com>

---------

Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Niels Lange <niels.lange@a8c.com>
2023-06-06 14:46:49 +02:00
Luigi Teschio a27787fb17 Product rating: improve preview style when the product doesn't have rating (https://github.com/woocommerce/woocommerce-blocks/pull/9684)
* product rating: improve preview style when no rating is visible

* fix class naming

* fix cutted star

* change variable

* fix cut border
2023-06-05 17:27:55 +02:00
Alexandre Lara 27275b913e Refactor: Add useIsDescendentOfSingleProductTemplate hook (https://github.com/woocommerce/woocommerce-blocks/pull/9657)
* Add useIsDescendentOfSingleProductTemplate hook

* Replace logic with useIsDescendentOfSingleProductTemplate hook
2023-06-05 12:13:28 -03:00
Tom Cafferkey 0f59e3f698 Checkout block: Full width Place Order button when Return To Cart link is disabled. (https://github.com/woocommerce/woocommerce-blocks/pull/9721)
* When the Return To Cart link is disabled, make Place Order button full width

* Optional prop fullWidth has undefined type added to it
2023-06-05 15:31:32 +01:00
Roy Ho 5a5d5d315a Make mini cart icon RTL on RTL sites in editor (https://github.com/woocommerce/woocommerce-blocks/pull/9707)
* Make mini cart icon RTL on RTL sites in editor

* Use BEM convention
2023-06-05 06:36:57 -07:00
Luigi Teschio 57c5d4a89a Product Price: remove underline on sale price (https://github.com/woocommerce/woocommerce-blocks/pull/9702) 2023-06-05 07:56:25 +00:00
Karol Manijak 37d4823680 Product Collection - Add Inherit query from template control (https://github.com/woocommerce/woocommerce-blocks/pull/9485)
* Add columns control to product collection block editor settings

- `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function.
- A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'.
- The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties.

* Refactor: Simplify Fallback Return in ColumnsControl Component

This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React.

* Feature: Add 'Order By' Control to Product Collection Inspector

This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse.

* Add more options to OrderBy type

* Add Inherit global query control to the Product Collection

* Add orderby handling on frontend & editor

The main changes include:
1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block.
2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block.
3. Added methods to manage query parameters for both frontend rendering and the Editor.
4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values.
5. Defined a function to build the query based on block attributes, filters, and global WP_Query.
6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively.

These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections.

* Fix the condition to show query controls (they shoul appear if query is NOT inherited)

* Make Product Collection inheirt global query in product archive templates by default

* Add 'on sale' filter and enhance settings management in product collection block

This commit introduces several changes to the product collection block.
- First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale.
- It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings.
- It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control.
- A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters.
- The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes.
- Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter.

This should enhance the flexibility and user-friendliness of the product collection block.

* Revert "Make Product Collection inheirt global query in product archive templates by default"

This reverts commit d257e8bdb014742c40ef069110f6a2a35148fb7a.

* Updated 'inherit' behavior in the Product Collection block

This commit updates the 'inherit' behavior in the Product Collection block and its associated controls.

Changes include:
- Removed the 'inherit' attribute from the block's JSON definition
- Defined an array of 'archive product templates' which includes the WooCommerce product archive, taxonomy, attribute, and search results templates.
- Set the initial 'inherit' value based on the current template ID when the Product Collection block is first added to the page.
- Restored the query object value when toggling 'inherit' off.
- Conditionally rendered the InheritQueryControl based on the current editor being the site editor.

* Add stock status filter to WooCommerce product collection block

This commit introduces a stock status filter to the WooCommerce product collection block.

The changes include:
1. Added the ability to filter products based on their stock status within the 'product-collection' block. A new stock status control is created within the inspector-controls of the block.
2. A new 'get_stock_status_query' function is introduced in 'ProductCollection.php' which returns a query for products depending on their stock status.

Please note that the stock status filter will only appear in the experimental build for now.

* Refactor Stock Status control of Product Collection block

This commit refactors the Stock Status control. The changes aim to improve the code organization and make the behavior of the component more explicit.

The key modifications are:
1. Moved stock status related constants and functions from `inspector-controls/utils.tsx` to `inspector-controls/constants.ts`. This is done to ensure that all constants and similar utility functions are organized in one place.
2. Updated `product-collection/index.tsx` to import `getDefaultStockStatuses` from `inspector-controls/constants` instead of `inspector-controls/utils`.
3. Updated `stock-status-control.tsx` to determine whether the stock status has value or not by comparing with the default stock statuses using `fastDeepEqual`. If the stock status control is deselected, it resets the stock status to the default statuses.

These changes do not introduce any new functionalities, but improve the readability and maintainability of the code.

* Add keyword search control to Product Collection block

This commit introduces a keyword search functionality to the Product Collection block. The update is aimed to provide users with more flexibility and precision in product collection queries.

Key changes:
1. Introduced a new file `keyword-control.tsx` that creates a Keyword Control component. This component includes a TextControl field that allows inputting a search keyword. The keyword search is debounced to prevent unnecessary queries during input and updates the block's attributes accordingly.
2. Modified `inspector-controls/index.tsx` to include the KeywordControl in the ToolsPanel for the block's filters.
3. Adjusted `ProductCollection.php` to include the keyword search in the product query array.

With these changes, users can now search for products by keyword in the Product Collection block.

* Add product attributes filter control to ProductCollection block

- This commit introduces the ability to filter products by attributes in ProductCollection block.
- A new `woocommerceAttributes` key was added to the `block.json` file and the `ProductCollectionQuery` type. Also, a new file `attributes-control.tsx` was created, providing the UI component for the attribute filter control in the editor.
- In addition, updates were made to the `ProductCollection.php` file in the backend to support filtering products by attributes, and the tax query was updated to include attribute queries.
- Lastly, the `ProductCollectionInspectorControls` was updated to include the `AttributesControl` component, thus enabling users to filter products by attributes in the block editor."`

* remove unused import of getDefaultStockStatuses

* Delete a duplicate file

* Remove console log

* Add taxonomies control to Product collection block

The primary changes include:
1. `taxQuery` field in the `ProductCollectionAttributes` was changed from a string to an object in `assets/js/blocks/product-collection/types.ts` and `assets/js/blocks/product-collection/constants.ts`, accommodating the ability to query products by taxonomy terms.

2. `assets/js/blocks/product-collection/inspector-controls/utils.tsx` was moved to `assets/js/blocks/product-collection/utils.tsx` to make it available for broader use.

3. New component `TaxonomyControls` was created in `assets/js/blocks/product-collection/inspector-controls/taxonomy-controls.tsx`, which is included in `assets/js/blocks/product-collection/inspector-controls/index.tsx`. This new control allows users to filter products in the block by their taxonomy terms.

4. Updated the block's inspector controls in `assets/js/blocks/product-collection/inspector-controls/index.tsx` to use the new `TaxonomyControls` component.

Please note that the TaxonomyControls component uses experimental features of WordPress's FormTokenField. As a result, a comment has been added to disable eslint warnings regarding the use of experimental APIs.

* Address PR feedback & other improvements

1. Added `woocommerceAttributes` to `DEFAULT_FILTERS` in the `product-collection/constants.ts` file to fix `reset all` button issue.

2. Refactored `attributes-control.tsx` to make it more maintainable:
   - The constant `EDIT_ATTRIBUTES_URL` now uses `ADMIN_URL` from `@woocommerce/settings` for a more dynamic URL generation.
   - The interface `Props` has been renamed to `AttributesControlProps` for more explicit naming.
   - Removed the usage of `useState` and `useEffect` for selected attributes. Instead, `selectedAttributes` is now directly derived from `woocommerceAttributes`.
   - The CSS class `woocommerce-product-query-panel__external-link` was renamed to `wc-product-collection-panel__external-link`

3. Deleted the `product-collection/inspector-controls/constants.ts` file which was no longer necessary due to changes in product collection implementation.

These changes contribute to codebase quality, improving readability and maintainability.

* Address PR review comments

This commit involves a significant refactoring of the default product query inside the 'product-collection/constants.ts' file. A new constant `DEFAULT_QUERY` has been defined and used to replace the previously hard-coded default query settings. This refactoring aids in code readability and future modifications.

Changes also include adjustments in 'product-collection/inspector-controls' to enhance UI/UX. A new SCSS file 'editor.scss' has been created for custom styles related to the editor.

Additions include:
- Adding a class name `product-collection-inspector-toolspanel__filters` to ToolsPanel for additional styling.
- The experimental property `__experimentalShowHowTo` is set to false for `FormTokenField` and `StockStatusControl`, to hide some additional information.

In 'product-collection/inspector-controls/taxonomy-controls.tsx', the classname `product-collection-inspector__taxonomy-control` is added for improved CSS targeting.

* Add wc-block-editor prefix to className

* Make improvements to 'inherit' functionality in Product collection block.

Key changes are:

1. 'inherit' in 'ProductCollectionAttributes' within 'constants.ts' has been changed from 'false' to 'null'. This accommodates for situations when Product collection block is first added to the page.

2. Various improvements in 'index.tsx' file which include more robust null checking for the 'query' object, simplifying the way 'woocommerceAttributes' is obtained, and passing 'setQueryAttributeBind' and 'inherit' to the 'InheritQueryControl' component.

3. In 'inherit-query-control.tsx', 'InheritQueryControl' component has been refactored to use '__experimentalToolsPanelItem' from '@wordpress/components' instead of 'ToggleControl'. This adds more flexibility to the control.

4. Changes in 'ProductCollectionAttributes' and 'ProductCollectionQuery' types in 'types.ts'. The

* Improve product collection query inheritance and fix URL typo

This commit addresses two primary areas:
1. Fixed a typo in the URL used as a reference in the use-previous.ts file. The URL was incorrectly case-sensitive, which has been corrected.

2. The product-collection block in the JavaScript files has been refactored for better handling of query inheritance:

   - Changed the 'inherit' value from false to null in the DEFAULT_QUERY constant to handle initial state more accurately.

   - In product-collection/inspector-controls, implemented conditional rendering for Filters and Query Controls based on 'displayQueryControls'. Also, improved the 'InheritQueryControl' by using the 'usePrevious' hook to maintain the state before enabling the inheritance.

   - In inherit-query-control, enhanced the control to toggle the query inheritance. It now considers the 'inherit' state from the query object and keeps track of the query object state before enabling inheritance. If the inheritance is toggled off, it reverts the query to the previous state before inheritance was enabled.

* Minor improvemnets

* Add wc-block-editor- prefix with classNames

* Handle duplicate taxonomy names in Taxonomy controls

the taxonomy controls have been enhanced in the following ways:
1. Modified the BASE_QUERY object to include 'slug' in the '_fields' property. This will ensure that the 'slug' of the taxonomy term is fetched along with its 'id' and 'name'.

2. Added a 'slug' property to the Term type to store the 'slug' of each term.

3. Updated the useEffect hook inside the TaxonomyItem function to generate suggestions based on search results. The suggestions now include the 'slug' of a term if the term's name is not unique. This change will help users distinguish between terms with the same name but different slugs.

* Remove isset() in if condition as it's unnecessary

* Refactor TaxonomyItem component for better readability

Following changes were made:

1. The useSelect hooks which were being used to fetch existing terms and search results have been moved into their own custom hooks named 'useExistingTerms' and 'useSearchResults' respectively. This simplifies the TaxonomyItem function's body and makes the hooks' purposes clearer.

2. The comments and props destructuring for the TaxonomyItem function have been moved up to make it easier to understand the function's purpose and the props it receives.

3. This refactor does not introduce any changes in functionality. It only changes how the code is organized and presented, which will make future development easier.

* Handling for duplicate term names & other improvements

This commit enhances the `TaxonomyControls` component within `product-collection` block by adding memoization and improving term uniqueness handling.

Changes:

1. Imported `useMemo` from `@wordpress/element` for memoizing certain results.

2. `getTermIdByTermValue` function has been modified to use a `termIdToNameMap` (term ids as keys and term names as values). This provides a more efficient and direct mapping for term search.

3. Introduced `useTermIdToNameMap` function, which returns a `Map` where term ids are keys and term names are values. It handles duplicate term names by appending the term slug to the name, ensuring unique term names.

4. Updated the `useExistingTerms` and `useSearchResults` to include `taxonomy` in their dependency arrays for `useSelect` hook. This will force re-computation when `taxonomy` changes.

5. Changed `TaxonomyItem` from a function declaration to a const arrow function, consistent with the rest of the codebase.

6. Updated `onTermsChange` function in `TaxonomyItem` to accommodate the changes in `getTermIdByTermValue` and the introduction of `termIdToNameMap`.

7. Replaced `Set` with a standard array for storing new term IDs in `onTermsChange`. The `Set` was unnecessary as term IDs are unique by default.

8. Updated `TaxonomyItem`'s effects and rendering to work with `termIdToNameMap`, ensuring the displayed term names are unique.

This update will result in more efficient term search and handling, and it will solve issues related to duplicate term names.

* Restructure taxonomy controls in product collection block

This commit restructures the taxonomy controls in the product collection block for improved clarity and maintainability.
- The file `taxonomy-controls.tsx` has been deleted, and its functionality has been divided into two new files: `index.tsx` and `taxonomy-item.tsx`.

- The `index.tsx` file contains the main TaxonomyControls component, which is responsible for displaying taxonomy-related options in the block's inspector controls. It includes a custom hook `useTaxonomies` that fetches and returns taxonomies associated with product post type.

- The `taxonomy-item.tsx` file, on the other hand, contains a TaxonomyItem component that handles the rendering of individual taxonomy items. It also contains some utility functions for mapping term names and ids and fetching terms based on the search query.

This refactor aims to improve code readability and separation of concerns, thus making future changes and maintenance easier.

* Fix case insensitive search support for FormTokenField

This change enhances the search functionality of the FormTokenField by introducing support for case insensitive search. This has been achieved by adding a lower-case version of the term name to the 'termNameToIdMap'.

This is an important enhancement as it will make the search process more user-friendly and resilient to different casing inputs. Users will now be able to find the desired taxonomy term regardless of their input's case.

* Refactor getTermIdByTermValue function and update newSuggestions mapping

This commit does a couple of important things:
1. Reorders the definition of constants in `TaxonomyItemProps` for clarity.
2. Refactors the `getTermIdByTermValue` function. Instead of checking for an exact term name match in a convoluted manner, it now directly tries to fetch the `id` from the `searchTerm` if it is an object. If the `searchTerm` is not an object, the function tries to match it against the `termNameToIdMap` in both normal and lowercase forms. This simplification makes the function more readable and concise.
3. Updates the `newSuggestions` mapping in the `TaxonomyItem` component. It now has a fallback to `searchResult.name` if a term's name is not found in `termIdToNameMap`. This change ensures that even if the term's name is not in the map for some reason, we can still display a suggestion using the original name of the term.

* Optimize term fetching and initial search state in TaxonomyItem

This commit introduces a couple of improvements to the TaxonomyItem component.

1. The initial state of the 'search' state variable has been updated to 'undefined'. This change helps prevent unnecessary initial fetching of terms when the search input is empty.

2. Term fetching logic has been optimized to only enable term fetching when necessary:
   a) Fetching based on the search query is only enabled when 'search' is not 'undefined'.
   b) Fetching existing terms is only enabled when there are term IDs.

3. The block of code responsible for fetching existing terms and setting the current value has been moved upwards. This reordering of code does not change the functionality, but it groups together similar pieces of code, enhancing readability and maintainability.

These optimizations make the component more efficient by reducing unnecessary requests and computations, and they improve the code organization.

* Address PR comments and other improvements

This commit makes several changes:
1. The useEffect that sets the default attributes was moved and modified. This now includes a `query` attribute that utilizes the imported function `getDefaultValueOfInheritQueryFromTemplate`.
2. An early return was added in `edit.tsx` to prevent rendering until default attributes are set.
3. In `columns-control.tsx`, the early return was removed and a label was added to the `RangeControl` component.
4. In `inherit-query-control.tsx`, logic related to `inherit` value initial setting was refactored using a `useMemo` hook with `getDefaultValueOfInheritQueryFromTemplate` function. This logic was moved to a separate utility function in `utils`.
5. The `query` attribute is no longer optional in `types.ts`.
6. A new utility function `getDefaultValueOfInheritQueryFromTemplate` was created in `utils.tsx` to encapsulate the logic of deciding the default value of `inherit` query attribute based on the current template.

These changes aim to improve code clarity and maintainability.

* Add  with types import statement

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
2023-06-05 06:09:11 +00:00
Alexandre Lara 5f307e1097 Add to Cart Form block: Prevent notice from appearing after clicking on Add to Cart button inside Single Product block (https://github.com/woocommerce/woocommerce-blocks/pull/9685)
* Add isDescendentOfSingleProductBlock attribute to Add to Cart Form block

* Prevent notice from appearing when Add to Cart button is clicked

When the Add to Cart Form is added inside the Single Product Block, we
have to prevent the notice from appearing when the Add to Cart button is
clicked.

* Fix PHP CS errors

* Fix PHP CS errors

* Fix PHP CS errors

* Fix PHP CS errors

* Fix PHP CS errors

* Fix PHP CS errors

* Add phpcs:ignore WordPress.Security.NonceVerification.Recommended

* Fix Processing form data without nonce verification.

* PHP Ignore

* Improve doc comments

* Improve name for add_to_cart_message_html_filter hook

* Replace equal operator with identity operator in the conditional statement
2023-06-02 11:29:22 -03:00
Manish Menaria 9426102565 Product Collection: Add Taxonomy filters to sidebar settings (https://github.com/woocommerce/woocommerce-blocks/pull/9634)
* Add columns control to product collection block editor settings

- `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function.
- A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'.
- The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties.

* Refactor: Simplify Fallback Return in ColumnsControl Component

This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React.

* Feature: Add 'Order By' Control to Product Collection Inspector

This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse.

* Add more options to OrderBy type

* Add orderby handling on frontend & editor

The main changes include:
1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block.
2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block.
3. Added methods to manage query parameters for both frontend rendering and the Editor.
4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values.
5. Defined a function to build the query based on block attributes, filters, and global WP_Query.
6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively.

These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections.

* Add 'on sale' filter and enhance settings management in product collection block

This commit introduces several changes to the product collection block.
- First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale.
- It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings.
- It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control.
- A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters.
- The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes.
- Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter.

This should enhance the flexibility and user-friendliness of the product collection block.

* Add stock status filter to WooCommerce product collection block

This commit introduces a stock status filter to the WooCommerce product collection block.

The changes include:
1. Added the ability to filter products based on their stock status within the 'product-collection' block. A new stock status control is created within the inspector-controls of the block.
2. A new 'get_stock_status_query' function is introduced in 'ProductCollection.php' which returns a query for products depending on their stock status.

Please note that the stock status filter will only appear in the experimental build for now.

* Refactor Stock Status control of Product Collection block

This commit refactors the Stock Status control. The changes aim to improve the code organization and make the behavior of the component more explicit.

The key modifications are:
1. Moved stock status related constants and functions from `inspector-controls/utils.tsx` to `inspector-controls/constants.ts`. This is done to ensure that all constants and similar utility functions are organized in one place.
2. Updated `product-collection/index.tsx` to import `getDefaultStockStatuses` from `inspector-controls/constants` instead of `inspector-controls/utils`.
3. Updated `stock-status-control.tsx` to determine whether the stock status has value or not by comparing with the default stock statuses using `fastDeepEqual`. If the stock status control is deselected, it resets the stock status to the default statuses.

These changes do not introduce any new functionalities, but improve the readability and maintainability of the code.

* Add keyword search control to Product Collection block

This commit introduces a keyword search functionality to the Product Collection block. The update is aimed to provide users with more flexibility and precision in product collection queries.

Key changes:
1. Introduced a new file `keyword-control.tsx` that creates a Keyword Control component. This component includes a TextControl field that allows inputting a search keyword. The keyword search is debounced to prevent unnecessary queries during input and updates the block's attributes accordingly.
2. Modified `inspector-controls/index.tsx` to include the KeywordControl in the ToolsPanel for the block's filters.
3. Adjusted `ProductCollection.php` to include the keyword search in the product query array.

With these changes, users can now search for products by keyword in the Product Collection block.

* Add product attributes filter control to ProductCollection block

- This commit introduces the ability to filter products by attributes in ProductCollection block.
- A new `woocommerceAttributes` key was added to the `block.json` file and the `ProductCollectionQuery` type. Also, a new file `attributes-control.tsx` was created, providing the UI component for the attribute filter control in the editor.
- In addition, updates were made to the `ProductCollection.php` file in the backend to support filtering products by attributes, and the tax query was updated to include attribute queries.
- Lastly, the `ProductCollectionInspectorControls` was updated to include the `AttributesControl` component, thus enabling users to filter products by attributes in the block editor."`

* remove unused import of getDefaultStockStatuses

* Delete a duplicate file

* Remove console log

* Add taxonomies control to Product collection block

The primary changes include:
1. `taxQuery` field in the `ProductCollectionAttributes` was changed from a string to an object in `assets/js/blocks/product-collection/types.ts` and `assets/js/blocks/product-collection/constants.ts`, accommodating the ability to query products by taxonomy terms.

2. `assets/js/blocks/product-collection/inspector-controls/utils.tsx` was moved to `assets/js/blocks/product-collection/utils.tsx` to make it available for broader use.

3. New component `TaxonomyControls` was created in `assets/js/blocks/product-collection/inspector-controls/taxonomy-controls.tsx`, which is included in `assets/js/blocks/product-collection/inspector-controls/index.tsx`. This new control allows users to filter products in the block by their taxonomy terms.

4. Updated the block's inspector controls in `assets/js/blocks/product-collection/inspector-controls/index.tsx` to use the new `TaxonomyControls` component.

Please note that the TaxonomyControls component uses experimental features of WordPress's FormTokenField. As a result, a comment has been added to disable eslint warnings regarding the use of experimental APIs.

* Address PR feedback & other improvements

1. Added `woocommerceAttributes` to `DEFAULT_FILTERS` in the `product-collection/constants.ts` file to fix `reset all` button issue.

2. Refactored `attributes-control.tsx` to make it more maintainable:
   - The constant `EDIT_ATTRIBUTES_URL` now uses `ADMIN_URL` from `@woocommerce/settings` for a more dynamic URL generation.
   - The interface `Props` has been renamed to `AttributesControlProps` for more explicit naming.
   - Removed the usage of `useState` and `useEffect` for selected attributes. Instead, `selectedAttributes` is now directly derived from `woocommerceAttributes`.
   - The CSS class `woocommerce-product-query-panel__external-link` was renamed to `wc-product-collection-panel__external-link`

3. Deleted the `product-collection/inspector-controls/constants.ts` file which was no longer necessary due to changes in product collection implementation.

These changes contribute to codebase quality, improving readability and maintainability.

* Address PR review comments

This commit involves a significant refactoring of the default product query inside the 'product-collection/constants.ts' file. A new constant `DEFAULT_QUERY` has been defined and used to replace the previously hard-coded default query settings. This refactoring aids in code readability and future modifications.

Changes also include adjustments in 'product-collection/inspector-controls' to enhance UI/UX. A new SCSS file 'editor.scss' has been created for custom styles related to the editor.

Additions include:
- Adding a class name `product-collection-inspector-toolspanel__filters` to ToolsPanel for additional styling.
- The experimental property `__experimentalShowHowTo` is set to false for `FormTokenField` and `StockStatusControl`, to hide some additional information.

In 'product-collection/inspector-controls/taxonomy-controls.tsx', the classname `product-collection-inspector__taxonomy-control` is added for improved CSS targeting.

* Add wc-block-editor prefix to className

* Add wc-block-editor- prefix with classNames

* Handle duplicate taxonomy names in Taxonomy controls

the taxonomy controls have been enhanced in the following ways:
1. Modified the BASE_QUERY object to include 'slug' in the '_fields' property. This will ensure that the 'slug' of the taxonomy term is fetched along with its 'id' and 'name'.

2. Added a 'slug' property to the Term type to store the 'slug' of each term.

3. Updated the useEffect hook inside the TaxonomyItem function to generate suggestions based on search results. The suggestions now include the 'slug' of a term if the term's name is not unique. This change will help users distinguish between terms with the same name but different slugs.

* Remove isset() in if condition as it's unnecessary

* Refactor TaxonomyItem component for better readability

Following changes were made:

1. The useSelect hooks which were being used to fetch existing terms and search results have been moved into their own custom hooks named 'useExistingTerms' and 'useSearchResults' respectively. This simplifies the TaxonomyItem function's body and makes the hooks' purposes clearer.

2. The comments and props destructuring for the TaxonomyItem function have been moved up to make it easier to understand the function's purpose and the props it receives.

3. This refactor does not introduce any changes in functionality. It only changes how the code is organized and presented, which will make future development easier.

* Handling for duplicate term names & other improvements

This commit enhances the `TaxonomyControls` component within `product-collection` block by adding memoization and improving term uniqueness handling.

Changes:

1. Imported `useMemo` from `@wordpress/element` for memoizing certain results.

2. `getTermIdByTermValue` function has been modified to use a `termIdToNameMap` (term ids as keys and term names as values). This provides a more efficient and direct mapping for term search.

3. Introduced `useTermIdToNameMap` function, which returns a `Map` where term ids are keys and term names are values. It handles duplicate term names by appending the term slug to the name, ensuring unique term names.

4. Updated the `useExistingTerms` and `useSearchResults` to include `taxonomy` in their dependency arrays for `useSelect` hook. This will force re-computation when `taxonomy` changes.

5. Changed `TaxonomyItem` from a function declaration to a const arrow function, consistent with the rest of the codebase.

6. Updated `onTermsChange` function in `TaxonomyItem` to accommodate the changes in `getTermIdByTermValue` and the introduction of `termIdToNameMap`.

7. Replaced `Set` with a standard array for storing new term IDs in `onTermsChange`. The `Set` was unnecessary as term IDs are unique by default.

8. Updated `TaxonomyItem`'s effects and rendering to work with `termIdToNameMap`, ensuring the displayed term names are unique.

This update will result in more efficient term search and handling, and it will solve issues related to duplicate term names.

* Restructure taxonomy controls in product collection block

This commit restructures the taxonomy controls in the product collection block for improved clarity and maintainability.
- The file `taxonomy-controls.tsx` has been deleted, and its functionality has been divided into two new files: `index.tsx` and `taxonomy-item.tsx`.

- The `index.tsx` file contains the main TaxonomyControls component, which is responsible for displaying taxonomy-related options in the block's inspector controls. It includes a custom hook `useTaxonomies` that fetches and returns taxonomies associated with product post type.

- The `taxonomy-item.tsx` file, on the other hand, contains a TaxonomyItem component that handles the rendering of individual taxonomy items. It also contains some utility functions for mapping term names and ids and fetching terms based on the search query.

This refactor aims to improve code readability and separation of concerns, thus making future changes and maintenance easier.

* Fix case insensitive search support for FormTokenField

This change enhances the search functionality of the FormTokenField by introducing support for case insensitive search. This has been achieved by adding a lower-case version of the term name to the 'termNameToIdMap'.

This is an important enhancement as it will make the search process more user-friendly and resilient to different casing inputs. Users will now be able to find the desired taxonomy term regardless of their input's case.

* Refactor getTermIdByTermValue function and update newSuggestions mapping

This commit does a couple of important things:
1. Reorders the definition of constants in `TaxonomyItemProps` for clarity.
2. Refactors the `getTermIdByTermValue` function. Instead of checking for an exact term name match in a convoluted manner, it now directly tries to fetch the `id` from the `searchTerm` if it is an object. If the `searchTerm` is not an object, the function tries to match it against the `termNameToIdMap` in both normal and lowercase forms. This simplification makes the function more readable and concise.
3. Updates the `newSuggestions` mapping in the `TaxonomyItem` component. It now has a fallback to `searchResult.name` if a term's name is not found in `termIdToNameMap`. This change ensures that even if the term's name is not in the map for some reason, we can still display a suggestion using the original name of the term.

* Optimize term fetching and initial search state in TaxonomyItem

This commit introduces a couple of improvements to the TaxonomyItem component.

1. The initial state of the 'search' state variable has been updated to 'undefined'. This change helps prevent unnecessary initial fetching of terms when the search input is empty.

2. Term fetching logic has been optimized to only enable term fetching when necessary:
   a) Fetching based on the search query is only enabled when 'search' is not 'undefined'.
   b) Fetching existing terms is only enabled when there are term IDs.

3. The block of code responsible for fetching existing terms and setting the current value has been moved upwards. This reordering of code does not change the functionality, but it groups together similar pieces of code, enhancing readability and maintainability.

These optimizations make the component more efficient by reducing unnecessary requests and computations, and they improve the code organization.

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
2023-06-02 15:31:29 +05:30
Hritik Chaudhary cec26fa849 Remove propTypes definitions from Reviews By Category (https://github.com/woocommerce/woocommerce-blocks/pull/9623)
* converted reviews-by-category block

* converted index.js to tsx

* fix imports

* removed unnecessary metadata

* added type explicitly
2023-06-02 07:53:16 +02:00
Roy Ho a67948d7e1 Ensure aria-label is showing correct value based on setting (https://github.com/woocommerce/woocommerce-blocks/pull/9672)
* Ensure aria-label is showing correct value based on setting

* Reuse same format code
2023-06-01 05:41:43 -07:00
Albert Juhé Lluveras 73ffb371d2 Fix colors not being applied to Mini-Cart Proceed to Checkout Button in the editor (https://github.com/woocommerce/woocommerce-blocks/pull/9661) 2023-05-31 13:58:20 +02:00
Tom Cafferkey 801b7846e7 Product Categories List: Add show child categories only toggle (https://github.com/woocommerce/woocommerce-blocks/pull/9550)
* Add show child categories only toggle to Product Categories block

* Check if current page is a template editor before adding the toggle

* Show current category if show_children is enabled and its the last category in the hierarchy

* Update comment

* Fix typo

* Remove forward slash

* Add is-widget-editor utility and enable feature for block usage in widget editor

* Don't render anything if the child only option is enabled and there are no children
2023-05-31 12:49:31 +01:00
Mike Jolley c6e0ca1d8b Combine country asset data to reduce the amount of data consumed by the cart and checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/9552)
* Combine countryData using shared util

* Update tests for shared util

* Update client to use countryData

* Avoid duplication of country names

* Use cart version of deep_sort_with_accents

* Update assets/js/settings/blocks/constants.ts

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

* Update LocaleSpecificAddressField type

* Support nested arrays

---------

Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
2023-05-31 10:30:44 +01:00
Roy Ho 5f5a0d4b54 Stack cart and checkout buttons on smaller screens (https://github.com/woocommerce/woocommerce-blocks/pull/9603) 2023-05-30 13:07:30 -07:00
Thomas Roberts fcedb41bbc Remove `setFullAddressPushed` to prevent address continually pushing (https://github.com/woocommerce/woocommerce-blocks/pull/9606)
* Remove fullShippingAddressPushed action/selectors etc from wc/store/cart

* Remove setFullAddressPushed from push-changes
2023-05-30 08:46:18 -07:00
Albert Juhé Lluveras bc34d9faaf Prevent horizontal shift when opening the Mini-Cart drawer if scrollbars are visible (https://github.com/woocommerce/woocommerce-blocks/pull/9648)
* Fix wrong TS name

* Prevent page horizontal shift when opening the Mini-Cart drawer when scrollbars are visible
2023-05-30 17:09:11 +02:00
Mike Jolley 50ad36321a Use CSSProperties in place of Records for useStyleProps (https://github.com/woocommerce/woocommerce-blocks/pull/9483)
* Use CSSProperties in place of Records

* Update types from StyleEngine

* Remove parseStyle

* Combine StyleProps type
2023-05-30 14:45:59 +01:00
Albert Juhé Lluveras c267504bd6 Use a portal to render the Drawer close button to fix the alignment with the Mini-Cart Contents block (https://github.com/woocommerce/woocommerce-blocks/pull/9507) 2023-05-30 15:39:19 +02:00
Alexandre Lara 6b105f0504 Product Rating block: Add the block to the Single Product template by default (https://github.com/woocommerce/woocommerce-blocks/pull/9510)
* Add Single Product template support to Product Rating block

* Add the Product Rating block to the Single Product Template by default

* Fix Product Rating block position on Single Product HTML template
2023-05-30 10:10:25 -03:00
Manish Menaria a6c31a7878 [Product Collection] Add `Attributes` filter control to sidebar settings (https://github.com/woocommerce/woocommerce-blocks/pull/9600)
* Add columns control to product collection block editor settings

- `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function.
- A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'.
- The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties.

* Refactor: Simplify Fallback Return in ColumnsControl Component

This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React.

* Feature: Add 'Order By' Control to Product Collection Inspector

This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse.

* Add more options to OrderBy type

* Add orderby handling on frontend & editor

The main changes include:
1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block.
2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block.
3. Added methods to manage query parameters for both frontend rendering and the Editor.
4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values.
5. Defined a function to build the query based on block attributes, filters, and global WP_Query.
6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively.

These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections.

* Add 'on sale' filter and enhance settings management in product collection block

This commit introduces several changes to the product collection block.
- First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale.
- It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings.
- It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control.
- A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters.
- The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes.
- Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter.

This should enhance the flexibility and user-friendliness of the product collection block.

* Add stock status filter to WooCommerce product collection block

This commit introduces a stock status filter to the WooCommerce product collection block.

The changes include:
1. Added the ability to filter products based on their stock status within the 'product-collection' block. A new stock status control is created within the inspector-controls of the block.
2. A new 'get_stock_status_query' function is introduced in 'ProductCollection.php' which returns a query for products depending on their stock status.

Please note that the stock status filter will only appear in the experimental build for now.

* Refactor Stock Status control of Product Collection block

This commit refactors the Stock Status control. The changes aim to improve the code organization and make the behavior of the component more explicit.

The key modifications are:
1. Moved stock status related constants and functions from `inspector-controls/utils.tsx` to `inspector-controls/constants.ts`. This is done to ensure that all constants and similar utility functions are organized in one place.
2. Updated `product-collection/index.tsx` to import `getDefaultStockStatuses` from `inspector-controls/constants` instead of `inspector-controls/utils`.
3. Updated `stock-status-control.tsx` to determine whether the stock status has value or not by comparing with the default stock statuses using `fastDeepEqual`. If the stock status control is deselected, it resets the stock status to the default statuses.

These changes do not introduce any new functionalities, but improve the readability and maintainability of the code.

* Add keyword search control to Product Collection block

This commit introduces a keyword search functionality to the Product Collection block. The update is aimed to provide users with more flexibility and precision in product collection queries.

Key changes:
1. Introduced a new file `keyword-control.tsx` that creates a Keyword Control component. This component includes a TextControl field that allows inputting a search keyword. The keyword search is debounced to prevent unnecessary queries during input and updates the block's attributes accordingly.
2. Modified `inspector-controls/index.tsx` to include the KeywordControl in the ToolsPanel for the block's filters.
3. Adjusted `ProductCollection.php` to include the keyword search in the product query array.

With these changes, users can now search for products by keyword in the Product Collection block.

* Add product attributes filter control to ProductCollection block

- This commit introduces the ability to filter products by attributes in ProductCollection block.
- A new `woocommerceAttributes` key was added to the `block.json` file and the `ProductCollectionQuery` type. Also, a new file `attributes-control.tsx` was created, providing the UI component for the attribute filter control in the editor.
- In addition, updates were made to the `ProductCollection.php` file in the backend to support filtering products by attributes, and the tax query was updated to include attribute queries.
- Lastly, the `ProductCollectionInspectorControls` was updated to include the `AttributesControl` component, thus enabling users to filter products by attributes in the block editor."`

* remove unused import of getDefaultStockStatuses

* Delete a duplicate file

* Remove console log

* Address PR feedback & other improvements

1. Added `woocommerceAttributes` to `DEFAULT_FILTERS` in the `product-collection/constants.ts` file to fix `reset all` button issue.

2. Refactored `attributes-control.tsx` to make it more maintainable:
   - The constant `EDIT_ATTRIBUTES_URL` now uses `ADMIN_URL` from `@woocommerce/settings` for a more dynamic URL generation.
   - The interface `Props` has been renamed to `AttributesControlProps` for more explicit naming.
   - Removed the usage of `useState` and `useEffect` for selected attributes. Instead, `selectedAttributes` is now directly derived from `woocommerceAttributes`.
   - The CSS class `woocommerce-product-query-panel__external-link` was renamed to `wc-product-collection-panel__external-link`

3. Deleted the `product-collection/inspector-controls/constants.ts` file which was no longer necessary due to changes in product collection implementation.

These changes contribute to codebase quality, improving readability and maintainability.

* Add wc-block-editor prefix to className

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
2023-05-30 11:06:26 +00:00
Albert Juhé Lluveras 27e3a9a3cc Fix invisible Mini-Cart badge in themes without <body> background (https://github.com/woocommerce/woocommerce-blocks/pull/9601) 2023-05-30 10:36:29 +02:00
Niels Lange 8a9bcd4d13 Adjust contributor docs (https://github.com/woocommerce/woocommerce-blocks/pull/9622)
* Adjust contributor docs

* Adjust contributor docs
2023-05-30 13:30:36 +07:00
Alexandre Lara 134b12bef7 Product Rating block: Add Single Product template support to the block (https://github.com/woocommerce/woocommerce-blocks/pull/9499)
* Add Single Product template support to Product Rating block

* Remove example attribute from block.json

Co-authored-by: Luigi Teschio <gigitux@gmail.com>

* Set isDescedentOfSingleProductTemplate attribute default to false

* Remove withProductSelector HOC

Since we are using the `ancestor` key then we don't need to use this HOC anymore

* Remove unused import on Product Rating Edit component

---------

Co-authored-by: Luigi Teschio <gigitux@gmail.com>
2023-05-29 16:54:36 -03:00
Luigi Teschio ec797e689f restore upsell products (https://github.com/woocommerce/woocommerce-blocks/pull/9636) 2023-05-29 15:46:55 +02:00
Hritik Chaudhary 86e96c0d0b Remove propTypes definitions from Newest Products block (https://github.com/woocommerce/woocommerce-blocks/pull/9613)
* converted product-new block

* converted product-new block

* filename changes in readme and checkstyle.xml

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-29 13:12:36 +07:00
Hritik Chaudhary 2e1193b2a9 removed proptypes from add-to-cart (https://github.com/woocommerce/woocommerce-blocks/pull/9615)
Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-29 11:13:25 +07:00
Hritik Chaudhary edab9c00ab removed proptypes from product-list container (https://github.com/woocommerce/woocommerce-blocks/pull/9616)
Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-28 15:11:28 +07:00
Daniel Dudzic 3e33914e87 Mini-Cart: Make error notifications non-dismissable. Closes woocommerce/woocommerce-blocks#8965. (https://github.com/woocommerce/woocommerce-blocks/pull/9578) 2023-05-26 19:39:33 +02:00
Alexandre Lara 8a75ec8bc2 Fix magnifying glass appearing outside the product image gallery (https://github.com/woocommerce/woocommerce-blocks/pull/9594) 2023-05-26 11:23:24 -03:00
Manish Menaria 3a4792150c Product Collection - Add keyword control to sidebar settings (https://github.com/woocommerce/woocommerce-blocks/pull/9583)
* Add columns control to product collection block editor settings

- `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function.
- A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'.
- The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties.

* Refactor: Simplify Fallback Return in ColumnsControl Component

This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React.

* Feature: Add 'Order By' Control to Product Collection Inspector

This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse.

* Add more options to OrderBy type

* Add orderby handling on frontend & editor

The main changes include:
1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block.
2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block.
3. Added methods to manage query parameters for both frontend rendering and the Editor.
4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values.
5. Defined a function to build the query based on block attributes, filters, and global WP_Query.
6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively.

These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections.

* Add 'on sale' filter and enhance settings management in product collection block

This commit introduces several changes to the product collection block.
- First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale.
- It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings.
- It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control.
- A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters.
- The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes.
- Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter.

This should enhance the flexibility and user-friendliness of the product collection block.

* Add stock status filter to WooCommerce product collection block

This commit introduces a stock status filter to the WooCommerce product collection block.

The changes include:
1. Added the ability to filter products based on their stock status within the 'product-collection' block. A new stock status control is created within the inspector-controls of the block.
2. A new 'get_stock_status_query' function is introduced in 'ProductCollection.php' which returns a query for products depending on their stock status.

Please note that the stock status filter will only appear in the experimental build for now.

* Refactor Stock Status control of Product Collection block

This commit refactors the Stock Status control. The changes aim to improve the code organization and make the behavior of the component more explicit.

The key modifications are:
1. Moved stock status related constants and functions from `inspector-controls/utils.tsx` to `inspector-controls/constants.ts`. This is done to ensure that all constants and similar utility functions are organized in one place.
2. Updated `product-collection/index.tsx` to import `getDefaultStockStatuses` from `inspector-controls/constants` instead of `inspector-controls/utils`.
3. Updated `stock-status-control.tsx` to determine whether the stock status has value or not by comparing with the default stock statuses using `fastDeepEqual`. If the stock status control is deselected, it resets the stock status to the default statuses.

These changes do not introduce any new functionalities, but improve the readability and maintainability of the code.

* Add keyword search control to Product Collection block

This commit introduces a keyword search functionality to the Product Collection block. The update is aimed to provide users with more flexibility and precision in product collection queries.

Key changes:
1. Introduced a new file `keyword-control.tsx` that creates a Keyword Control component. This component includes a TextControl field that allows inputting a search keyword. The keyword search is debounced to prevent unnecessary queries during input and updates the block's attributes accordingly.
2. Modified `inspector-controls/index.tsx` to include the KeywordControl in the ToolsPanel for the block's filters.
3. Adjusted `ProductCollection.php` to include the keyword search in the product query array.

With these changes, users can now search for products by keyword in the Product Collection block.

* remove unused import of getDefaultStockStatuses
2023-05-26 13:21:51 +00:00
Manish Menaria c3060cff0e Product Collection: Add stock status filter (https://github.com/woocommerce/woocommerce-blocks/pull/9580)
* Add columns control to product collection block editor settings

- `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function.
- A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'.
- The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties.

* Refactor: Simplify Fallback Return in ColumnsControl Component

This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React.

* Feature: Add 'Order By' Control to Product Collection Inspector

This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse.

* Add more options to OrderBy type

* Add orderby handling on frontend & editor

The main changes include:
1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block.
2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block.
3. Added methods to manage query parameters for both frontend rendering and the Editor.
4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values.
5. Defined a function to build the query based on block attributes, filters, and global WP_Query.
6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively.

These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections.

* Add 'on sale' filter and enhance settings management in product collection block

This commit introduces several changes to the product collection block.
- First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale.
- It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings.
- It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control.
- A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters.
- The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes.
- Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter.

This should enhance the flexibility and user-friendliness of the product collection block.

* Add stock status filter to WooCommerce product collection block

This commit introduces a stock status filter to the WooCommerce product collection block.

The changes include:
1. Added the ability to filter products based on their stock status within the 'product-collection' block. A new stock status control is created within the inspector-controls of the block.
2. A new 'get_stock_status_query' function is introduced in 'ProductCollection.php' which returns a query for products depending on their stock status.

Please note that the stock status filter will only appear in the experimental build for now.

* Refactor Stock Status control of Product Collection block

This commit refactors the Stock Status control. The changes aim to improve the code organization and make the behavior of the component more explicit.

The key modifications are:
1. Moved stock status related constants and functions from `inspector-controls/utils.tsx` to `inspector-controls/constants.ts`. This is done to ensure that all constants and similar utility functions are organized in one place.
2. Updated `product-collection/index.tsx` to import `getDefaultStockStatuses` from `inspector-controls/constants` instead of `inspector-controls/utils`.
3. Updated `stock-status-control.tsx` to determine whether the stock status has value or not by comparing with the default stock statuses using `fastDeepEqual`. If the stock status control is deselected, it resets the stock status to the default statuses.

These changes do not introduce any new functionalities, but improve the readability and maintainability of the code.

* Fix: Default values of attributes not saving as serialized block comment

This was happening because of this issue: https://github.com/WordPress/gutenberg/issues/7342

Therefore, I had to use `useEffect` to set the default values of the attributes.

Here is the list of changes I made:
1. Removed default values from `block.json` for `query`, `tagName`, and `displayLayout`.
2. Moved the default values to `constants.ts` and created a new object `DEFAULT_ATTRIBUTES` to store them.
3. Relocated `constants.ts` from `inspector-controls` to the parent directory.
4. Refactored `edit.tsx` to use `DEFAULT_ATTRIBUTES` from `constants.ts` to set default attributes using `useEffect`.
5. Removed the attributes assignment from `registerBlockType` in `index.tsx`.
6. Updated `columns-control.tsx`, `index.tsx`, `order-by-control.tsx`, and `stock-status-control.tsx` to import from the relocated `constants.ts`.
7. Updated `ProductCollectionAttributes` and `ProductCollectionQuery` in `types.ts` to include `tagName` and `isProductCollectionBlock` respectively.
8. Modified `ProductCollection.php` to match the updated `orderBy` key in the query parameter.

This refactor enhances the readability of the code and reduces duplication by keeping all constants and default values in one place.

* Replace usage of 'statii' with 'statuses' in stock status handling

This commit replaces all instances of 'statii' with the correct term 'statuses' in the context of handling stock status. This change affects three files:
1. `assets/js/blocks/product-collection/inspector-controls/stock-status-control.tsx` - The term is corrected in a comment block.
2. `assets/js/blocks/product-collection/types.ts` - Updated the name of a variable in the `ProductCollectionQuery` interface.
3. `src/BlockTypes/ProductCollection.php` - Here, the term is replaced in several locations including variable names, comments and the method `get_stock_status_query`.

This commit helps improve code readability and consistency across the repository.
2023-05-26 11:44:37 +00:00
Hritik Chaudhary 5bd706edd9 Remove propTypes definitions from Top Rated Products block (https://github.com/woocommerce/woocommerce-blocks/pull/9595)
* replace propTypes and converted to tsx -  product-top-rated/block.js

* replace propTypes and converted to tsx -  product-top-rated/block.js

* converted product-top-rated to typescript

* added JSX.Element

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-26 13:46:13 +07:00
Alexandre Lara 75d92b60b8 Remove Add Review link and hide rating when the Product has no rating (https://github.com/woocommerce/woocommerce-blocks/pull/9556) 2023-05-25 11:49:02 -03:00
Luigi Teschio 4fb7da7962 Classic Product Template visible in the inserter (https://github.com/woocommerce/woocommerce-blocks/pull/9573) 2023-05-25 09:42:29 +02:00
Manish Menaria 0b3853090b Product Collection: Add 'on sale' filter and enhance settings management in product collection block (https://github.com/woocommerce/woocommerce-blocks/pull/9549)
* Add columns control to product collection block editor settings

- `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function.
- A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'.
- The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties.

* Refactor: Simplify Fallback Return in ColumnsControl Component

This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React.

* Feature: Add 'Order By' Control to Product Collection Inspector

This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse.

* Add more options to OrderBy type

* Add orderby handling on frontend & editor

The main changes include:
1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block.
2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block.
3. Added methods to manage query parameters for both frontend rendering and the Editor.
4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values.
5. Defined a function to build the query based on block attributes, filters, and global WP_Query.
6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively.

These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections.

* Add 'on sale' filter and enhance settings management in product collection block

This commit introduces several changes to the product collection block.
- First, it adds a new 'on sale' filter that can be used to display only the products that are currently on sale.
- It also refactors the settings management in the product collection block to use the experimental ToolsPanel component from WordPress, which provides a more flexible and intuitive way to manage block settings.
- It moves the 'Columns' control into the ToolsPanel, along with the 'Order by' control.
- A new utility function `setQueryAttribute` is introduced to simplify setting nested query parameters.
- The structure of the `ProductCollectionAttributes` and `ProductCollectionQuery` types have been adjusted to accommodate the changes.
- Finally, it makes corresponding changes in the PHP part to handle the new 'on sale' query parameter.

This should enhance the flexibility and user-friendliness of the product collection block.
2023-05-25 06:38:19 +00:00
Saad Tarhi 4bdbdbf309 Fix total shipping display info when no shipping method is available (https://github.com/woocommerce/woocommerce-blocks/pull/8819)
* Fix total shipping info when no shipping are available

* Fix a logical error for displaying shipping info

* Fix failing unit tests

* Run unit test for the Cart instead of the Checkout

The calculator is only available for the Cart Block, so it doesn't make
sense to run this test for the Checkout Block

* Fix no shipping methods and incomplete address conflict

When there are no shipping methods (except for local pickup), we would
like to inform the shopper that there are no shipping options available
even though the address is complete

The solution we found is to check the address on the Cart Block only

* Refactor code

* Check whether rate is collectible without using hardcoded id

* Correctly negate hasCollectibleRate result

* Add notice when shipping is selected but no methods are available yet (https://github.com/woocommerce/woocommerce-blocks/pull/9171)

* Create useShippingTotalWarning hook

* Show notices above checkout sidebar

* Call hook to show notice in Checkout block

* Remove unused imports

* Update hook name to useShowShippingTotalWarning

* Move hook to its own file

* Import shipping data internally (without alias)

* Remove unused imports

* Move import to correct place

* Return early to avoid if else

* Refactor useShowShippingTotalWarning

* Get shipping rates directly from the cart instead of the hook

* Show shipping cost when price information is available

* Check if the passed rates are considered selected

* Prevent errors when no rates are available

---------

Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Tarun Vijwani <tarun.vijwani@automattic.com>
2023-05-25 06:31:15 +01:00
Hritik Chaudhary ed2c17f16c Remove `propTypes` definitions from Product Search block (https://github.com/woocommerce/woocommerce-blocks/pull/9565)
* Remove propTypes definitions for product search

* Resolved TS errors

* Addressed review comments

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-24 19:24:08 +07:00
Albert Juhé Lluveras a04c00a79f Make Mini-Cart block work well with caching plugins (https://github.com/woocommerce/woocommerce-blocks/pull/9493)
* Make Mini-Cart block work well with caching plugins

* Add tests

* Add back aria-label to Mini-Cart menu

* Fetch Mini-Cart data before page finishes loading

* Store and retrieve Mini-Cart values from localStorage for better performance

* Update styles as early as possible

* Reorder code

* Remove overrideTotals param from updateTotals() function

* Update tests

* Initialize local storage inside a function and add act to filter tests

* Replace void with undefined types in several funtions

* Fix 0 quantity badge appearing on page load
2023-05-23 09:28:40 +02:00
Luigi Teschio c919466a8c Enable blockified conversation to archive templates (https://github.com/woocommerce/woocommerce-blocks/pull/9509) 2023-05-22 12:17:56 +00:00
Seghir Nadir 5457145c6a Trigger the set-billing-address when editing Shipping (https://github.com/woocommerce/woocommerce-blocks/pull/8841) 2023-05-22 09:30:49 +00:00
Tarun Vijwani 90e57bca11 Add unit test cases for Min and Max price for shipping methods (https://github.com/woocommerce/woocommerce-blocks/pull/9336)
* Add unit test cases for Min and Max price for shipping methods

* Move Test for Min and Max rates to shipping-rates

- Move Test for Min and Max rates to shipping-rates.
- Use single shippingRates object throughout the test cases.

* Update assets/js/base/utils/test/shipping-rates.ts

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

* Update assets/js/base/utils/test/shipping-rates.ts

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

* Add helper function to generate shipping rates

* Add a test for empty shipping rates

* Remove redundant attribute values from generateRate function

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-22 12:48:12 +04:00
Tarun Vijwani 296a0b4360 Fix Checkout block stepped sections numbers overlapping (https://github.com/woocommerce/woocommerce-blocks/pull/9497)
- Fix the padding for checkout-step component
2023-05-22 11:03:50 +04:00
Alexandre Lara 410e041936 Remove the fill color of the Product Meta icon (https://github.com/woocommerce/woocommerce-blocks/pull/9506) 2023-05-19 16:59:18 -03:00
Alexandre Lara 0847c20f79 Remove the fill color of the Product Details icon and move it to the icons library (https://github.com/woocommerce/woocommerce-blocks/pull/9503) 2023-05-19 12:09:13 -03:00
Albert Juhé Lluveras b0af5ac12e Update Mini-Cart block logic to use isSiteEditorPage util (https://github.com/woocommerce/woocommerce-blocks/pull/9501)
* Revert "Mini-Cart: prevent 'Mini-Cart in cart and checkout pages' toggle from showing up in the post/page editor (https://github.com/woocommerce/woocommerce-blocks/pull/9442)"

This reverts commit 0bfc1b341e.

* Update Mini-Cart block logic to use isSiteEditorPage util
2023-05-18 15:53:01 +02:00
Alexandre Lara bad4c30e36 Add to Cart with Options: Fix styles that are not being applied correctly (https://github.com/woocommerce/woocommerce-blocks/pull/9472)
* Add missing WooCommerce styles to Add to Cart with Options block

* Fix input style for Add to Cart with Options block

* Add comment about the input-text css class that was added to the Add To Cart Form
2023-05-18 08:02:51 -03:00
Manish Menaria 57d4ac529e Product Collection: Add 'Order By' Control to Product Collection Inspector (https://github.com/woocommerce/woocommerce-blocks/pull/9480)
* Add columns control to product collection block editor settings

- `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function.
- A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'.
- The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties.

* Refactor: Simplify Fallback Return in ColumnsControl Component

This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React.

* Feature: Add 'Order By' Control to Product Collection Inspector

This commit adds a new 'Order By' control to the product collection inspector. The control allows users to specify the order of products in a collection by various attributes such as title and date. To support this, a new component 'OrderByControl' has been created and included in the product collection inspector. Additionally, the types for 'order' and 'orderBy' attributes have been updated and exported for reuse.

* Add more options to OrderBy type

* Add orderby handling on frontend & editor

The main changes include:
1. Added a new property 'isProductCollectionBlock' in the block.json to denote if a block is a product collection block.
2. In the ProductCollection PHP class, a new initialization function has been defined to hook into the WordPress lifecycle, register the block, and update the query based on this block.
3. Added methods to manage query parameters for both frontend rendering and the Editor.
4. Expanded allowed 'collection_params' for the REST API to include custom 'orderby' values.
5. Defined a function to build the query based on block attributes, filters, and global WP_Query.
6. Created utility functions to handle complex query operations such as merging queries, handling custom sort values, and merging arrays recursively.

These improvements allow for more flexible and robust handling of product collections in both the front-end display and the WordPress editor. It also extends support for custom 'orderby' values in the REST API, which allows for more advanced sorting options in product collections.

* fix: handle undefined index for isProductCollectionBlock

This commit addresses a potential issue where the 'isProductCollectionBlock' index might not be defined in certain situations within the 'build_query' method of the ProductCollection class.

Previously, we directly accessed 'isProductCollectionBlock' from the 'query' context of the block. Now, we use the null coalescing operator (??) to ensure that we assign a default value of false if 'isProductCollectionBlock' is not set.

This change provides a safer way to handle the scenario when the 'isProductCollectionBlock' is not defined in the block context and helps prevent undefined index warnings.
2023-05-18 10:54:08 +00:00
Albert Juhé Lluveras 5d6397b7b5 Prevent QuantitySelector stealing focus on page load (https://github.com/woocommerce/woocommerce-blocks/pull/9487) 2023-05-18 09:17:29 +02:00
Tarun Vijwani 21a356c58c Allow Shipping method prices to inherit global styles text color (https://github.com/woocommerce/woocommerce-blocks/pull/9456)
- Remove the hardcoded color for Shipping method prices
2023-05-17 21:52:20 +04:00
Alexandre Lara 2ef37db063 Add useIsDescendentOfSingleProductBlock hook to product rating block (https://github.com/woocommerce/woocommerce-blocks/pull/9489) 2023-05-17 10:58:12 -03:00
Luigi Teschio 689b5dd22a Fix undo button (https://github.com/woocommerce/woocommerce-blocks/pull/9478)
* fix undo button

* fix label
2023-05-17 13:25:02 +00:00
Alexandre Lara f22036af89 Fix Product Rating Block not showing when manually inserted to Single Product block (https://github.com/woocommerce/woocommerce-blocks/pull/9413) 2023-05-16 15:28:11 -03:00
Alexandre Lara 90573156fe Fix Product SKU not being displayed on frontend when outside Single Product template (https://github.com/woocommerce/woocommerce-blocks/pull/9446) 2023-05-16 15:25:34 -03:00
Luigi Teschio f8d46570ae Add isSiteEditorPage util (https://github.com/woocommerce/woocommerce-blocks/pull/9468)
* Add isSiteEditorPage util

* fix logic
2023-05-16 13:59:49 +02:00
Manish Menaria 14f87be044 Product Collection: Add columns control to product collection block editor settings (https://github.com/woocommerce/woocommerce-blocks/pull/9466)
* Add columns control to product collection block editor settings

- `InspectorControls` from './inspector-controls' is now imported in `edit.tsx` and used in the returned JSX of `Edit` function.
- A new file `columns-control.tsx` is added under 'product-collection' block's 'inspector-controls' directory which exports a `ColumnsControl` component. This component uses `RangeControl` from '@wordpress/components' to control the number of columns in the product collection display layout when the layout type is 'flex'.
- The types file (`types.ts`) for 'product-collection' block is updated. The `Attributes` interface is renamed to `ProductCollectionAttributes` and the `ProductCollectionContext` interface is removed. The `ProductCollectionAttributes` now includes 'queryContext', 'templateSlug', and 'displayLayout' properties.

* Refactor: Simplify Fallback Return in ColumnsControl Component

This commit simplifies the fallback return value of the ColumnsControl component. Instead of returning an empty fragment (<> </>), it now returns null when the condition isn't met. This change improves readability and aligns with best practices for conditional rendering in React.
2023-05-16 09:23:22 +00:00
Albert Juhé Lluveras 3b28b74777 Mini Cart: stop using Modal component (https://github.com/woocommerce/woocommerce-blocks/pull/9345)
* Remove unused styles

* Replace usage of Modal component with custom Drawer

* Update MiniCart.php class structure

* Update tests

* Prevent focus styles to appear unnecessarily when opening the Mini Cart drawer

* Work-around issue with disabled buttons causing lose of focus inside the Mini-Cart drawer

* Revert "Work-around issue with disabled buttons causing lose of focus inside the Mini-Cart drawer"

This reverts commit 4360f77384ad1f1d90a3ba8a0385ad79da2449f2.

* QuantitySelector: focus text input field after decrease or increase button become disabled

* Move focus to the input field also when the body has focus, that fixes the issue in Chrome

* Add explanatory comment
2023-05-16 10:41:26 +02:00
Mike Jolley 6e3b1ac7fb Styling fixes for form step headings (https://github.com/woocommerce/woocommerce-blocks/pull/9437)
Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-15 12:28:24 +01:00
Tarun Vijwani afa5406746 Fix radio control overlap when font-size is small (https://github.com/woocommerce/woocommerce-blocks/pull/9436)
Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-15 14:46:42 +04:00
Manish Menaria 0e6141f5ed Foundation of New Product Collection Block (https://github.com/woocommerce/woocommerce-blocks/pull/9352)
* Add Products Collection block scaffolding

This commit adds the initial scaffolding for the new Products Collection block. It includes the creation of new files (block.json, edit.tsx, index.tsx and ProductsCollection.php) and additions to existing files (webpack-entries.js and BlockTypesController.php). The block is marked as experimental and currently displays a static "Product collection" text in both the editor and the frontend.

* Add Product Template block and integrate with Products Collection block

This commit introduces the new Product Template block and integrates it with the existing Products Collection block. The changes include:
- Creation of the Product Template block, including its block.json, edit.tsx, icon.tsx, index.tsx, and save.tsx files.
- Modification of the Products Collection block, adding an icon.tsx file and updating its edit.tsx and index.tsx files.
- Updates to the webpack-entries.js file to include the new Product Template block.
- Addition of the ProductTemplate class in the src/BlockTypes directory.
- Inclusion of the ProductTemplate class in the src/BlockTypesController.php file.

* Enhance product-template block with context and styling

This commit adds various enhancements to the product-template block. It includes:

- Introduce `usesContext` and `supports` properties to the block.json file
- Update the edit.tsx file to use BlockContextProvider and add query logic
- Add an editor.scss file for styling the product-template block in the editor
- Extend the products-collection block.json file with new properties
- Modify the products-collection edit.tsx file to include instanceId and useEffect

These changes improve the product-template block by providing better context handling and styling options.

* Add 'woocommerce/product-template' to supported inner blocks and improve product-template editing

This commit adds 'woocommerce/product-template' as a supported inner block for various product elements, including button, image, rating, sale-badge, SKU, and stock-indicator. It also improves the editing experience for the product-template block by memoizing the block previews and rendering them more efficiently. This should lead to a smoother editing experience and better performance in the block editor.

* Add product title and summary variations for Products Collection block

- Add default spacing between product elements in `style.scss`
- Register product title and summary element variations in `products-collection` block
- Create utility for registering element variations
- Extend core elements with WooCommerce namespace

* Set inherit to false by default and other improvements

This commit introduces several changes to the ProductsCollection block:
1. Set the "inherit" property to false in block.json, disabling inheritance by default.
2. Remove the default styles for inner blocks in the edit.tsx file.
3. Add a save function in the index.tsx file, and create a save.tsx file to handle saving the block.
4. Update the ProductTemplate.php file to properly render the block content based on the changes.
5. Remove the render function from the ProductsCollection.php file, as it is no longer necessary.

These changes improve the functionality and flexibility of the ProductsCollection block, allowing for better customization and control over the block's appearance and behavior.

* Fix pagination issue

* Minor code quality improvments

* Register product blocks only in experimental builds

- Wrap registerBlockType calls in product-template and products-collection with isExperimentalBuild check to enable block registration only in experimental builds.
- Update the default value for the perPage property in products-collection/block.json from null to 9, setting a default display of 9 items per page.

* Add experimental flag to PHP file

* Update documentation for feature flags

- Add Products Collection and Product Template blocks to the list of experimental flags in the feature-flags-and-experimental-interfaces.md file.
- Include references to PHP and webpack flags for both blocks.

* Change default order and orderBy values in block.json

- Update the default 'order' value from 'desc' to 'asc'.
- Update the default 'orderBy' value from 'date' to 'title'.

* Refactor experimental block registration and remove unused file

- Replace `isExperimentalBuild()` with `registerExperimentalBlockType()` in product-template/index.tsx.
- Remove unused file types.ts in product-template directory.
- Add `get_block_type_script()` function to ProductTemplate.php and ProductsCollection.php to return null.

* Update variation names in product summary and product title elements

Updated variation names for product summary and product title elements to match the new products-collection namespace. The previous variation names used the product-query namespace which will be deprecated. This change ensures that the correct variation names are used for these elements in the products-collection block.

* Rename 'Products Collection' to 'Product Collection'

- Renamed all instances of "products-collection" to "product-collection" across multiple files.
- Adjusted related types and method calls to match the new naming convention.
- Updated documentation and feature flags to reflect the name change.
- Made necessary changes in `BlockTypesController.php` and `bin/webpack-entries.js`.

* Hide product-template block from inserter

- Added "woocommerce/product-collection" to the list of parent blocks in `product-template/block.json`.
- Added `"inserter": false` to the "supports" section to disable the option of inserting this block through the editor inserter component.

* Fix Eslint error
2023-05-15 08:51:49 +00:00
Mike Jolley 43eaed7620 Experiment: Replace style hooks coming from `@wordpress/block-editor` (https://github.com/woocommerce/woocommerce-blocks/pull/9251)
* Replace all style hooks with useStyleProps hook

* Remove border/color/spacing hooks

* Style Props Hook

* Make use of `change-case` package

* Tidy up block wrappers

* Attribute filter does not use frontend.ts nor styles within block

* Remove frontend from filter blocks and unused styleprops usage

* Tidy up variable names so its clearer attributes are not required specifically from blocks

* Update assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/mini-cart-title-label-block/block.tsx

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

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

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

* Update assets/js/blocks/active-filters/block-wrapper.tsx

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

* Update assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/mini-cart-checkout-button-block/block.tsx

Co-authored-by: Tom Cafferkey <tjcafferkey@gmail.com>

* Update assets/js/blocks/rating-filter/block-wrapper.tsx

Co-authored-by: Tom Cafferkey <tjcafferkey@gmail.com>

* Update assets/js/blocks/stock-filter/block-wrapper.tsx

Co-authored-by: Tom Cafferkey <tjcafferkey@gmail.com>

* Update assets/js/blocks/price-filter/block-wrapper.tsx

Co-authored-by: Tom Cafferkey <tjcafferkey@gmail.com>

* Update assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/mini-cart-cart-button-block/block.tsx

Co-authored-by: Tom Cafferkey <tjcafferkey@gmail.com>

* Simplify styleprop

* Styleprops simplify

* Fix withFeaturedItem styles

* Like the original hook, flatten props and combine with parsed styles

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
Co-authored-by: Tom Cafferkey <tjcafferkey@gmail.com>
2023-05-12 13:42:16 +01:00
Mike Jolley 7e06584c14 Update settings text and styling (https://github.com/woocommerce/woocommerce-blocks/pull/9440) 2023-05-12 10:11:08 +01:00
Albert Juhé Lluveras 0bfc1b341e Mini-Cart: prevent 'Mini-Cart in cart and checkout pages' toggle from showing up in the post/page editor (https://github.com/woocommerce/woocommerce-blocks/pull/9442) 2023-05-12 10:26:03 +02:00
Dennis Jonda 1add6a146e Fix alignment issue with 'Add Coupon Code' button in WooCommerce Blocks checkout page (https://github.com/woocommerce/woocommerce-blocks/pull/9392)
Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-12 12:28:08 +07:00
Albert Juhé Lluveras d236af2a8c Only show the Mini Cart count badge when there are items in the cart (https://github.com/woocommerce/woocommerce-blocks/pull/9259)
* Only show the Mini Cart count badge when there are items in the cart

* Update badge to new design

* Add tests

* Make sure colors don't break existing themes

* Update Mini Cart e2e test
2023-05-11 17:23:36 +02:00
Albert Juhé Lluveras 2b6eef516b Update Mini-Cart block editor sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/9420)
* Update Mini-Cart block editor sidebar

* Rename Mini Cart block to Mini-Cart

* Update Mini-Cart block editor sidebar (II)

* Update two instances of mini-cart to uppercase
2023-05-11 14:52:03 +02:00
Luigi Teschio b15cb932fb Improve transform classic product template UX (https://github.com/woocommerce/woocommerce-blocks/pull/9386)
* improve transform classic product template UX

* improve layout

* not update deps

* improve logic

* add bold

* fix height and width preview on hover

* fix label

* improve logic for revert button

* fix regression
2023-05-10 13:02:33 +02:00
Patricia Hillebrandt b12cfd2d6a Add to Cart Button > Update block registration to rely on metadata and enable usage for the Single Product Block (https://github.com/woocommerce/woocommerce-blocks/pull/9404)
* Adapt the Add to Cart Button block to be registered via block.json

* Remove the legacy supports.ts file

* Ditch all registration methods from the ProductButton class as it is now registered via metadata (a block.json file)

* Update get_block_type_uses_context and register_block_type_assets
2023-05-10 10:20:40 +00:00
Seghir Nadir 4c2f024418 Only validate postcode if its required or filled (https://github.com/woocommerce/woocommerce-blocks/pull/9377)
* Only validate postcode if its required

* Clear postcode validation error if postcode is not required

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-05-09 16:54:28 +07:00
Lucio Giannotta 41817ea2d6 Implement Hand-Picked Products block (https://github.com/woocommerce/woocommerce-blocks/pull/7925)
Implements the ProductSelector advanced filter within the “Products (Beta)” block.
The filter allows the merchant to narrow down the exact products to which all
subsequent filters will be applied, mirroring the functionality of the existing
“Hand-picked Products” plus all the other functionalities available
from the “Products (Beta)” block.
2023-05-08 14:50:10 +02:00
Danilo Parra Jr 4c204ab578 Add color and typography styles on the mini cart title block (https://github.com/woocommerce/woocommerce-blocks/pull/9382)
* feat: added color and typography supports on the mini cart title block

* refactor: remove background support for mini cart title block
2023-05-08 13:52:25 +02:00
Albert Juhé Lluveras 349ae658bb Mini Cart drawer: print width in PHP (https://github.com/woocommerce/woocommerce-blocks/pull/9329)
* Mini Cart drawer: print width in PHP

* Remove unnecessary timeout

* Make sure classic themes have a Mini Cart contents width value set up
2023-05-05 11:44:41 +02:00
Albert Juhé Lluveras 19332e960d Fix Product Price styles leaking into the Mini Cart, Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/9276)
* Fix Product Price styles leaking into the Mini Cart

* Add support for All Products block
2023-05-04 09:32:45 +02:00
Thomas Roberts fdfb445a58 Prevent email address being removed when changing shipping method/entering shipping address (https://github.com/woocommerce/woocommerce-blocks/pull/9328)
* Preserve email when rendering shipping address form for the first time

* Ensure billing email does not reset when changing form values

* Add test to ensure email does not get overwritten
2023-05-03 06:45:57 -07:00
Mike Jolley 3743b024b7 Refactor klona usage (https://github.com/woocommerce/woocommerce-blocks/pull/9320)
* cloneObject in tests

* Create custom updateNested function instead of deepCloning objects

* Update type based on feedback
2023-05-03 12:09:12 +01:00
Luigi Teschio fed679cbeb Rename Add to Cart (https://github.com/woocommerce/woocommerce-blocks/pull/9315)
* rename Add to Cart

* fix E2E test
2023-05-03 10:31:59 +00:00
Luigi Teschio 0ea4dab3c9 Product Image Gallery: fix resize width when the window resize (https://github.com/woocommerce/woocommerce-blocks/pull/9299) 2023-05-03 08:44:22 +00:00
Albert Juhé Lluveras 4534beaa91 Fix Mini Cart block not respecting Add-to-Cart behaviour attribute when adding the first product (https://github.com/woocommerce/woocommerce-blocks/pull/9257) 2023-05-03 09:49:43 +02:00
Mike Jolley 1a0f209770 Fix shipping notices for multiple packages (https://github.com/woocommerce/woocommerce-blocks/pull/9285)
* Move notice to top and only show on cart page

* Missing setting on cart page prevents notice display

* Allow null in the select-shipping-rate endpoint to select all packages

* Only show the warning if different packages are selected

* Check if selected rates is an object before mapping it

---------

Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
2023-05-02 16:04:29 +01:00
Albert Juhé Lluveras bad0222385 Related Products: make Product Title a link (https://github.com/woocommerce/woocommerce-blocks/pull/9179) 2023-05-02 11:36:23 +02:00
Luigi Teschio 114ba02135 Product Image Gallery: fix inline (https://github.com/woocommerce/woocommerce-blocks/pull/9297) 2023-05-02 09:11:58 +00:00
Alexandre Lara 448f8102d9 Product Rating block: Fix review count not displaying on frontend (https://github.com/woocommerce/woocommerce-blocks/pull/9129)
* Fix review count not displaying on Product Rating

* Fix PHP CS errors

* Add Customer Reviews count to the Product Rating block on the Editor

* Remove unnecessary var_dump
2023-04-28 14:26:43 -03:00
Mike Jolley 2d506f9f57 Fix/you do not need lodash (https://github.com/woocommerce/woocommerce-blocks/pull/9161)
* Remove lodash `without` usage

* isNumber

* Remove lodash `difference`

* Replace lodash isEmpty with type guard

* Replace isObject with type guard

* remove lodash noop

* Replace lodash clamp

* replace lodash uniqueId

* Remove uniqueId import

* Add eslint rule to restrict lodash import

* Replace lodash range

* Replace lodash has() function

Replace lodash has

* replace omitby

* Replace lodash isEqual with fastDeepEqual

* Replace kebabCase with change-case package

* Replace lodash camelCase

Replace lodash mapKeys with function

Move mapkeys to utility

Create camelCaseKeys which replaces usage of mapKeys

* Replace lodash debounce with custom utiity

* replace lodash keyby

* Replace lodash pick with native function

* Replace lodash cloneDeep with klona

* Replace snake case keys package with change case

* Replace sortBy with fast sort package

* replace isEmpty with type guard

* Replace pickBy usage in validation reducer

* Replace groupBy usage in search list control

* Replace flatten, uniqBy usage in getProducts()

* Remove setWith and clone from updateState

* Replace custom useThrottle with useThrottledCallback from use-debounce package

* onSelectRate can use-debounce

* Fix missing flatten

* Update assets/js/data/cart/test/push-changes.ts

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
2023-04-28 11:29:45 +01:00
Tom Cafferkey a22ab08410 Remove min-height and padding for WP Button elements (https://github.com/woocommerce/woocommerce-blocks/pull/9260)
* Remove min-height and padding for WP Button elements

* Remove commented out code

* Add min-height style back in for .woocommerce-block-theme-has-button-styles themes
2023-04-28 10:49:12 +01:00
Manish Menaria 1e1b82ad63 Products block: Using nested selector to add margin between Product elements (https://github.com/woocommerce/woocommerce-blocks/pull/8993)
* Using nested selector to style Product elements in Products Block

This commit simplifies the INNER_BLOCKS_TEMPLATE array in the product-query constants.ts file by removing the style properties from the individual elements. Instead, the default styles are now managed in the style.scss file, providing a more consistent and centralized approach to styling.

In the style.scss file, a new section for default styling has been added to handle product elements inside the Products Block, adhering to the Gutenberg styling hierarchy. This ensures the lowest precedence in the hierarchy, allowing for easier overrides when needed.

* Decrease specificity of styles for product elements in Products Block

The commit changes the default styles for product elements inside the 'Products Block'. It changes the way the margin-bottom and margin-top properties are set by using the :where() selector instead of using the .products-block-post-template class selector. This is done to decrease the specificity of the CSS selector, ensuring that the styles have the lowest precedence in the hierarchy. It also removes the display: inline-block property from the a selector, and moves the styles to the .editor-styles-wrapper class selector.

* Decrease specificity of CSS selectors

In these changes, the product elements inside the Products Block have been restyled. The specificity of the CSS selector has been decreased using the :where() selector, to ensure that these styles have the lowest precedence in the hierarchy.

In constants.ts, a new class name, products-block-post-template, has been added to the inner block template for the post. This class is used to add default styles for inner blocks.

In style.scss, the CSS selector for the inner blocks has been updated to include the new class name. The :where() selector has also been used to ensure that these styles have the lowest precedence in the hierarchy.

* Update default margins and remove redundant entries

This commit updates the default margin values for the Product Title in the Products block, moving them from the style.scss file to the constants.ts file. It also removes unnecessary empty arrays in the INNER_BLOCKS_TEMPLATE and background-color property from the style.scss file.
2023-04-28 07:43:47 +00:00
Alexandre Lara aacd82c8fb Single Product block: Add wide and full-width alignments support (https://github.com/woocommerce/woocommerce-blocks/pull/8981)
* Add align support to single product block

* Fix block alignment that was not being set on the frontend

* Remove classname prop from the Single Product Edit component
2023-04-27 16:44:10 -03:00
Luigi Teschio 1d0ff02f8f Rename Add To Cart Form to Add To Cart Options (https://github.com/woocommerce/woocommerce-blocks/pull/9238) 2023-04-27 17:05:50 +00:00
Alba Rincón 4cea6664a5 [Patterns]: Add new `Header Centered Search` pattern (https://github.com/woocommerce/woocommerce-blocks/pull/9081)
* Add new `Header Centered Search` pattern

* Add margin support to the customer account block

* Add margin to the customer account to separate it from the search bar

* Update margin

* Add with, fix margins

* Remove unnecessary separator

* Updates after review

* Remove ref

* Remove separator

* Bring back separator and use product search

* Remove html block and fix search border
2023-04-27 10:23:24 +02:00
Albert Juhé Lluveras 0dae33e4b9 Use currentColor for Mini Cart footer border (https://github.com/woocommerce/woocommerce-blocks/pull/9245) 2023-04-26 16:59:35 +02:00
Luigi Teschio 8e0709eb9a Update the icon and description for the Product Details block (https://github.com/woocommerce/woocommerce-blocks/pull/9241)
* Update icon and description for the Product Details block

* fix alt
2023-04-26 16:19:01 +02:00
Luigi Teschio 2ca2287cb8 Update icon and description for the Product Meta block (https://github.com/woocommerce/woocommerce-blocks/pull/9243)
* Update icon and description for the Product Meta block

* fix alt
2023-04-26 12:16:54 +00:00
Albert Juhé Lluveras cb8040f7b0 Mini Cart Contents block: fix wide width not being applied in the editor (https://github.com/woocommerce/woocommerce-blocks/pull/9201) 2023-04-26 12:16:43 +02:00
Albert Juhé Lluveras 96bd0432cd Mini Cart Contents block: set minimum width (https://github.com/woocommerce/woocommerce-blocks/pull/9196)
* Mini Cart Contents block: set minimum width

* Mini Cart Contents block: allow changing the width only in the feature plugin

* Allow resetting the Mini Cart Contents width to the default

* Update assets/js/blocks/mini-cart/mini-cart-contents/edit.tsx

Co-authored-by: Karol Manijak <karol.manijak@automattic.com>

---------

Co-authored-by: Karol Manijak <karol.manijak@automattic.com>
2023-04-25 18:54:35 +02:00
Albert Juhé Lluveras ce97f918ea Mini Cart block: fix slide in animation (https://github.com/woocommerce/woocommerce-blocks/pull/9195) 2023-04-25 13:39:21 +02:00
Thomas Roberts 30aecd2068 Reinstate "Hide shipping costs until an address is entered" but disable it when using local pickup (https://github.com/woocommerce/woocommerce-blocks/pull/8964)
* Add class property to track local pickup enabled

* Force shipping enabled only when local pickup is also enabled

Otherwise, skip filtering and leave it to the current value

* Disabled and add text to WC Core hide shipping option

* Skip forcing shipping to be enabled in all cases

* Remove WC Core setting changes for hidden shipping rates option

* Add warning to local pickup UI about hidden rates setting in core

* Add local_pickup_enabled util function

* Revert "Skip forcing shipping to be enabled in all cases"

This reverts commit 0bf1886e73d791f7828ac86988f681cdce808b12.

* Check if local pickup is enabled before force enabling shipping

* Show correct shipping placeholder if rates hidden until address entered

* Remove tests for removed functionality

* Remove shippingCostRequiresAddress prop

* Update tests for shipping settings

* Remove irrelevant tests and fix existing ones

* Fix typo in comment

* Disable local pickup after each test

* Get shipping data from useCustomerData hook

* Change div in help prop to span

This prevents a DOM Nesting error, div cannot appear as a descendant of p

* Prevent hide shipping notice showing if the setting was originally off
2023-04-22 02:10:11 -07:00
Tarun Vijwani e39a27bd74 Add theme-level global styles to Cart and Checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/8809)
* Dummy commit to open a PR

* Revert the last change

* Ensure Checkout block supports the theme-level global styles for `Colors » Buttons` (https://github.com/woocommerce/woocommerce-blocks/pull/8844)

* Add GS support for button colors in Checkout block

* Sync button hover effect with GB

* Fix link margin/padding (https://github.com/woocommerce/woocommerce-blocks/pull/8908)

* Replace <AddToCartButton /> with <ProductButton /> (https://github.com/woocommerce/woocommerce-blocks/pull/8914)

* Add GS support for button typography in Checkout block (https://github.com/woocommerce/woocommerce-blocks/pull/8918)

* Ensure Checkout block supports the theme-level global styles for Typography » Buttons (https://github.com/woocommerce/woocommerce-blocks/pull/8892)

* Remove classname from cart image to avoid conflicts (https://github.com/woocommerce/woocommerce-blocks/pull/8898)

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

* Use consistent and semantically correct HTML elements in the Cart and Checkout blocks (https://github.com/woocommerce/woocommerce-blocks/pull/9065)

* Allow button height to adjust

* Ensure to display full width heading background

* Inherit font style and font weight for headings

* Inherit font style and font weight for textarea

* Inherit font family and font weight for buttons

---------

Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Mike Jolley <mike.jolley@me.com>
2023-04-22 00:11:10 +04:00
Kirtan Gajjar 030a9ae267 Fix filter by stock status dropdown ordering (https://github.com/woocommerce/woocommerce-blocks/pull/9127)
* Fix filter by stock status dropdown ordering

* Update assets/js/blocks/stock-filter/utils.ts

Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>

* Update assets/js/blocks/stock-filter/utils.ts

Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>

---------

Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
2023-04-21 14:04:34 -03:00
Albert Juhé Lluveras 87ce986719 Fix image editor in Featured Product/Category blocks on WP 6.2 (https://github.com/woocommerce/woocommerce-blocks/pull/9142) 2023-04-20 15:56:42 +02:00
Siddharth Thevaril cb378d2e9d fix/8129: remove rounding the caused issue with UI (https://github.com/woocommerce/woocommerce-blocks/pull/9118)
* remove rounding the caused issue with UI

* jslint autofixes

---------

Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Karol Manijak <karol.manijak@automattic.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
2023-04-20 08:41:36 -03:00
Luigi Teschio 7b2830eafa wrap getComputedStyle function inside a useMemo (https://github.com/woocommerce/woocommerce-blocks/pull/9132) 2023-04-20 11:30:29 +02:00
Siddharth Thevaril b3acdea73c add cursor:pointer to checkbox and radio fields (https://github.com/woocommerce/woocommerce-blocks/pull/9102)
Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
2023-04-20 12:40:02 +07:00
Dharmesh Patel 32f43e3d84 fix/8651: Use body background color as the Cart block sticky footer background color (https://github.com/woocommerce/woocommerce-blocks/pull/9103)
* Use body background color as the Cart block sticky footer background color

* Reduce the opacity of box-shadow.

* Fix the Proceed to Checkout button cut off.
2023-04-19 18:15:10 +01:00
Siddharth Thevaril 50f08e6143 fix/8946: replace ToggleGroupControl with ToggleControl (https://github.com/woocommerce/woocommerce-blocks/pull/9098)
* replace ToggleGroupControl with ToggleControl

* eslint fix

* Fix linting in assets/js/mini-cart/edit.tsx file

---------

Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Karol Manijak <karol.manijak@automattic.com>
2023-04-19 17:45:48 +02:00
Dharmesh Patel 4743d4fd93 fix/8363: Match checkout block Place order button UI with frontend (https://github.com/woocommerce/woocommerce-blocks/pull/9094)
Co-authored-by: Niels Lange <info@nielslange.de>
2023-04-19 14:09:06 +01:00
Karol Manijak 21269963e8 Get product by ID if there's more products returned from useStoreProducts (https://github.com/woocommerce/woocommerce-blocks/pull/9079)
* Get product by ID if there's more products returned from useStoreProducts
2023-04-19 09:52:16 +02:00
Luigi Teschio 4fbf32cef6 Product SKU: fix product SKU when added in the product meta block (https://github.com/woocommerce/woocommerce-blocks/pull/8966) 2023-04-19 07:47:03 +00:00
Darren Ethier 732827e60b Fix broken post/page editor screens in WordPress versions earlier than 6.2 (https://github.com/woocommerce/woocommerce-blocks/pull/9090)
* Fix infinite loop (range error) on subscribe callback.

* Replace getEditedPostContext with getEditedPostId to retrieve the templateId from the Site Editor for 6.1.1 compatibility

---------

Co-authored-by: tjcafferkey <tjcafferkey@gmail.com>
2023-04-19 09:08:40 +02:00
Karol Manijak f3c28b9d78 Pass proper data to On Sale badge when used in the scope of Product Image (https://github.com/woocommerce/woocommerce-blocks/pull/9021)
* Don't use withProductDataContext in Sale Badge block

There was no information about product passed to the block, so it fetched information about all products which then wasn't even used

* Pass necessary props to the Sale Badge so it doesn't overfetch unnecessary data

* Move the import to the previous place
2023-04-18 14:53:50 +02:00
Manish Menaria be5356d30a Product Stock indicator: Add support for background color, margin, padding & various typography controls (https://github.com/woocommerce/woocommerce-blocks/pull/8954)
* Add color, typography, and spacing support to Product SKU block

This commit introduces a new file `supports.ts` for the Product SKU block in the WooCommerce Blocks plugin, which adds color, typography, and spacing support. The following configuration has been added:

1. In `assets/js/atomic/blocks/product-elements/sku/supports.ts`, a new `supports` object is created, which extends the shared configuration and adds support for the following properties:
  - `text` and `background` color
  - `fontSize`, `lineHeight`, `__experimentalFontWeight`, `__experimentalFontFamily`, `__experimentalFontStyle`, `__experimentalTextTransform`, `__experimentalTextDecoration`, and `__experimentalLetterSpacing` for typography
  - `margin` and `padding` for spacing

* Add color, typography, and spacing support for Product SKU block in All Products block

This commit extends the support for color, typography, and spacing to the Product SKU block when used within the All Products block. The following changes have been made:

1. In `assets/js/atomic/blocks/product-elements/sku/block.tsx`, the `useColorProps`, `useSpacingProps`, and `useTypographyProps` hooks are imported and used to add the appropriate className and style properties to the rendered SKU element.
2. In `assets/js/atomic/blocks/product-elements/sku/edit.tsx`, the `style` property is separated from `useBlockProps()` and used directly on the `div` element for the SKU block.

* Add server-side rendering class for Product SKU Gutenberg block

This commit adds the ".wp-block-woocommerce-product-sku" class to the Product SKU Gutenberg block for server-side rendering purposes. The inclusion of this class ensures consistent styling between the editor and the front-end view of the block, providing a seamless experience for users.

The class name is generated based on the Gutenberg block prefix "wp-block", the namespace "woocommerce", and the block name "product-sku", creating a unique and identifiable class for the block. This class enables developers to target the block specifically in both the editor and front-end styles, maintaining the integrity of the block's appearance and functionality across different environments.

By adding this class to the server-side rendered version of the block, we ensure a unified and coherent styling experience throughout the block's usage.

* Fix minor issues

* Gate only experimental features behind isFeaturePluginBuild flag

This commit refactors the Product SKU block supports to enable color, typography, and spacing features for all builds, while keeping experimental features specific to the feature plugin build. It also adds necessary lint and TypeScript error handling for the experimental spacing API.

* Add overflow-wrap to Product SKU block and update comment

This commit adds the overflow-wrap property to the Product SKU block styles to handle long SKU values gracefully.
It also updates the comment for the experimental spacing API to better reflect the usage check.

* Refactor Product SKU block classname and style handling

This commit refactors the Product SKU block classname and style handling. It combines classnames for better readability and removes the hardcoded textTransform style in favor of default styles.
This also fix the issue where textTransform style was not working as expected.

* Add support for color, typography and spacing to stock indicator block

This commit updates the stock-indicator block support in the woocommerce-blocks repository. It includes the following changes:

- Added support for background color, line height, and various experimental typography features.
- Conditionally included support for margin and padding based on the availability of the __experimentalGetSpacingClassesAndStyles function from the @wordpress/block-editor package.

These updates provide more customization options for the stock-indicator block, allowing users to better match the appearance of this element to their site's design.

* Refactor stock text generation and apply minor style adjustments

This commit introduces a new function, `getTextBasedOnStock`, which handles the generation of stock text based on the stock information provided. It replaces the previous `lowStockText` and `stockText` functions, making the code more readable and maintainable.

In addition, minor adjustments to the class name handling have been made to simplify the code and ensure consistent styling when used inside the All Products block.

In the `edit.tsx` file, the `useBlockProps` function call has been updated to include the default `wc-block-components-product-stock-indicator` class name, ensuring it is always applied.

* Remove redundant block type supports in ProductStockIndicator

This commit removes the redundant get_block_type_supports() method from the ProductStockIndicator.php file, as it is no longer needed. The block type supports are now handled in the frontend.
2023-04-18 09:50:11 +00:00
Albert Juhé Lluveras cb9980c519 Mini Cart: Remove excessive margin under cart items (https://github.com/woocommerce/woocommerce-blocks/pull/9051) 2023-04-17 18:52:43 +02:00
leonardo lopes de albuquerque c58a09a8ef Fixed trim is not a function error when address has an attribute that is not a string (https://github.com/woocommerce/woocommerce-blocks/pull/8988) 2023-04-17 13:57:09 +00:00
Albert Juhé Lluveras 6123ba4433 Fix Mini Cart drawer not opening in RTL locales (https://github.com/woocommerce/woocommerce-blocks/pull/9066) 2023-04-17 10:02:26 +02:00
Albert Juhé Lluveras 779e13af15 Fix JS error visible in the editor caused by Mini Cart Contents buttons (https://github.com/woocommerce/woocommerce-blocks/pull/9039) 2023-04-14 16:53:39 +02:00
Alexandre Lara 0ad067d8a9 Add save method to Product Meta block (https://github.com/woocommerce/woocommerce-blocks/pull/9032) 2023-04-14 08:52:19 -03:00
Albert Juhé Lluveras c63923e2fb Display Mini Cart overlay in template part editor (https://github.com/woocommerce/woocommerce-blocks/pull/9014) 2023-04-14 10:44:09 +02:00
Alba Rincón b6039d1d74 Mini cart: allow changing the drawer width (https://github.com/woocommerce/woocommerce-blocks/pull/8930)
* WIP

* Add width control to the settings sidebar

* Fix linting errors

* Remove comments

* Inline function

* Fix issue with smaller viewports

* Remove unnecessary code
2023-04-14 09:48:55 +02:00
Alba Rincón 709a7a9add [Mini cart] Make the title customizable (https://github.com/woocommerce/woocommerce-blocks/pull/8905)
* Create the counter block and the header pattern

* Change the pattern to an inner block

* Allow customizing item counter block

* Rename block

* Allow removing the items counter block

* Add padding controls

* Preload new blocks

* Add title block back from the inserter

* Move h2 tag to the parent title

* Align items at the bottom

* Unify styles

* Add title class in the editor

* Prevent removing title blocks

* Disallow unlocking and inserter

* Disallowing moving blocks
2023-04-14 09:21:21 +02:00
Luigi Teschio c3f585ef55 Product SKU: fix preview on the Single Product Block (https://github.com/woocommerce/woocommerce-blocks/pull/8805) 2023-04-13 19:10:41 +02:00
Alexandre Lara aaeb6af909 Customer Account block: Fix padding for the block in the Editor (https://github.com/woocommerce/woocommerce-blocks/pull/9009)
* Fix padding for the Customer Account block in the Editor

* Add padding to Customer Account block icon
2023-04-13 09:36:38 -03:00
Alexandre Lara 8889ba43f2 Fix inspector control border for the Customer Account block (https://github.com/woocommerce/woocommerce-blocks/pull/9008) 2023-04-12 14:12:54 -03:00
Luigi Teschio 4d1604bdd0 Product Price Block: remove ProductSelector (https://github.com/woocommerce/woocommerce-blocks/pull/8980) 2023-04-12 18:27:02 +02:00
Luigi Teschio 6c86d45951 Skeleton component: fix warning about key prop (https://github.com/woocommerce/woocommerce-blocks/pull/9018) 2023-04-12 16:04:05 +02:00
Patricia Hillebrandt 3c0463ada1 Filter data count mismatch > Create the get_attribute_and_meta_counts method (https://github.com/woocommerce/woocommerce-blocks/pull/8599)
* Introduce the new get_attribute_and_meta_counts method.

* Ensure that if no term_slug or term_id is found for counting, the default list with all terms (with count equal zero) is returned instead.

* update conditional for the slug, the empty state for requests without filter attributes and the condition query for 'and'

* Introduce the get_terms_list method.

* Remove the legacy get_attribute_counts method and update its calls to rely on the new get_attribute_and_meta_counts method instead.

* Update the query to ensure that if a parent product has multiple identical attributes, they are counted once.

* Update to start relying on the get_product_by_metas method for counting product metas

* Add a new where_clause to only include product metas and attributes in the macro query if they are not empty.

* Add wpdb->prepare to the macro query and the get_terms_list method.

* Replace the raw atomic query for fetching the filtered terms with the new get_product_by_filtered_terms method.

* Update the request params for the get_attribute_and_meta_counts method.

* Update the request params for the product metas (min and max price).

* Update the query and returned value on get_terms_list.

* Update the validation for returning the default counts when no values are filtered.

* Update the query on get_terms_list to use ->prefix

* Update the  variable for the query to rely on the filtered one. Update the min_price and max_price format on get_product_by_metas.

* Ensure the get_product_by_filtered_terms method is triggered for each one of the filtered terms and update the macro query to include those term ids on the WHERE clause.

* Make adjustments for the 'and' condition to work as expected.

* Ensure the queryState.attributes is properly added as a param to the API request to correctly fetch the attribute count data.

* Ensure the get_product_by_metas method is only triggered when at least one of the metas in the request is not empty.

* Join type update: for the 'and' (all) filter condition, items with the count zero are not displayed.

* wpdb prepare the where clauses

* Update the get_product_by_filtered_terms query wpdb prepare params

* update the get_product_by_metas method's where clause preparation.

* Update the where clause preparation for get_attribute_and_meta_counts so we don't rely on interpolated variables anymore.

* Adjust the get_attribute_and_meta_counts method for usage alongside the rating filter.

* Adjust the query for fetching the attribute counts for filtered ratings.

* Add support for the filter by stock.

* Ensure the product attribute counts are correct if the parent product receives a rating.

* Ensure product_or_parent_id is used only when the filter by rating is used, not affecting price or stock filters.

* Add the missing else condition.

* Enable caching.

* Address CR

* Update query for average rating.

* remove file accidentally commited.

* When multiple ratings are selected, make sure the where clause is updated accordingly for each one of them.

* Start updating the stock_status logic to account for when multiple options are selected by the user.

* Ensure the counts are properly updated when more than one stock status is selected.

* Ditch the is_array condition for the average_rating counts as  is always an array.

* Deprecate the second param attributes for the get_attribute_counts method.

* Add the filtered_attribute to the transient_key

* Bypass cache if WP_DEBUG is enabled.

* Update formatting for macro query.

* Fix mixed tabs spaces on query

* Update spacing/formatting for SQL queries.

* Minor: update indentation for the main SQL query

---------

Co-authored-by: roykho <roykho77@gmail.com>
2023-04-11 12:32:24 -03:00
Alexandre Lara 53eb5b9219 Single Product Block: Add block preview (https://github.com/woocommerce/woocommerce-blocks/pull/8923)
* Add block minimal structure

* Add Single Product block icon

* Add usesContext to block.json

* Add Save function to Single Product Block registration settings

* Add InnerBlocks template to Editor for Single Product Block

* Add Product selector to Single Product block

* Add withProduct HOC to the block editor

* Add save function to the Single Product block

* Add renderOnServerSide attribute to Product image

This attribute is used to determine if the product image should be rendered on the server side or not. This is needed because the product image is not rendered on the server side by default, but we want to render it on the server side when it is inside the Single Product block.

* Add renderOnServerSide attribute to Product Category List block

* Add renderOnServerSide attribute to Product Price block

* Add renderOnServerSide attribute to Product Rating block

* Add renderOnServerSide attribute to Product Stock Indicator block

* Add renderOnServerSide attribute to Product Summary block

* Add renderOnServerSide attribute to Product Tag List block

* Add renderOnServerSide attribute to Product Title block

* Add renderOnServerSide attribute to Product Add to Cart, Sales Badge and Sku block

* Reuse editor code for Single Product block

* Add Props interface to Single Product Server Side Editor

* Add render_block_context hook to SingleProductServerSide block

* Fix Single Product Server Side block that was not appearing in the block inserter

* Fix bug where the correct product was not being displayed on the frontend

* Remove Single Product Block

* Add Product title and product summary variations

* Add Add To Cart Form and Product Meta blocks to the Single Product Block

* remove more files that belong the Single Product block

* fix php linter error

* wrap up Single Product Block

* Fix issue preventing the block from working on the Single Product Template

* Fix update context function for Single Product block

* Replace Single Product block title

* Replace global $post only for Single Product inner blocks

* Remove unnecessary var_dump statement

* Improve documentation for the Single Product block

* fix registration: add-to-cart-form and product-meta blocks

* Improve documentation for Single Product block

* Fix lint error related to imports

* Remove query monitor debug code

* Remove unnecessary `renderOnServerSide` attribute from product elements

* Fix return type for the Save function of the Product Elements blocks

* Fix return type for the Save function of the Product Title block

* Add scss file for Single Product block

* Fix PHP coding standards

* Fix php coding standards

* Remove internal dependencies section duplication

* Replace .wc-block with .wc-block-editor- styles

According to the naming convention for this project (https://github.com/woocommerce/woocommerce-blocks/blob/trunk/docs/contributors/contributing/coding-guidelines.md#naming) we should be using the `.wc-block-editor-` prefix for styles that are only used in the editor.

* Solve style for the Edit card component in the Single Product block

* Fix error preventing Block Control from being displayed

* Make the Product title to be a link by default

* Fix PHP Coding Standards

* Fix PHP Code Standards

* Fix php cs issues

* Fix issue with php cs

* Remove unnecessary comment

* Remove unused Icon import

* Remove unnecessary dot from the className attributes in the Single Product Block

* Replace metadata.name with metadata.title in the Editor file

* Ignore phpcs rule

* Add new attributes to the Attributes interface of the Price block

* Fix typescript errors on the Product Meta block

* Fix ts errors on Single Product editor

* Fix ts errors on layout-editor.tsx

* Fix ts errors in Single Product index file

* Fix ts errors on add to cart form index file

* Fix unsupported block error when using inner blocks outside the Single Product template

* Fix unsupported block error for the Single Product block when editing Posts/Pages

* Remove unnecessary JSDoc types

* Remove unnecessary APIError component

* Replace global $post only when rendering a `core/post-excerpt` block

* Fix php cs errors

* Put the Single Product block behind an experimental flag

* Enable Single Product block preview

---------

Co-authored-by: Luigi <gigitux@gmail.com>
2023-04-11 11:46:21 -03:00
Alexandre Lara 719fabdc57 Product Image: Displays with different size on the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/8926)
* Add block minimal structure

* Add Single Product block icon

* Add usesContext to block.json

* Add Save function to Single Product Block registration settings

* Add InnerBlocks template to Editor for Single Product Block

* Add Product selector to Single Product block

* Add withProduct HOC to the block editor

* Add save function to the Single Product block

* Add renderOnServerSide attribute to Product image

This attribute is used to determine if the product image should be rendered on the server side or not. This is needed because the product image is not rendered on the server side by default, but we want to render it on the server side when it is inside the Single Product block.

* Add renderOnServerSide attribute to Product Category List block

* Add renderOnServerSide attribute to Product Price block

* Add renderOnServerSide attribute to Product Rating block

* Add renderOnServerSide attribute to Product Stock Indicator block

* Add renderOnServerSide attribute to Product Summary block

* Add renderOnServerSide attribute to Product Tag List block

* Add renderOnServerSide attribute to Product Title block

* Add renderOnServerSide attribute to Product Add to Cart, Sales Badge and Sku block

* Reuse editor code for Single Product block

* Add Props interface to Single Product Server Side Editor

* Add render_block_context hook to SingleProductServerSide block

* Fix Single Product Server Side block that was not appearing in the block inserter

* Fix bug where the correct product was not being displayed on the frontend

* Remove Single Product Block

* Add Product title and product summary variations

* Add Add To Cart Form and Product Meta blocks to the Single Product Block

* remove more files that belong the Single Product block

* fix php linter error

* wrap up Single Product Block

* Fix issue preventing the block from working on the Single Product Template

* Fix update context function for Single Product block

* Replace Single Product block title

* Replace global $post only for Single Product inner blocks

* Remove unnecessary var_dump statement

* Improve documentation for the Single Product block

* fix registration: add-to-cart-form and product-meta blocks

* Improve documentation for Single Product block

* Fix lint error related to imports

* Remove query monitor debug code

* Remove unnecessary `renderOnServerSide` attribute from product elements

* Fix return type for the Save function of the Product Elements blocks

* Fix return type for the Save function of the Product Title block

* Add scss file for Single Product block

* Fix PHP coding standards

* Fix php coding standards

* Remove internal dependencies section duplication

* Replace .wc-block with .wc-block-editor- styles

According to the naming convention for this project (https://github.com/woocommerce/woocommerce-blocks/blob/trunk/docs/contributors/contributing/coding-guidelines.md#naming) we should be using the `.wc-block-editor-` prefix for styles that are only used in the editor.

* Solve style for the Edit card component in the Single Product block

* Fix error preventing Block Control from being displayed

* Make the Product title to be a link by default

* Fix PHP Coding Standards

* Fix PHP Code Standards

* Fix php cs issues

* Fix issue with php cs

* Remove unnecessary comment

* Remove unused Icon import

* Remove unnecessary dot from the className attributes in the Single Product Block

* Replace metadata.name with metadata.title in the Editor file

* Ignore phpcs rule

* Add new attributes to the Attributes interface of the Price block

* Fix typescript errors on the Product Meta block

* Fix ts errors on Single Product editor

* Fix ts errors on layout-editor.tsx

* Fix ts errors in Single Product index file

* Fix ts errors on add to cart form index file

* Fix unsupported block error when using inner blocks outside the Single Product template

* Fix unsupported block error for the Single Product block when editing Posts/Pages

* Remove unnecessary JSDoc types

* Remove unnecessary APIError component

* Replace global $post only when rendering a `core/post-excerpt` block

* Fix php cs errors

* Put the Single Product block behind an experimental flag

* Fix error occurring when trying to access ancestor of an undefined block settings

* Fix Product Image appearing with different size on the Frontend

* Fix PHP Code Standards errors

* Remove JS Doc from shared-product-control.tsx

* Fix single-product-frontend.js 404 error

* Fix error 'Block names must be string' when adding Single Product block

* Add todo comment to state the temporary solution used in the Single Product block

* Set imageSizing attribute on Product Query and Single Product blocks

* Rename values for image size options in the product image block

The previous allowed values were 'cropped' and 'full-size'. The new values are 'thumbnail' and 'single' which are similar to the values used in WooCoomerce.

WooCommerce uses 'woocommerce_thumbnail', 'woocommerce_gallery_thumbnail' and 'woocommerce_single' for images sizes. The 'woocommerce_single' size is used for the Single Product page and the 'woocommerce_thumbnail' size is used for the product grid.

* Fix Related Products image to show as a thumbnail instead of the full size

* Fix PHP CS error

---------

Co-authored-by: Luigi <gigitux@gmail.com>
2023-04-11 11:41:34 -03:00
Thomas Roberts e30c0f5463 Add `validateOnMount` prop to `ValidatedTextInput` (https://github.com/woocommerce/woocommerce-blocks/pull/8889)
* Add validateOnFirstFocus prop

* Only run validation on first focus if validateOnFirstFocus is true

* Rename validateOnFirstFocus to validateOnMount

* Set TotalsCoupon to not validate when the input is mounted

* Add tests for validation error handling

* Fix test that was not making a good assertion

* Add tests for validateOnMount functionality

* Clean up validateOnMount logic, make the code more readable & efficient
2023-04-11 01:50:59 -07:00
Albert Juhé Lluveras d35254f537 Create specific stylesheet for CartLineItemsTable component (https://github.com/woocommerce/woocommerce-blocks/pull/8967) 2023-04-11 09:51:09 +02:00
Daniel Dudzic b95812da5f Product Rating: Normalize the height of rating icons and the Add review link (https://github.com/woocommerce/woocommerce-blocks/pull/8399) 2023-04-06 15:35:48 -04:00
Alexandre Lara 7965a07870 Add single product block (https://github.com/woocommerce/woocommerce-blocks/pull/8610)
* Add block minimal structure

* Add Single Product block icon

* Add usesContext to block.json

* Add Save function to Single Product Block registration settings

* Add InnerBlocks template to Editor for Single Product Block

* Add Product selector to Single Product block

* Add withProduct HOC to the block editor

* Add save function to the Single Product block

* Add renderOnServerSide attribute to Product image

This attribute is used to determine if the product image should be rendered on the server side or not. This is needed because the product image is not rendered on the server side by default, but we want to render it on the server side when it is inside the Single Product block.

* Add renderOnServerSide attribute to Product Category List block

* Add renderOnServerSide attribute to Product Price block

* Add renderOnServerSide attribute to Product Rating block

* Add renderOnServerSide attribute to Product Stock Indicator block

* Add renderOnServerSide attribute to Product Summary block

* Add renderOnServerSide attribute to Product Tag List block

* Add renderOnServerSide attribute to Product Title block

* Add renderOnServerSide attribute to Product Add to Cart, Sales Badge and Sku block

* Reuse editor code for Single Product block

* Add Props interface to Single Product Server Side Editor

* Add render_block_context hook to SingleProductServerSide block

* Fix Single Product Server Side block that was not appearing in the block inserter

* Fix bug where the correct product was not being displayed on the frontend

* Remove Single Product Block

* Add Product title and product summary variations

* Add Add To Cart Form and Product Meta blocks to the Single Product Block

* remove more files that belong the Single Product block

* fix php linter error

* wrap up Single Product Block

* Fix issue preventing the block from working on the Single Product Template

* Fix update context function for Single Product block

* Replace Single Product block title

* Replace global $post only for Single Product inner blocks

* Remove unnecessary var_dump statement

* Improve documentation for the Single Product block

* fix registration: add-to-cart-form and product-meta blocks

* Improve documentation for Single Product block

* Fix lint error related to imports

* Remove query monitor debug code

* Remove unnecessary `renderOnServerSide` attribute from product elements

* Fix return type for the Save function of the Product Elements blocks

* Fix return type for the Save function of the Product Title block

* Add scss file for Single Product block

* Fix PHP coding standards

* Fix php coding standards

* Remove internal dependencies section duplication

* Replace .wc-block with .wc-block-editor- styles

According to the naming convention for this project (https://github.com/woocommerce/woocommerce-blocks/blob/trunk/docs/contributors/contributing/coding-guidelines.md#naming) we should be using the `.wc-block-editor-` prefix for styles that are only used in the editor.

* Solve style for the Edit card component in the Single Product block

* Fix error preventing Block Control from being displayed

* Make the Product title to be a link by default

* Fix PHP Coding Standards

* Fix PHP Code Standards

* Fix php cs issues

* Fix issue with php cs

* Remove unnecessary comment

* Remove unused Icon import

* Remove unnecessary dot from the className attributes in the Single Product Block

* Replace metadata.name with metadata.title in the Editor file

* Ignore phpcs rule

* Add new attributes to the Attributes interface of the Price block

* Fix typescript errors on the Product Meta block

* Fix ts errors on Single Product editor

* Fix ts errors on layout-editor.tsx

* Fix ts errors in Single Product index file

* Fix ts errors on add to cart form index file

* Fix unsupported block error when using inner blocks outside the Single Product template

* Fix unsupported block error for the Single Product block when editing Posts/Pages

* Remove unnecessary JSDoc types

* Remove unnecessary APIError component

* Replace global $post only when rendering a `core/post-excerpt` block

* Fix php cs errors

* Put the Single Product block behind an experimental flag

* Fix error occurring when trying to access ancestor of an undefined block settings

* Remove JS Doc from shared-product-control.tsx

* Fix single-product-frontend.js 404 error

* Fix error 'Block names must be string' when adding Single Product block

* Add todo comment to state the temporary solution used in the Single Product block

* Move the wp_reset_postdata outside the block name check condition

* Add comments about why we need to unregister the block on Single Product template

---------

Co-authored-by: Luigi <gigitux@gmail.com>
2023-04-06 15:40:43 -03:00
Thomas Roberts 3d62b6da78 Set Cart and Checkout blocks to be wide aligned by default (https://github.com/woocommerce/woocommerce-blocks/pull/8899)
* Add default align attribute value for Cart block

* Add default align attribute value for Checkout block

* Update cart tests

* Check for not disabled insert button
2023-04-06 06:42:38 -07:00
Karol Manijak fcdd0f243c Stop displaying decimals in Filter by Price (https://github.com/woocommerce/woocommerce-blocks/pull/8975)
* Remove the decimals from Filter by Price

* Simplify the props in Filter by Price by reusing the common ones
2023-04-06 14:58:07 +02:00
Thomas Roberts f4f842e716 Add "Collection from..." in Checkout sidebar when selecting local pickup (https://github.com/woocommerce/woocommerce-blocks/pull/8305)
* Add get_collectible_method_ids function

* Add collectibleMethodIds to asset data registry

* Remove unnecessary pluck and add pickup_location to returned array

* Add hasSelectedLocalPickup to shipping types

* show shipping address even if collecting

* Make checkout store set prefersCollection based on IDs from settings

* Move areRatesCollectible outside of hook

* Add pickup location component

* Show pickup location if user prefers collection

* Move prefersCollection check into ShippingAddress component

* Remove spread for collectibleMethodIds

Not needed now since pickup_location is included in the setting by default

* Check address metadata has a value before displaying it

* Add tests for ShippingAddress component

* Move PickupLocation specific tests to new file

* Ensure TotalsShipping shows only one package rate if local pickup chosen

* Update prefersCollection selector to use typeof check

* Use isPackageRateCollectible rather than checking against settings

* Do not show calculator button if local pickup rate is selected

* Update test to mock correct setting

* Remove unused method from ShippingController

* Check isPackageRateCollectable rather than checking settings array

* Update test to mock correct setting

* Change spelling of collectible to collectable

* Improve mocked useSelect function

Old one returned incorrect data shape for prefersCollection

* Remove duplicate import
2023-04-06 04:56:47 -07:00
Mike Jolley 62c62d3326 Checkout Block: Avoid using editor buttons in the post content to prevent inheriting global styles (https://github.com/woocommerce/woocommerce-blocks/pull/8957)
* Remove express payment placeholders when there are no express payment methods

* Only use one instance of CartCheckoutFeedbackPrompt

* Show NoPaymentMethods notice in the inspector instead of the block

* Move privacy notices to inspector

* Unused hook

* Update tests to use mocks
2023-04-06 12:16:42 +01:00
Mike Jolley e977882a74 Error to warning (https://github.com/woocommerce/woocommerce-blocks/pull/8969) 2023-04-06 10:42:04 +01:00
Manish Menaria c497190936 Product SKU: Adds support for color, typography, and spacing (https://github.com/woocommerce/woocommerce-blocks/pull/8913)
* Add color, typography, and spacing support to Product SKU block

This commit introduces a new file `supports.ts` for the Product SKU block in the WooCommerce Blocks plugin, which adds color, typography, and spacing support. The following configuration has been added:

1. In `assets/js/atomic/blocks/product-elements/sku/supports.ts`, a new `supports` object is created, which extends the shared configuration and adds support for the following properties:
  - `text` and `background` color
  - `fontSize`, `lineHeight`, `__experimentalFontWeight`, `__experimentalFontFamily`, `__experimentalFontStyle`, `__experimentalTextTransform`, `__experimentalTextDecoration`, and `__experimentalLetterSpacing` for typography
  - `margin` and `padding` for spacing

* Add color, typography, and spacing support for Product SKU block in All Products block

This commit extends the support for color, typography, and spacing to the Product SKU block when used within the All Products block. The following changes have been made:

1. In `assets/js/atomic/blocks/product-elements/sku/block.tsx`, the `useColorProps`, `useSpacingProps`, and `useTypographyProps` hooks are imported and used to add the appropriate className and style properties to the rendered SKU element.
2. In `assets/js/atomic/blocks/product-elements/sku/edit.tsx`, the `style` property is separated from `useBlockProps()` and used directly on the `div` element for the SKU block.

* Add server-side rendering class for Product SKU Gutenberg block

This commit adds the ".wp-block-woocommerce-product-sku" class to the Product SKU Gutenberg block for server-side rendering purposes. The inclusion of this class ensures consistent styling between the editor and the front-end view of the block, providing a seamless experience for users.

The class name is generated based on the Gutenberg block prefix "wp-block", the namespace "woocommerce", and the block name "product-sku", creating a unique and identifiable class for the block. This class enables developers to target the block specifically in both the editor and front-end styles, maintaining the integrity of the block's appearance and functionality across different environments.

By adding this class to the server-side rendered version of the block, we ensure a unified and coherent styling experience throughout the block's usage.

* Fix minor issues

* Gate only experimental features behind isFeaturePluginBuild flag

This commit refactors the Product SKU block supports to enable color, typography, and spacing features for all builds, while keeping experimental features specific to the feature plugin build. It also adds necessary lint and TypeScript error handling for the experimental spacing API.

* Add overflow-wrap to Product SKU block and update comment

This commit adds the overflow-wrap property to the Product SKU block styles to handle long SKU values gracefully.
It also updates the comment for the experimental spacing API to better reflect the usage check.

* Refactor Product SKU block classname and style handling

This commit refactors the Product SKU block classname and style handling. It combines classnames for better readability and removes the hardcoded textTransform style in favor of default styles.
This also fix the issue where textTransform style was not working as expected.
2023-04-06 11:30:27 +05:30
Mike Jolley 7a89cecb6b Feature Branch: Updated Shopper Notices (https://github.com/woocommerce/woocommerce-blocks/pull/8659)
* Notice banner component

* Snackbar support

* Switch to new components

* Finish snackbar implementation

* Summary notice

* Styling issues

* Fix text wrap in shipping calculator

* Storybook entries

* Docs and tests for NoticeBanner

* Framer motion to avoid components dependency

* Snackbar list stories

* Docs for snackbar list

* Update assets/js/base/components/notice-banner/README.md

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

* Update assets/js/base/components/notice-banner/README.md

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

* Update assets/js/base/components/notice-banner/README.md

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

* Update assets/js/base/components/notice-banner/README.md

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

* Update assets/js/base/components/notice-banner/README.md

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

* Types/docblocks

* Docs

* Update notice type

* Use NoticeBannerProps for type of noticeProps

* Raw html to fix notice encoding

* getClassNameFromStatus is unused

* Update position text

* Clarify notice text

* Fix hover style in whisper TT3 theme

* remove div styles

* Add new templates for legacy buyer notices in WooCommerce core (https://github.com/woocommerce/woocommerce-blocks/pull/8732)

* Add templates for legacy core notices

* Update src/Domain/Services/Notices.php

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

* Remove debugging code

* DRY get_notices_template

* Simplify error template

* Fix padding

* Only include new notices if using block cart/checkout

---------

Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>

* Fix view box tag

* Hover and focus styles

* Styling when notices added via ajax

* Remove margin change

* Implement react-transition-group instead of framer (https://github.com/woocommerce/woocommerce-blocks/pull/8920)

* Add screenshots to docs

---------

Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
2023-04-05 13:43:03 +01:00
Alexandre Lara 2f98513cd8 Add to Cart Form: Replace Notice with Skeleton component (https://github.com/woocommerce/woocommerce-blocks/pull/8842)
* Add Skeleton component

* Replace notice with skeleton on Add to Cart Form block

* Fix css lint error

* add tooltip

* fix css linter

* add css for change cursor

---------

Co-authored-by: Luigi <gigitux@gmail.com>
2023-04-05 09:38:58 -03:00
Manish Menaria e1183211e5 Product Price: support for background color, line height, font family, letter spacing, and padding (https://github.com/woocommerce/woocommerce-blocks/pull/8906)
* Add typography and spacing support to Product Price block

This commit adds additional typography and spacing support to the Product Price block. The following changes have been made:

1. In `assets/js/atomic/blocks/product-elements/price/block.tsx`, the `typographyProps.className` has been added to the `classNames` function to apply the typography styles.

2. In `assets/js/atomic/blocks/product-elements/price/supports.ts`, the following support attributes have been added to the `typography` object:
  - `lineHeight`
  - `__experimentalFontFamily`
  - `__experimentalLetterSpacing`
Additionally, the `padding` attribute has been added to the `spacing` object.

3. In `src/BlockTypes/ProductPrice.php`, the `StyleAttributesUtils::get_classes_and_styles_by_attributes` function has been updated to receive all attributes instead of a predefined list.

* Enable background color support for Product Price block

This commit enables the background color support for the Product Price block in the WooCommerce Blocks plugin. The following change has been made:

1. In `assets/js/atomic/blocks/product-elements/price/supports.ts`, the `background` property within the `color` object has been changed from `false` to `true`, allowing users to set the background color for the Product Price block.
2023-04-04 10:08:45 +00:00
kmanijak c81e5d8da6 Move surrounding blocks from Products block when converting the Classic Template to Blockified one (https://github.com/woocommerce/woocommerce-blocks/pull/8887)
* Move blocks outside of Products block when convering Propduct Archive to the blockified version

* Move blocks outside of Products block when convering Product Search Result to the blockified version

* Move blocks outside of Products block in blockified templates

* Make sure Term description is still removed from Product Catalog template
2023-04-03 16:29:08 +02:00
Alexandre Lara 7e9a4105f2 Prevent image placeholder from going outside its wrapper (https://github.com/woocommerce/woocommerce-blocks/pull/8901) 2023-03-31 14:36:17 -03:00
Mike Jolley af0520bb8d Show Cart and Checkout blocks in Style Book (https://github.com/woocommerce/woocommerce-blocks/pull/8888)
* Update forced layout

* Track isPreview in editor context

* Add preview to checkout

* Add preview to cart
2023-03-30 15:15:00 +01:00
kmanijak 0262bc2ab7 Make a Single Product conversion enabled in Core, but keep the Product Archive behind experimental flag (https://github.com/woocommerce/woocommerce-blocks/pull/8907) 2023-03-30 15:57:33 +02:00
Daniel W. Robert ae012817cc Remove `isExperimentalBuild` Checks in Classic Template Block (https://github.com/woocommerce/woocommerce-blocks/pull/8902)
* Remove isExperimentalBuild checks.

By removing the `isExperimentalBuild` conditional checks in the Classic
Template block, we can ensure the features added in woocommerce/woocommerce-blocks#8324 will land in
WooCommerce Core and are not limited to the feature plugin.

See p1680000654295729-slack-C02UBB1EPEF for additional context.

* Revert isExperimentalBuild removal on registration

The conditional `isExperimentalBuild` conditional check that was
wrapping some conditional registration of the classic template
block seems to be  unrelated to the template conversion/migration.

This is something we can revisit and test separately but should not be
included in this changeset.
2023-03-30 08:47:02 -04:00
Manish Menaria 392f7e17fe Add padding support for `Product Image` block (https://github.com/woocommerce/woocommerce-blocks/pull/8895)
* Refactor import and add padding support in image block

In this commit, the import statement for __experimentalGetSpacingClassesAndStyles has been refactored to use an alias getSpacingClassesAndStyles for better readability. Additionally, padding support has been added to the image block's spacing configuration.

* Refactor ProductImage to use consolidated style classes and attributes

This commit refactors the ProductImage block by using the consolidated classes and styles provided by the StyleAttributesUtils::get_classes_and_styles_by_attributes() function. This change simplifies the code, improves readability, and ensures consistent handling of styles across different block elements.
2023-03-30 12:35:32 +05:30
Lucio Giannotta e1cccc5b8e Add Product Reviews block (https://github.com/woocommerce/woocommerce-blocks/pull/8857)
---------

Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
2023-03-28 19:14:13 +02:00
Thomas Roberts 182c58d7d0 Add `additionalCartCheckoutInnerBlockTypes` filter to enable additional blocks in the Cart/Checkout blocks. (https://github.com/woocommerce/woocommerce-blocks/pull/8650)
* Add filter to change allowed blocks in Cart and Checkout blocks

* Add documentation for allowedBlockTypes

* Add test to check the filters work for the Checkout block

* Rename filter to additionalCartCheckoutInnerBlockTypes

* Update docs to reflect new name

* Add tests for additionalCartCheckoutInnerBlockTypes in Cart block

* Update Checkout test to reflect new filter name

* Update docs TOC to add example link
2023-03-28 05:33:28 -07:00
Alexandre Lara 0ad16b2686 Add $schema property to block.json files (https://github.com/woocommerce/woocommerce-blocks/pull/8877)
This adds the $schema property to all block.json files. This is required for the block.json files to be valid according to the JSON schema. I noticed that this property was not set for some of the block.json files.
2023-03-27 17:26:46 -03:00
Thomas Roberts be2ba748be Check for address on shippingData (https://github.com/woocommerce/woocommerce-blocks/pull/8878) 2023-03-27 09:33:18 -07:00
Luigi Teschio 746bbf7be3 Single Product Template: add the Store Notice block to the template (https://github.com/woocommerce/woocommerce-blocks/pull/8833)
* Add minimum structure for Single Product Details block

* Add Product Image Gallery woocommerce/woocommerce-blocks#8233

Add Product Image Gallery

* First try to render Product Arhcive template as blocks

* First iteration of the whole blockified product archive template

* Add tests for Single Product Details block

* Extract a blockified Product Archive Template to the templates

* Add templates to tsconfig.json so the files are resolved as part of the core code

* Add a encouragement note to use blockified version IF migration is available

* Add a Row block wrapping Product Results Count and Catalog Sorting blocks

* Move blockified product-archive from templates/ to assets/ directory

* Remove unnecessary margin from Product Results Count block

When used in a Row block in a blockified Archive Product template, Product Results Count had additional unnecessary margin which caused misalignment with the Catalog Sorting block

* Fix TypeScript error

* Update the description of the Classic Template Editor placeholder

* Remove unnecessary entry in tsconfig.json to include templates directory

It was added couple of commits earlier, since the template was kept there, but it was decided to move it to assets directory, so entry is no longer necessary

* Move the  to

* Differentiate the Classic Template placeholder description depending on the availability to convert to Products block

* Add the initial basis for the Add to Cart button

* Add E2E test that the Classic Template can be replaced with the blockified version

* Abandon writing E2E tests for now, as there's a problem to run them locally

* Trigger the single product add to cart action for each product type.

* Syntax improvement

* Set margin for Catalog Sorting to 0, so it aligns properly when used in blockified Archive Product template

* Make the blockification config, so it covers the Product Archive as well as Single Product templates

* Move the product-archive specific functions from classic-template/index.tsx to the product-archive.ts

* wip: create block structure and add initial styles

* Add alignment option to the Store Notices block and make the blockified template blocks aligned wide

That is required, so the Classic Template layout is preserved

* Create single-product.ts file which is a placeholder for the blockified Single Product template

* Add block details to the SingleProductDetails.php file

* Make Blockified Product Archive template inherit the align attibute

* Simplify the interface of blockified templates

Expose  function instead of two functions for allowing and disallowing conversion

* Add a BlockifiedTemplate type

* Rename and simplify the function checking if conversion of classic template to block version is possible

* Rename the block from add-to-cart-button to add-to-cart-form

* Update to use the cart icon.

* Align the variable naming to use  instead of

* Implement the skeleton for the editor preview.

* Render tabs title with empty content

* Use woocommerce_output_product_data_tabs function to retrieve tabs data

* Update styles and add Notice for the display in the Editor.

* Update CSS.

* Add base tests for the new Add to Cart Form component.

* Add Product Image Gallery block

* Pass the Classic Template attributes to the blockified template instead of getting it from data store

* Include Breadcrumbs block in the Blockified Product Archive Template

* Consume alignment attributes of Catalog Sorting in the PHP render function

* Consume alignment attributes of Breadcrumbs in the PHP render function

* Show conversion button with label and description

* Add conversion placeholder (until we have all the blocks implemented)

* Remove align support from Catalog Sorting and add to Store Notices block

* remove support global styles

* remove support global styles

* Update the button CSS.

* Remove customizations for the Single Product Details block

* Update styles for the cart form.

* update td style.

* Update divs and CSS.

* Use conventional input instead of the experimental InputControl

* Extend the get_classes_and_styles_by_attributes method with align and text_align attributes

* address CSS feedback

* Add Archive Title block to the Blockified Classic Template

* Minor getRowBlock function refactor

* add support for the custom classname

* remove save function

* Add  property to the classic templates and base the config on it instead of placeholder

* Add separate blockified template for a Product Search Results

* Pass  attribute from classic template to No Results block in Product Search Results

* Remove unnecessary console.log from the Edit.tsx file

* Remove block classname from block wrapper

* Remove unnecessary WooCommerce tabs filter from the BlockTemplatesController

* Remove attributes property from the block registration

* Remove isExperimental flag for the Single Product Details block

* Remove get_classes_and_styles_by_attributes method from SingleProductDetails block

* Prevent Single Product Details block from apppearing in Pages or Posts

* Extract the common functions between blockified archive-template and product-search-results to utils

* Enable 'Inherit query from template' in Products block by default when converting the Classic Template to blockified one

* add second parameter to the subscribe function

* Implement the new design and copy provided for the editor.

* Make the notice compatible with dark themes.

* Some additional CSS tweaks

* adjust the padding for the input

* wrap the Single Product Template in a div with the product class

* Fix PHP Coding Standards warnings

* Improve the naming of BlockifiedTemplateConfig type

* Differentiate Product Catalog and Products By * templates. The latter include Term Description block

* improve logic and increase coverage of unit test

* Change unclear ProductsBy to ProductTaxonomy in regards to classic template conversion

* improve logic and increase coverage of unit test

* fix test

* format HTML

* fix edge case

* update @types/wordpress__data package

* update placeholder, icon and description

* update tsconfig

* update block name

* fix SCSS linter error

* address feedback

* create SingleProductTemplateCompatibility class

* Revert the margin fix which was added already on trunk

* Add Hooks compatibility

* remove not used file

* remove not used files

* Add compatibility layer for the Single Product template

* fix check

* implement Product meta template header

* Add default Single Product HTML template

* Fix style issues when adding blocks inside group/stack/columns blocks

* Add Related Products to the default single product template HTML file

* Product Price Block: Add support Single Product Template

* fix missing import

* add comment

* return a value

* improve comment

* fix import

* Add Product Meta block

* wrap up default single product html

* remove classname

* add blocks

* improve code

* Remove !important statement from Product Image Gallery block css

* Change width of Product Image Gallery block to initial instead of unset

* Wrap up default single product html template (https://github.com/woocommerce/woocommerce-blocks/pull/8632)

* Add minimum structure for Single Product Details block

* Add Product Image Gallery woocommerce/woocommerce-blocks#8233

Add Product Image Gallery

* Add tests for Single Product Details block

* Add the initial basis for the Add to Cart button

* Trigger the single product add to cart action for each product type.

* wip: create block structure and add initial styles

* Add block details to the SingleProductDetails.php file

* Rename the block from add-to-cart-button to add-to-cart-form

* Update to use the cart icon.

* Implement the skeleton for the editor preview.

* Render tabs title with empty content

* Use woocommerce_output_product_data_tabs function to retrieve tabs data

* Update styles and add Notice for the display in the Editor.

* Update CSS.

* Add base tests for the new Add to Cart Form component.

* Add Product Image Gallery block

* remove support global styles

* remove support global styles

* Update the button CSS.

* Remove customizations for the Single Product Details block

* Update styles for the cart form.

* update td style.

* Update divs and CSS.

* Use conventional input instead of the experimental InputControl

* address CSS feedback

* add support for the custom classname

* remove save function

* Remove unnecessary console.log from the Edit.tsx file

* Remove block classname from block wrapper

* Remove unnecessary WooCommerce tabs filter from the BlockTemplatesController

* Remove attributes property from the block registration

* Remove isExperimental flag for the Single Product Details block

* Remove get_classes_and_styles_by_attributes method from SingleProductDetails block

* Prevent Single Product Details block from apppearing in Pages or Posts

* add second parameter to the subscribe function

* Implement the new design and copy provided for the editor.

* Make the notice compatible with dark themes.

* Some additional CSS tweaks

* adjust the padding for the input

* wrap the Single Product Template in a div with the product class

* Fix PHP Coding Standards warnings

* improve logic and increase coverage of unit test

* improve logic and increase coverage of unit test

* fix test

* format HTML

* fix edge case

* update @types/wordpress__data package

* update placeholder, icon and description

* update tsconfig

* update block name

* fix SCSS linter error

* address feedback

* create SingleProductTemplateCompatibility class

* Add Hooks compatibility

* remove not used file

* remove not used files

* Add compatibility layer for the Single Product template

* fix check

* implement Product meta template header

* Product Price Block: Add support Single Product Template

* fix missing import

* add comment

* return a value

* improve comment

* fix import

* Add Product Meta block

* wrap up default single product html

* fix: related products and grouped products result woocommerce/woocommerce-blocks#8589

* remove classname

* fix crash

* update template

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>

* Fix images width in the Single Product page

* Remove the !important attribute from the Product Image Gallery block

* fix sku block

* improve layout

* improve layout

* improve layout

* improve layout

* improve layout

* update label

* Single Product Template: add store notice block

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
Co-authored-by: Karol Manijak <karol.manijak@automattic.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
Co-authored-by: Alba Rincón <alba.rincon@automattic.com>
Co-authored-by: Alba Rincón <albarin@users.noreply.github.com>
2023-03-26 21:19:28 +02:00
Alexandre Lara 22a9a479ae Related Products: Move Notice block to the Inspector Control section (https://github.com/woocommerce/woocommerce-blocks/pull/8843)
* Add Notice component to the Inspector Controls section of the Related Products block

* Change margin css attribute to use the short syntax

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

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2023-03-24 14:03:12 -03:00
Alba Rincón 91eb482e17 Mini-cart buttons: add explanation regarding why we need to check for children (https://github.com/woocommerce/woocommerce-blocks/pull/8847)
* Add comment explanation regarding the children buttons

* Update comment

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

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2023-03-24 16:25:09 +01:00
Alba Rincón aa601fe102 Mini-cart: add the option to change the style between 'Outline' and 'Fill' in all the buttons (https://github.com/woocommerce/woocommerce-blocks/pull/8835)
* Render inner buttons on the frontend

* Add deprecation to the buttons

* Fix lint and inline save

* Remove commented out code and fix condition

* Change migrate condition

* Add styles outline and fill styles to cart and checkout buttons

* Add fill and outline styles to the start shopping button

* Refactor variants

* Remove imports

* Add classname default value

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2023-03-24 10:14:06 +01:00
Manish Menaria 1416642cd2 Add more Inspector controls for Product(Add to cart) button (https://github.com/woocommerce/woocommerce-blocks/pull/8781)
* Add Fill & Outline styles to Product button

This commit adds the Fill & Outline styles to the Product button block.
You can see new Styles section in Inspector Controls where you will be able to change between Fill & Outline styles.

* Add width setting to product button

The button block now has a width selector, which allows the user to
set the button to 25%, 50%, 75%, or 100% of the parent container.
By default, a button's width is determined by the size of its content.

You can find this setting in the button block's sidebar.

* Enable all typography controls

Now following typography controls are also available:
- Font Family
- Appearance
- Line height
- Letter spacing
- Decoration
- Letter case

* Fix width settings not working

* Fix align doesn't work with Width settings

* Fix width setting not working in Single product block

* Fix - Default button is shorter on the frontend

In Editor default and outlined button has the same height. Outlined button in the frontend as well. But default button on the frontend is shorter (smaller padding)

More info: https://github.com/woocommerce/woocommerce-blocks/pull/8781#issuecomment-1477527049

* Fix - background color not matching when GB is enabled

* Fix - 100% width button exceeds the container

Fix following issues:
- "Select Options" or "View products" for variable and grouped products don't respect the container max width
- Also, for small width (25%) they are wider

More info: https://github.com/woocommerce/woocommerce-blocks/pull/8781#issuecomment-1477527049

* Fix: Width setting not working in All Products block

This commit fixes the width setting not working in the All Products block.

* Keep other classes along with Width setting classes

`block.attributes.className` should be kept along with the width setting classes.
```
className: classnames( block.attributes.className, {
	[ `has-custom-width wp-block-button__width-${ block.attributes?.width }` ]:
		block.attributes?.width,
} )
```

* Translate styles label in block configuration
2023-03-24 12:38:43 +05:30
Tarun Vijwani 8b57aa35cb Fix _n usage to use plural and singular correctly (https://github.com/woocommerce/woocommerce-blocks/pull/8749)
* Fix _n usage to use plural and singular correctly

* Replace switch condition with if else

- Replace switch condition with if else for better readability.

* Add packageCount in LocalPickupSelect component

- packageCount prop was missing from LocalPickupSelect component. Add packageCount in LocalPickupSelect component.

---------

Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: Niels Lange <info@nielslange.de>
2023-03-24 10:52:38 +04:00
Luigi Teschio 4451dbb323 Product Image Gallery: remove attributes key (https://github.com/woocommerce/woocommerce-blocks/pull/8825) 2023-03-23 18:00:16 +01:00
Alba Rincón 2555beadf5 Provide a way to switch to the blockified Single Product Template (https://github.com/woocommerce/woocommerce-blocks/pull/8324)
* Add minimum structure for Single Product Details block

* Add Product Image Gallery woocommerce/woocommerce-blocks#8233

Add Product Image Gallery

* First try to render Product Arhcive template as blocks

* First iteration of the whole blockified product archive template

* Add tests for Single Product Details block

* Extract a blockified Product Archive Template to the templates

* Add templates to tsconfig.json so the files are resolved as part of the core code

* Add a encouragement note to use blockified version IF migration is available

* Add a Row block wrapping Product Results Count and Catalog Sorting blocks

* Move blockified product-archive from templates/ to assets/ directory

* Remove unnecessary margin from Product Results Count block

When used in a Row block in a blockified Archive Product template, Product Results Count had additional unnecessary margin which caused misalignment with the Catalog Sorting block

* Fix TypeScript error

* Update the description of the Classic Template Editor placeholder

* Remove unnecessary entry in tsconfig.json to include templates directory

It was added couple of commits earlier, since the template was kept there, but it was decided to move it to assets directory, so entry is no longer necessary

* Move the  to

* Differentiate the Classic Template placeholder description depending on the availability to convert to Products block

* Add the initial basis for the Add to Cart button

* Add E2E test that the Classic Template can be replaced with the blockified version

* Abandon writing E2E tests for now, as there's a problem to run them locally

* Trigger the single product add to cart action for each product type.

* Syntax improvement

* Set margin for Catalog Sorting to 0, so it aligns properly when used in blockified Archive Product template

* Make the blockification config, so it covers the Product Archive as well as Single Product templates

* Move the product-archive specific functions from classic-template/index.tsx to the product-archive.ts

* wip: create block structure and add initial styles

* Add alignment option to the Store Notices block and make the blockified template blocks aligned wide

That is required, so the Classic Template layout is preserved

* Create single-product.ts file which is a placeholder for the blockified Single Product template

* Add block details to the SingleProductDetails.php file

* Make Blockified Product Archive template inherit the align attibute

* Simplify the interface of blockified templates

Expose  function instead of two functions for allowing and disallowing conversion

* Add a BlockifiedTemplate type

* Rename and simplify the function checking if conversion of classic template to block version is possible

* Rename the block from add-to-cart-button to add-to-cart-form

* Update to use the cart icon.

* Align the variable naming to use  instead of

* Implement the skeleton for the editor preview.

* Render tabs title with empty content

* Use woocommerce_output_product_data_tabs function to retrieve tabs data

* Update styles and add Notice for the display in the Editor.

* Update CSS.

* Add base tests for the new Add to Cart Form component.

* Add Product Image Gallery block

* Pass the Classic Template attributes to the blockified template instead of getting it from data store

* Include Breadcrumbs block in the Blockified Product Archive Template

* Consume alignment attributes of Catalog Sorting in the PHP render function

* Consume alignment attributes of Breadcrumbs in the PHP render function

* Show conversion button with label and description

* Add conversion placeholder (until we have all the blocks implemented)

* Remove align support from Catalog Sorting and add to Store Notices block

* remove support global styles

* remove support global styles

* Update the button CSS.

* Remove customizations for the Single Product Details block

* Update styles for the cart form.

* update td style.

* Update divs and CSS.

* Use conventional input instead of the experimental InputControl

* Extend the get_classes_and_styles_by_attributes method with align and text_align attributes

* address CSS feedback

* Add Archive Title block to the Blockified Classic Template

* Minor getRowBlock function refactor

* add support for the custom classname

* remove save function

* Add  property to the classic templates and base the config on it instead of placeholder

* Add separate blockified template for a Product Search Results

* Pass  attribute from classic template to No Results block in Product Search Results

* Remove unnecessary console.log from the Edit.tsx file

* Remove block classname from block wrapper

* Remove unnecessary WooCommerce tabs filter from the BlockTemplatesController

* Remove attributes property from the block registration

* Remove isExperimental flag for the Single Product Details block

* Remove get_classes_and_styles_by_attributes method from SingleProductDetails block

* Prevent Single Product Details block from apppearing in Pages or Posts

* Extract the common functions between blockified archive-template and product-search-results to utils

* Enable 'Inherit query from template' in Products block by default when converting the Classic Template to blockified one

* add second parameter to the subscribe function

* Implement the new design and copy provided for the editor.

* Make the notice compatible with dark themes.

* Some additional CSS tweaks

* adjust the padding for the input

* wrap the Single Product Template in a div with the product class

* Fix PHP Coding Standards warnings

* Improve the naming of BlockifiedTemplateConfig type

* Differentiate Product Catalog and Products By * templates. The latter include Term Description block

* improve logic and increase coverage of unit test

* Change unclear ProductsBy to ProductTaxonomy in regards to classic template conversion

* improve logic and increase coverage of unit test

* fix test

* format HTML

* fix edge case

* update @types/wordpress__data package

* update placeholder, icon and description

* update tsconfig

* update block name

* fix SCSS linter error

* address feedback

* create SingleProductTemplateCompatibility class

* Revert the margin fix which was added already on trunk

* Add Hooks compatibility

* remove not used file

* remove not used files

* Add compatibility layer for the Single Product template

* fix check

* implement Product meta template header

* Add default Single Product HTML template

* Fix style issues when adding blocks inside group/stack/columns blocks

* Add Related Products to the default single product template HTML file

* Product Price Block: Add support Single Product Template

* fix missing import

* add comment

* return a value

* improve comment

* fix import

* Add Product Meta block

* wrap up default single product html

* remove classname

* add blocks

* improve code

* Remove !important statement from Product Image Gallery block css

* Change width of Product Image Gallery block to initial instead of unset

* Wrap up default single product html template (https://github.com/woocommerce/woocommerce-blocks/pull/8632)

* Add minimum structure for Single Product Details block

* Add Product Image Gallery woocommerce/woocommerce-blocks#8233

Add Product Image Gallery

* Add tests for Single Product Details block

* Add the initial basis for the Add to Cart button

* Trigger the single product add to cart action for each product type.

* wip: create block structure and add initial styles

* Add block details to the SingleProductDetails.php file

* Rename the block from add-to-cart-button to add-to-cart-form

* Update to use the cart icon.

* Implement the skeleton for the editor preview.

* Render tabs title with empty content

* Use woocommerce_output_product_data_tabs function to retrieve tabs data

* Update styles and add Notice for the display in the Editor.

* Update CSS.

* Add base tests for the new Add to Cart Form component.

* Add Product Image Gallery block

* remove support global styles

* remove support global styles

* Update the button CSS.

* Remove customizations for the Single Product Details block

* Update styles for the cart form.

* update td style.

* Update divs and CSS.

* Use conventional input instead of the experimental InputControl

* address CSS feedback

* add support for the custom classname

* remove save function

* Remove unnecessary console.log from the Edit.tsx file

* Remove block classname from block wrapper

* Remove unnecessary WooCommerce tabs filter from the BlockTemplatesController

* Remove attributes property from the block registration

* Remove isExperimental flag for the Single Product Details block

* Remove get_classes_and_styles_by_attributes method from SingleProductDetails block

* Prevent Single Product Details block from apppearing in Pages or Posts

* add second parameter to the subscribe function

* Implement the new design and copy provided for the editor.

* Make the notice compatible with dark themes.

* Some additional CSS tweaks

* adjust the padding for the input

* wrap the Single Product Template in a div with the product class

* Fix PHP Coding Standards warnings

* improve logic and increase coverage of unit test

* improve logic and increase coverage of unit test

* fix test

* format HTML

* fix edge case

* update @types/wordpress__data package

* update placeholder, icon and description

* update tsconfig

* update block name

* fix SCSS linter error

* address feedback

* create SingleProductTemplateCompatibility class

* Add Hooks compatibility

* remove not used file

* remove not used files

* Add compatibility layer for the Single Product template

* fix check

* implement Product meta template header

* Product Price Block: Add support Single Product Template

* fix missing import

* add comment

* return a value

* improve comment

* fix import

* Add Product Meta block

* wrap up default single product html

* fix: related products and grouped products result woocommerce/woocommerce-blocks#8589

* remove classname

* fix crash

* update template

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>

* Fix images width in the Single Product page

* Remove the !important attribute from the Product Image Gallery block

* fix sku block

* improve layout

* improve layout

* improve layout

* improve layout

* improve layout

* update label

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
Co-authored-by: Luigi <gigitux@gmail.com>
Co-authored-by: Karol Manijak <karol.manijak@automattic.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
2023-03-23 17:59:59 +01:00
Alba Rincón 2d9519b3ba Add style to the `Mini Cart` buttons (https://github.com/woocommerce/woocommerce-blocks/pull/8776)
* Create new car button inner block

* Create new checkout button inner block

* Render inner buttons on the frontend

* Fix buttons size

* Add outline to the cart button

* Add color props

* Add urls

* Fix button classes

* Add classes to edit

* Start using editable button

* Add buttons to mini cart tempalte

* Reorder buttons in template

* Add cart & checkout buttons scripts

* Remove unnecessary divs

* Change checkout button block name

* Change cart button block name

* Add deprecation to the buttons

* Fix lint and inline save

* Remove commented out code and fix condition

* Render buttons if no children

* Change migrate condition

* Simplify condition

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

* Make props optional

* Add missing import

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2023-03-23 16:55:53 +01:00
Albert Juhé Lluveras c9a6391e20 Fix border styles not visible in the editor in Featured Product and Featured Category blocks in core (https://github.com/woocommerce/woocommerce-blocks/pull/8838) 2023-03-23 15:36:46 +01:00
Roy Ho 48fde013ea Add decoding to product names (https://github.com/woocommerce/woocommerce-blocks/pull/8824)
* Add decoding to product names

* Fix linting error
2023-03-23 06:27:02 -07:00
Mike Jolley 280040653c Avoid returning before hooks are run (https://github.com/woocommerce/woocommerce-blocks/pull/8820) 2023-03-23 10:24:04 +00:00
Luigi Teschio 9baad55f4f Stock Indicator Block: remove unused save function (https://github.com/woocommerce/woocommerce-blocks/pull/8832) 2023-03-23 08:43:42 +00:00
kmanijak a06f4fbd91 Normalise the search param for comparison to avoid endless redirections (https://github.com/woocommerce/woocommerce-blocks/pull/8784)
* Replace single quote with the encoded version %27 for URL comparison

This is required as as removeQueryArgs() function uses decodeURIcomponent method which doesn't encode single quotes (') while it was still encoded in the original URL (%27). So when the single quote was in a query param, for example as a search term, it caused endless redirection loop.

* Replace single quote with the encoded version %27 for URL comparison in Filter by Rating

* refactor the solution so it encodes the href rather than decode the newly created URL

* Refactor the normalisation

* Add tests to normalisation function
2023-03-23 08:42:23 +01:00
Alexandre Lara f39d8b7943 Add default Single Product HTML template (https://github.com/woocommerce/woocommerce-blocks/pull/8515)
* Add default Single Product HTML template

* Fix style issues when adding blocks inside group/stack/columns blocks

* Add Related Products to the default single product template HTML file

* Remove !important statement from Product Image Gallery block css

* Change width of Product Image Gallery block to initial instead of unset

* Wrap up default single product html template (https://github.com/woocommerce/woocommerce-blocks/pull/8632)

* Add minimum structure for Single Product Details block

* Add Product Image Gallery woocommerce/woocommerce-blocks#8233

Add Product Image Gallery

* Add tests for Single Product Details block

* Add the initial basis for the Add to Cart button

* Trigger the single product add to cart action for each product type.

* wip: create block structure and add initial styles

* Add block details to the SingleProductDetails.php file

* Rename the block from add-to-cart-button to add-to-cart-form

* Update to use the cart icon.

* Implement the skeleton for the editor preview.

* Render tabs title with empty content

* Use woocommerce_output_product_data_tabs function to retrieve tabs data

* Update styles and add Notice for the display in the Editor.

* Update CSS.

* Add base tests for the new Add to Cart Form component.

* Add Product Image Gallery block

* remove support global styles

* remove support global styles

* Update the button CSS.

* Remove customizations for the Single Product Details block

* Update styles for the cart form.

* update td style.

* Update divs and CSS.

* Use conventional input instead of the experimental InputControl

* address CSS feedback

* add support for the custom classname

* remove save function

* Remove unnecessary console.log from the Edit.tsx file

* Remove block classname from block wrapper

* Remove unnecessary WooCommerce tabs filter from the BlockTemplatesController

* Remove attributes property from the block registration

* Remove isExperimental flag for the Single Product Details block

* Remove get_classes_and_styles_by_attributes method from SingleProductDetails block

* Prevent Single Product Details block from apppearing in Pages or Posts

* add second parameter to the subscribe function

* Implement the new design and copy provided for the editor.

* Make the notice compatible with dark themes.

* Some additional CSS tweaks

* adjust the padding for the input

* wrap the Single Product Template in a div with the product class

* Fix PHP Coding Standards warnings

* improve logic and increase coverage of unit test

* improve logic and increase coverage of unit test

* fix test

* format HTML

* fix edge case

* update @types/wordpress__data package

* update placeholder, icon and description

* update tsconfig

* update block name

* fix SCSS linter error

* address feedback

* create SingleProductTemplateCompatibility class

* Add Hooks compatibility

* remove not used file

* remove not used files

* Add compatibility layer for the Single Product template

* fix check

* implement Product meta template header

* Product Price Block: Add support Single Product Template

* fix missing import

* add comment

* return a value

* improve comment

* fix import

* Add Product Meta block

* wrap up default single product html

* fix: related products and grouped products result woocommerce/woocommerce-blocks#8589

* remove classname

* fix crash

* update template

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>

* Fix images width in the Single Product page

* Remove the !important attribute from the Product Image Gallery block

* fix sku block

* improve layout

* fix header and footer template parts declaration

---------

Co-authored-by: Luigi <gigitux@gmail.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
2023-03-22 15:00:48 +00:00
Saad Tarhi 547cc76f8e Fix save changes bug in Firefox browser (https://github.com/woocommerce/woocommerce-blocks/pull/8754) 2023-03-22 12:45:48 +00:00
kmanijak a5714a6519 Use shared save function for all the product elements blocks (https://github.com/woocommerce/woocommerce-blocks/pull/8813)
* Use attributes provided to save function in product-price block

* remove save function and use the shared one

* fix import

---------

Co-authored-by: Luigi <gigitux@gmail.com>
2023-03-22 11:52:50 +00:00
kmanijak 752fd37a0b Make Product SKU editable (https://github.com/woocommerce/woocommerce-blocks/pull/8804) 2023-03-22 09:29:49 +01:00
Albert Juhé Lluveras 5235f6c392 Allow themes to remove the Mini Cart title on overridden template parts (https://github.com/woocommerce/woocommerce-blocks/pull/8779)
* Allow themes to remove the Mini Cart title on overridden template parts

* Remove unused file
2023-03-22 08:23:52 +01:00
Tarun Vijwani 82c59ffb29 Display the link to add the shipping address when shipping address is not available (https://github.com/woocommerce/woocommerce-blocks/pull/8141) 2023-03-22 11:15:13 +04:00
Luigi Teschio f9cdca7625 Remove Single Product Block (https://github.com/woocommerce/woocommerce-blocks/pull/8763)
* Remove Single Product Block

* remove more files that belong the Single Product block

* fix php linter error

* remove Product Tag List and Product Category List blocks
2023-03-20 13:27:23 +00:00
Tarun Vijwani ef24a42211 Add validation error to prevent checkout when there is no shipping method available (https://github.com/woocommerce/woocommerce-blocks/pull/8384)
* Prevent checkout when no shipping rates available

-  Add the validation error in ShippingSelector to prevent checkout when no shipping rates available.
- Add notice to Checkout processor so that notice appears after clicking on place order button.

* Fix TypeScript error in checkout shipping method block

-   Make multiple prop as optional in RatePrice component to fix TypeScript error.
2023-03-17 19:32:03 +04:00
Albert Juhé Lluveras ec19838355 Fix issue that prevented spaces being added to Mini Cart, Cart and Checkout buttons (https://github.com/woocommerce/woocommerce-blocks/pull/8777)
* Fix issue that prevented spaces being added to Mini Cart, Cart and Checkout buttons

* Fix a couple of comments
2023-03-17 13:26:34 +01:00
Luigi Teschio 6dfee2664e fix isDescendentOfSingleProductTemplate check (https://github.com/woocommerce/woocommerce-blocks/pull/8767) 2023-03-17 10:22:51 +01:00
Alba Rincón dca03c3323 Add styles to the `Start shopping` button (https://github.com/woocommerce/woocommerce-blocks/pull/8766) 2023-03-16 14:57:54 +01:00
Luigi Teschio 235b37a626 Product Search Results template: fix the preview when the Inherit Query option is enabled (https://github.com/woocommerce/woocommerce-blocks/pull/7965)
* Product Search Results: fix the preview when the Inherit Query option is enabled

* create a component to make the code more readable

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2023-03-16 11:04:52 +01:00
Tarun Vijwani ef63d807b9 Fix the local pickup price in the shipping type selector and pickup options (https://github.com/woocommerce/woocommerce-blocks/pull/8623)
* Fix local pickup price in the shipping type selector

- While calculating min and max value for local pickup, if the rate is not for local pickup, it will take already calculated lowest value instead of comparing it with the value of other shipping rate.

* Add the typecasting for price and tax to fix tax calculation

- We were concatenating the two strings instead of adding the integers. Add the typecasting for price and tax to fix it in local pickup.

---------

Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
2023-03-15 13:26:06 +01:00
kmanijak afa8672e49 Change the property name of the attribute slug in Products By Attribute after the refactor (https://github.com/woocommerce/woocommerce-blocks/pull/8759) 2023-03-15 12:29:13 +01:00
Roy Ho 112a402261 Add a higher z-index than the title for mini cart close button (https://github.com/woocommerce/woocommerce-blocks/pull/8737) 2023-03-14 10:08:10 -07:00
Alba Rincón d4fe2a5b5d Mini-cart: add setting to not render the block on the cart & checkout pages (https://github.com/woocommerce/woocommerce-blocks/pull/8700)
* Add `renderInCartAndCheckout` attribute and toggle

* Show setting only when inserted in a template

* Don't render the mini-cart if the setting is disabled

* Stop rendering the mini-cart if the setting is false

* method to snakecase

* Make the attribute a string

In the future we may want to add more rendering styles, so a boolean wasn't the
best option, a string will allowed us more than two options

* Change toggle copy
2023-03-14 15:59:46 +01:00
Saad Tarhi abe3488861 Local Pickup: merge country and state into same field in location modal (https://github.com/woocommerce/woocommerce-blocks/pull/8408)
* Get the default store state

We are merging the Country & State fields. So, we should get both
default values

* Merge the Country & State fields

We merged both fields in the Pickup Location form modal

We can see a similar example in `WooCommerce -> Settings -> General`

* Clean up the code

* Show the state text field above the country select

* Create some util functions

* Refactor the Form component

* Display a user friendly country and state in admin

* Fix country defaulting to "Afghan" bug
2023-03-14 14:49:31 +01:00
Luigi Teschio a2945306ac Fix the related products block result when used along a grouped product (https://github.com/woocommerce/woocommerce-blocks/pull/8656)
* fix: related products and grouped products result woocommerce/woocommerce-blocks#8589

* fix crash
2023-03-14 14:28:21 +01:00
Niels Lange 83b5019e4d Add client side postcode validation (https://github.com/woocommerce/woocommerce-blocks/pull/8503)
* Add client side postcode validation

* Prevent server-side validation

* Adjust translation

* Only validate postcode if country is available

* Specify return type of isPostcode()

* Convert function to static variable set

* Refactor <ValidatedTextInput> for postcode validation

* Refactor customValidationHandler

* Use customValidationHandler as intermediate function

* Hyphenate file names

* Update packages/checkout/utils/validation/is-postcode.ts

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

* Normalise postcode on input

* Fix usage of out of date value from input field

---------

Co-authored-by: Mike Jolley <mike.jolley@me.com>
2023-03-14 19:37:28 +07:00
Albert Juhé Lluveras b64a6b8a5e Add spacing below Mini Cart title (https://github.com/woocommerce/woocommerce-blocks/pull/8676) 2023-03-14 09:42:53 +01:00
Thomas Roberts bee8a74150 Add `ExperimentalOrderLocalPickupPackages` Slot/Fill (https://github.com/woocommerce/woocommerce-blocks/pull/8636)
* Add ExperimentalOrderLocalPickupPackages slot fill

* Render ExperimentalOrderLocalPickupPackages in local pickup block

* Update docs to include ExperimentalOrderLocalPickupPackages

* Use LocalPickupSelect component when rendering local pickup options
2023-03-13 12:00:02 +00:00
Thomas Roberts 991e407fa9 Remove WC Core shipping settings if Cart/Checkout blocks are in use (https://github.com/woocommerce/woocommerce-blocks/pull/8679)
* Add CartCheckoutUtils class

This class will store reusable methods relating to Cart/Checkout Blocks, i.e. whether they are used on the Cart/Checkout page.

* Update ShippingController to use the new CartCheckoutUtils function

This will reduce code duplication when checking if the Cart/Checkout blocks are in use on the Cart/Checkout page.

* Add filter to remove shipping settings when Cart/Checkout are default

* Ensure setting displays correctly if cart is default but not checkout

* Add tests to ensure core shipping settings update correctly

* Add setCartCheckoutPages function to update set the cart/checkout page

* Force shipping to be enabled if the Checkout block is in use.

* Add filter to override cost requires address option

* Add shippingCostRequiresAddress option

* Check if the address is required before showing rates

* Show shipping rates in editor

* Add shippingCostRequiresAddress attribute to shipping methods block

* Update frontend type to show shippingCostRequiresAddress is a prop

* Add control to toggle shippingCostRequiresAddress option

* Show address notice in the correct scenario

* Send shippingCostRequiresAddress to Block in front end context

* Add e2e test for editor control

* Add e2e tests for shipping options on the front end

* Add updateAttributeInSiblingBlock function

* Add shippingCostRequiresAddress to shipping method block

* Ensure attribute is updated in both blocks when editing

* In Shipping Methods Block, show correct component based on block setting

* Show correct block in editor

* Remove broken test from PR

* Clean up updateAttributeInSiblingBlock

* Add setCartCheckoutPages function to update set the cart/checkout page

* Add tests to ensure core shipping settings update correctly

* Add isAddressComplete function

Borrowed from woocommerce/woocommerce-blocks#8141

* Check if the address is required before showing rates

* Show shipping rates in editor

* Show address notice in the correct scenario

* Add e2e tests for shipping options on the front end

* Ensure errorId is passed to StateInput

* Add fullShippingAddressPushed action to wc/store/cart

* Add fullShippingAddressPushed case to reducer

* Ensure fullShippingAddressPushed is set when initialising cart store

* Add fullShippingAddressPushed selector and default state entry

* Add shippingAddressHasValidationErrors util function

* Do not overwrite addresses when selecting a rate

* Set whether full address has been pushed when saving address changes

* In Shipping Methods Block, show correct component based on block setting

* Don't show from price if rates should be hidden until address entered

* Check city validation errors to assert if shipping address is valid

* Rename merchant.js to merchant.ts

* Move local pickup functions to common merchant util

* Update local pickup tests to use common merchant utils

* Add test to ensure setting toggles in both blocks

* Add navigating to settings and saving in merchant util

* Create addPickupLocation merchant util

* Add test for local pickup and require full address

* Make sure correct conditions are met to show shipping options

* Ensure checkbox is checked during local pickup tests

* Unset the checkbox when tests are finished running

* Update checkout block fixture

* Prevent error in unit tests

* Import validation store key from constants

Required because importing from the index causes the validation data store to register twice

* Update checkout terms test to wait for button not to be disabled

* Revert "Add isAddressComplete function"

This reverts commit 9967dc0d4f10cf638859ae085e6f4cc2901dd299.
2023-03-13 11:49:28 +00:00
Mike Jolley 95efc38d1f Checkout - Available Payment Method Filtering (https://github.com/woocommerce/woocommerce-blocks/pull/8441)
* Document payment_gateways() usage

* Type in code comment

* Return available methods in cart/checkout StoreAPI responses

* Filter available methods in checkout

* fix tests

* fix TS error

* fix TS warnings in tests

* Update src/StoreApi/Schemas/V1/CartSchema.php

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

* Only apply filtering on frontend

* Avoid filter on express methods

---------

Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
2023-03-13 10:29:17 +00:00
Thomas Roberts aa83cae9bc Add filter to change proceed to checkout button text and URL (https://github.com/woocommerce/woocommerce-blocks/pull/8613)
* Fix up typescript of checkout filters

* Clear cached values when adding new filters

* Allow href on WPButton type

* Specify generic type of getSetting for checkout page link

* Apply filters to Proceed to Checkout button

* Add unit tests for proceed to checkout button and link filters

* Make cart extend a plain object

* Pass cart in args for proceed to checkout filters

* Add documentation for proceed to checkout filters

* Add unit test for multiple filter registration

* Change word to bump stuck GitHub actions

* Apply consistent casing to test names
2023-03-13 14:34:12 +07:00
Thomas Roberts f708214246 Add E2E test for third-party local pickup methods (https://github.com/woocommerce/woocommerce-blocks/pull/8543)
* Add third party local pickup method to woo-test-helper plugin

* Add test to check for checkout with local pickup

* Ensure local pickup is disabled when done with tests

* Add a more reliable selector for the "use same address for billing" box

* Prevent local pickup rates showing if local pickup is not enabled

* Check billing details after placing local pickup order

* Change local pickup unit test so rates dont show if localPickup disabled

* Use existing const instead of getSetting

* Update tests to mock constant from @woocommerce/block-settings

---------

Co-authored-by: Niels Lange <info@nielslange.de>
2023-03-13 10:45:48 +07:00
Thomas Roberts 3c6229879a Add `LocalPickupSelect` component (https://github.com/woocommerce/woocommerce-blocks/pull/8634)
* Add LocalPickupSelect component

This will be used to render the local pickup options and also display a title if there are more than one package (e.g. if WC subs adds them)

* Add tests for LocalPickupSelect component

* Make title optional

* Add packageCount as an option to LocalPickupSelect

* Revert "Add packageCount as an option to LocalPickupSelect"

This reverts commit 10b1dc9497aa6c4329aee7e74e1404cb9645c3b9.

* Add ackage count to LocalPickupSelect

* Add package count and remove unused variable from renderPickupLocation
2023-03-10 07:52:21 -08:00
Albert Juhé Lluveras 705c0937a2 Remove wc-settings from Mini Cart block dependencies (https://github.com/woocommerce/woocommerce-blocks/pull/8703) 2023-03-10 13:36:20 +01:00
Alba Rincón 98f5f67ed1 Add border support to mini cart contents (https://github.com/woocommerce/woocommerce-blocks/pull/8654)
* Add border support to mini cart contents

* Fix buttons in firefox when logged out

* Fix mini cart in all browsers

* Fix border not visible on mobile because of the admin bar

* Add feature flag to the experimental border

---------

Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
2023-03-10 09:25:24 +01:00
Daniel Dudzic 35860da21e Products: Update product element margins in patterns (https://github.com/woocommerce/woocommerce-blocks/pull/8401)
* Product Rating: Normalize the height of rating icons and the Add review link

* Products: Update inner blocks margins.

* Product Rating: Remove css changes from this PR.

* Products patterns: Remove px values and update the default pattern template.

---------

Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
2023-03-10 11:34:47 +05:30
Luigi Teschio 10516c3392 fix: Show sale bage on Product Image Gallery block (https://github.com/woocommerce/woocommerce-blocks/pull/8652)
* fix: show sale bage on Product Image Gallery block woocommerce/woocommerce-blocks#8528

* set multiple flag to false
2023-03-09 09:42:59 +01:00
Luigi Teschio 391105a71e Add Product Meta Block (https://github.com/woocommerce/woocommerce-blocks/pull/8484)
* Add minimum structure for Single Product Details block

* Add Product Image Gallery woocommerce/woocommerce-blocks#8233

Add Product Image Gallery

* Add tests for Single Product Details block

* Add the initial basis for the Add to Cart button

* Trigger the single product add to cart action for each product type.

* wip: create block structure and add initial styles

* Add block details to the SingleProductDetails.php file

* Rename the block from add-to-cart-button to add-to-cart-form

* Update to use the cart icon.

* Implement the skeleton for the editor preview.

* Render tabs title with empty content

* Use woocommerce_output_product_data_tabs function to retrieve tabs data

* Update styles and add Notice for the display in the Editor.

* Update CSS.

* Add base tests for the new Add to Cart Form component.

* Add Product Image Gallery block

* remove support global styles

* remove support global styles

* Update the button CSS.

* Remove customizations for the Single Product Details block

* Update styles for the cart form.

* update td style.

* Update divs and CSS.

* Use conventional input instead of the experimental InputControl

* address CSS feedback

* add support for the custom classname

* remove save function

* Remove unnecessary console.log from the Edit.tsx file

* Remove block classname from block wrapper

* Remove unnecessary WooCommerce tabs filter from the BlockTemplatesController

* Remove attributes property from the block registration

* Remove isExperimental flag for the Single Product Details block

* Remove get_classes_and_styles_by_attributes method from SingleProductDetails block

* Prevent Single Product Details block from apppearing in Pages or Posts

* add second parameter to the subscribe function

* Implement the new design and copy provided for the editor.

* Make the notice compatible with dark themes.

* Some additional CSS tweaks

* adjust the padding for the input

* wrap the Single Product Template in a div with the product class

* Fix PHP Coding Standards warnings

* improve logic and increase coverage of unit test

* improve logic and increase coverage of unit test

* fix test

* format HTML

* fix edge case

* update @types/wordpress__data package

* update placeholder, icon and description

* update tsconfig

* update block name

* fix SCSS linter error

* address feedback

* create SingleProductTemplateCompatibility class

* Add Hooks compatibility

* remove not used file

* remove not used files

* Add compatibility layer for the Single Product template

* fix check

* implement Product meta template header

* Product Price Block: Add support Single Product Template

* fix missing import

* add comment

* return a value

* improve comment

* fix import

* Add Product Meta block

* remove unnecessary change

* fix compatibility layer when the Single Product template has the classic block

---------

Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
2023-03-09 09:42:40 +01:00
Albert Juhé Lluveras f65a1afe15 Mini Cart drawer close button: inherit text color and improve alignment (https://github.com/woocommerce/woocommerce-blocks/pull/8605)
* Make Mini Cart drawer close button inherit the color

* Fix Mini Cart drawer close button alignment

* Increase opacity when Mini Cart drawer close icon is hover, focused or active
2023-03-09 09:28:55 +01:00
Lucio Giannotta 61eeeb3c68 Improve Products block Attributes Filter Inspector Controls (https://github.com/woocommerce/woocommerce-blocks/pull/8583)
This PR is meant to improve the UI and UX behind the Attributes filter
within the Inspector Controls of the “Products (Beta)“ block.

Also included:

* Refactor `useProductAttributes` hook
  * Move it into the shared hooks.
  * Fetch both terms AND attributes via the API (previously,
we got the attributes from the settings, but we'd get
partial objects compared to the API? Maybe a follow-up
to this could be to check why the attributes stored in
the settings are incomplete?)
  * Make sure the return values match the ones expected
from search items.
* Remove attribute-related types from PQ directory
* Improve functionality of `SearchListControl`
  * Allow the search input to be a Token based input.
  * Allow for search input to search even collapsed properties.
  * Use core `CheckboxControl` instead of radio buttons for
items having children (includes undeterminated state).
  * Enable removal of tokens from the input
* Improve styles:
  * Refactor classnames for `SearchItem`.
  * Add more semantic classes.
  * Align count label and caret to the right.
  * Make caret switch direction on expanded.
  * `cursor: pointer` on collapsible items.
  * Indent children of collapsible items.
  * Correctly pass through class names to search item
* Enable keyboard navigation for collapsible items
* Add link to manage attributes
* Change label inside the inspector controls
* Make search list attached when token type
* Implement more sophisticated behavior of parent checkbox
  * If indeterminate or unchecked, it will check all children.
  * If checked, it will uncheck all children.
* Remove hardcoded `isSingle` from `expandableSearchListItem`
2023-03-08 17:22:51 +01:00
Albert Juhé Lluveras 3de39425c2 Remove wc-blocks-registry from Mini Cart block dependencies so more scripts can be lazy-loaded (https://github.com/woocommerce/woocommerce-blocks/pull/8657)
* Remove wc-blocks-registry from Mini Cart block so more scripts can be lazy-loaded

* Make check more reliable in case window.wc is not defined
2023-03-08 17:15:07 +01:00
Albert Juhé Lluveras 3d3f4a5dae Fix a circular dependency in CartLineItemRow (https://github.com/woocommerce/woocommerce-blocks/pull/8664) 2023-03-08 14:16:22 +01:00
Albert Juhé Lluveras 6d821202ee Move CartLineItemsTable from the Cart block directory to base-components (https://github.com/woocommerce/woocommerce-blocks/pull/8644) 2023-03-08 10:14:20 +01:00
Mike Jolley 4e581a4825 Allow view switcher to toggle view when using Gutenberg list view (https://github.com/woocommerce/woocommerce-blocks/pull/8429)
* Remove old view switcher component (not used)

* Switch in list view

* useSelect

* Optional selection of parent block on changing view

---------

Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
2023-03-07 11:21:13 +00:00
Thomas Roberts 9cba7ed8ad Add tests to ensure dirty props are re-pushed if the original `pushChanges` request fails (https://github.com/woocommerce/woocommerce-blocks/pull/8648)
* Add tests for pushChanges and dirty props

* Update assets/js/data/cart/test/push-changes.ts

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

---------

Co-authored-by: Mike Jolley <mike.jolley@me.com>
2023-03-06 20:52:36 -08:00
Mike Jolley 26e7c51698 Undo dirty prop removal on error (https://github.com/woocommerce/woocommerce-blocks/pull/8633)
Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
2023-03-06 16:05:38 +01:00
Luigi Teschio d08696de34 Product Price block: add support to the Single Product Template (https://github.com/woocommerce/woocommerce-blocks/pull/8609)
* Product Price Block: Add support Single Product Template

* fix missing import

* add comment

* return a value

* improve comment

* fix import
2023-03-06 15:14:08 +01:00
Niels Lange 627a11d045 Revert "Show Cart and Checkout blocks in Style Book (https://github.com/woocommerce/woocommerce-blocks/pull/8489)" (https://github.com/woocommerce/woocommerce-blocks/pull/8602)
This reverts commit 5944e229c2.
2023-03-06 12:19:08 +07:00
Alba Rincón b3db625215 Make the customer account icon bigger to match the mini-cart one (https://github.com/woocommerce/woocommerce-blocks/pull/8594)
* Make the customer account icon bigger to match the mini-cart one

* Add variation to increase the icon size for new blocks

* Improve class name

* Add variation explanation

* Add default attributes
2023-03-03 15:44:34 +01:00
Luigi Teschio 89cd344374 upgrade @types/wordpress__blocks package (https://github.com/woocommerce/woocommerce-blocks/pull/8624) 2023-03-03 12:42:50 +01:00
Alba Rincón 7245ca519e Make the start shopping button show the theme style (https://github.com/woocommerce/woocommerce-blocks/pull/8567)
* Make the start shopping button show the theme style

* Center the button

* Fix test
2023-03-03 10:55:28 +01:00
Albert Juhé Lluveras 1d0adeed28 Replace react imports with wordpress/element (https://github.com/woocommerce/woocommerce-blocks/pull/8520)
* Replace react imports with wordpress/element

* Fix TS errors

* Update a couple of React type imports
2023-03-02 15:26:00 +01:00
Alba Rincón 363fe84039 Switch Select by Toggle for the 'Add-to-Cart behaviour' (https://github.com/woocommerce/woocommerce-blocks/pull/8558) 2023-03-02 15:09:37 +01:00
Alba Rincón 8ff958a0e2 Remove colorClassName and style from QuantityBadge (https://github.com/woocommerce/woocommerce-blocks/pull/8557) 2023-03-02 15:08:09 +01:00
Niels Lange 465732aeb8 Show three Express Payments buttons in-line (https://github.com/woocommerce/woocommerce-blocks/pull/8601)
Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
2023-03-02 19:47:18 +07:00
Albert Juhé Lluveras 4b82793b33 Fix Mini Cart missing translations (https://github.com/woocommerce/woocommerce-blocks/pull/8591) 2023-03-02 11:16:32 +01:00
Paulo Arromba 6483ee08d0 Added debounce to shipping rate selection on cart (https://github.com/woocommerce/woocommerce-blocks/pull/8498) 2023-03-01 13:41:20 +00:00
Patricia Hillebrandt a7f471d9ff Add to Cart Form Block > Ensure the editor preview is properly displayed with the Gutenberg plugin disabled (https://github.com/woocommerce/woocommerce-blocks/pull/8582)
* Update the editor styles for the add to cart form button so it is properly displayed with the Gutenberg plugin disabled.

* update for the input height.

* update the min-height
2023-03-01 10:39:54 +01:00
Roy Ho b9044a72df Add explicit CSS styling to mini-cart block amount in inserter preview (https://github.com/woocommerce/woocommerce-blocks/pull/8516)
* Add explicit CSS styling to mini-cart block amount in inserter preview

* Add preview specific class name

* Fix formatting
2023-02-28 09:40:06 -08:00
David Arenas 8f76d41fe2 Serialize the Interactivity API's store from PHP and hydrate it on the client (https://github.com/woocommerce/woocommerce-blocks/pull/8447)
* Update Interactivity API

* Change `wp` prefixes to `woo`

* Use `woo` prefix for the directives runtime bundle

* Update Interactivity API runtime

* Hardcode php from interactivity API

* Temporarily add gutenberg plugin as dependency

* Exclude Interactivity API files from phpcs checks

* Update Interactivity API js files

* Update Interactivity API php files

* Remove gutenberg from wp-env plugins

* Fix registered runtime paths

* Fix prefixes when getting attributes in directives

* Fix directive prefix in constants

* Avoid a Fatal error when importing `wp-html`

* Remove TODO comments from Interactivity API files

* Add missing prefix to some global functions

* Use true as value for boolean attributes

* Add `wp-html` file

* Change requires in `wp-html` with includes
2023-02-28 17:33:33 +01:00
kmanijak 630f602f49 [Blockifying Product Archive Templates]: Implement the blockified template conversion for the Classic Template Block. (https://github.com/woocommerce/woocommerce-blocks/pull/8248)
* Extract a blockified Product Archive Template to the templates

* Add templates to tsconfig.json so the files are resolved as part of the core code

* Add a encouragement note to use blockified version IF migration is available

* Add a Row block wrapping Product Results Count and Catalog Sorting blocks

* Move blockified product-archive from templates/ to assets/ directory

* Remove unnecessary margin from Product Results Count block

When used in a Row block in a blockified Archive Product template, Product Results Count had additional unnecessary margin which caused misalignment with the Catalog Sorting block

* Update the description of the Classic Template Editor placeholder

* Remove unnecessary entry in tsconfig.json to include templates directory

It was added couple of commits earlier, since the template was kept there, but it was decided to move it to assets directory, so entry is no longer necessary

* Differentiate the Classic Template placeholder description depending on the availability to convert to Products block

* Set margin for Catalog Sorting to 0, so it aligns properly when used in blockified Archive Product template

* Make the blockification config, so it covers the Product Archive as well as Single Product templates

* Move the product-archive specific functions from classic-template/index.tsx to the product-archive.ts

* Add alignment option to the Store Notices block and make the blockified template blocks aligned wide

That is required, so the Classic Template layout is preserved

* Create single-product.ts file which is a placeholder for the blockified Single Product template

* Make Blockified Product Archive template inherit the align attibute

* Simplify the interface of blockified templates

Expose  function instead of two functions for allowing and disallowing conversion

* Add a BlockifiedTemplate type

* Rename and simplify the function checking if conversion of classic template to block version is possible

* Align the variable naming to use  instead of

* Pass the Classic Template attributes to the blockified template instead of getting it from data store

* Include Breadcrumbs block in the Blockified Product Archive Template

* Consume alignment attributes of Catalog Sorting in the PHP render function

* Consume alignment attributes of Breadcrumbs in the PHP render function

* Remove align support from Catalog Sorting and add to Store Notices block

* Extend the get_classes_and_styles_by_attributes method with align and text_align attributes

* Add Archive Title block to the Blockified Classic Template

* Minor getRowBlock function refactor

* Add  property to the classic templates and base the config on it instead of placeholder

* Add separate blockified template for a Product Search Results

* Pass  attribute from classic template to No Results block in Product Search Results

* Extract the common functions between blockified archive-template and product-search-results to utils

* Enable 'Inherit query from template' in Products block by default when converting the Classic Template to blockified one

* Improve the naming of BlockifiedTemplateConfig type

* Differentiate Product Catalog and Products By * templates. The latter include Term Description block

* Change unclear ProductsBy to ProductTaxonomy in regards to classic template conversion

* Revert the margin fix which was added already on trunk

* Move the surrounding blocks as inner blocks of Products

* Hide the conversion behind the experimental build flag (as it was before)
2023-02-27 15:34:18 +01:00
Alba Rincón 90e68175cf Fix "Product Price" block margin on the "All products" block (https://github.com/woocommerce/woocommerce-blocks/pull/8518)
* Only use margin for the feature plugin

* Return empty style if no support for spacing styling
2023-02-27 14:38:45 +01:00
Mike Jolley eae93e60b8 Do not mount form until shown (https://github.com/woocommerce/woocommerce-blocks/pull/8525) 2023-02-27 11:52:57 +00:00
Mike Jolley a454e1ee0a Avoid rendering renamed props for inner blocks (https://github.com/woocommerce/woocommerce-blocks/pull/8471) 2023-02-27 11:35:12 +00:00
Seghir Nadir 2b89cbff33 Prevent double triggering select shipping on the same rate (https://github.com/woocommerce/woocommerce-blocks/pull/8497)
* Prevent selecting already selected rates

* refactor reducer

* revert changes back to only block dubplicate requests
2023-02-27 11:52:38 +01:00
Niels Lange 49b42b627f Ensure express payment buttons are visible next to each other (https://github.com/woocommerce/woocommerce-blocks/pull/8548) 2023-02-27 17:30:22 +07:00
kmanijak 87cc35678a Move usage of wordpress-components to editor and replace with @wordpress-components (https://github.com/woocommerce/woocommerce-blocks/pull/8463) 2023-02-27 11:13:00 +01:00
Patricia Hillebrandt 25b434036d Fine-tune the Add to cart form block (https://github.com/woocommerce/woocommerce-blocks/pull/8482)
* Restrict usage to the single product template.

* Update class prefix from wc to wp

* Move the add-to-cart-form block to atomic blocks so it is aligned with the updated structure adopted for single product related blocks.

* Address CR

* ditch woocommerce class.

* remove attributes key

* Add new styles to account for the removal of the .summary and .entry-summary selectors

* Narrow down the styles to the add-to-cart-form class.
2023-02-24 23:12:53 +01:00
Luigi Teschio abd8cdbcc2 Add Related Products block (https://github.com/woocommerce/woocommerce-blocks/pull/8522) 2023-02-24 16:35:43 +01:00
Saad Tarhi 9bfc8a633c Fix Payment Options settings crash in the editor (https://github.com/woocommerce/woocommerce-blocks/pull/8535) 2023-02-24 16:08:19 +01:00