Update product editor package #36830

louwie17 · 2023-02-14T10:28:13Z

All Submissions:

Have you followed the WooCommerce Contributing guideline?
Does your code follow the WordPress' coding standards?
Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

This PR copies over the Slot fill components for the product screen from the @woocommerce/components package to the @woocommerce/product-editor package. I have added deprecated messages to them within the components package.

Closes #36355 .

This PR is a very minor change/addition and does not require testing instructions (if checked you can ignore/remove the next section).

How to test the changes in this Pull Request:

Have you followed the Writing high-quality testing instructions guide?

Build this branch and go to Products > Add New with the new product management feature enabled
Open your console and make sure there are no deprecated warnings showing and everything still works as expected.
Check the above also in the variations view (Options > edit)
Create a JS file from this gist and import it. Go to the new Test tab and make sure the deprecated warning shows up, but things still render correctly.

Other information:

Have you added an explanation of what your changes do and why you'd like us to include them?
Have you written new tests for your changes, as applicable?
Have you created a changelog file for each project being changed, ie pnpm --filter=<project> changelog add?

FOR PR REVIEWER ONLY:

I have reviewed that everything is sanitized/escaped appropriately for any SQL or XSS injection possibilities. I made sure Linting is not ignored or disabled.

codecov · 2023-02-14T12:41:44Z

Codecov Report

Merging #36830 (ccc3282) into trunk (f9f6e68) will increase coverage by 0.0%.
The diff coverage is n/a.

Additional details and impacted files

@@           Coverage Diff            @@
##             trunk   #36830   +/-   ##
========================================
  Coverage     46.7%    46.7%           
  Complexity   17178    17178           
========================================
  Files          429      429           
  Lines        64779    64779           
========================================
+ Hits         30240    30241    +1     
+ Misses       34539    34538    -1

Impacted Files	Coverage Δ
plugins/woocommerce/includes/class-wc-tax.php	`78.8% <0.0%> (+0.2%)`	⬆️

github-actions · 2023-02-14T12:48:47Z

Test Results Summary

Commit SHA: ccc3282

Test 🧪	Passed ✅	Failed 🚨	Broken 🚧	Skipped ⏭️	Unknown ❔	Total 📊	Duration ⏱️
API Tests	259	0	0	2	0	261	0m 50s
E2E Tests	189	0	0	6	0	195	12m 17s

To view the full API test report, click here.
To view the full E2E test report, click here.
To view all test reports, visit the WooCommerce Test Reports Dashboard.

nathanss · 2023-02-16T13:54:06Z

packages/js/product-editor/src/components/woo-product-field-item/README.md

+
+| Prop         | Type     | Description                                                                                                              |
+| -------------| -------- | ------------------------------------------------------------------------------------------------------------------------ |
+| `id`         | String   | A unique string to identify your fill. Used for configuiration management.                                               |


you forgot to fix this typo

nathanss · 2023-02-16T13:54:37Z

packages/js/product-editor/src/components/woo-product-field-item/README.md

+
+### WooProductFieldItem.Slot (slot)
+
+This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.


Can you include context as to why it will not be used as frequently?

Good point, I am not why I added that part, let me update this and the other two places as well.

I think you forgot to update this one

nathanss · 2023-02-16T13:55:43Z

packages/js/product-editor/src/components/woo-product-section-item/README.md

+
+### WooProductSectionItem.Slot (slot)
+
+This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.


Same comments here are the above as it's copied

you forgot to update here as well

nathanss · 2023-02-16T13:56:06Z

packages/js/product-editor/src/components/woo-product-tab-item/README.md

+
+### WooProductTabItem.Slot (slot)
+
+This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.


you forgot to update here as well

nathanss · 2023-02-16T13:57:35Z

packages/js/product-editor/src/components/woo-product-section-item/woo-product-section-item.tsx

