* 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>
* 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
* 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>
Manish Menaria
Karol Manijak
Christopher Allford
Ron Rennick