* Show product picker control in the editor when a product context is required but not provided
Enhanced the Product Collection block by introducing the `selectedReference` attribute and implementing a product picker control. This control appears in the editor when a product context is required but not provided in the current template/page/post.
1. **block.json**: Added `selectedReference` attribute of type `object`.
2. **constants.ts**: Included `selectedReference` in the `queryContextIncludes` array.
3. **EditorProductPicker.tsx**: Created a new component for selecting products within the editor.
4. **editor.scss**: Added styles for the new Editor Product Picker component.
5. **index.tsx**: Updated logic to determine the component to render, incorporating the new Editor Product Picker.
6. **types.ts**: Defined types for `selectedReference` and updated `ProductCollectionAttributes` interface.
This enhancement allows merchants to manually select a product for collections that require a product context, ensuring the block displays correctly even when the product context is not available in the current template/page/post.
- **Product Picker Control**: Utilizes the existing `ProductControl` component for selecting products. This component is displayed in the editor when a collection requires a product context but it doesn't exist in the current template/page/post.
* Update label on ProductControl component
* Implement dynamic UI state management for product collection block
- Introduced `ProductCollectionUIStatesInEditor` enum to define various UI states for the product collection block.
- Added `getProductCollectionUIStateInEditor` utility function to determine the appropriate UI state based on context.
- Updated `Edit` component to use `getProductCollectionUIStateInEditor` for dynamic state management.
- Refactored `ProductCollectionContent` to utilize the new Editor UI state management.
* Fix: Product picker isn't showing
* Fix: Preview label state isn't showing
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Refactor WooCommerceBlockLocation type
- Introduced specific interfaces for WooCommerceBlockLocation, including ProductLocation, ArchiveLocation, CartLocation, OrderLocation, and SiteLocation, to improve type safety and code clarity.
- Updated createLocationObject function to return a BaseLocation type.
- Refactored useSetPreviewState hook in product-collection utils:
- Extracted termId from location.sourceData for cleaner and more readable code.
- Replaced direct access of location.sourceData?.termId with termId variable.
* Remove fallback to 0 in case there may be a product with id 0
* Use optional chaining to avoid undefined errors
* Rename to
* Change order of arguments in function
* Pass boolean prop instead of making further recognition of the UI state in ProductCollectionContent
* Destructure props in component
* Rename to
* Update names in enum
* Rename to and change the structure to single number.
* Rename location to
* Add a method to choose a product in the product picker in Editor
* Add E2E tests
* Fix failing e2e tests by changing location to productCollectionLocation
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Don't allow selecting product variations
* Minor code refactoring
* Fix: Product control isn't showing products
**Before**
```tsx
const getRenderItemFunc = () => {
if ( renderItem ) {
return renderItem;
} else if ( showVariations ) {
return renderItemWithVariations;
}
return () => null;
};
```
As you can see above, `return () => null;` is returning a function which is causing the issue. This will render nothing in the list. I changed this to `return undefined;`. This way, we will use default render item function.
* Translate text in ProductPicker component
* Improve E2E test
* Use createInterpolateElement to safely render strong HTML tag
* Fix E2E tests
* Fix E2E tests
* Product Collection: Inspector control to change selected product (#50590)
* Add Linked Product Control to Product Collection Block Inspector Controls
- Introduced a new `LinkedProductControl` component in the Product Collection block's Inspector Controls.
- This control allows users to link a specific product to the product collection via a dropdown with a search capability.
- Added corresponding styles to `editor.scss`.
- Integrated a `useGetProduct` hook in the `utils.tsx` to fetch and manage the state of the linked product data, including handling loading states and errors.
- Updated the Inspector Controls to include the new Linked Product Control component, enhancing the block's customization options for users.
* Add E2E tests
* Hide product picker when product context is available
* Improve logic to hide Linked Product Control
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Remove hasError state from useGetProduct hook
* Rename isShowLinkedProductControl to showLinkedProductControl
* Convert jsxProductButton to ProductButton component
* Refactor jsxPopoverContent to LinkedProductPopoverContent component
* Improve UI of Linked Product Control
* Address PR feedback
* Fix E2E tests
---------
Co-authored-by: github-actions <github-actions@github.com>
* Rename isUsesReferencePreviewMode to isUsingReferencePreviewMode
* Change order of conditions in getProductCollectionUIStateInEditor
---------
Co-authored-by: github-actions <github-actions@github.com>
* Fix inline documentation typos in woocommerce-blocks
* Add changelog file
* Add changefile(s) from automation for the following project(s): woocommerce-blocks, woocommerce
* Remove original changelog
---------
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: Mike Jolley <mike.jolley@me.com>
* Update "Learn More" docs link for incompatible extensions
* Update links to blocks documentation
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Remove Unnecessary changelog message
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
* Delete unneeded changelog file
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Fix for tags overlapping divider line issue in "Filter by product category"
Issue fixed where tags are overlapping divider line in "Filter by product category".
* Fix for tags overlapping divider line issue in "Filter by product category"
Issue fixed where tags are overlapping divider line in "Filter by product category".
* Add changefile(s) from automation for the following project(s): woocommerce-blocks
---------
Co-authored-by: github-actions <github-actions@github.com>
* Replace classnames with clsx within woocommerce-blocks.
* Undo unnecessary change to getClassnames const.
* Replace classnames with clsx within woocommerce-admin.
* Add changelog.
* Update the pnpm lock file
* Address lint.
* Address lint errors for the block-library.
* 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>
* 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 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>
* 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>
* 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>
* 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>
* 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.
* Fix strings in modal window
* Update assets/js/editor-components/incompatible-extension-notice/modal.tsx
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
---------
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Add transforms for checkout block
* Block to shortcode switcher in notice
* cart transforms
* Fix target block for switching
* Remove switcher UI for classic cart/checkout
* Set isPreview when generating block preview in switcher
* Onboarding task
* Action on click
* Focus on block after replacement
* Update notice styling and wording
* Undo functionality
* Look for woocommerce/classic-shortcode when determining if task list item should display
* Enable focus on the cart/checkout block when visiting from the task list
* Classic Cart/Checkout Updated Title
* Add missing translations
* Refactor modal content to avoid sprintf
* Improve pickBlockClientId
* Tracks events for switching to classic shortcode block
* TaskList support for non-block themes
* Updated placeholder to work on non-white page backgrounds
* Find blocks using findBlock utility
* Add TabbableContainer for buttons
* Add align to wrapper
* Update modal content
* Update modal usage
* Removed undo link when converting from classic shortcode
* Check if block was selected
* Revert "Removed undo link when converting from classic shortcode"
This reverts commit 2babbab4c1e69861a0371ff745e85d80ff6bbab1.
* update snackbar text
* Remove block level options in favour of settings
* Remove calculator toggle test
* Update assets/js/blocks/cart/inner-blocks/cart-order-summary-shipping/block.tsx
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Remove unused attributes
---------
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Adkust text of sidebar notice
* Adjust text of sidebar notice
* Rename folder to “incompatible-extension-notice”
* Rename main component and interface
* Rename constants
* Add new files for splitting logic
* WIP: Semi-hardcoded solution
* WIP: Add new data store
* Fetch incompatible extensions dynamically
* Fix broken dismiss notice functionality
* Minor refactor
* Remove data store
* Remove console.log
* Remove obsolete data store fragment
* Update package-lock.json and composer.lock
* Change wording from “might be” to “may be”
* Show single incompatible extension within notice instead of as list
* Fix *.md linting error
* Rename checkout template slug
* Remove redirect and custom title
* Classic shortcode block for checkout
* Empty title
* WIP placeholder
* Change blockified template
* Prefix cart and checkout templates with "Page: "
* Template migration routine
* Apply same treatment to cart template
* Notices
* Update placeholder text
* Classic shortcodes block
* Page content wrapper for templates
* Update default
* Do not save attributes
* Update templates
* Remove cart classic template
* Reverted endpoints for Cart & Checkout templates. This reverts PR 9406
* Migrate page content wrapper.
* Removed useless method arg. Minor tweaks.
* Skip migration if the theme has a template file for this page.
* Removed impossible condition.
* Migrate page content wrapper.
* Remove TemplateNotice in favour of DefaultNotice
* Documentation links in shortcode placeholder
* Hide cart and checkout page selector when using block themes
* Unused var
* Add tests for template changes
* Revert changes to classic-template
* Allow frontend redirect
* Unused file
* Bump version for updater
* Support x template naming as well as page-x
* Need to add item to cart to test checkout
* Fix header test by fixing utility for adding to cart
* Remove permalink tests
* Click body
* Wait for content to finish loading
* Wait for add to cart response when adding to cart without item name
* Wait for save before visiting frontend
* Set content instead of inserting block
* Perform test in site editor rather than page editor
* Prevent notice to set the default cart/checkout page from showing on the site editor.
---------
Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com>
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
The main aim of this PR was to convert the product-control component to TypeScript. However, since the component is coupled with many other parts (it is itself wrapped into 4 HOCs), many refactoring changes were needed to make the types work.
In particular:
* Add `convertProductResponseItemToSearchItem` utility function
The function allows to clean up the `ProductResponseItem` in order
to make its shape compatible with the `SearchListItem`, instead of
passing the entire object.
Because data from the object might need to be used in certain
circumstance (e.g. render functions), the data is now allowed to be
scoped within a `details` key.
This commit also converts `utils/products` to TypeScript.
* Fix `ProductResponseItem` type missing `slug`
The `slug` is returned by the API but didn't appear in the type def.
* Improve certain HOCs types
The `withSearchedProducts` and `withTransformSingleSelectToMultipleSelect`
HOCs are now typed in such a way that it is clear what incoming props
they expect and what they inject.
* Refactor `ProductAttrributeTermControl` for further type safety
Make sure that `count` is always a `number` as required by the
component types.
* Refactor `search-list-control.tsx` and `item.tsx`
The new `SearchItem` allows for the `details` key to be passed.
All the components are now aware of it.
Daniel Mallory
Fernando Marichal
Manish Menaria
Caleb Mazalevskis
Karol Manijak
Gabriel Manussakis
Brian Taylor
RJ
Thomas Roberts
Bhupesh Mishra
Niels Lange
Patricia Hillebrandt
Seghir Nadir
Sam Seay
Leif Singer
Alexandre Lara
Tarun Vijwani
Christopher Allford
Ron Rennick
Arsany Benyamine
Mike Jolley
Paulo Arromba
dependabot[bot]
Lucio Giannotta
Albert Juhé Lluveras
Darren Ethier