+					{ ( fillProps: Fill.Props ) => {
+						return createOrderedChildren<
+							Fill.Props & { tabName: string }
+						>( children, tabOrder || 20, {


I'm not sure it falls within the scope of this PR, if not, please disregard it, but how about moving 20 and other numbers to a constant?

nathanss · 2023-02-16T13:57:59Z

packages/js/product-editor/src/components/woo-product-tab-item/woo-product-tab-item.tsx

+					{ ( fillProps: Fill.Props ) => {
+						return createOrderedChildren< Fill.Props >(
+							children,
+							templateData.order || 20,


Same comment as above

you forgot the constant here

louwie17 · 2023-02-17T12:20:14Z

@nathanss thanks for taking a detailed look at the README's 👍 there were a couple other discrepancies that I also fixed, all as part of this commit: af16af1

This should be ready for a re-review whenever you have some time.

nathanss · 2023-02-23T18:12:49Z

packages/js/product-editor/src/components/woo-product-field-item/README.md

+
+### WooProductFieldItem.Slot (slot)
+
+This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.


I think you forgot to update this one

nathanss · 2023-02-23T18:13:13Z

packages/js/product-editor/src/components/woo-product-field-item/README.md

+
+| Prop         | Type     | Description                                                                                                              |
+| -------------| -------- | ------------------------------------------------------------------------------------------------------------------------ |
+| `id`         | String   | A unique string to identify your fill. Used for configuiration management.                                               |


you forgot to fix this typo

nathanss · 2023-02-23T18:13:34Z

packages/js/product-editor/src/components/woo-product-section-item/README.md

+
+### WooProductSectionItem.Slot (slot)
+
+This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.


you forgot to update here as well

nathanss · 2023-02-23T18:13:42Z

packages/js/product-editor/src/components/woo-product-tab-item/README.md

+
+### WooProductTabItem.Slot (slot)
+
+This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.


you forgot to update here as well

nathanss · 2023-02-23T18:13:56Z

packages/js/product-editor/src/components/woo-product-tab-item/woo-product-tab-item.tsx

+					{ ( fillProps: Fill.Props ) => {
+						return createOrderedChildren< Fill.Props >(
+							children,
+							templateData.order || 20,


you forgot the constant here

louwie17 · 2023-02-23T18:48:42Z

Thanks for the second review @nathanss, looks like I made all your previously suggested changes in the components package but forgot to do it in the product-editor package 🤦

* Add an encoding selector to the product importer * Add changelog file * Don't assume the character encoding parameter is present * Add woocommerce_attributes_saved trigger. Closes #35004. * Fix create wc extension script (#36917) * Run create-extension for create-wc-extension script * Add changelog --------- Co-authored-by: Sam Seay <samueljseay@gmail.com> * Update product editor package (#36830) * Add missing dev packages to product-editor package * Create components folder for organization * Move product field, section and tab slots over to product-editor package * Move use of product slot fills to product-editor package * Sync dependencies * Add changelogs * Update README's and add constant for default values * Update README's in product-editor package * Change SORT_STRING to SORT_NATURAL for the encodings list Co-authored-by: Barry Hughes <3594411+barryhughes@users.noreply.github.com> * Add changelog * Add custom rendering logic to the item label (#36476) * Add type definitions * Add custom rendering logic to the item label * Add stories * Add changelog file * Fix rebase merge issue * Fix up stories after rebase --------- Co-authored-by: Matt Sherman <matt@jam123.com> * Fix k6 incorrect step * Fix k6 test env setup --------- Co-authored-by: Nestor Soriano <konamiman@konamiman.com> Co-authored-by: helgatheviking <507025+helgatheviking@users.noreply.github.com> Co-authored-by: louwie17 <lourensschep@gmail.com> Co-authored-by: Sam Seay <samueljseay@gmail.com> Co-authored-by: Barry Hughes <3594411+barryhughes@users.noreply.github.com> Co-authored-by: Maikel David Pérez Gómez <mdperez86@gmail.com> Co-authored-by: Matt Sherman <matt@jam123.com>

* Add an encoding selector to the product importer * Add changelog file * Don't assume the character encoding parameter is present * Add woocommerce_attributes_saved trigger. Closes #35004. * Fix create wc extension script (#36917) * Run create-extension for create-wc-extension script * Add changelog --------- Co-authored-by: Sam Seay <samueljseay@gmail.com> * Update product editor package (#36830) * Add missing dev packages to product-editor package * Create components folder for organization * Move product field, section and tab slots over to product-editor package * Move use of product slot fills to product-editor package * Sync dependencies * Add changelogs * Update README's and add constant for default values * Update README's in product-editor package * Change SORT_STRING to SORT_NATURAL for the encodings list Co-authored-by: Barry Hughes <3594411+barryhughes@users.noreply.github.com> * Add changelog * Add custom rendering logic to the item label (#36476) * Add type definitions * Add custom rendering logic to the item label * Add stories * Add changelog file * Fix rebase merge issue * Fix up stories after rebase --------- Co-authored-by: Matt Sherman <matt@jam123.com> * Enable "Smoke test release" workflow (#36598) * First pass at updating release test workflow * Add changelog * Set dir env variables * Update to workflow * Fix indent * Fix indent * Clean up indent * Re-order steps * Change order of jobs * Added common php versions * Update pipeline * Update some labels * Simplify for testing * Update paths * Create tmp folder * Fix path * Paths * Try outputting some debugging * Add step ID back * Remove working directory * Another path tweak * Add API release tests * Add k6 tests * Add PHP tests * Launch wp-env during PHP tests * Try default values * Tweak some settings, add WP testing * Tweak some settings * Re-order e2e steps * Update step descriptions * Reorganize tests, add plugin tests * Enable only e2e job * Initial set up to run against release smoke test site * Fix syntax * Temporarily disable update wc spec * Temporarily disable downloading woocommerce zip * Download release zip using tag name * Fix wrong job name * Fix wrong job name * Fix dir * Delete fetch-asset-id.js * REfactor update-woocommerce spec * Add error handling * Download release zip by tag * Refactor update woo spec to download zip by tag * Correct job name * fail test on invalid tag * Enable all e2e tests * Run api tests before e2e tests * Fix job dependency * Add customer credentials to api job * Separate job for WC Update * Combine e2e allure-results, then report * Enable report job * Fix context * Change job and artifact names * Use test s3 path * Minor job name change * Upload artifacts to bucket * Correct s3 path * Add quiet option * Retain video on failures * Finalize s3 path * Try WP latest-1 * Revert to wp latest * Refine search for woocommerce zip asset * Get created-at * Specify repo in gh command * Slugify env description * Trim space * Sync with bucket instead of copy * Remove invalid --recursive flag * Re-add missing step to combine e2e results from update wc test * Ensure artifact upload on test failure * Enable all e2e tests on WP latest * Retain existing data before updating WC * Make test compatible with 'Canceled' and 'Cancelled' * Set env_desc as env var * Re-add deleted file * Fix UPDATE_WC in daily smoke test workflow * Add tracing in global setup * Remove tracing * Temporarily run only basic spec * Job for WP Latest-1 & 2 * Fix "Required input 'created_at' not provided" * Minor rename * Remove install filter * Install deps in get-wp-matrix * Delete get-wp-versions.js * Add get-wp-versions.js to e2e-pw folder * REname file * REfactor * Refactor script for getting WP prev versions * Update job dependencies * Temporarily remove disabled jobs * Allow e2e-wp-latest after api test failure * Update L-1 & L-2 job deps * Fix report-wp-latest * Fix failing api test * Make get-wp-versions quicker * Publish report immediately after test * Test reporting in e2e-update-wc * Fix missing parameter * Fix env_desc, re-enable other jobs * Enable all e2e tests * Minor job name change * Fix flaky test * Add php version testing * stringify php versions * Re-enable all e2e tests * Up timeout to 2min * Remove PHP 8.0 * Add missing conditionals * Fix php version verification script * Fix starting dir * Fix flakiness * Skip e2e if api failed * Verify woocommerce.zip early * Add token * Delete test summary on github for the meantime * Use default playwright config * More meaningful variable names * Update step titles based on review * Use expect.poll() * Minor spacing corrections * Use `stable-check` endpoint, delete unnecessary loop * Update locators to be JN-compatible * Fix erroneous getting of release tag * Fix conflict of "No thanks" button locator with that of WP Mail Logging's * Update github-script action to v6 * Revert to 'Cancelled' * Remove unnecessary step * Provide missing env variables --------- Co-authored-by: Jon Lane <jon.lane@automattic.com> Co-authored-by: Jonathan Lane <lanej0@users.noreply.github.com> * Rename workflow file --------- Co-authored-by: Nestor Soriano <konamiman@konamiman.com> Co-authored-by: helgatheviking <507025+helgatheviking@users.noreply.github.com> Co-authored-by: louwie17 <lourensschep@gmail.com> Co-authored-by: Sam Seay <samueljseay@gmail.com> Co-authored-by: Barry Hughes <3594411+barryhughes@users.noreply.github.com> Co-authored-by: Maikel David Pérez Gómez <mdperez86@gmail.com> Co-authored-by: Matt Sherman <matt@jam123.com> Co-authored-by: Jon Lane <jon.lane@automattic.com> Co-authored-by: Jonathan Lane <lanej0@users.noreply.github.com>

* Add missing dev packages to product-editor package * Create components folder for organization * Move product field, section and tab slots over to product-editor package * Move use of product slot fills to product-editor package * Sync dependencies * Add changelogs * Update README's and add constant for default values * Update README's in product-editor package

github-actions bot added focus: react admin package: @woocommerce/components issues related to @woocommerce/components labels Feb 14, 2023

louwie17 force-pushed the update/36355_product_editor_package branch from 7856f32 to e130902 Compare February 14, 2023 12:18

github-actions bot added the plugin: woocommerce Issues related to the WooCommerce Core plugin. label Feb 14, 2023

louwie17 marked this pull request as ready for review February 14, 2023 12:24

louwie17 requested a review from a team February 14, 2023 12:25

nathanss requested changes Feb 16, 2023

View reviewed changes

louwie17 force-pushed the update/36355_product_editor_package branch from e130902 to af16af1 Compare February 17, 2023 12:19

louwie17 requested a review from nathanss February 20, 2023 08:29

joelclimbsthings assigned louwie17 Feb 21, 2023

nathanss requested changes Feb 23, 2023

View reviewed changes

louwie17 force-pushed the update/36355_product_editor_package branch from af16af1 to 4da0d1f Compare February 23, 2023 18:40

louwie17 requested a review from nathanss February 23, 2023 18:40

nathanss previously approved these changes Feb 23, 2023

View reviewed changes

louwie17 dismissed nathanss’s stale review via 9d0f22f February 23, 2023 18:47

louwie17 force-pushed the update/36355_product_editor_package branch from 4da0d1f to 9d0f22f Compare February 23, 2023 18:47

joelclimbsthings requested a review from nathanss February 23, 2023 19:31

louwie17 added 8 commits February 24, 2023 04:27

Add missing dev packages to product-editor package

96b6787

Create components folder for organization

3917c00

Move product field, section and tab slots over to product-editor package

22fe573

Move use of product slot fills to product-editor package

de123ae

Sync dependencies

caa7bd5

Add changelogs

7243069

Update README's and add constant for default values

edf551f

Update README's in product-editor package

034add7

louwie17 force-pushed the update/36355_product_editor_package branch from 9d0f22f to 034add7 Compare February 24, 2023 08:27

Merge branch 'trunk' into update/36355_product_editor_package

ccc3282

nathanss approved these changes Feb 24, 2023

View reviewed changes

louwie17 merged commit aec4dfd into trunk Feb 24, 2023

louwie17 deleted the update/36355_product_editor_package branch February 24, 2023 13:37

github-actions bot added this to the 7.6.0 milestone Feb 24, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update product editor package #36830

Update product editor package #36830

louwie17 commented Feb 14, 2023 •

edited

codecov bot commented Feb 14, 2023 •

edited

github-actions bot commented Feb 14, 2023 •

edited

nathanss Feb 16, 2023

nathanss Feb 23, 2023

nathanss Feb 16, 2023

louwie17 Feb 17, 2023

nathanss Feb 23, 2023

nathanss Feb 16, 2023

nathanss Feb 23, 2023

nathanss Feb 16, 2023

nathanss Feb 23, 2023

nathanss Feb 16, 2023

nathanss Feb 16, 2023

nathanss Feb 23, 2023

louwie17 commented Feb 17, 2023

nathanss Feb 23, 2023

nathanss Feb 23, 2023

nathanss Feb 23, 2023

nathanss Feb 23, 2023

nathanss Feb 23, 2023

louwie17 commented Feb 23, 2023


		### WooProductFieldItem.Slot (slot)

		This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.


		### WooProductSectionItem.Slot (slot)

		This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.


		### WooProductTabItem.Slot (slot)

		This is the slot component, and will not be used as frequently. It must also receive the required `location` prop that will be identical to the fill `location`.

Update product editor package #36830

Update product editor package #36830

Conversation

louwie17 commented Feb 14, 2023 • edited

All Submissions:

Changes proposed in this Pull Request:

How to test the changes in this Pull Request:

Other information:

FOR PR REVIEWER ONLY:

codecov bot commented Feb 14, 2023 • edited

Codecov Report

github-actions bot commented Feb 14, 2023 • edited

Test Results Summary

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

louwie17 commented Feb 17, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

louwie17 commented Feb 23, 2023

louwie17 commented Feb 14, 2023 •

edited

codecov bot commented Feb 14, 2023 •

edited

github-actions bot commented Feb 14, 2023 •

edited