* Rename blocks to to distinguish them from new blocks
* Add changelog
* Change the naming convention to XYZ (Classic)
* Update classic templates descriptions
* Fix package.json lint error
* Use the term attribute sort order for the "Filter by attribute" block
* Allow `id` and `name_num` orderby values
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add type safety, update coming soon entire site changes for fonts
* Add conditional font to support TT24 and other themes
* Revert unnecessary change
* Changelog
* Lint
* Fix: Ensure Product Collection Block Respects "Hide Out of Stock Items" Setting
- Added logic to include the "Out of stock visibility" setting in the Product Collection block.
- Modified `ProductTemplateEdit` component to use the `getDefaultStockStatuses` function.
- Ensured that out-of-stock products are hidden in the Product Collection block when the "Hide out of stock items from the catalog" option is enabled.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Make shipping total show FREE if price is 0
* Make free text uppercase in order summary
* Add test to check free/paid shipping displays as free or shows price
* Add changelog
* Update E2E test to make sure shipping is selected correctly
* Update shipping cost e2e tests
* Further fixes to e2e tests
* Make sidebar sticky on desktop
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* limit sidebar sticky to cart only
* add useless new line
---------
Co-authored-by: github-actions <github-actions@github.com>
* return focus on drawer
* adjust notice button color
* adjust cart/checkout input label color
* return focus for shipping form button
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* remove the generic incompatible notice
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Turn Change address link to button
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* fix lint
---------
Co-authored-by: github-actions <github-actions@github.com>
* Fix input clearing issue in PriceTextField with improved currency parsing
This commit addresses a usability issue in the PriceTextField component, highlighted by @dinhtungdu, where the input field would clear itself if users omitted a space between the numeric value and the currency symbol when the currency is configured to appear on the right with a space (e.g., "20$" instead of "20 $"). The problem was rooted in the strict parsing logic that did not account for variations in user input related to currency formatting.
The fix involves an enhancement to the numeric parsing function, which now effectively handles various user inputs regardless of space or placement of the currency symbol. The revised parsing logic uses a regular expression to strip out any characters that are not numeric or the designated decimal separator, and then replaces the locale-specific decimal separator with a period for standard numeric conversion. This approach not only fixes the specific issue but also improves the robustness of the component against similar input variations.
* Refactor currency parsing and improve handling in PriceTextField
1. Renaming `formatValueAsCurrency` to `formatNumberAsCurrency` to better
reflect its functionality.
2. Moving the `convertCurrencyStringToNumber` function outside of the
PriceTextField component, enhancing readability and reusability.
3. Changing the internal state handling from `newValue` to `inputValue`,
directly managing the string input and parsing it as needed for further
processing. This will force input field to re-render.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Fix: Handle empty string in price conversion to prevent 0 value
This commit fixes an issue where an empty string in the price conversion function resulted in a value of 0. Now, empty strings are properly handled and do not convert to a numerical value.
---------
Co-authored-by: github-actions <github-actions@github.com>
* fix: handle undefined templateSlug in Product Collection tracking utils
The modification introduces a check for templateSlug before attempting to access its properties or use it in further logic. This change addresses a bug that manifested when users tried to edit a synchronized Product Collection block, resulting in a JavaScript error because templateSlug could be undefined.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Update types to better reflect reality
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
* Update styles for WooCommerce coming soon page
- Add min-width to container for better responsiveness
- Adjust padding for smaller screens
- Update font size and text wrapping for banner
* Add changelog
* Improve readability
* POC: Preview Mode using HOC
* Add explanation as comments
POC: Implement preview mode for Product Collection block in editor
- Added extensive commentary to clarify the mechanism and usage of the `handlePreviewState` function
- Implemented an internal state within `ProductCollectionContent` to manage preview status and messages, serving as a foundational example of how preview mode can enrich block functionality.
- Showcased the application of `handlePreviewState` by incorporating it as a prop in `BlockEdit`, illustrating the potential for extending the block's capabilities for dynamic and interactive previews.
This POC demonstrates a flexible approach to managing preview states within the editor, paving the way for further development and integration based on feedback and use-case analysis.
* Refactor preview state handling and collection registration
This commit introduces a centralized approach for registering product collection variations and managing their preview states. It abstracts the registration logic into a dedicated function and enhances the flexibility of preview state handling across different collection types.
* Rename file
* Minor improvements
* Don't pass previewState to handlePreviewState
I don't see any good use of it in handlePreviewState. Also, We will be going to call handlePreviewState only once
therefore, it will always have the same value as the initial value of the previewState. If in future, we decide to run it
multiple times then we can pass the previewState as an argument to handlePreviewState.
* Add comment
* Use JS closure to inject handlePreviewState
This commit introduces a refined approach for injecting the `handlePreviewState` function into product collection blocks, utilizing JavaScript closures to streamline the process. This method replaces the previous global registry mechanism, offering a more direct and efficient way to manage preview states.
Advantages of This Approach:
- Utilizing JavaScript closures for injecting `handlePreviewState` simplifies the overall architecture by directly modifying block edit components without relying on an external registry. This method enhances code clarity and reduces the cognitive load for developers.
- The conditional application of `withHandlePreviewState` ensures that the preview state handling logic is only added to blocks that require it, optimizing performance and maintainability.
* Refactor preview state management into custom hook
This commit enhances the organization and readability of the product collection content component by abstracting the preview state management into a custom hook named `usePreviewState`. This change streamlines the component's structure and aligns with React best practices for managing state and side effects.
Key Changes:
- Introduced `usePreviewState`, a custom hook responsible for initializing and managing the preview state (`isPreview` and `previewMessage`) of the product collection block. This hook encapsulates the state logic and its side effects, including the conditional invocation of `handlePreviewState`.
- Modified `ProductCollectionContent` to utilize `usePreviewState` for handling its preview state. This adjustment makes the component cleaner and focuses it more on presentation and behavior rather than state management details.
* Replace useEffect with useLayoutEffect
* Add cleanup function in handlePreviewState function
Based on [this discussion](https://github.com/woocommerce/woocommerce/pull/45703#discussion_r1535323883), I added a cleanup function support for handlePreviewState. `handlePreviewState` can return a function which will be called on cleanup in `useLayoutEffect` hook.
* Fetching random products in Preview mode
* Allow collection to set initial preview state
* Pass location & all attributes to handlePreviewState function
* Handling collection specific query for preview mode
- Consolidated `handlePreviewState` and `initialPreviewState` into a single `preview` prop in `register-product-collection.tsx` and `product-collection-content.tsx` to streamline prop passing and improve the component interface.
- Updated the `queryContextIncludes` in `constants.ts` to include 'previewState'
- Enhanced the `ProductCollection` PHP class to handle preview-specific queries more effectively, introducing a new method `get_preview_query_args` that adjusts query parameters based on the collection being previewed, thereby improving the relevance and accuracy of products displayed in preview mode.
* Always set initialPreviewState on load
* Refine preview state handling
- Renamed `HandlePreviewStateArgs` to `SetPreviewStateArgs` in `featured.tsx` to better reflect its purpose, which is now more focused on setting rather than handling states. The implementation details within `featured.tsx` have also been refined to include async operations and cleanup functions, demonstrating a more sophisticated approach to managing state.
Overall, these updates make the preview state logic more understandable and maintainable.
* Rename "initialState" to "initialPreviewState"
* Fix: Correct merging of newPreviewState into previewState attribute
This commit addresses an issue in the product-collection-content.tsx where the newPreviewState was not properly merged into the existing previewState attribute. Previously, the spread operator was incorrectly applied, leading to potential loss of existing state attributes. By changing the order of operations and correctly spreading the existing attributes before merging the newPreviewState, we ensure that all state attributes are preserved and updated correctly.
* Initial refactor POC code to productionize it
* Move `useSetPreviewState` to Utils
* Implement preview mode for Generic archive templates
Implemented a new useLayoutEffect in `utils.tsx` to dynamically set a preview message in the editor for product collection blocks located in generic archive templates (like Products by Category, Products by Tag, or Products by Attribute).
* Remove preview mode from Featured and On sale collection
* Remove preview query modfication for On Sale collection
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Fix: hide/show preview label based on value of "inherit"
If user change the toggle "Sync with current query", then it should reflect for the preview label as well.
- If the toggle is on, then the preview label should be shown.
- If the toggle is off, then the preview label should be hidden.
* Minor improvements
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Refactor: Simplify SetPreviewState type definition in types.ts
This commit refines the SetPreviewState type definition by eliminating the previously used intermediate interface, SetPreviewStateArgs. The change streamlines the type definition directly within the SetPreviewState type, enhancing readability and reducing redundancy.
* Update import syntax for ElementType in register-product-collection.tsx
This commit updates the import statement for `ElementType` from `@wordpress/element` to use the more modern and concise `import type` syntax. This change does not affect functionality but aligns with TypeScript best practices for importing types, ensuring that type imports are distinguished from regular imports. This helps in clarity and in optimizing the build process by explicitly indicating that `ElementType` is used solely for type checking and not included in the JavaScript runtime.
* Refactor: Update TypeScript usage in Product Collection
This commit introduces several TypeScript refinements across product-collection components:
1. **DEFAULT_ATTRIBUTES** in `constants.ts` now uses `Pick` to explicitly define its shape, ensuring only relevant attributes are included and typed accurately.
2. **ProductCollectionAdvancedInspectorControls** and **ToolbarControls** in the `edit` subdirectory now use `Omit` to exclude the 'preview' property from props, clarifying the intended prop usage and improving type safety.
These changes collectively tighten the type definitions and improve the codebase's adherence to best practices in TypeScript.
* Refactor: Update dependencies of useSetPreviewState hook in utils.tsx
This change enhances the stability and predictability of the hook's behavior, ensuring it updates its internal state accurately when its dependencies change, thus aligning with best practices in React development.
* Refactor preview button CSS and conditional rendering
1. **CSS Refactoring:** Moved the positioning styles of the `.wc-block-product-collection__preview-button` from inline styles in the JSX to the `editor.scss` file. This separation of concerns improves maintainability and readability, aligning the styling responsibilities solely within the CSS file.
2. **Conditional Rendering Logic:** Updated the rendering condition for the preview button. Now, it not only checks if `isPreview` is true but also if the block is currently selected (`props.isSelected`). This prevents the preview button from appearing when the block is not actively selected, reducing visual clutter and enhancing the user experience in the editor.
* Enhance: Update preview button visibility logic in ProductCollectionContent
This commit enhances the visibility logic of the preview button in the `ProductCollectionContent` component:
1. **Added `isSelectedOrInnerBlockSelected`:** Introduced a new `useSelect` hook to determine if the current block or any of its inner blocks are selected. This ensures that the preview button is visible when either the product collection block or any of its inner blocks are selected.
2. **Updated Conditional Rendering:** Adjusted the conditional rendering of the preview button to use the new `isSelectedOrInnerBlockSelected` value, providing a more intuitive user experience by ensuring the preview button remains visible when any relevant block is selected.
* use __private prefix with attribute name
* Add E2E tests for Preview Mode
1. **Template-Specific Tests:** Each template (tag, category, attribute) undergoes a test to ensure the preview button behaves as expected when replacing products with product collections in these contexts.
2. **Visibility Checks:** The tests verify that the preview button is visible when the block or its inner blocks are selected and hidden when the block is not selected. This helps confirm the correct implementation of the preview button visibility logic across different use cases.
3. **Interaction with Inner Blocks:** Additional checks are included to ensure the preview button's visibility toggles appropriately when interacting with inner blocks, reinforcing the dynamic nature of block selection and its effect on UI elements within the editor.
* Add setPreviewState to dependencies
* Add data-test-id to Preview button and update e2e locator
Modifications:
- Added `data-test-id="product-collection-preview-button"` to the Preview button in `product-collection-content.tsx`.
- Updated the corresponding e2e test locator in `product-collection.block_theme.side_effects.spec.ts` to use the new `data-test-id` instead of the class name.
By using `data-test-id`, we ensure that the e2e tests are not affected by changes in the styling or restructuring of the DOM that might alter CSS classes but do not affect functionality.
* Enhance: Localize preview message in useSetPreviewState hook
* Don't show shadow & outline on focus
* Make preview button font same as Admin
* Fix SCSS lint errors
* Add missing await keyword
---------
Co-authored-by: github-actions <github-actions@github.com>
* Create trackInteraction function and pass it to query Insprector Controls
* Add tracking to Attribute filter
* Add tracking to Created filter
* Add tracking to Featured filter
* Add tracking to Handpicked Products filter
* Add tracking to Inherit Query filter
* Add tracking to Keyqord filter
* Add tracking to On Sale filter
* Add tracking to Order By option
* Add tracking to Stock Statusoption
* Add tracking to Price Range filter
* Add tracking to Taxonomies filter
* Fix lint errors
* Add changelog
* Rearrange the logic of recognising the tracks location so it's more reliable
In the interest of avoiding pagination this refactor swaps the current term loading with one that doesn't require a cache of all terms. We've removed the need for the cache by storing the ID and term name together in the token/suggestion list and using a display transformation to hide any unnecessary information.
* Product Filters: add individual clear button
* Remove unused style.scss
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Simplify searching for the tag
* Convert to use button instead of anchor
* Try using iAPI to show/hide clear button
* Use local context instead of global state
* Fix linting error
* Remove unneeded context
* Update clear button block description
* Fix frontend PHP error
* Add e2e tests for attributes filter clear button
* Add e2e tests for price filter clear button
* Add e2e tests for rating filter clear button
* Add e2e tests for stock status filter clear button
* Address feedback and use built in locators
* Address feedback and replace the use of timeouts
---------
Co-authored-by: github-actions <github-actions@github.com>
* select a shipping rate if there are no shipping rates on mount
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* move code and explain it
---------
Co-authored-by: github-actions <github-actions@github.com>
* reset state if it's not valid for the current country
* reset postcode as well
* Add changefile(s) from automation for the following project(s): woocommerce
* update logic so its in Checkout block instead of store api
* fix linting
---------
Co-authored-by: github-actions <github-actions@github.com>
* Move country to top of form for all countries
* adjust styling
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* Change “Pickup options” to “Pickup locations”
* Always show pickup location and truncate pickup details
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Adjust spacing between pickup details and more link
* Hide pickup details of unselected pickup location
* Adjust line height of truncated text
* Show “Read more/less” instead of “more/less”
* Ensure both lines are equally filled with text
---------
Co-authored-by: github-actions <github-actions@github.com>
* WIP: Display price in place order button
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Fix JS lint error
* Update e2e tests
* Display default place order button including placeholder in page editor
* Update plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-actions-block/constants.tsx
Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
* Optimise i18n using sprintf
* Wrap cart totals in “useSelect”
* Temporary skip failing e2e test
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
* Fix broken checkout address forms layout
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Product Reviews: not use useBlockProps twice
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Product Details: not use twice
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Refactor shipping sections
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Refactor various files and adjust e2e tests
* Display expected styles for “Ship” and “Pickup” in the page editor
* Use exact selector
---------
Co-authored-by: github-actions <github-actions@github.com>
* Refactor to wrap everything under cover block
* Changelog
* Cleanup and fix classic theme
* Wrap center with stack for ease of adding elements nearby
* Update styles
* Fix dynamic background color
* Style clean up
* Add border around order summary on cart & checkout
* Group subtotal, discount, fees, taxes and shiping block
* Move the coupon form in order summary
* Move the coupon form in order summary
* Manage state externally in Panel component and refactor Coupon form to use the Panel component
* Remove descriptions from order summary items
* increase font weight of order summary title
* Tidy up design for desktop and add separator back in for blocks on checkout order summary
* Remove border around order summary on mobile
* Revert "Move the coupon form in order summary"
This reverts commit 4a8044cdcf.
* Change heading styles for cart
* Change font weight to 500 of order summary heading on checkout block
* Remove padding and border between order summary totals items
* Refactor css for cart & checkout totals to work in the editor
* Adjust cart totals heading in the editor
* Last adjustment to checkout totals style to work in editor
* Add changelog
* Change the cursor to pointer for the panel component
* remove unused short and full description from OrderSummaryItem
* Fix failing e2e tests
* Fix lint issues
* Vertically align order summary title in the editor
* Fix e2e tests
* Fix linting issues
* Fix unit tests
* Remove changes from woocommerce.php
* Fix checkout block test
* fix eslint errors in checkout block test
---------
Co-authored-by: Niels Lange <info@nielslange.de>
* graduate woocommerce_blocks_register_checkout_field
* graduate filters
* Migrate Additional to Order and Other
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* fix markdown lint
* update tests to use old value
* fix lint issue
* pass field options by reference
* update test helpers
* update tests to use latest api
---------
Co-authored-by: github-actions <github-actions@github.com>
* copy styles over from 46619
* Fix header padding
* login/out
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* typo
---------
Co-authored-by: github-actions <github-actions@github.com>
* Added new OrderSummaryTotals Block
* Refactor order summary and totals block to contain the inner children
* Add migration for Order Summary Block
* Migration to handle older order summary without totals block
* Remove empty lines from order summary migration
* block editor migration for order summary
* Fix isEligible function
* Update Totals title
* Add checkout totals
* Remove echos and dies
* replace individual checkout blocks with totals block
* Change parent of totals inner blocks and add totals block to innerBlockAreas map
* change CART_ORDER_SUMMARY_TOTALS to CHECKOUT_ORDER_SUMMARY_TOTALS
* Fix linting issues
* fix lint warnings
* Add changelog
* Lock movement of the taxes block in attributes.tsx
* Less indentation in the render function of CartOrderSummaryBlock and CheckoutOrderSummaryBlock
* Rename webpack chunkName for order summary totals
* Split taxonomies filter into seperate filter per taxonomy
* Add changelog
* Improve onDeselect function
* Update tests
* Fix lint
* Satisfy TS by returning single React element rather than array of elements
* Remove unused variable
* Add translation context to ambiguous words
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add deselect callabck to attribute filter
* Add deselect callabck to created filter
* Add deselect callabck to featured filter
* Add deselect callabck to handpicked filter
* Cleanup deselect callabck to keyword filter
* Add deselect callabck to on salefilter
* Add deselect callabck to order by option
* Add deselect callabck to stock status filter
* Add deselect callabck to price range filter
* Add deselect callabck to price taxonomies filter
* Call all the reset filer callbacks on reset
* Add changelog
* Remove unused variable
* Replace hardcoded default filter values with the DEFAULT_FILTERS constant
* Use templateSlug context in Product Collection
* Implement util recognising the location for track events
* Implement the track event when user chooses a collection in Product Collection
* Add changelog
* Remove incorrect import
* Cover cases with specific Product or Specific Taxonomy
* Update event name
* Adjust Product Filters tests
* Revert wrong commit
* Unify the category for all Product Elements
* Add changelog
* Bring back category to product elements that don't use shared confiug
* Add specific category to some Product Elements blocks registered only for Single Product template
* Recognise if Product Collection is inside Cart or Checkout blocks
* Upgrade priority block recognition over templates
* Update the comments to better depict the flow
* Add changelog
* Simplify the logic
* Fetch all products for hand-picked products control
This commit modifies the `getProducts` function usage within the Hand-Picked Products control, aiming to fetch all products regardless of catalog size.
The change involves explicitly setting `queryArgs` to include `per_page: 0` in the function call. This adjustment overrides the default behavior based on the `isLargeCatalog` condition, ensuring that all available products are fetched from the Store API for selection within the control.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Remove clickable cursor on post title
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Update plugins/woocommerce-blocks/assets/js/blocks/product-collection/edit/editor.scss
Co-authored-by: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
* Add missing semicolon
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
* Ensure that each <CheckboxControl> component has a unique id
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Optimise setup and teardown settings
* Wrapping setup and teardown in act()
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add missing allowed inner blocks to Single Product block
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Remove unnecessary attribute from Single Product block template
---------
Co-authored-by: github-actions <github-actions@github.com>
* Don't show publicly non-queryable taxonomies
The main enhancement involves adding a visibility filter to the taxonomies query. Now, the query considers the `publicly_queryable` property of each taxonomy. Only taxonomies marked as publicly queryable are included in the final list returned by the `useTaxonomies` hook. This change ensures that the Product Collection block's taxonomy controls only display taxonomies relevant and accessible to the public, enhancing both the usability for content creators and the relevance of taxonomy selections for site visitors.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
Since we don't need it to be _perfectly_ stable,
we can just set the `queryId` to the instance ID
on every component mounting. This is fine and
won't mark the attribute as dirty unless a
collection block is added, deleted, or moved
in just the right way. The exception to this
is collection blocks in sync patterns.
In this case the ID cannot change
because it can cause update loops in some
cases that freeze the browser.
* Add gap between quantity field and add to cart button when stacked
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Add specificity to quantity
---------
Co-authored-by: github-actions <github-actions@github.com>
* Rating filter: fix misaligned count
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Fix broken CSS classes and update JS unit snapshots
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* removes the star font
The WooCommerce font can hold many other icons there isn't the reason to load a font for a single icon
* updates custom templates stylesheets
* adds woff2 font format to themes customized stylesheets
* fix the star font size diff
* removes WooCommerce.eot and SVG file that are no longer needed and updates the template style in order to import from font.scss
* Optimized font import
Unifies the import of fonts by extending it to the twenty-twenty-three theme
* Add changefile(s) from automation for the following project(s): woocommerce
* Add changefile(s) from automation for the following project(s): woocommerce
* Svg font minification (WooCommerce.svg)
* Add changefile(s) from automation for the following project(s): woocommerce
* "star" font phasing out
The font family 'star' was replaced in all files. However, it continues to remain physically in the repo but not in the style files
* Removes the `.eot` font file since nowdays it's completely useless
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add dummy Force Page Reload control to Inspector Advanced Control
* Add enhancedPagination attribute that decides if client side navigation is enabled
* Consume the enhancedPagination attribute
* Force client side navigation when incompatible blocks detected
* Dummy util to detect incompatible blocks
* Detect incompatible blocks in the Editor
* Switch to WordPress Interactivity package in Product Collection
* Add initial implementation of the incompatible blocks detection in frontend
* Remove leftover
* Revert to using internal version of interactivity API
* There's no Interactivity store config available in the internal Interactivity implementation so remove it
* Disable client side navigation if the incompatible block is detected
* Add default attribute value
* Switch from enmhancedPagination attribute to forcePageReload
* Fixed some misclicked line order change
* Switch from enhancedPagination to forcePageReload in PHP code
* Apply the correct filter
* Fix the incorrect condition to detect incompatible block
* Initial implementation of orange dot to bring attention
* Cleanup
* Remove the orange dot indicator
* Refactor checking for unsupported blocks
* Add changelog
* Fix PHP lint errors
* Bring back empty line at the end of pnpm-lock
* Bring pnpm-lock.yaml file to original state
* Fix incorrect function call
* Add visibility description to function
* Switch private method to public
* More linted fixes
* Disable block interactions within the editor
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Pass isPreview prop to inner blocks of the Product Filter block
* Add logic to render preview block when in Preview mode
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
Since the product collection block uses the interactivity router,
it reloads the page in the background and replaces sections
with a `data-wc-navigation-id` set. This adds the attribute
to the count block so that it can also live reload regardless
of where it is in the tree.
* Add totalValue filter
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Remove nowrap to prevent text overflow
* Start docs for ‘totalValue’ filter
* Fix *.md lint issues
* Ignore .md lint errors for now
* Update code example and add screenshots
* Fix failing JS unit tests
---------
Co-authored-by: github-actions <github-actions@github.com>
* Prevent invalid price range selection in Product Filter Price block
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* changed filter by attribute filter options order
In filter by attribute, order of the filter conditions "ALL" and "ANY" reversed as requested.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Set initial vlaue of Created filter for New Arrivals collection
* Add changelog
* Remove a check for products in tests as they may not really be displayed
* Adjust the New Arrivals test
* Adjust the tests logic after the change
* Bring back previous formatting
* Bring back function closure removed by mistake
* Fix styling issue in the Editor when Inline input fields is enabled
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Fix styling issue on the Frontend when Inline input fields is enabled
* Fix css lint errors
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add block preview to filter blocks
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
With the availability of other unique characteristics
for identifying collection blocks, it is no longer necessary
to keep this attribute. Since it has not been used it is safe
to remove it without a deprecation cycle.
* Fix styling for select in Site Editor
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add with-product-variations.tsx
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Add types for ProductVariationItem
* Fix ESLint errors
* Remove JS file
* Replace Product with ProductResponseItem interface
Initially, a Product interface was created to add the required types; however,
it was pointed out that the @woocommerce/types alias already provided an interface
for products (the ProductResponseItem interface).
* Remove returning types definition
---------
Co-authored-by: github-actions <github-actions@github.com>
* Refactor No Reviews Placeholder component from JavaScript to TypeScript
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Fix file import
---------
Co-authored-by: github-actions <github-actions@github.com>
* Convert Reviews Editor code to TypeScript
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* add imageSizing attribute to the product catalog template
* add attribute for the product search results template
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* Refactor store usage
* Prepare function resolving inherit property for additional check
* Add logic to disable sync with query if there's already one Product Collection on archive that does that
* Add changelog
* Cover the post editor case
* Add E2E test for that and small refactor in tests
* Remove duplicated import
* Fix lint problems
* Fix typo in test description
Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
* Replace confusin abbreviation with other description
* Update the logic to be more robust and covering also the case where Product Collection blocks are nested
* Add issue reference to the comment
* Add eslint disable before ts-ignore
---------
Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
* Add animation for client-side pagination
This includes:
- Addition of animation state management in the frontend file to control the visual transition between pagination states.
- Introduction of new SCSS rules for the start and finish animations, ensuring a seamless and visually appealing pagination experience.
- Modification of the PHP logic to inject necessary HTML for the animation to be applied.
These updates aim to provide a more engaging and responsive interface for users navigating through product collection.
* Enhance accessibility for product collection navigation
This commit introduces several improvements to enhance accessibility and user experience. Specifically, it adds new context properties to manage accessibility messages during the navigation process, including messages for loading and when a page has loaded. These changes ensure that screen reader users receive appropriate feedback during navigation.
Changes made:
- Added `accessibilityMessage`, `accessibilityLoadingMessage`, and `accessibilityLoadedMessage` properties to the `ProductCollectionStoreContext`. These properties store messages to be announced by screen readers during different stages of page navigation.
- Implemented logic in the product collection store to update the `accessibilityMessage` during the start of navigation (showing a loading message) and upon completion (showing a loaded message).
- Utilized a technique to ensure that consecutive identical messages are still announced by screen readers, by appending a no-break space to the message if it is the same as the previous one. This follows a pattern similar to the `@wordpress/a11y` package.
- In `ProductCollection.php`, enhanced the block's HTML output to include these new accessibility messages and integrated them with the existing interactive data attributes. This ensures that the front-end components are fully prepared to handle these accessibility enhancements.
- Added a new `div` with `class="screen-reader-text"` and `aria-live="polite"` attributes, which dynamically displays the accessibility message based on the navigation state. This div complements the visual pagination animation with an accessibility-focused mechanism for announcing the page load states to screen reader users.
By addressing accessibility considerations with these enhancements, we're making Product Collection navigation more inclusive and user-friendly for all users.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add spacing in Checkout block page
* Add spacing in Order summary block
* Update responsive styles for order summary panel
* Update styles for cart and cart line items table
* Update styles for order summary and cross-sells products
* Remove unnecessary CSS styles from cart line items table and cart block
* Remove unused CSS class from cart line items table
* Fix linting errors
* Add changelog
* Fix changelog lint
* Update quantity selector style
* Increase the line-height of the set description and remove margin top from email field
* Add margin-top to order summary image and express payment margin adjustment
* Update styles for cart and checkout components
* Fix linting error
* Fix margin units in cart-cross-sells-products
* Replace em with px
* Add margin-top to payment method container
* Update styles for Cart block for mobile screen
* Update padding in cart style.scss
* Fix removal of express payment method from state
- Correct the logic for removing an express payment method from the availableExpressPaymentMethods state object.
- Previously, the deletion targeted the incorrect object, leading to incorrect change in state. Now, the correct entry is removed using destructuring and rest parameters, ensuring the express payment method is properly deleted.
* Revert "Fix removal of express payment method from state"
This reverts commit 8e24553794.
* Fix typo error in the reducer
* Add unit to make sure correct express payment method is removed
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Remove payment method descriptions from express and fix changelog
---------
Co-authored-by: github-actions <github-actions@github.com>
* Clear billing address when useShippingAsBilling checkbox is unchecked
* Add billing address sync with server
* Add useRef hook to store previous billing address and update sync functions
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Revert "Add useRef hook to store previous billing address and update sync functions"
This reverts commit 7bc3312ab7.
* Added condition to clear address only for guest users
* Add E2E test to check billing address form is empty for Guest shopper
* Fix typo
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Updated docs-manifest.json
* Revert "Updated docs-manifest.json"
This reverts commit 20d578a9d6.
* Include company field in the E2E test
* Replace beforeAll with beforeEach
* Skip country reset to keep consistency with Shortcode Checkout
* Remove sync billing address on server
* Update E2E test to include the shipping address check
* Remove unsed imports
* Clear address fields except country and state
* Optimize the billing and shipping address check with switch statement
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
* Add animation for client-side pagination
This includes:
- Addition of animation state management in the frontend file to control the visual transition between pagination states.
- Introduction of new SCSS rules for the start and finish animations, ensuring a seamless and visually appealing pagination experience.
- Modification of the PHP logic to inject necessary HTML for the animation to be applied.
These updates aim to provide a more engaging and responsive interface for users navigating through product collection.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Allow user clicks under product collection's loading animation
This commit enhances the user experience of the loading animation for the product collection block. Changes include:
- Specifying `transform-origin: 0% 0%;` directly within the block's initial style to indicate the animation should start from the left
- Adding `pointer-events: none;` to allow user interactions with elements underneath the loading animation, thus improving usability by not blocking clicks.
Additionally, redundant `transform-origin` properties were removed from the `@keyframes` declaration to clean up the code and avoid unnecessary repetition. This simplification contributes to both the maintainability and readability of the stylesheet.
* Fix linting errors in SCSS file
---------
Co-authored-by: github-actions <github-actions@github.com>
* Fix Gutenberg links in the docs pointing to the wrong branch
* Add changefile(s) from automation for the following project(s): @woocommerce/notices, @woocommerce/eslint-plugin, @woocommerce/dependency-extraction-webpack-plugin, @woocommerce/components, woocommerce-blocks, woocommerce-beta-tester, woo-ai
* Fix markdown lint errors
* Fix wrong link in the docs
---------
Co-authored-by: github-actions <github-actions@github.com>
* Early implementation of getting the Product Collection location/context
* Solve the problem of async fetch in the hook
* Improve typing
* Import core data store instead of hardcoding store name
* Recognise Product Category and Product Tag
* Remove attr property from archive location data
* Unify states naming
* Add TODO entry
* Display the info about the location of Product Collection
* Improve the typing
* Recognise if Product Collection is nested in Single Product block
* Improve cases descriptions and add some defaults to potentially undefined values
* Change the taxonomies sourceData
* Recognise Mini Cart as Cart context
* Recognise attribute as archive contect but no taxonomy
* Refactor the function into single useEffect and clean it up
* Fix typo
* Remove unnecessary import
* Stop rendering the output in Editor (it was for demo purposes)
* Pass location data to Product Template query in Editor
* Replace templateSlugs literal strings with object reference
* Rename parseResponse function to more specific name getIdFromResponse
* Add dpeendency array to useEffect
* Refactor templates detection
* Use full taxonomy names instead of shortcuts
* Write down scenarios to test
* Working scenario
* Change the verification way for more robust
* Add more robust methods to include Single Product block
* Add test Product Collection in Single Product block in a Single Product Template
* Imprvoe the order of veryfing the requests
* Fix linter issues. Although that makes code less readable
* Improve the useGetLocation typing so it's more generic
* Rework the E2E tests regarding location of Product Collection and limit their number
* Bring back necessary eslint-disable
* Remove unused imports
* Uncomment line required for other tests
* Add changelog
* Rename constant from BLOCK_NAME to BLOCK_SLUG as it's a slug
* Add a BLOCK_NAME constant and replace the literal block name usages in E2E tests
* Fix post merge issues
* Fix test after merge
* Adjust the tests to kick off waiting for request before action that triggers them
* Make attributes available in rest_product_query hook
This commit introduces the 'includeInQueryContext' attribute to the 'woocommerce/product-collection' block and updates the 'woocommerce/product-template' block to consume this new attribute.
Key Changes:
1. `woocommerce/product-collection` Block:
- A new attribute 'includeInQueryContext' is added in `block.json`. This attribute is designed to hold a list of attribute names relevant for the query context.
- The 'includeInQueryContext' attribute is included in the `providesContext` field to ensure its availability to child blocks.
- In `constants.ts`, default values for 'includeInQueryContext' are defined, specifying 'collection' and 'id' as initial attributes.
- The `types.ts` file is updated with a comment explaining the purpose of 'includeInQueryContext'.
2. `woocommerce/product-template` Block:
- Modified `block.json` to utilize the 'includeInQueryContext' context provided by the parent `woocommerce/product-collection` block.
- The `edit.tsx` file is updated to handle the new context. It uses a newly added utility function `useProductCollectionBlockAttributes` from `utils.tsx` to access parent block attributes.
- The `utils.tsx` file is introduced, containing the `useProductCollectionBlockAttributes` hook. This hook is responsible for finding the parent 'woocommerce/product-collection' block and returning its attributes.
- Within `edit.tsx`, logic is added to create a query context object based on the attributes specified in 'includeInQueryContext', enhancing the block's ability to dynamically adapt to changes.
* Remove commented code
* Rename query context attribute and optimize parent block detection
This commit introduces two significant changes aimed at improving code readability and efficiency.
1. **Renaming of Query Context Attribute:**
- The attribute `includeInQueryContext` has been renamed to `queryContextIncludes` across various files, including block JSON configurations and TypeScript definitions. This change makes the attribute's purpose more intuitive, indicating it specifies which attributes to include in the query context.
2. **Optimized Parent Block Detection:**
- Replaced the use of `getBlockParents` with `getBlockParentsByBlockName` in utility functions to find the closest Product Collection block. This optimization allows for a more direct and efficient way to identify the relevant parent block by specifying the block name, reducing unnecessary iterations and improving code performance.
* Streamline query context construction in product template
Key Changes:
- **Introduction of `useProductCollectionQueryContext` Hook:** This new hook takes the `clientId` and `queryContextIncludes` as inputs and returns a query context object. It encapsulates the logic for fetching parent product collection block attributes and constructing the query context accordingly. This abstraction simplifies the edit component's logic, focusing on the essentials and improving code readability.
- **Optimization of Parent Block Detection:** The hook uses `getBlockParentsByBlockName` to accurately and efficiently find the closest parent `Product Collection` block, minimizing the overhead previously associated with traversing the block hierarchy.
* Always include `collection` and `id` in query context
* Minor refactor
* Enhance query context handling for more maintainable code
- Introduced `DEFAULT_QUERY_CONTEXT_ATTRIBUTES` in `edit.tsx` to maintain a clear list of default query context attributes.
- Modified `ProductTemplateEdit` to automatically include these default attributes in `queryContextIncludes`, ensuring they are always part of the query context without manual initialization.
- Simplified `useProductCollectionQueryContext` in `utils.tsx` by removing static initialization of 'collection' and 'id', relying instead on the dynamic addition of necessary attributes from `queryContextIncludes`.
This refactor enhances the maintainability and clarity of the code, ensuring a solid foundation for future enhancements and features.
* Add E2E tests for Product Collection query context
- Added a new test suite 'Query Context in Editor' to validate the correctness of query context parameters when the Product Collection block is used. This suite ensures that:
- For the 'Product Catalog', only the ID is sent in the query context, confirming that collection-specific parameters are excluded when not relevant.
- For collections such as 'On Sale', the collection name is correctly passed in the query context, validating that the block dynamically adjusts query parameters based on its settings.
- Introduced a new utility method `setupAndFetchQueryContextURL` in `product-collection.page.ts`. This method automates the setup of a post with the Product Collection block and fetches the URL with query context parameters, facilitating the validation of query context handling.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Fix edge case when `queryContextIncludes` is not defined
- Initializing `queryContextIncludes` with a default empty array directly in the destructuring assignment of the component's props. This approach ensures that `queryContextIncludes` is always an array, simplifying downstream logic.
- Creating a new constant `queryContextIncludesWithDefaults` to hold the combination of `queryContextIncludes` and `DEFAULT_QUERY_CONTEXT_ATTRIBUTES`. This step avoids directly mutating the `queryContextIncludes` prop, aligning with best practices for functional purity and making the code easier to understand and debug.
- Updating the `useProductCollectionQueryContext` hook call to use `queryContextIncludesWithDefaults`. This ensures that the default query context attributes are consistently included without altering the original prop.
These adjustments not only enhance the code's maintainability but also ensure more predictable behavior by avoiding side effects related to parameter mutation.
---------
Co-authored-by: github-actions <github-actions@github.com>
* Add logic to trap keyboard focus inside the Product Gallery Pop-Up
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Remove unnecessary condition
* Fix issue with keyboard focus trap not working within the Pop-Up
---------
Co-authored-by: github-actions <github-actions@github.com>
* Import editor.scss styles of Product Templayte and increase specificity
* Add changelog
* Add ts ignore
* Revert changing eslint-disable as it conficts with another rule creating more errors
* Include collection attribute in the block context
* add 'collection' to useContext for Product Template
* Changelog
---------
Co-authored-by: Manish Menaria <the.manish.menaria@gmail.com>
* Return focus to trigger element when closing pop-up
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Fix php cs error
---------
Co-authored-by: github-actions <github-actions@github.com>
* Update data store to bail if there is no customer ID
* Use WC_Data meta functions
* Save and load meta in session class
* Customer session handling
* CheckoutFields - only persist customer data to accounts
* Inline docs for session handling
* Handle meta data in session
* Document wc->customer inline
* Store only additional fields in session
* Prevent notice in WC_Data
* Organise keys and remove duplicates
* Correctly save fields to account
* Fix notices on checkout
* Remove unnecessary diff
* Changelog
* Go back to previous way to loading session handler to avoid 3rd party breakage
* No need to track is_session
* white space
* Remove changes to customer data store
* Update class-wc-customer-data-store.php
* Populate client from additional values from api
* Additional fields in session
* Add woocommerce_customer_allowed_session_meta_keys hook
* Put back legacy keys for tests
* Remove key fixes
* Don't save additional fields to customer object
* Remove duplicate init call
* Only persist contact fields
* Add ability to select thumbnails using keyboard
* Add ability to open the Product Gallery pop up using the keyboard
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Fix outline border not showing on Thumbnails on some browsers
* Prevent firefox browser from focusing on UL tag of the Large Image block
* Enable usage of 'Space' and 'NumpadEnter' keys to navigate between the thumbnails
---------
Co-authored-by: github-actions <github-actions@github.com>
* fix error on decimal input for the Number of Thumbnails setting
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Initial working version
* Update scrolling behavior in product collection block frontend
This commit updates the scrolling behavior in the product collection block's frontend script.
Previously, the code focused on the first anchor or button within a product collection block. This approach was taken to maintain accessibility and ensure that the focused element was scrolled into view. However, this behavior has been changed to improve the user experience.
The updated code now directly scrolls to the first product in the collection. This is achieved by selecting the product using a new selector that targets the `.wc-block-product` class within the `.wc-block-product-template` of the specified `data-wc-navigation-id`. Once the product is selected, the `scrollIntoView` method is used with smooth behavior and start block alignment, offering a more visually appealing scroll effect.
This change enhances the user experience by smoothly directing attention to the beginning of the product collection, making it easier for users to browse products.
* Remove code related to animation
* Fix the issue related to pagination block rendering
- I have improved the code by breaking it into smaller functions
- Added unique `data-wc-key` to each anchor tag
* Enhance Product Collection Block with Interactive Prefetching
* Refine Prefetch Logic & other improvements
This commit further refines the prefetch logic and interactivity in the Product Collection block. It focuses on enhancing code clarity and improving the prefetch behavior based on user interactions.
Key changes include:
1. Renamed 'isPrefetchNextAndPreviousLink' to 'isPrefetchNextOrPreviousLink' in ProductCollectionStoreContext for better readability and accuracy.
2. Modified the scrollToFirstProductIfNotVisible function to accept a wcNavigationId as a parameter instead of a reference
3. Introduced checks for the existence of wcNavigationId in scrollToFirstProductIfNotVisible to prevent unnecessary executions.
4. Updated comments throughout frontend.tsx for enhanced clarity, explaining the prefetch logic and its triggers in detail.
5. Adjusted the logic in the navigate and prefetch functions to align with the new context structure and prefetch strategy.
6. In ProductCollection.php, updated data attributes to align with the revised prefetch strategy.
7. Refined the attribute setting in process_pagination_links function to correctly implement the updated interactivity and prefetch logic.
These changes aim to optimize the prefetch functionality, reduce unnecessary prefetching on initial page load, and ensure a smoother and more efficient navigation experience within the Product Collection block.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Improve comments
* Use wp_json_encode for data-wc-interactive attribute
This commit updates the `ProductCollection` class to use `wp_json_encode` for setting the `data-wc-interactive` attribute value. Previously, the attribute value was hardcoded as a JSON string. Now, by utilizing `wp_json_encode`, we ensure the JSON encoding is handled correctly by WordPress standards, enhancing readability and maintainability of the code.
---------
Co-authored-by: github-actions <github-actions@github.com>
* Initial approach to fix incorrect product data displayed in Product Collection in context of Single Product block
* Remove the BlockCOntextProvider
* Add Block context for title and summary
* Add changelog
* Improve typing
* Add E2E test with Product Collection inside Single Product block
* Improve insertBLock function description
* Make productPrices selector in Product Collectionmore specific
* Extract components props into a types
* Hide the shipping rates in editor to match front-end
- If there are no shipping rates, hide the shipping rates in editor to match front-end.
* Add get_shipping_zones method to CartCheckoutUtils
* Display change address like for fallback shipping zone
- If cart has multiple and default shipping zones without shopper address, display the change address link
* Update shipping address label
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Fix linting errors
* Update plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/shipping-address.tsx
Co-authored-by: Niels Lange <info@nielslange.de>
* Display shipping calculator for locations outside all other zones
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Update typescript for activeShippingZones
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
* Fix session notices in Cart and Checkout block pages
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Update plugins/woocommerce-blocks/assets/js/base/components/notice-banner/style.scss
Co-authored-by: Niels Lange <info@nielslange.de>
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
* Add unique ID attribute to Product Collection block
In this update, we introduced a unique identifier for each instance of the Product Collection block. This change involves several key modifications:
1. **Block JSON Update**: Added a new `id` attribute in `block.json` to store the unique identifier for each block instance.
2. **Product Collection Content Update**: In `product-collection-content.tsx`, we utilized the `uuid` library to generate a unique ID. This is done in a `useEffect` hook, ensuring that each block instance receives a distinct ID upon initialization.
3. **Type Definitions**: The `ProductCollectionAttributes` interface in `types.ts` was updated to include the new `id` attribute, aligning with our enhanced data structure.
4. **Package Dependencies**: To support this feature, `@types/uuid` and `uuid` were added to `package.json`, ensuring we have the necessary tools for ID generation.
This enhancement is pivotal for uniquely identifying each Product Collection block, paving the way for more robust and individualized block handling in the future.
* Rename uniqueId to id
* Add lock file
* Add 'id' context to product collection and template
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Merge trunk with 42861-introduce-a-unique-identifier-for-each-product-collection-block
* Regenerate the lockfile
* Remove autogenerated change in plugins/woocommerce/package.json
* Regenerate lock file
* Rerun CI actions
* Delete pnpm-lock.yaml file & regenerate it using pnpm install command
---------
Co-authored-by: github-actions <github-actions@github.com>
* Remove the experimental flag from the Product Gallery block
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* Get default attributes on front end
* Remove console log
* Show notice about 0 registered fields in editor
* Do not show block in editor if no fields are registered
* Wrapper block
* Styling/spacing
* Update webpack config
* Register heading pattern
* Wrapper block type definition
* get_fields_for_location return fields in array format
* Use wrapper in default content
* Separate fields from the hook block
* Hide when no custom fields exist
* Address and contact fields
* Shared form fields in settings
* remove info block from wrapper
* Revert render_content to original
* rename block
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Update styling
* Create shared get_order_additional_fields_with_values to format values
* Update block names and descriptions
* Show address placeholders
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Unused import
---------
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: github-actions <github-actions@github.com>
* Product Gallery: Update div elements to ul and li for better accessibility
* Product Gallery: Add changelog files
---------
Co-authored-by: roykho <roykho77@gmail.com>
* Prevent body from scrolling when pop-up is open
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Add namespace to the modal-open css class
* Fix class name for the Product Gallery block
---------
Co-authored-by: github-actions <github-actions@github.com>
* Fix Mini-Cart price disappearing on hover
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Introduce the minimal block style for productDetails block
* Change the default style in the template
* Change the default template when using the transform-to-blocks button
* Cleanup
* Organize CSS selectors
* Add opacity on hover
* Fix specificity and add explanation
* Cleanup
* Changelog
* Rename media setting to "Open pop-up when clicked"
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Product Gallery: Use @container rule to adjust overlay link count font size
* Add changelogs
* Remove em from line height
* Make view all link smaller
* Move the switch to classic shortcode block button to separate component
- Move modal component file from incompatible-extension-notice component folder to switch-to-classic-shortcode-button folder.
- Rename modal component file to model-content component file.
- Move the switch to classic shortcode block button to separate component folder
* Update generic incompatibility notice
- Update the notice description.
- Add switch to classic shortcode block button to the notice.
* Fix margin in editor.scss
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Update class names in switch-to-classic-shortcode-button component
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Update plugins/woocommerce-blocks/assets/js/editor-components/switch-to-classic-shortcode-button/editor.scss
Co-authored-by: Niels Lange <info@nielslange.de>
* Refactor SwitchToClassicShortcodeButton component
* Fix css lint erros
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Add type property to notice events
* Refactor switch to classic shortcode button logic
* Use isCart for switchButtonLabel and snackbarLabel
* Remove empty div in sidebar compatibility notice component
* Refactor switch to classic shortcode button event handling
* Adjust wording
* Adjust marging and readability
* Introduce union for SwitchToClassicShortcodeButtonProps type prop
* Simplify logic
* Use proposed text
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
* add: multiple select support to attribute dropdown
* fix: remove active filter from dropdown
* chore: remove unused extractBuiltinColor
---------
Co-authored-by: Tung Du <dinhtungdu@gmail.com>
* add: query filters count class
* chore: method comments
* refactor: rename class to QueryFilters
* fix: price filter count
* fix: price filter url
* chore: remove unnecessary transformation
* chore: remove unused meta query filter
* chore: put public methods on the top of the class
* fix: passing $wp_query
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* fix: stock query clause
* fix: handle and query type for attribute filter
* fix: ensure passing non null value to floor/ceil
* [Experimental] Collection Filter blocks: ensure the namespace is always rendered (#43112)
* fix: ensure the namespace is always rendered
* fix: target only wc queries
* fix: properly reset part of query to make new filter blocks work with Product Collection block
* Revert "Trigger event `experimental__woocommerce_blocks-cart-add-item` in the SSR Product Button vis Interactivity API (#42946)"
This reverts commit 4fec136da1.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Update woocommerce.com URLs in documentation and code files
* Add changelog
* Fix github repository link in extend-rest-api-add-custom-fields.md
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
* Add github reporter (#42974)
* Add github reporter
* Add changelog
---------
Co-authored-by: Jon Lane <jon.lane@automattic.com>
* Fix product task redirect to support grouped and external products (#43051)
* Rearrange product redirection logic to better accept grouped and external produc types
* Add changelog
* Modify feedback modal actions (#43005)
* Adapt feedback modal actions
* Add changelogs
* Modify comments
* Fix tests
* Fix test
* Update class-wc-gateway-bacs.php (#43054)
* Update class-wc-gateway-bacs.php
Fix typo in textdomain
* Add changefile(s) from automation for the following project(s): woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* [Product Block Editor]: Add `Linked product` tab (#43009)
* add linked-products to group IDs
* add Linked Products tab
* tweak hideConditions condition
* changelog
* fix typo in doc comment
* Introduce a product type selection within the new experience (#41823)
* Create a relation between the product type and the product block template
* Add 'patterns' to name the kind of products that can be created for a specific template
* Resolve template using its id as a template query param
* Rename ProductEditPattern to ProductTemplate
* Rename get_patterns hook to woocommerce_product_editor_get_product_templates
* Return the list of templates to the client
* Set layout template events as array
* Register the layout template based on the product template or the post type in case of product variations
* Registering non supported product types
* Create and register the woocommerce/product-details-section-description block
* Add the product type to the section description
* Create product type selector
* Fix menu item style
* Highlight selected menu item
* Set the selected product template
* Set product template title to lowercase in the content description
* Rename blocks by blockTemplates under the AbstractBlockTemplate class
* Rename to woocommerce_product_editor_product_templates filter
* Remove product_template_ prefix from the supported_product_types map
* Rename get_formatted to to_JSON and convert the props to client side like
* Refactor get_product_templates
* Fix icon resolution
* Add a confirmation modal for unsupported product templates
* Add changelog files
* Remove product types using for testing
* Fix redirection when changing to a non supported product template
* Set the change button state to busy when it is saving the product
* Fix php linter errors
* Fix rebase conflict
* Move ProductTemplate to Automattic\WooCommerce\Admin\Features\ProductBlockEditor namespace
* Add the to_json definition to the BlockTemplateInterface
* Create default product template by custom product type if it does not have a template associated yet
* Fix some comments and product template creation validation
* Add support to load the product template icon from an external resource
* Fix php linter
* Fix the changelog description
* [Experimental] Interactivity Dropdown multi-select mode, ratings filter and introduce each directive (#42981)
---------
Co-authored-by: David Arenas <david.arenas@automattic.com>
* Introduce the transient files engine (#42877)
Co-authored-by: Corey McKrill <916023+coreymckrill@users.noreply.github.com>
* Change marketplace install API request to POST instead of GET (#43033)
* Change marketplace install API to using POST instead of GET
* Fix linting error
* Add changefile(s) from automation for the following project(s): woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* Prep trunk for 8.6 cycle (#43021)
Prep trunk for 8.6 cycle with version bump to 8.6.0-dev
Co-authored-by: WooCommerce Bot <no-reply@woo.com>
* Add Playwright tests for All Reviews, Reviews by Product and Reviews by Category blocks (#42903)
* Remove Reviews blocks Puppeteer tests
* Minor code cleanup
* Typos
* Create publishAndVisitPost() editor util
* Fix subcategories when importing products in Playwright and add reviews
* Add Reviews blocks tests in Playwright
* More typos
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Create a 'reviews' object in data.ts so we can store reviews data in one single place
* Update test so instead of creating a new post in each test, we go to the already-created post
* Add source comments to reviews data to match it with the script
---------
Co-authored-by: github-actions <github-actions@github.com>
* Release: Remove 8.5 change files (#43022)
Delete changelog files from 8.5 release
Co-authored-by: WooCommerce Bot <no-reply@woo.com>
Co-authored-by: Alex López <alex.lopez@automattic.com>
* Delete changelog files based on PR 43033 (#43079)
Delete changelog files for 43033
Co-authored-by: WooCommerce Bot <no-reply@woo.com>
* Delete changelog files based on PR 43051 (#43081)
Delete changelog files for 43051
Co-authored-by: WooCommerce Bot <no-reply@woo.com>
* Interactive Price Filter: use `context` instead of `state` (#42980)
* feat: use context instead of state
* fix: temporary move the context to inner element for diffing to work
* fix: update context before navigation for optimistic UI
* Load google analytics gtag script asynchronously in WooCommerce Blocks (#43040)
Co-authored-by: github-actions <github-actions@github.com>
* set WOOCOMMERCE_BLOCKS_PHASE to 1 for the production build (#43074)
* set WOOCOMMERCE_BLOCKS_PHASE to 1 for the production build
* Add changefile(s) from automation for the following project(s): woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
* Revert "Fix schedule sales error" (#43094)
Revert "Fix schedule sales error (#42700)"
This reverts commit 9b800aa179.
* [Product Block Editor]: add Linked product sections. First approach. (#43013)
* add Linked products, Upsell section
* changelog
* add Cross-lens section
* add links to the Upsell sections
* changelog
* fix lint issues
* fix lint issus
* fix linting issue :-|
* check whether the linked product group is defined
* [Product Block Editor]: introduce ShoppingBags component (#43042)
* add ShoppingBags component
* Add ShoppingBag story
* changelog
* Fix: Collection data being leaked between Collection Filters blocks (#43044)
* fix: CYS - change heading color (#43076)
* fix: CYS - change heading color
* Add changefile(s) from automation for the following project(s): woocommerce
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
* Delete changelog files based on PR 43074 (#43118)
Delete changelog files for 43074
Co-authored-by: WooCommerce Bot <no-reply@woo.com>
* [Product Block Editor]: fix feature flag to hide the Linked products (#43119)
* fix flag to hide/show product editor
* changelog
* Add changelog
---------
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
Co-authored-by: Jonathan Lane <lanej0@users.noreply.github.com>
Co-authored-by: Jon Lane <jon.lane@automattic.com>
Co-authored-by: louwie17 <lourensschep@gmail.com>
Co-authored-by: Fernando Marichal <fernando.marichal@automattic.com>
Co-authored-by: Marc Guay <marc.guay@gmail.com>
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Damián Suárez <rdsuarez@gmail.com>
Co-authored-by: Maikel David Pérez Gómez <maikel.perez@automattic.com>
Co-authored-by: Sam Seay <samueljseay@gmail.com>
Co-authored-by: Néstor Soriano <konamiman@konamiman.com>
Co-authored-by: Corey McKrill <916023+coreymckrill@users.noreply.github.com>
Co-authored-by: Kyle Nel <22053773+kdevnel@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: WooCommerce Bot <no-reply@woo.com>
Co-authored-by: Alex López <alex.lopez@automattic.com>
Co-authored-by: Tung Du <dinhtungdu@gmail.com>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
Co-authored-by: Patricia Hillebrandt <patriciahillebrandt@gmail.com>
* Fix: Enable Pagination Block Visibility in Product Collection Block
This commit resolves an issue where the Pagination block was not visible in the block insertor within the Product Collection block.
- The core query pagination block name, initially hardcoded, is now declared as a constant `coreQueryPaginationBlockName` in `constants.ts`. This change not only improves code readability but also ensures consistency in using the block name across different files.
- In `index.tsx`, the `addProductCollectionBlockToParentOfPaginationBlock` utility function from `utils.tsx` is imported and executed. This function plays a crucial role in the fix. It dynamically adds the Product Collection block to the parent array of the Core Pagination block, ensuring the latter's visibility in the insertor when editing the Product Collection block.
- The utility function employs WordPress hooks and version checks to gracefully handle different WordPress environments. This careful approach maintains backward compatibility while addressing the current issue.
With these changes, merchants can now easily add a Pagination block from the insertor while working on the Product Collection block, enhancing the user experience and functionality.
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Show rating stars for the cross-sells products
* Fix typo introduced in #43116 (#43148)
* Fix typo introduced in #43116
* Add changefile(s) from automation for the following project(s): @woocommerce/product-editor
---------
Co-authored-by: github-actions <github-actions@github.com>
---------
Co-authored-by: github-actions <github-actions@github.com>
* Migrate PR to Core
* Migrate test changes
* Add Custom Collection with inherit query attribute disabled
* Update copy of Product Catalog collection
* Don't choose default active collection in polaceholder and remove highlight
* Remove inherit query option from inspector controls
* Add collection names to Product Catalog and Custom one
* Unify Collection Chooser between Modal and Placeholder
* Bring back util removed by accident
* Replace the translations domain with woocommerce
* Remove leftovers after merge
* Add pagination and no results to Product Catalog and Custom collections
* Revert textdomain change
* Fix lint error
* Add changelog entry
* Change collection label
* Bring back Inherit query from template
* Remove Custom collection and bring back single Product Collection
* Simplify applying collection
* Make sure Inherit query from template is enabled in archive templates by default and disbaled in posts/pages
* Change incorrect Playwright locator
* Add test for Product Catalog inheriting the query in product archive
* Add tests for recommendation collection hiding the predefined filters
* Add reviews to multiple products
* Update expected products in Top Rated
* Remove rating creation in test env and skip undeterministic tests
* Add skip to Best Sellers test
* Update README.md
* Add more keywords to collections, like 'product collection' to recommendation collections
* Rephrase the README note about Collections registration
* Simplify types
* Rename unchangeableFilters to hideControls
* Fix typo in file name
* Remove 'pattern' references from toolbar files
* Replace hardcoded SCSS color with wc variable
* Remove changelog file from different PR
* Move hideControls to Product Collection ayttributes
* Improve responsiveness of columns in Product Collection Placeholder
* Use admin color pallette in Product Collection Placeholder
* Move Inherit query from template to the top of Inspector Controls
* Change the Collection prefix to woocommerce rather than woocommerce-blocks
* Simplify Placeholder and Modal styles
* feat: use context instead of state
* fix: temporary move the context to inner element for diffing to work
* fix: update context before navigation for optimistic UI
* Add price range filter to Product Collection block
This update introduces a price range filter feature to Product Collection. Changes include:
1. Constants Update:
- Added `priceRange` as undefined in `DEFAULT_QUERY` and `DEFAULT_FILTERS` in `constants.ts`.
2. Style Adjustments:
- Added CSS for `.wc-block-product-price-range-control` in `editor.scss` to align the input text to the end.
3. Component Integration:
- In `inspector-controls/index.tsx`, the `PriceRangeControl` component is now imported and integrated.
4. New Components:
- `PriceTextField.tsx` and `PriceRangeControl/index.tsx` have been created to handle price range inputs in the Product Collection block.
5. Backend Integration:
- `PriceRange` interface added in `types.ts` for type support.
- In `ProductCollection.php`, a filter (`add_price_range_filter`) is added to modify the main query based on the price range, including adjustments for tax considerations.
Overall, this enhancement allows users to filter products within a specific price range. The backend adjustments ensure that the filtering respects tax settings and displays accurate prices.
* Fix formatting
* Fix: Price range filter not working on Editor
* Improve: Share logic between Frontend & Editor
* Add changelog
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Remove duplicate changelog file
* Enhanced Input Control for Price Fields
Key changes include:
1. **Switch to Input Control**: Replaced the NumberControl component with the more versatile InputControl. This offers better handling of currency formatting and user input.
2. **Currency Formatting Logic**: Added robust logic for formatting numbers according to the currency settings. This includes handling thousand separators, decimal places, and currency symbols.
3. **String-to-Number Conversion**: Implemented a function to convert user-entered strings back to numbers, accounting for currency symbols and separators. This ensures accurate parsing of user input for processing.
4. **Input Handling Improvements**: Modified the onChange handlers for minimum and maximum price inputs. Now, they correctly handle edge cases like undefined or zero values, maintaining consistency in the user interface and data processing.
* Refactor price range query handling
1. Introduction of a new method `get_price_range_query_args()` to encapsulate the logic for handling price range queries, especially for the two edge cases:
- Prices excluding tax displayed including tax.
- Prices including tax displayed excluding tax.
2. Removal of direct conditionals in the `get_query_results()` method, replacing them with a call to the new `get_price_range_query_args()` method. This makes the code more modular and easier to understand.
This refactor enhances readability and maintainability of the code, ensuring that special cases in price range filtering are handled more effectively.
* Remove unnecessary suffix prop
* Refactor PriceTextField formatting logic for currency
1. Conditional application of thousand separators: The code now checks for the existence of `currency.thousandSeparator` before applying it. This prevents potential errors when the separator is undefined.
2. Simplified decimal separator handling: Introduced a fallback for the decimal separator, defaulting to a period ('.') if not specified by the currency settings.
3. Enhanced readability and documentation: Added comments to clarify the purpose of code blocks, especially where currency symbols are added or removed, and where value normalization occurs.
4. Function renaming for clarity: Renamed `formatValueWithCurrencySymbol` to `formatCurrency`, which better reflects its purpose.
* Fix onBlur issue with PriceTextField component
Refactored the PriceTextField component to utilize useState for better state management. This change introduces a local state variable, 'newValue', to store the current value. The state updates occur in the handleOnChange function, ensuring that the component's state is managed efficiently. Additionally, a new function, handleOnBlur, is implemented to handle the onBlur event, updating the component's state when focus is lost. The handleEnterKeyPress function captures the 'Enter' key press, providing a more user-friendly experience by allowing users to confirm their input with the Enter key.
* Fix linting error
---------
Co-authored-by: github-actions <github-actions@github.com>
* Trigger event experimental__woocommerce_blocks-cart-add-item in the SSR Product Button vis Interactivity API
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Update code comment and add reference to the followup issue
---------
Co-authored-by: github-actions <github-actions@github.com>
* Don't access the keys of what is now just an array
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Reviews by Product block: fix encoded in input aria-label
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* add: active filters block
* update text domain
* chore: linting
* use template string instead of concat
* add experimental flag to register block type calls
* chore: update comments
* feat: register active rating filter data
* fix: unique navigation id when collection filters are added outside product collection
* fix: active filter rating id
* fix: return the href
* chore: phpcs
* Move the switch to classic shortcode block button to separate component
- Move modal component file from incompatible-extension-notice component folder to switch-to-classic-shortcode-button folder.
- Rename modal component file to model-content component file.
- Move the switch to classic shortcode block button to separate component folder
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Update class names in switch-to-classic-shortcode-button component
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Update plugins/woocommerce-blocks/assets/js/editor-components/switch-to-classic-shortcode-button/editor.scss
Co-authored-by: Niels Lange <info@nielslange.de>
* Refactor SwitchToClassicShortcodeButton component
* Fix css lint erros
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073
* revert test to what it was
* Default to text, if the type supplied is not supported throw an error
* Add type for options
* Return null if somehow the select made it through without options
* Make select fields type enum and add options to schema
* Lint fixes
* Update plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/address-form/address-form.tsx
Co-authored-by: Niels Lange <info@nielslange.de>
* Update plugins/woocommerce/src/Blocks/Domain/Services/CheckoutFields.php
Co-authored-by: Niels Lange <info@nielslange.de>
* Update checks to log errors and fail gracefully
* Add field id to class names
* Fix lint error
* Fix short array use
* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073
* Default to text, if the type supplied is not supported throw an error
* Lint fixes
* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073
* add support for registering checkboxes
* remove extra error log
* add styling
* fix rebase conflit
* fix rebase conflit 2
* fix linter errors
* address review comments
* add warning for checkbox
* fix changes
---------
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
* Remove padding for the products query with background
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Karol Manijak <20098064+kmanijak@users.noreply.github.com>
* Introduce Additional Fields API for Checkout Block https://github.com/woocommerce/woocommerce-blocks/pull/12073
* add changelog
* Auto load the Blocks/Domain/Services/functions.php file
* add changelog
* revert test to what it was
* Update text domain for translations
* Ensure address data is added on the cart block too
* fix lint problem
---------
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
* Product Image Gallery: Add transform to Product Gallery block
* Single Product Template: Transform to blocks with new Product Gallery block
* Ensure we first check for block existance
* Add changelog
* Add/delete changelog file
* Change border color to Gutenberg 100 for Cart and Checkout blocks
* Change form input color to Gutenberg 900 for Cart and Checkout blocks
* Fix additional border colors of Checkout block
* Update borders and form field colors in Cart Block
* Change border color to $universal-border-light
* Change border color for cart line items to $universal-border-light
* Change form input fields border color to $universal-border-dark
- Add $universal-border-dark color variable for woocommerce/woocommerce-blocks#1e1e1e on white.
* Fix colors of text area border and form steps
* Change form input fields border color to $universal-border-dark
- Add $universal-border-dark color variable for woocommerce/woocommerce-blocks#1e1e1e on white.
* Fix form steps
* Update universal dark border rgba value
- Update universal dark border rgba value from rgba(0, 0, 0, 0.882) to rgba(17, 17, 17, .80) to keep it consistent with universal-border colors
* Update $universal-border-light color
* Update the opacity of the borders
* Update the border color to rgba (17, 17, 17, 0.12)
* Roll back $universal-border-light value to the original value: 0.115
* Remove Opacity and pass it as argument in with-translucent-border
- We have with-translucent-border option that accepts border and opacity for pseudo elements.
* Remove additional spaces
* Replace with-translucent-border with normal border
- Since we're are not mixing the opacity to the border color so we don't need to use mixin with-translucent-border.
* Fix applied css and add low contrast Color usage details
- Fix minor CSS as per the standards.
- Add comments for universal border colors that they're low contrast colors and should be used for decorative elements only
* Fix border gap and double border for multiple shipping packages
* Fix payment method borders and Cart line items borders
- Change border bottom to border-top for cart line items.
- Fix payment method radio control borders.
* Fix local pickup border
- Local pickup was using with-translucent-borders so it has some opacity, changed it to border-bottom.
* Add border-bottom to cart items
* Remove additional border from Cart items
* Fix radio and checkbox borders as per the design
* Fix shipping method borders and background color as per the design.
* Force align left on the description for the local pickup options.
* Update border color in quantity selector component
* Fix Shipping options radio selection alignment
- Add left padding to wc-block-components-shipping-rates-control__package element.
* Update colors and variables
* Change checkbox and radio button colors
- Change checkbox and radio button colors from rgba(25, 23, 17, 0.3) to rgba(25, 23, 17, 0.48).
* Remove bottom property from express payment style
* Center align view all link
* Add thumbnail count specific styling
* Product Gallery Thumbnails: Improve the responsiveness of the View All overlay text
---------
Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
* Change the default for Mini Cart block
The Block Hooks API currently doesn’t allow for setting the default state of the block injected into content so this ensures the mini-cart block has a better default state for injection. The current default (displaying total value in cart) takes up more width increasing the risk of poor layout.
* Utilize Block Hooks to automatically inject mini-cart block.
* include experimental prefix on filters
* Fix filter name.
* remove experimental prefix.
On thinking about this, I don’t think these need to be experimental. They are intentionally provided as escape hatches for hosts/themes that want to opt-in/out so we’ll have to support them when this is shipped (at least until its no longer needed!)
* fix variable name!
* fix unit tests because of new default
* remove another incorrect text expectation
Defaults for the block affect this expectation.
* fix E2E tests
* Mini Cart Block: improve E2E test
* fix: improve check for the Product Collection block
---------
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
* Limit number of visible incompatible extensions in sidebar notice
* Adjust link text
* Ensure text-decoration works in Safari
* Minor CSS tweaks
* Refactor constant names
* Adjust chevron position for opened state
* Revert "Adjust chevron position for opened state"
This reverts commit ff5142427738626837be887dd8d7e5d94c2432d4.
* Reorganise Columns controls and fix undefined problem in Product Collection settings
* Remove type condition in hasValue of Columns control
* Adjust the E2E tests locator to new changes
* Try env:restart instead of env:start
* Change env:restart to env:start again
* Try env:restart instead of env:start
* Change env:restart to env:start again
* Adjust heading level of cart and checkout template
* Replace button selector with label selector
* Try env:restart instead of env:start
* Change env:restart to env:start again
* Ensure to close welcome guide modal
* Adjust heading level of default template content
* Try env:restart instead of env:start
* Change env:restart to env:start again
* Try env:restart instead of env:start
* Change env:restart to env:start again
* Address existing TS issues
* View template in edit mode
* Keep certain tests skipped
* Fix broken tests after addressing TS issues
* Convert to tsx and replace proptypes by ts definitions
* Fix imports
* Fix noReviewsPlaceholder type
* Fix ts errors
* Use createHigherOrderComponent in withReviews
* Revert hoc change
---------
Co-authored-by: Niels Lange <info@nielslange.de>
* Add HTML entity decoding for product names in Hand-Picked Products control
In the Hand-Picked Products control within the product-collection inspector controls, a function for decoding HTML entities in product names has been added.
- A new utility function `decodeHTMLEntities` has been implemented. This function decodes HTML entities in a string, ensuring that special characters are correctly displayed in their human-readable form.
- The `transformTokenIntoProductName` function has been updated to utilize `decodeHTMLEntities`. Now, when a product name is fetched (either directly as a token or via a product ID), the HTML entities within the name are decoded.
- This enhancement ensures that product names containing characters like ampersands or other HTML entities are accurately displayed in the UI.
This change improves the readability and accuracy of product names within the Hand-Picked Products control, enhancing the user experience for store managers using WooCommerce Blocks.
* Update label and hide description
This commit updates the `HandPickedProductsControl` component. Specifically, the user-facing label for product selection has been changed from 'Pick some products' to 'Hand-picked Products'. Additionally, the `__experimentalShowHowTo` property has been added with a `false` value, to hide description. Corresponding changes have been made in the E2E test file `product-collection.block_theme.spec.ts`, where the filter name is updated to match the new label.
* Refactor: Replace custom HTML entity decoder with `@wordpress/html-entities`
Rationale:
- The shift to `@wordpress/html-entities` aligns with standard WordPress practices, ensuring consistency across the platform.
- Enhances maintainability by relying on a well-supported library rather than custom code.
- Simplifies the codebase by removing a redundant utility function.
This change enhances the robustness of our code and aligns with best practices in WordPress development.
* Product Gallery Thumbnails: Refactor sizing in the editor and the front end
* Product Gallery Thumbnails: Change default vertical alignment to top and better control the width of the thumbnails
* Product Gallery Thumbnails: Fix thumbnails cropping based on the 'Crop images to fit' setting
* Product Gallery Thumbnails: Revert thumbnails styling from woocommerce/woocommerce-blocks#11665
* Product Gallery Thumbnails: Update the default value of the cropImages setting to false
* Product Gallery Thumbnails: Refactor sizing in the editor and the front end
* Product Gallery Thumbnails: Change default vertical alignment to top and better control the width of the thumbnails
* Product Gallery Thumbnails: Restrict the bottom position thumbnails width based on the total number of thumbnails set
* Product Gallery: Remove hardcoded width for Thumbnails and the Large Image and update the width inside of the Dialog
* Product Gallery Thumbnails: Introduce thumbnails scaling based on the number of thumbnails
* Product Gallery Thumbnails: Fix editor thumbnails scaling
* Product Gallery Thumbnails: Remove unused column gap variable
* Product Gallery Thumbnails: Fix styling for vertical images
* Product Gallery: Remove the unused editor.scss file
* Product Gallery: Fix the placement of the Thumbnails block in the block template
* Product Gallery Dialog: Reset changes to the dialog
* update @wordpress/e2e-test-utils-playwright package
* don't update node version
* remove waitForSiteEditorFinishLoading function
* use visitSiteEditor util
* Product Gallery Thumbnails: Add code comments
* Product Gallery Thumbnails E2E: Fix the test checking the default position of the thumbnails
* Product Gallery E2E: Fix the test checking if the cropping setting works correctly
* Product Gallery Thumbnails: Hide the Thumbnails block if there aren't at least 2 thumbnails to display
---------
Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
* Enable shrink columns option in Product Collection by default
* Improve tests about responsiveness
* Make regex allowing for floating pixels
* Related products should not use sticky and author attribute or have hardcoded queryId
* Bring back properties for Related Products as it's based on Propducts block, not Product Collection
* Enable shrink columns to fit by default in patterns
* Sync Interactivity API code with Gutenberg
* New store() API
* Store raw actions
* Update wc-interactivity-store implementation
* Replace `wc_store` with `wc_initial_state`
* Parse and populate initial state
* Allow store parts in `store()`
* Accept namespaces in directive paths
* Add $$namespace to directives' object values
* Make namespace parsing more robust
* Use DeepPartial type for store parts
* Do not pass `rawStore` to `afterLoad` callbacks
* Simplify `store()` a bit
* Implement `privateStore()`
* Sync context directive with Gutenberg
* Refactor scope and extract getters per scope
* Add namespace to getters and actions
* Remove current privateStore implementation
* Remove `afterLoad` option from `store`
* Use same proxy handlers for ns, getters and actions
* Set scope inside `evaluate`
* Refactor proxy handlers
* Improve types a bit
* Catch errors in async actions
* Implement stacks for scopes and namespaces
* Implement `getElement`
* Change directives object structure
* Remove unnecessary import
* Implement private stores
* Return value from sync actions
* Minor optimizations and improved comments
* Don't use async inside `data-wp-watch`
* Use a single Provider in context directive
* Remove DeepPartial type
* Do not check if element exists
* Add the `current` prop of state inside the scope
* Move getters outside scope
* Fix wc-key assignment
* Fix missing `navigate` in directives
* Fix namespace not being picked in the same element
* Deep merge raw stores instead of proxied ones
* Fix namespace assignment
* Allow forward slashes in namespaces
* Migration of Product Collection and Product Button blocks to the new `store()` API (https://github.com/woocommerce/woocommerce-blocks/pull/11558)
* Refactor Product Button with new store() API
* Use `wc_initial_state` in Product Button
* Fix namespace
* Remove unnecessary state
* Test namespaces in directive paths
* Add test context with namespace
* Simplify woo-test context
* Move addToCart and animations to a file
* Do not pass `rawStore` to `afterLoad` callbacks
* Move callbacks and actions back to the main file
Because the animation was broken.
* Remove selectors in favor of state
* Use default ns in `getContext` for state and actions
* Remove `afterLoad` callback
* Remove unnecessary ns
* Fix getContext in add-to-cart
* Replace namespace and delete unnecessary store
* Pass context types only once
* Use an alternative for requestIdleCallback
* Add previous react code for notices
* Add namespace to Product Collection block
* Replace getTextButton with getButtonText
* Add block name to the ProductCollection namespace
* fix style HTML code
* Remove circular deps error on the Interactivity API
* Product Gallery block: Migrate to new Interactivity API store (https://github.com/woocommerce/woocommerce-blocks/pull/11721)
* Migrate Product Gallery block to new Interactivity API store
* Fix some references
* Add missing data-wc-interactive
* Fix an additional namespace
* Remove unnecessary click handler
* Dialog working
* Refactor action names
* Reindex PHP array
There was some missing indexes, which turned the array into an object in JS.
* Remove unused event handlers
* Move next/previous logic to external function
* Move StorePart util to the types folder
* Rename namespace to `woocommerce/product-gallery`
* Undo product collection namespace renaming
* Remove unnecessary namespace
* Don't hide the large image on page load
* Minor refactorings
* Fix eslint error
* Fix php cs errors with spacing and double arrows alignment
* Disable no-use-before-define rule for eslint
* Disable @typescript-eslint/ban-types rule for eslint
* Fix parsed context error in e2e tests
* Fix context parser for Thumbnail image
* Move store to the top of the frontend file
* Add interactivity api utils to the @woocommerce/utils alias
* Replace deprecated event attribute
---------
Co-authored-by: Luis Herranz <luisherranz@gmail.com>
Co-authored-by: David Arenas <david.arenas@automattic.com>
Co-authored-by: roykho <roykho77@gmail.com>
---------
Co-authored-by: David Arenas <david.arenas@automattic.com>
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
Co-authored-by: roykho <roykho77@gmail.com>
* Fix error when closing product gallery dialog with keyboard escape key
* use wc_initial_state instead of wc_store
---------
Co-authored-by: Luis Herranz <luisherranz@gmail.com>
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
Co-authored-by: roykho <roykho77@gmail.com>
* 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
* Add Simple Price Filter block
* Remove all files related to directive processing in PHP
* Use values directly for SimplePriceFilter SSR
* Reset pages to 0 when changing filter
Note: we also need to do this with `/page/x`
* wip
* phpcs
* register price filter as inner block
* try: render block using save
* add types
* use min range var instead of 0
* inject dynamic data
* query price data in editor
* better injecting interactivity data
* remove rounding
* Product Collection Data endpoint doesn't care about current query so we remove the context for now
* extract data injecting as a method, possbily a trait in the future
* add sidebar setting
* duplicating the markup in php render callback for safety
* remove directive from edit component
* show prices without decimal
* use final class
* use sample collection data response
* prepare for multiple styles support
* use collection data from context
* cleanup props and props passing
* pass only necessary states
* retire heredoc in favor of late escaping
* reorganize style
* inherit style from current price filter react component, pre extract the component for multiple display style support
* keep minPrice smaller than max
* remove unnecessary active handler logic
* update folder structure
* avoid whitespace change
* clean up
* title
* move inspector to component folder, ready to be extracted to inner block
* block icon
* block name
* name
* use inner block for view
* inner block view switcher
* try: process data in Collection Filtes block only
* wip: query collection data from collection filters block only
* provide all context from collection filters block
* simplify context passing
* feat: use default attribute to define filter type of view block
* rename
* remove price block
* rename price slider to price, default price filter should be a slider
* type cleanup
* fix ancestor block name
* only passing the collection data down
* wip
* recusive
* editor preview
* refactor: data fetching, context passing, and code organization
* initial attribute filter block
* feat: attribute selector
* inspector control
* wip
* break the edit into smaller components
* wip: editor component
* extract checkbox list
* wip editor preview
* show count checkbox list
* fix param aggregation for attribute filter blocks
* post merge fix
* fix param aggregation for attribute filters
* fix: set correct selected attribute
* WIP checkbox list
* WIP checkbox list
* avoid action name conflicts
* Checkbox list front end
* phpcs
* update context on input, navigate on change
* fix: attribute selection
* dropdown
* remove isDeepEqual
* add: warning when attribute has no products or no attribute is selected
* update type
* update type
---------
Co-authored-by: David Arenas <david.arenas@automattic.com>
Co-authored-by: Luis Herranz <luisherranz@gmail.com>
* Add custom 'No Results' block for Product Collection
This commit introduces a new 'No Results' block, replacing the default core 'query-no-results' block within product collection block. The 'No Results' block provides a tailored experience for WooCommerce stores, displaying a custom message when no products are found in a query.
Key changes include:
- A new block type 'woocommerce/no-results' is registered with a complete configuration and content structure.
- Edit and save functions are implemented for the block, allowing for custom content and styles within the block editor and on the front end.
- Webpack entries are updated to include the new block in the build process.
- A PHP class NoResults is added for server-side rendering, which only displays the block when the product query returns no results, enhancing performance.
- The ProductCollectionUtils utility class is extended to support the new block's query needs.
The new block enriches the user experience by providing clearer communication when no products match the collection criteria and allows store owners to customize the message and presentation.
* Update description
* Rename 'no-results' block to 'product-collection-no-results'
Changes include:
- Updating the block name in `edit.tsx` within the `product-collection` directory.
- Modifying the block.json file in the `no-results` inner block to reflect the new name.
- Adjusting the className in `edit.tsx` for the `no-results` inner block.
- Altering the webpack entries in `webpack-entries.js` to recognize the new block name.
- Renaming the block in `NoResults.php` to align with this update.
This renaming aims to make the block's purpose more clear and to maintain a consistent naming scheme within our product collection blocks.
* Rename NoResults to ProductCollectionNoResults for clarity
This commit renames the `NoResults` class to `ProductCollectionNoResults`. The change aims to enhance clarity and specificity about the class's purpose, indicating that it specifically handles no-result scenarios within product collections.
Changes made:
- Renamed `NoResults.php` to `ProductCollectionNoResults.php`.
- Updated the class name from `NoResults` to `ProductCollectionNoResults` in the file.
- Modified the reference in `BlockTypesController.php` to use the new class name.
This renaming ensures better readability and understanding of the class's role in the context of product collections. The primary change is the renaming, with no significant alterations in the class functionality.
* Update No-Results Message Formatting in Product Collection Block
This commit simplifies the layout and message content for the 'No results found' message in the product collection block's no-results edit component. The changes include:
1. Removal of the full stop in the 'No results found' string for consistency.
2. Replacing the 'core/group' block with a 'core/paragraph' block.
3. Streamlining the message content to be more concise and integrated into fewer text blocks.
4. Direct links for 'clearing any filters' and navigating to the 'store's home' are now included in the same paragraph.
---------
Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
Karol Manijak
Alba Rincón
Niels Lange
Ilyas Foo
Manish Menaria
Thomas Roberts
Seghir Nadir
Sam Seay
Chi-Hsuan Huang
Alexandre Lara
Christopher Allford
Roy Ho
Luigi Teschio
ianlv
Paul Sealock
Alex Florisca
Leif Singer
Wesley Rosa
Tung Du
Tom Cafferkey
Erik Golinelli
Paulo Arromba
Bhupesh Mishra
Tarun Vijwani
Mike Jolley
Chris Lilitsas
Danny Dudzic
Albert Juhé Lluveras
Ron Rennick
Arsany Benyamine
Darren Ethier
David Arenas