From 6862a300ecfbb69d81f54e7917761c3f850797fd Mon Sep 17 00:00:00 2001 From: Jon Lane Date: Mon, 18 Sep 2023 13:18:47 -0700 Subject: [PATCH 001/272] Remove OBW end to end tests --- .../changelog/e2e-remove-obw-tests | 4 + .../complete-onboarding-wizard.spec.js | 329 ------------------ 2 files changed, 4 insertions(+), 329 deletions(-) create mode 100644 plugins/woocommerce/changelog/e2e-remove-obw-tests delete mode 100644 plugins/woocommerce/tests/e2e-pw/tests/activate-and-setup/complete-onboarding-wizard.spec.js diff --git a/plugins/woocommerce/changelog/e2e-remove-obw-tests b/plugins/woocommerce/changelog/e2e-remove-obw-tests new file mode 100644 index 00000000000..33dbe30fd26 --- /dev/null +++ b/plugins/woocommerce/changelog/e2e-remove-obw-tests @@ -0,0 +1,4 @@ +Significance: patch +Type: dev + +Removes the onboarding wizard e2e tests (has been replaced by core profiler) diff --git a/plugins/woocommerce/tests/e2e-pw/tests/activate-and-setup/complete-onboarding-wizard.spec.js b/plugins/woocommerce/tests/e2e-pw/tests/activate-and-setup/complete-onboarding-wizard.spec.js deleted file mode 100644 index 8ac356d365b..00000000000 --- a/plugins/woocommerce/tests/e2e-pw/tests/activate-and-setup/complete-onboarding-wizard.spec.js +++ /dev/null @@ -1,329 +0,0 @@ -const { test, expect } = require( '@playwright/test' ); -const { onboarding } = require( '../../utils' ); -const { storeDetails } = require( '../../test-data/data' ); -const { api } = require( '../../utils' ); -const { features } = require( '../../utils' ); - -// Skipping Onbaording tests when the core-profiler is enabled. -const testRunner = features.is_enabled( 'core-profiler' ) - ? test.describe.skip - : test.describe; - -testRunner( 'Store owner can complete onboarding wizard', () => { - test.use( { storageState: process.env.ADMINSTATE } ); - - test.beforeEach( async () => { - // Complete "Store Details" step through the API to prevent flakiness when run on external sites. - await api.update.storeDetails( storeDetails.us.store ); - } ); - - // eslint-disable-next-line jest/expect-expect - test( 'can complete the "Store Details" section', async ( { page } ) => { - await onboarding.completeStoreDetailsSection( - page, - storeDetails.us.store - ); - } ); - - // eslint-disable-next-line jest/expect-expect - test( 'can complete the industry section', async ( { page } ) => { - await onboarding.completeIndustrySection( - page, - storeDetails.us.industries, - storeDetails.us.expectedNumberOfIndustries - ); - await page.locator( 'button >> text=Continue' ).click(); - await expect( page ).toHaveURL( /.*step=product-types/ ); - await expect( - page.locator( '.product-types button >> text=Continue' ) - ).toBeVisible(); - } ); - - // eslint-disable-next-line jest/expect-expect - test( 'can save industry changes when navigating back to "Store Details"', async ( { - page, - } ) => { - await onboarding.completeIndustrySection( - page, - storeDetails.us.industries2, - storeDetails.us.expectedNumberOfIndustries - ); - - // Navigate back to "Store Details" section - await page.locator( 'button >> text=Store Details' ).click(); - await onboarding.handleSaveChangesModal( page, { saveChanges: true } ); - await page.locator( 'text="Welcome to WooCommerce"' ).waitFor(); - - // Navigate back to "Industry" section - await page.locator( 'button >> text=Industry' ).click(); - for ( let industry of Object.values( storeDetails.us.industries2 ) ) { - await expect( page.getByLabel( industry ) ).toBeChecked(); - } - } ); - - // eslint-disable-next-line jest/expect-expect - test( 'can discard industry changes when navigating back to "Store Details"', async ( { - page, - } ) => { - - // set up pre-condition to ensure Industries stored in - // storeDetails.us.industries2 have been set - await onboarding.completeIndustrySection( - page, - storeDetails.us.industries2, - storeDetails.us.expectedNumberOfIndustries - ); - - // Navigate to "Store Details" section to show Save Changes modal prompt - await page.locator( 'button >> text=Store Details' ).click(); - - // handle save changes modal if displayed - const saveChangesModalVisible = await page - .locator( '.components-modal__header-heading' ) - .isVisible(); - if ( saveChangesModalVisible ) { - // Save the changes to ensure the test is now in the correct state - // independent of the previous test results - await onboarding.handleSaveChangesModal( page, { saveChanges: true } ); - } - - // test proper begins - await onboarding.completeIndustrySection( - page, - storeDetails.us.industries, - storeDetails.us.expectedNumberOfIndustries - ); - - // Navigate back to "Store Details" section - await page.locator( 'button >> text=Store Details' ).click(); - - await onboarding.handleSaveChangesModal( page, { saveChanges: false } ); - - // Navigate back to "Industry" section - await page.locator( 'button >> text=Industry' ).click(); - for ( let industry of Object.values( storeDetails.us.industries2 ) ) { - await expect( page.getByLabel( industry ) ).toBeChecked(); - } - } ); - - // eslint-disable-next-line jest/expect-expect - test( 'can complete the product types section', async ( { page } ) => { - await onboarding.completeProductTypesSection( - page, - storeDetails.us.products - ); - await page.locator( 'button >> text=Continue' ).click(); - } ); - - // eslint-disable-next-line jest/expect-expect - test( 'can complete the business section', async ( { page } ) => { - // We have to ensure that previous steps are complete to avoid generating an error - await onboarding.completeIndustrySection( - page, - storeDetails.us.industries, - storeDetails.us.expectedNumberOfIndustries - ); - await page.locator( 'button >> text=Continue' ).click(); - - await onboarding.completeProductTypesSection( - page, - storeDetails.us.products - ); - await page.locator( 'button >> text=Continue' ).click(); - - await onboarding.completeBusinessDetailsSection( page ); - await page.locator( 'button >> text=Continue' ).click(); - } ); - - // eslint-disable-next-line jest/expect-expect - test.skip( 'can unselect all business features and continue', async ( { - page, - } ) => { - // We have to ensure that previous steps are complete to avoid generating an error - await onboarding.completeIndustrySection( - page, - storeDetails.us.industries, - storeDetails.us.expectedNumberOfIndustries - ); - // Check to see if WC Payments is present - const wcPay = await page.locator( - '.woocommerce-admin__business-details__selective-extensions-bundle__description a[href*=woocommerce-payments]' - ); - - await onboarding.completeProductTypesSection( - page, - storeDetails.us.products - ); - - await onboarding.unselectBusinessFeatures( page ); - await page.locator( 'button >> text=Continue' ).click(); - } ); -} ); - -// Skipping Onbaording tests as we're replacing StoreDetails with Core Profiler -// !Changed from Japanese to Liberian store, as Japanese Yen does not use decimals -testRunner( - 'A Liberian store can complete the selective bundle install but does not include WCPay.', - () => { - test.use( { storageState: process.env.ADMINSTATE } ); - - test.beforeEach( async () => { - // Complete "Store Details" step through the API to prevent flakiness when run on external sites. - await api.update.storeDetails( storeDetails.liberia.store ); - } ); - - // eslint-disable-next-line jest/expect-expect - test( 'can choose the "Other" industry', async ( { page } ) => { - await onboarding.completeIndustrySection( - page, - storeDetails.liberia.industries, - storeDetails.liberia.expectedNumberOfIndustries - ); - await page.locator( 'button >> text=Continue' ).click(); - } ); - - // eslint-disable-next-line jest/expect-expect - test( 'can choose not to install any extensions', async ( { - page, - } ) => { - const expect_wp_pay = false; - - await onboarding.completeIndustrySection( - page, - storeDetails.liberia.industries, - storeDetails.liberia.expectedNumberOfIndustries - ); - await page.locator( 'button >> text=Continue' ).click(); - - await onboarding.completeProductTypesSection( - page, - storeDetails.liberia.products - ); - // Make sure WC Payments is NOT present - await expect( - page.locator( - '.woocommerce-admin__business-details__selective-extensions-bundle__description a[href*=woocommerce-payments]' - ) - ).not.toBeVisible(); - - await page.locator( 'button >> text=Continue' ).click(); - - await onboarding.completeBusinessDetailsSection( page ); - await page.locator( 'button >> text=Continue' ).click(); - - await onboarding.unselectBusinessFeatures( page, expect_wp_pay ); - - await page.locator( 'button >> text=Continue' ).click(); - - await expect( page ).not.toHaveURL( /.*step=business-details/ ); - } ); - - // Skipping this test because it's very flaky. Onboarding checklist changed so that the text - // changes when a task is completed. - // eslint-disable-next-line jest/no-disabled-tests - test.skip( 'should display the choose payments task, and not the WC Pay task', async ( { - page, - } ) => { - // If payment has previously been setup, the setup checklist will show something different - // This step resets it - await page.goto( - 'wp-admin/admin.php?page=wc-settings&tab=checkout' - ); - // Ensure that all payment methods are disabled - await expect( - page.locator( '.woocommerce-input-toggle--disabled' ) - ).toHaveCount( 3 ); - // Checklist shows when completing setup wizard - await onboarding.completeBusinessDetailsSection( page ); - await page.locator( 'button >> text=Continue' ).click(); - - await onboarding.unselectBusinessFeatures( page, expect_wp_pay ); - await page.locator( 'button >> text=Continue' ).click(); - - // Start test - await page.waitForLoadState( 'networkidle' ); - await expect( - page.locator( - ':nth-match(.woocommerce-task-list__item-title, 3)' - ) - ).toContainText( 'Set up payments' ); - await expect( - page.locator( - ':nth-match(.woocommerce-task-list__item-title, 3)' - ) - ).not.toContainText( 'Set up WooPayments' ); - } ); - } -); - -// Skipping this test because it's very flaky. -testRunner( 'Store owner can go through setup Task List', () => { - test.use( { storageState: process.env.ADMINSTATE } ); - - test.beforeEach( async ( { page } ) => { - await page.goto( - 'wp-admin/admin.php?page=wc-admin&path=/setup-wizard' - ); - await page - .locator( '#woocommerce-select-control-0__control-input' ) - .click(); - await page - .locator( '#woocommerce-select-control-0__control-input' ) - .fill( 'United States (US) — California' ); - await page - .locator( 'button >> text=United States (US) — California' ) - .click(); - await page.locator( '#inspector-text-control-0' ).fill( 'addr 1' ); - await page.locator( '#inspector-text-control-1' ).fill( '94107' ); - await page - .locator( '#inspector-text-control-2' ) - .fill( 'San Francisco' ); - await page - .locator( '#inspector-text-control-3' ) - .fill( storeDetails.us.store.email ); - await page.locator( '#inspector-checkbox-control-0' ).check(); - await page.locator( 'button >> text=Continue' ).click(); - await page.locator( 'button >> text=No thanks' ).click(); - await page.locator( 'button >> text=Continue' ).click(); - await page.locator( 'button >> text=Continue' ).click(); - await page.locator( 'button >> text=Continue' ).click(); - // Uncheck all business features - if ( - page.locator( '.components-checkbox-control__input' ).isChecked() - ) { - await page.locator( '.components-checkbox-control__input' ).click(); - } - await page.locator( 'button >> text=Continue' ).click(); - await page.waitForLoadState( 'networkidle' ); // not autowaiting for form submission - } ); - - test( 'can setup shipping', async ( { page } ) => { - await page.goto( '/wp-admin/admin.php?page=wc-admin' ); - await page.locator( 'div >> text=Review Shipping Options' ).click(); - - // dismiss tourkit if visible - const tourkitVisible = await page - .locator( 'button.woocommerce-tour-kit-step-controls__close-btn' ) - .isVisible(); - if ( tourkitVisible ) { - await page - .locator( - 'button.woocommerce-tour-kit-step-controls__close-btn' - ) - .click(); - } - - // check for automatically added shipping zone - await expect( - page.locator( 'tr[data-id="1"] >> td.wc-shipping-zone-name > a' ) - ).toContainText( 'United States (US)' ); - await expect( - page.locator( 'tr[data-id="1"] >> td.wc-shipping-zone-region' ) - ).toContainText( 'United States (US)' ); - await expect( - page.locator( - 'tr[data-id="1"] >> td.wc-shipping-zone-methods > div > ul > li' - ) - ).toContainText( 'Free shipping' ); - } ); -} ); From 7a303f259c8b5cb2e49062e66fff3e7c0c5a0e05 Mon Sep 17 00:00:00 2001 From: Jon Lane Date: Mon, 25 Sep 2023 15:53:18 -0700 Subject: [PATCH 002/272] Check first element on the page --- .../woocommerce/tests/e2e-pw/tests/merchant/page-loads.spec.js | 1 + 1 file changed, 1 insertion(+) diff --git a/plugins/woocommerce/tests/e2e-pw/tests/merchant/page-loads.spec.js b/plugins/woocommerce/tests/e2e-pw/tests/merchant/page-loads.spec.js index f25c2735def..31d3a762232 100644 --- a/plugins/woocommerce/tests/e2e-pw/tests/merchant/page-loads.spec.js +++ b/plugins/woocommerce/tests/e2e-pw/tests/merchant/page-loads.spec.js @@ -231,6 +231,7 @@ for ( const currentPage of wcPages ) { await expect( page.locator( currentPage.subpages[ i ].element ) + .first() ).toBeVisible(); await expect( From 9af1245d04b6ae0ab112548fd76ac1a00a4dc4ec Mon Sep 17 00:00:00 2001 From: Jon Lane Date: Mon, 25 Sep 2023 15:57:16 -0700 Subject: [PATCH 003/272] Add changelog --- plugins/woocommerce/changelog/e2e-fix-for-flaky-page-load | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 plugins/woocommerce/changelog/e2e-fix-for-flaky-page-load diff --git a/plugins/woocommerce/changelog/e2e-fix-for-flaky-page-load b/plugins/woocommerce/changelog/e2e-fix-for-flaky-page-load new file mode 100644 index 00000000000..f9ec282c35c --- /dev/null +++ b/plugins/woocommerce/changelog/e2e-fix-for-flaky-page-load @@ -0,0 +1,4 @@ +Significance: patch +Type: dev + +Fix for occasionally flaky page load test From 4ee6eb7ce3d508587109187204bdf0257ce82e6e Mon Sep 17 00:00:00 2001 From: Ron Rennick Date: Wed, 27 Sep 2023 05:03:21 -0300 Subject: [PATCH 004/272] update project labeler workflow configuration labels --- .github/project-pr-labeler.yml | 6 +++--- plugins/woocommerce/changelog/update-project-labeler-labels | 4 ++++ 2 files changed, 7 insertions(+), 3 deletions(-) create mode 100644 plugins/woocommerce/changelog/update-project-labeler-labels diff --git a/.github/project-pr-labeler.yml b/.github/project-pr-labeler.yml index ad5c471c0d4..87d89fa1056 100644 --- a/.github/project-pr-labeler.yml +++ b/.github/project-pr-labeler.yml @@ -67,11 +67,11 @@ 'plugin: woo-ai': - plugins/woo-ai/**/* -'focus: performance tests [team:Solaris]': +'focus: performance tests': - plugins/woocommerce/tests/performance/**/* -'focus: api tests [team:Solaris]': +'focus: api tests': - plugins/woocommerce/tests/api-core-tests/**/* -'focus: e2e tests [team:Solaris]': +'focus: e2e tests': - plugins/woocommerce/tests/e2e-pw/**/* diff --git a/plugins/woocommerce/changelog/update-project-labeler-labels b/plugins/woocommerce/changelog/update-project-labeler-labels new file mode 100644 index 00000000000..10bb8cb09fe --- /dev/null +++ b/plugins/woocommerce/changelog/update-project-labeler-labels @@ -0,0 +1,4 @@ +Significance: patch +Type: update + +update project labeler workflow configuration labels From 2f1a5f82ec983f3d3d9b2cec400e59a5c3872af4 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 20:55:22 -0400 Subject: [PATCH 005/272] Add ProductEditorContext and ProductEditorBlockEditProps interfaces --- packages/js/product-editor/src/index.ts | 5 +++++ packages/js/product-editor/src/types.ts | 18 ++++++++++++++++++ 2 files changed, 23 insertions(+) create mode 100644 packages/js/product-editor/src/types.ts diff --git a/packages/js/product-editor/src/index.ts b/packages/js/product-editor/src/index.ts index 511ba936c76..878a63d638a 100644 --- a/packages/js/product-editor/src/index.ts +++ b/packages/js/product-editor/src/index.ts @@ -6,6 +6,11 @@ export { TRACKS_SOURCE, } from './constants'; +/** + * Types + */ +export * from './types'; + /** * Utils */ diff --git a/packages/js/product-editor/src/types.ts b/packages/js/product-editor/src/types.ts new file mode 100644 index 00000000000..96e0434dda2 --- /dev/null +++ b/packages/js/product-editor/src/types.ts @@ -0,0 +1,18 @@ +/** + * External dependencies + */ +import { BlockEditProps } from '@wordpress/blocks'; +import { Product } from '@woocommerce/data'; + +export interface ProductEditorContext { + editedProduct: Product; + postId: number; + postType: string; + selectedTab: string | null; +} + +// eslint-disable-next-line @typescript-eslint/no-explicit-any +export interface ProductEditorBlockEditProps< T extends Record< string, any > > + extends BlockEditProps< T > { + readonly context: ProductEditorContext; +} From a22e92bea341dbc6891e0ce11dc7079829a19fef Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:12:26 -0400 Subject: [PATCH 006/272] Type context prop for BlockEditor --- .../src/components/block-editor/block-editor.tsx | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/packages/js/product-editor/src/components/block-editor/block-editor.tsx b/packages/js/product-editor/src/components/block-editor/block-editor.tsx index 9c069b2b7a7..246c9dcd8dd 100644 --- a/packages/js/product-editor/src/components/block-editor/block-editor.tsx +++ b/packages/js/product-editor/src/components/block-editor/block-editor.tsx @@ -32,11 +32,10 @@ import { * Internal dependencies */ import { useConfirmUnsavedProductChanges } from '../../hooks/use-confirm-unsaved-product-changes'; +import { ProductEditorContext } from '../../types'; type BlockEditorProps = { - context: { - [ key: string ]: unknown; - }; + context: Partial< ProductEditorContext >; product: Partial< Product >; settings: | ( Partial< EditorSettings & EditorBlockListSettings > & { @@ -94,13 +93,21 @@ export function BlockEditor( { ); }, [ product.id ] ); + const editedProduct: Product = useSelect( ( select ) => + select( 'core' ).getEditedEntityRecord( + 'postType', + 'product', + product.id + ) + ); + if ( ! blocks ) { return null; } return (
- + Date: Tue, 26 Sep 2023 21:13:40 -0400 Subject: [PATCH 007/272] Fix typing for initBlock call in catalog-visibility --- .../src/blocks/catalog-visibility/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/catalog-visibility/index.ts b/packages/js/product-editor/src/blocks/catalog-visibility/index.ts index 5b30cbce748..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/catalog-visibility/index.ts +++ b/packages/js/product-editor/src/blocks/catalog-visibility/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { CatalogVisibilityBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< CatalogVisibilityBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< CatalogVisibilityBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From 4f72172426ebe325be29b03b1bc0d07779b9d8ae Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:13:50 -0400 Subject: [PATCH 008/272] Fix typing for initBlock call in checkbox --- packages/js/product-editor/src/blocks/checkbox/index.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/checkbox/index.ts b/packages/js/product-editor/src/blocks/checkbox/index.ts index 6b7a2f17c22..23131cd2074 100644 --- a/packages/js/product-editor/src/blocks/checkbox/index.ts +++ b/packages/js/product-editor/src/blocks/checkbox/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -10,7 +9,7 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; import blockConfiguration from './block.json'; import { Edit } from './edit'; -const { name, ...metadata } = blockConfiguration as BlockConfiguration; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; @@ -19,4 +18,5 @@ export const settings = { edit: Edit, }; -export const init = () => registerWooBlockType( { name, metadata, settings } ); +export const init = () => + registerWooBlockType( { name, metadata: metadata as never, settings } ); From c507f02f4750b9a4d8e285ad2e451b234b042127 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:14:05 -0400 Subject: [PATCH 009/272] Fix typing for initBlock call in description --- packages/js/product-editor/src/blocks/description/index.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/description/index.ts b/packages/js/product-editor/src/blocks/description/index.ts index 6b7a2f17c22..23131cd2074 100644 --- a/packages/js/product-editor/src/blocks/description/index.ts +++ b/packages/js/product-editor/src/blocks/description/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -10,7 +9,7 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; import blockConfiguration from './block.json'; import { Edit } from './edit'; -const { name, ...metadata } = blockConfiguration as BlockConfiguration; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; @@ -19,4 +18,5 @@ export const settings = { edit: Edit, }; -export const init = () => registerWooBlockType( { name, metadata, settings } ); +export const init = () => + registerWooBlockType( { name, metadata: metadata as never, settings } ); From 21929ccd25422094b136f4a746abf07e4f00e50b Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:14:20 -0400 Subject: [PATCH 010/272] Fix typing for initBlock call in inventory-quantity --- .../src/blocks/inventory-quantity/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/inventory-quantity/index.ts b/packages/js/product-editor/src/blocks/inventory-quantity/index.ts index 98fb0c23aad..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/inventory-quantity/index.ts +++ b/packages/js/product-editor/src/blocks/inventory-quantity/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { TrackInventoryBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< TrackInventoryBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< TrackInventoryBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From 1b64e7dd0effed0d4f8f00ab25ff46b66be80058 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:14:30 -0400 Subject: [PATCH 011/272] Fix typing for initBlock call in inventory-email --- .../src/blocks/inventory-email/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/inventory-email/index.ts b/packages/js/product-editor/src/blocks/inventory-email/index.ts index db814b62b9e..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/inventory-email/index.ts +++ b/packages/js/product-editor/src/blocks/inventory-email/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { InventoryEmailBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< InventoryEmailBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< InventoryEmailBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From 4fc547dfb102e13d062e46f8ead44df8d0009ccc Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:14:41 -0400 Subject: [PATCH 012/272] Fix typing for initBlock call in inventory-sku --- .../js/product-editor/src/blocks/inventory-sku/index.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/inventory-sku/index.ts b/packages/js/product-editor/src/blocks/inventory-sku/index.ts index 6b7a2f17c22..23131cd2074 100644 --- a/packages/js/product-editor/src/blocks/inventory-sku/index.ts +++ b/packages/js/product-editor/src/blocks/inventory-sku/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -10,7 +9,7 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; import blockConfiguration from './block.json'; import { Edit } from './edit'; -const { name, ...metadata } = blockConfiguration as BlockConfiguration; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; @@ -19,4 +18,5 @@ export const settings = { edit: Edit, }; -export const init = () => registerWooBlockType( { name, metadata, settings } ); +export const init = () => + registerWooBlockType( { name, metadata: metadata as never, settings } ); From 54209362a07ec09dbb1291f71600f2226bbde8de Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:14:54 -0400 Subject: [PATCH 013/272] Fix typing for initBlock call in notice --- .../js/product-editor/src/blocks/notice/index.ts | 14 ++++---------- 1 file changed, 4 insertions(+), 10 deletions(-) diff --git a/packages/js/product-editor/src/blocks/notice/index.ts b/packages/js/product-editor/src/blocks/notice/index.ts index 72691b07798..98bcf30bafb 100644 --- a/packages/js/product-editor/src/blocks/notice/index.ts +++ b/packages/js/product-editor/src/blocks/notice/index.ts @@ -1,26 +1,20 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** * Internal dependencies */ import blockConfiguration from './block.json'; -import { Edit, NoticeBlockAttributes } from './edit'; +import { Edit } from './edit'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< NoticeBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< BlockConfiguration< NoticeBlockAttributes > > = - { - example: {}, - edit: Edit, - }; +export const settings = { example: {}, edit: Edit }; export function init() { - registerWooBlockType( { name, metadata, settings } ); + registerWooBlockType( { name, metadata: metadata as never, settings } ); } From c8ad1de579a030381c3b00795d1b3db112af9a57 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:15:04 -0400 Subject: [PATCH 014/272] Fix typing for initBlock call in password --- .../product-editor/src/blocks/password/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/password/index.ts b/packages/js/product-editor/src/blocks/password/index.ts index a25088682e6..d384267be7e 100644 --- a/packages/js/product-editor/src/blocks/password/index.ts +++ b/packages/js/product-editor/src/blocks/password/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,19 +8,19 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { RequirePasswordBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< RequirePasswordBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< RequirePasswordBlockAttributes > -> = { +export const settings = { edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From dfaa1b7dfda0c27d811d54048445b0cf48a019d1 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:15:12 -0400 Subject: [PATCH 015/272] Fix typing for initBlock call in pricing --- .../src/blocks/pricing/index.ts | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/packages/js/product-editor/src/blocks/pricing/index.ts b/packages/js/product-editor/src/blocks/pricing/index.ts index 4d22a025cd8..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/pricing/index.ts +++ b/packages/js/product-editor/src/blocks/pricing/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,19 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { PricingBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< PricingBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< BlockConfiguration< PricingBlockAttributes > > = - { - example: {}, - edit: Edit, - }; +export const settings = { + example: {}, + edit: Edit, +}; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From ed57f267fb7fce63839deec235b825cf5378147f Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:15:21 -0400 Subject: [PATCH 016/272] Fix typing for initBlock call in radio --- .../js/product-editor/src/blocks/radio/index.ts | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/packages/js/product-editor/src/blocks/radio/index.ts b/packages/js/product-editor/src/blocks/radio/index.ts index 247c3376403..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/radio/index.ts +++ b/packages/js/product-editor/src/blocks/radio/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,18 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { RadioBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< RadioBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< BlockConfiguration< RadioBlockAttributes > > = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From edaf1154d0c472c2591bbb6fc48cb85899ffddde Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:15:31 -0400 Subject: [PATCH 017/272] Fix typing for initBlock call in sale-price --- .../product-editor/src/blocks/sale-price/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/sale-price/index.ts b/packages/js/product-editor/src/blocks/sale-price/index.ts index d52482c6070..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/sale-price/index.ts +++ b/packages/js/product-editor/src/blocks/sale-price/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { SalePriceBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< SalePriceBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< SalePriceBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From e94de74d004dde2a60bea0ecc9fdb53205b7638f Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:15:40 -0400 Subject: [PATCH 018/272] Fix typing for initBlock call in section --- .../src/blocks/section/index.ts | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/packages/js/product-editor/src/blocks/section/index.ts b/packages/js/product-editor/src/blocks/section/index.ts index addbd405737..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/section/index.ts +++ b/packages/js/product-editor/src/blocks/section/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,19 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { SectionBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< SectionBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< BlockConfiguration< SectionBlockAttributes > > = - { - example: {}, - edit: Edit, - }; +export const settings = { + example: {}, + edit: Edit, +}; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From 9f55c320dc43e8e4359b063a5f4a5f7073f2f113 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:16:01 -0400 Subject: [PATCH 019/272] Fix typing for initBlock call in regular-price --- .../src/blocks/regular-price/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/regular-price/index.ts b/packages/js/product-editor/src/blocks/regular-price/index.ts index d52482c6070..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/regular-price/index.ts +++ b/packages/js/product-editor/src/blocks/regular-price/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { SalePriceBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< SalePriceBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< SalePriceBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From 8ff4f6b095043e599e8484fb8c909516a03861b0 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:16:16 -0400 Subject: [PATCH 020/272] Fix typing for initBlock call in schedule-sale --- .../src/blocks/schedule-sale/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/schedule-sale/index.ts b/packages/js/product-editor/src/blocks/schedule-sale/index.ts index a503751f2d1..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/schedule-sale/index.ts +++ b/packages/js/product-editor/src/blocks/schedule-sale/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { ScheduleSalePricingBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< ScheduleSalePricingBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< ScheduleSalePricingBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From ce4b7af7e813c21316cb7c266abb7ef3f6c8be9b Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:16:28 -0400 Subject: [PATCH 021/272] Fix typing for initBlock call in shipping-class --- .../src/blocks/shipping-class/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/shipping-class/index.ts b/packages/js/product-editor/src/blocks/shipping-class/index.ts index c61e625622d..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/shipping-class/index.ts +++ b/packages/js/product-editor/src/blocks/shipping-class/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { ShippingClassBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< ShippingClassBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< ShippingClassBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From ac7ab2b1a0ddc494827190e2cc6e0b23375562a3 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:16:40 -0400 Subject: [PATCH 022/272] Fix typing for initBlock call in shipping-dimensions --- .../src/blocks/shipping-dimensions/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/shipping-dimensions/index.ts b/packages/js/product-editor/src/blocks/shipping-dimensions/index.ts index 7bf5acf1c12..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/shipping-dimensions/index.ts +++ b/packages/js/product-editor/src/blocks/shipping-dimensions/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { ShippingDimensionsBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< ShippingDimensionsBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< ShippingDimensionsBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From c2e60a4aa8af9354bc986086f4793411fba621bd Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:16:52 -0400 Subject: [PATCH 023/272] Fix typing for initBlock call in summary --- packages/js/product-editor/src/blocks/summary/index.ts | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/packages/js/product-editor/src/blocks/summary/index.ts b/packages/js/product-editor/src/blocks/summary/index.ts index 634fcfa6837..7801d49c280 100644 --- a/packages/js/product-editor/src/blocks/summary/index.ts +++ b/packages/js/product-editor/src/blocks/summary/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,10 +8,8 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { SummaryAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< SummaryAttributes >; +const { name, ...metadata } = blockConfiguration; export { name, metadata }; @@ -22,9 +19,9 @@ export const settings = { }; export function init() { - return registerWooBlockType< SummaryAttributes >( { + return registerWooBlockType( { name, - metadata, + metadata: metadata as never, settings, } ); } From 8a78340b308c6de93c564407c065736e2528baa6 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:17:05 -0400 Subject: [PATCH 024/272] Fix typing for initBlock call in toggle --- .../product-editor/src/blocks/toggle/index.ts | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/packages/js/product-editor/src/blocks/toggle/index.ts b/packages/js/product-editor/src/blocks/toggle/index.ts index 43d9b3fa945..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/toggle/index.ts +++ b/packages/js/product-editor/src/blocks/toggle/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,19 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { ToggleBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< ToggleBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< BlockConfiguration< ToggleBlockAttributes > > = - { - example: {}, - edit: Edit, - }; +export const settings = { + example: {}, + edit: Edit, +}; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From 57448d4627c0caecfcf5a0c15fc9d1ebeb4e062c Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:17:17 -0400 Subject: [PATCH 025/272] Fix typing for initBlock call in variation-options --- .../src/blocks/variation-options/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/variation-options/index.ts b/packages/js/product-editor/src/blocks/variation-options/index.ts index 17a6b007a32..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/variation-options/index.ts +++ b/packages/js/product-editor/src/blocks/variation-options/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { VariationOptionsBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< VariationOptionsBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< VariationOptionsBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From ef48cccc23ad55567a23679b78fe88a09be5dc46 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:17:42 -0400 Subject: [PATCH 026/272] Fix typing for initBlock call in variations --- .../product-editor/src/blocks/variations/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/variations/index.ts b/packages/js/product-editor/src/blocks/variations/index.ts index 6f2dfb0dc1a..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/variations/index.ts +++ b/packages/js/product-editor/src/blocks/variations/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { VariationsBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< VariationsBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< VariationsBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From a4a44ef56b4d9407673cad256fe7b51ac27e3fee Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:18:09 -0400 Subject: [PATCH 027/272] Fix typing for initBlock call in variation-items --- .../src/blocks/variation-items/index.ts | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/packages/js/product-editor/src/blocks/variation-items/index.ts b/packages/js/product-editor/src/blocks/variation-items/index.ts index 17a6b007a32..cd9e326744d 100644 --- a/packages/js/product-editor/src/blocks/variation-items/index.ts +++ b/packages/js/product-editor/src/blocks/variation-items/index.ts @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** @@ -9,20 +8,20 @@ import { registerWooBlockType } from '@woocommerce/block-templates'; */ import blockConfiguration from './block.json'; import { Edit } from './edit'; -import { VariationOptionsBlockAttributes } from './types'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< VariationOptionsBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< - BlockConfiguration< VariationOptionsBlockAttributes > -> = { +export const settings = { example: {}, edit: Edit, }; export function init() { - return registerWooBlockType( { name, metadata, settings } ); + return registerWooBlockType( { + name, + metadata: metadata as never, + settings, + } ); } From b6dc633e81e5d33ef9ba3a98bd385f50c6658090 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:18:18 -0400 Subject: [PATCH 028/272] Fix typing for initBlock call in tab --- packages/js/product-editor/src/blocks/tab/index.ts | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/packages/js/product-editor/src/blocks/tab/index.ts b/packages/js/product-editor/src/blocks/tab/index.ts index a72be689268..4061285c398 100644 --- a/packages/js/product-editor/src/blocks/tab/index.ts +++ b/packages/js/product-editor/src/blocks/tab/index.ts @@ -1,25 +1,23 @@ /** * External dependencies */ -import { BlockConfiguration } from '@wordpress/blocks'; import { registerWooBlockType } from '@woocommerce/block-templates'; /** * Internal dependencies */ import blockConfiguration from './block.json'; -import { Edit, TabBlockAttributes } from './edit'; +import { Edit } from './edit'; -const { name, ...metadata } = - blockConfiguration as BlockConfiguration< TabBlockAttributes >; +const { name, ...metadata } = blockConfiguration; export { metadata, name }; -export const settings: Partial< BlockConfiguration< TabBlockAttributes > > = { +export const settings = { example: {}, edit: Edit, }; export function init() { - registerWooBlockType( { name, metadata, settings } ); + registerWooBlockType( { name, metadata: metadata as never, settings } ); } From a2e908015027057f83b89dce2c347ef7582a38be Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:19:30 -0400 Subject: [PATCH 029/272] Update context type for tab --- packages/js/product-editor/src/blocks/tab/edit.tsx | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/packages/js/product-editor/src/blocks/tab/edit.tsx b/packages/js/product-editor/src/blocks/tab/edit.tsx index d9af3352387..c18cbcfdd30 100644 --- a/packages/js/product-editor/src/blocks/tab/edit.tsx +++ b/packages/js/product-editor/src/blocks/tab/edit.tsx @@ -4,13 +4,14 @@ import { InnerBlocks } from '@wordpress/block-editor'; import classnames from 'classnames'; import { createElement } from '@wordpress/element'; -import type { BlockAttributes, BlockEditProps } from '@wordpress/blocks'; +import type { BlockAttributes } from '@wordpress/blocks'; import { useWooBlockProps } from '@woocommerce/block-templates'; /** * Internal dependencies */ import { TabButton } from './tab-button'; +import { ProductEditorBlockEditProps } from '../../types'; export interface TabBlockAttributes extends BlockAttributes { id: string; @@ -23,14 +24,10 @@ export function Edit( { setAttributes, attributes, context, -}: BlockEditProps< TabBlockAttributes > & { - context?: { - selectedTab?: string | null; - }; -} ) { +}: ProductEditorBlockEditProps< TabBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { id, title, order, isSelected: contextIsSelected } = attributes; - const isSelected = context?.selectedTab === id; + const isSelected = context.selectedTab === id; if ( isSelected !== contextIsSelected ) { setAttributes( { isSelected } ); } From bd4c7847b9531071a32bfb0a0ee155a7eaf0c515 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:19:44 -0400 Subject: [PATCH 030/272] Update context type for tag --- packages/js/product-editor/src/blocks/tag/edit.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/js/product-editor/src/blocks/tag/edit.tsx b/packages/js/product-editor/src/blocks/tag/edit.tsx index 75f402a55d2..b1c7211e53f 100644 --- a/packages/js/product-editor/src/blocks/tag/edit.tsx +++ b/packages/js/product-editor/src/blocks/tag/edit.tsx @@ -17,19 +17,17 @@ import { useEntityProp } from '@wordpress/core-data'; * Internal dependencies */ import { TagField } from '../../components/tags-field'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, context, -}: { - attributes: BlockAttributes; - context?: { postType?: string }; -} ) { +}: ProductEditorBlockEditProps< BlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { name, label, placeholder } = attributes; const [ tags, setTags ] = useEntityProp< Pick< ProductTag, 'id' | 'name' >[] - >( 'postType', context?.postType || 'product', name || 'tags' ); + >( 'postType', context.postType || 'product', name || 'tags' ); const tagFieldId = useInstanceId( BaseControl, 'tag-field' ) as string; From 8aa42f433fb7e0a1ad3a06ecb41b40d777873d90 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:20:14 -0400 Subject: [PATCH 031/272] Update context type for variation-items --- .../js/product-editor/src/blocks/variation-items/edit.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/variation-items/edit.tsx b/packages/js/product-editor/src/blocks/variation-items/edit.tsx index b57528f19f2..0237fc92760 100644 --- a/packages/js/product-editor/src/blocks/variation-items/edit.tsx +++ b/packages/js/product-editor/src/blocks/variation-items/edit.tsx @@ -27,12 +27,13 @@ import { VariationOptionsBlockAttributes } from './types'; import { VariableProductTour } from './variable-product-tour'; import { TRACKS_SOURCE } from '../../constants'; import { handlePrompt } from '../../utils/handle-prompt'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, context, -}: BlockEditProps< VariationOptionsBlockAttributes > & { - context?: { +}: ProductEditorBlockEditProps< VariationOptionsBlockAttributes > & { + context: { isInSelectedTab?: boolean; }; } ) { @@ -198,7 +199,7 @@ export function Edit( { } } } /> - { context?.isInSelectedTab && } + { context.isInSelectedTab && }
); } From 9ce23c10269cc68d77528f58edcdc97b6d428b75 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Tue, 26 Sep 2023 21:20:46 -0400 Subject: [PATCH 032/272] Update conditional to use editedProduct from context --- .../src/blocks/conditional/block.json | 1 + .../src/blocks/conditional/edit.tsx | 31 +++++++------------ 2 files changed, 13 insertions(+), 19 deletions(-) diff --git a/packages/js/product-editor/src/blocks/conditional/block.json b/packages/js/product-editor/src/blocks/conditional/block.json index 5afff2f5865..c3ddd9c0581 100644 --- a/packages/js/product-editor/src/blocks/conditional/block.json +++ b/packages/js/product-editor/src/blocks/conditional/block.json @@ -16,6 +16,7 @@ "default": [] } }, + "usesContext": [ "editedProduct" ], "supports": { "align": false, "html": false, diff --git a/packages/js/product-editor/src/blocks/conditional/edit.tsx b/packages/js/product-editor/src/blocks/conditional/edit.tsx index 0c088010354..0fc5bdec282 100644 --- a/packages/js/product-editor/src/blocks/conditional/edit.tsx +++ b/packages/js/product-editor/src/blocks/conditional/edit.tsx @@ -4,33 +4,26 @@ import type { BlockAttributes } from '@wordpress/blocks'; import { createElement, useMemo } from '@wordpress/element'; import { InnerBlocks } from '@wordpress/block-editor'; -import { useSelect } from '@wordpress/data'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { DisplayState } from '@woocommerce/components'; -import { Product } from '@woocommerce/data'; -// eslint-disable-next-line @typescript-eslint/ban-ts-comment -// @ts-ignore No types for this exist yet. -// eslint-disable-next-line @woocommerce/dependency-group -import { useEntityId } from '@wordpress/core-data'; + +/** + * Internal dependencies + */ +import { ProductEditorBlockEditProps } from '../../types'; + +export interface ConditionalBlockAttributes extends BlockAttributes { + mustMatch: Record< string, Array< string > >; +} export function Edit( { attributes, -}: { - attributes: BlockAttributes & { - mustMatch: Record< string, Array< string > >; - }; -} ) { + context, +}: ProductEditorBlockEditProps< ConditionalBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { mustMatch } = attributes; - const productId = useEntityId( 'postType', 'product' ); - const product: Product = useSelect( ( select ) => - select( 'core' ).getEditedEntityRecord( - 'postType', - 'product', - productId - ) - ); + const product = context.editedProduct; const displayBlocks = useMemo( () => { for ( const [ prop, values ] of Object.entries( mustMatch ) ) { From fd997269cd754be90093e23c74e8f07622c7f2f5 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 07:59:09 -0400 Subject: [PATCH 033/272] Remove unused import --- packages/js/product-editor/src/blocks/variation-items/edit.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/js/product-editor/src/blocks/variation-items/edit.tsx b/packages/js/product-editor/src/blocks/variation-items/edit.tsx index 0237fc92760..a8fbd8e6121 100644 --- a/packages/js/product-editor/src/blocks/variation-items/edit.tsx +++ b/packages/js/product-editor/src/blocks/variation-items/edit.tsx @@ -10,7 +10,6 @@ import { } from '@woocommerce/data'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { recordEvent } from '@woocommerce/tracks'; -import { BlockEditProps } from '@wordpress/blocks'; import { createElement, useMemo, useRef } from '@wordpress/element'; import { resolveSelect, useDispatch, useSelect } from '@wordpress/data'; // eslint-disable-next-line @typescript-eslint/ban-ts-comment From e8184141a6f0cc345701c54d6ce273d0a4d6b763 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 08:00:11 -0400 Subject: [PATCH 034/272] Changelog --- .../js/product-editor/changelog/add-edited-product-in-context | 4 ++++ 1 file changed, 4 insertions(+) create mode 100644 packages/js/product-editor/changelog/add-edited-product-in-context diff --git a/packages/js/product-editor/changelog/add-edited-product-in-context b/packages/js/product-editor/changelog/add-edited-product-in-context new file mode 100644 index 00000000000..81040c48b28 --- /dev/null +++ b/packages/js/product-editor/changelog/add-edited-product-in-context @@ -0,0 +1,4 @@ +Significance: minor +Type: add + +Store edited product in product editor context. From 57444b5a907fdd5a8e56b8d08062e190dfda1ac6 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 13:31:57 -0400 Subject: [PATCH 035/272] Fix tabs test --- .../src/components/tabs/test/tabs.spec.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/packages/js/product-editor/src/components/tabs/test/tabs.spec.tsx b/packages/js/product-editor/src/components/tabs/test/tabs.spec.tsx index 97d9905a356..284b794ec98 100644 --- a/packages/js/product-editor/src/components/tabs/test/tabs.spec.tsx +++ b/packages/js/product-editor/src/components/tabs/test/tabs.spec.tsx @@ -34,6 +34,9 @@ const blockProps = { function MockTabs( { onChange = jest.fn() } ) { const [ selected, setSelected ] = useState< string | null >( null ); const mockContext = { + editedProduct: null, + postId: 1, + postType: 'product', selectedTab: selected, }; @@ -48,16 +51,22 @@ function MockTabs( { onChange = jest.fn() } ) { From 898dd99be6ab667134de60389b0423ac30c2f43d Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 17:17:52 -0400 Subject: [PATCH 036/272] Update registerWooBlockType for conditional --- packages/js/product-editor/src/blocks/conditional/index.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/js/product-editor/src/blocks/conditional/index.ts b/packages/js/product-editor/src/blocks/conditional/index.ts index 6af10d47939..5322eeb221e 100644 --- a/packages/js/product-editor/src/blocks/conditional/index.ts +++ b/packages/js/product-editor/src/blocks/conditional/index.ts @@ -19,4 +19,8 @@ export const settings = { }; export const init = () => - registerWooBlockType( { name, metadata: metadata as never, settings } ); + registerWooBlockType( { + name, + metadata: metadata as never, + settings: settings as never, + } ); From 78fab5c8e30b3b7bf34fb6a4e1c0e9d30de5405f Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 17:18:00 -0400 Subject: [PATCH 037/272] Update registerWooBlockType for tab --- packages/js/product-editor/src/blocks/tab/index.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/js/product-editor/src/blocks/tab/index.ts b/packages/js/product-editor/src/blocks/tab/index.ts index 4061285c398..73e3f1d9d81 100644 --- a/packages/js/product-editor/src/blocks/tab/index.ts +++ b/packages/js/product-editor/src/blocks/tab/index.ts @@ -19,5 +19,9 @@ export const settings = { }; export function init() { - registerWooBlockType( { name, metadata: metadata as never, settings } ); + registerWooBlockType( { + name, + metadata: metadata as never, + settings: settings as never, + } ); } From 5bf2e92eff127438547c78b4ecf6cf076cae8784 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 17:18:08 -0400 Subject: [PATCH 038/272] Update registerWooBlockType for tag --- packages/js/product-editor/src/blocks/tag/index.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/js/product-editor/src/blocks/tag/index.ts b/packages/js/product-editor/src/blocks/tag/index.ts index 6af10d47939..5322eeb221e 100644 --- a/packages/js/product-editor/src/blocks/tag/index.ts +++ b/packages/js/product-editor/src/blocks/tag/index.ts @@ -19,4 +19,8 @@ export const settings = { }; export const init = () => - registerWooBlockType( { name, metadata: metadata as never, settings } ); + registerWooBlockType( { + name, + metadata: metadata as never, + settings: settings as never, + } ); From 51370ac88af798c20077136cd316e277988f2be7 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 17:18:20 -0400 Subject: [PATCH 039/272] Update registerWooBlockType for variation-items --- packages/js/product-editor/src/blocks/variation-items/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/js/product-editor/src/blocks/variation-items/index.ts b/packages/js/product-editor/src/blocks/variation-items/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/variation-items/index.ts +++ b/packages/js/product-editor/src/blocks/variation-items/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From ad2e50fb1c613a93092551a539cee8af1eea15de Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:38:23 -0400 Subject: [PATCH 040/272] Update Edit props type for attributes --- packages/js/product-editor/src/blocks/attributes/edit.tsx | 7 +++++-- packages/js/product-editor/src/blocks/attributes/index.ts | 2 +- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/attributes/edit.tsx b/packages/js/product-editor/src/blocks/attributes/edit.tsx index 044777a0d90..1866544e8ce 100644 --- a/packages/js/product-editor/src/blocks/attributes/edit.tsx +++ b/packages/js/product-editor/src/blocks/attributes/edit.tsx @@ -1,7 +1,7 @@ /** * External dependencies */ -import { BlockEditProps, BlockAttributes } from '@wordpress/blocks'; +import { BlockAttributes } from '@wordpress/blocks'; import { createElement } from '@wordpress/element'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { ProductAttribute } from '@woocommerce/data'; @@ -14,8 +14,11 @@ import { useEntityProp, useEntityId } from '@wordpress/core-data'; * Internal dependencies */ import { Attributes as AttributesContainer } from '../../components/attributes/attributes'; +import { ProductEditorBlockEditProps } from '../../types'; -export function Edit( { attributes }: BlockEditProps< BlockAttributes > ) { +export function Edit( { + attributes, +}: ProductEditorBlockEditProps< BlockAttributes > ) { const [ entityAttributes, setEntityAttributes ] = useEntityProp< ProductAttribute[] >( 'postType', 'product', 'attributes' ); diff --git a/packages/js/product-editor/src/blocks/attributes/index.ts b/packages/js/product-editor/src/blocks/attributes/index.ts index 37f321821db..5322eeb221e 100644 --- a/packages/js/product-editor/src/blocks/attributes/index.ts +++ b/packages/js/product-editor/src/blocks/attributes/index.ts @@ -22,5 +22,5 @@ export const init = () => registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); From 857eb39b115cf6e08201a1bd2aa56a75fd41f75c Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:38:38 -0400 Subject: [PATCH 041/272] Update Edit props type for catalog-visibility --- .../js/product-editor/src/blocks/catalog-visibility/edit.tsx | 5 ++--- .../js/product-editor/src/blocks/catalog-visibility/index.ts | 2 +- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/packages/js/product-editor/src/blocks/catalog-visibility/edit.tsx b/packages/js/product-editor/src/blocks/catalog-visibility/edit.tsx index 7ec4e7a30d9..12889a34bae 100644 --- a/packages/js/product-editor/src/blocks/catalog-visibility/edit.tsx +++ b/packages/js/product-editor/src/blocks/catalog-visibility/edit.tsx @@ -11,12 +11,11 @@ import { Product } from '@woocommerce/data'; * Internal dependencies */ import { CatalogVisibilityBlockAttributes } from './types'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, -}: { - attributes: CatalogVisibilityBlockAttributes; -} ) { +}: ProductEditorBlockEditProps< CatalogVisibilityBlockAttributes > ) { const { label, visibility } = attributes; const blockProps = useWooBlockProps( attributes ); diff --git a/packages/js/product-editor/src/blocks/catalog-visibility/index.ts b/packages/js/product-editor/src/blocks/catalog-visibility/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/catalog-visibility/index.ts +++ b/packages/js/product-editor/src/blocks/catalog-visibility/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 1a2041cef14eb449e36c5b2f0989d95e13ba50c0 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:38:46 -0400 Subject: [PATCH 042/272] Update Edit props type for checkbox --- packages/js/product-editor/src/blocks/checkbox/edit.tsx | 5 ++++- packages/js/product-editor/src/blocks/checkbox/index.ts | 6 +++++- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/packages/js/product-editor/src/blocks/checkbox/edit.tsx b/packages/js/product-editor/src/blocks/checkbox/edit.tsx index 5efb60dad99..f8b4dfa84cf 100644 --- a/packages/js/product-editor/src/blocks/checkbox/edit.tsx +++ b/packages/js/product-editor/src/blocks/checkbox/edit.tsx @@ -11,8 +11,11 @@ import { useWooBlockProps } from '@woocommerce/block-templates'; /** * Internal dependencies */ +import { ProductEditorBlockEditProps } from '../../types'; -export function Edit( { attributes }: { attributes: BlockAttributes } ) { +export function Edit( { + attributes, +}: ProductEditorBlockEditProps< BlockAttributes > ) { const blockProps = useWooBlockProps( { className: 'woocommerce-product-form__checkbox', ...attributes, diff --git a/packages/js/product-editor/src/blocks/checkbox/index.ts b/packages/js/product-editor/src/blocks/checkbox/index.ts index 23131cd2074..d670004d84d 100644 --- a/packages/js/product-editor/src/blocks/checkbox/index.ts +++ b/packages/js/product-editor/src/blocks/checkbox/index.ts @@ -19,4 +19,8 @@ export const settings = { }; export const init = () => - registerWooBlockType( { name, metadata: metadata as never, settings } ); + registerWooBlockType( { + name, + metadata: metadata as never, + settings: settings as never, + } ); From 73815bdef705a33ceb37776e9ffbd8286136fb57 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:39:03 -0400 Subject: [PATCH 043/272] Update Edit props type for collapsible --- .../js/product-editor/src/blocks/collapsible/edit.tsx | 9 ++++++++- .../js/product-editor/src/blocks/collapsible/index.ts | 6 +++++- 2 files changed, 13 insertions(+), 2 deletions(-) diff --git a/packages/js/product-editor/src/blocks/collapsible/edit.tsx b/packages/js/product-editor/src/blocks/collapsible/edit.tsx index 17dc9b86db5..265748bbd32 100644 --- a/packages/js/product-editor/src/blocks/collapsible/edit.tsx +++ b/packages/js/product-editor/src/blocks/collapsible/edit.tsx @@ -7,7 +7,14 @@ import type { BlockAttributes } from '@wordpress/blocks'; import { createElement } from '@wordpress/element'; import { InnerBlocks } from '@wordpress/block-editor'; -export function Edit( { attributes }: { attributes: BlockAttributes } ) { +/** + * Internal dependencies + */ +import { ProductEditorBlockEditProps } from '../../types'; + +export function Edit( { + attributes, +}: ProductEditorBlockEditProps< BlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { toggleText, initialCollapsed, persistRender = true } = attributes; diff --git a/packages/js/product-editor/src/blocks/collapsible/index.ts b/packages/js/product-editor/src/blocks/collapsible/index.ts index 6af10d47939..5322eeb221e 100644 --- a/packages/js/product-editor/src/blocks/collapsible/index.ts +++ b/packages/js/product-editor/src/blocks/collapsible/index.ts @@ -19,4 +19,8 @@ export const settings = { }; export const init = () => - registerWooBlockType( { name, metadata: metadata as never, settings } ); + registerWooBlockType( { + name, + metadata: metadata as never, + settings: settings as never, + } ); From e28da2912a48aacb80ad07f2791045e7117d3866 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:39:12 -0400 Subject: [PATCH 044/272] Update Edit props type for description --- packages/js/product-editor/src/blocks/description/edit.tsx | 6 ++++-- packages/js/product-editor/src/blocks/description/index.ts | 6 +++++- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/description/edit.tsx b/packages/js/product-editor/src/blocks/description/edit.tsx index 769d713f9c7..aa748e09111 100644 --- a/packages/js/product-editor/src/blocks/description/edit.tsx +++ b/packages/js/product-editor/src/blocks/description/edit.tsx @@ -4,7 +4,6 @@ import { __ } from '@wordpress/i18n'; import { createElement, useState } from '@wordpress/element'; import { - BlockEditProps, BlockAttributes, BlockInstance, parse, @@ -20,6 +19,7 @@ import { useEntityProp } from '@wordpress/core-data'; */ import { ContentPreview } from '../../components/content-preview'; import { ModalEditor } from '../../components/modal-editor'; +import { ProductEditorBlockEditProps } from '../../types'; /** * Internal dependencies @@ -45,7 +45,9 @@ function clearDescriptionIfEmpty( blocks: BlockInstance[] ) { return blocks; } -export function Edit( { attributes }: BlockEditProps< BlockAttributes > ) { +export function Edit( { + attributes, +}: ProductEditorBlockEditProps< BlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const [ isModalOpen, setIsModalOpen ] = useState( false ); const [ description, setDescription ] = useEntityProp< string >( diff --git a/packages/js/product-editor/src/blocks/description/index.ts b/packages/js/product-editor/src/blocks/description/index.ts index 23131cd2074..d670004d84d 100644 --- a/packages/js/product-editor/src/blocks/description/index.ts +++ b/packages/js/product-editor/src/blocks/description/index.ts @@ -19,4 +19,8 @@ export const settings = { }; export const init = () => - registerWooBlockType( { name, metadata: metadata as never, settings } ); + registerWooBlockType( { + name, + metadata: metadata as never, + settings: settings as never, + } ); From b800b6ddcc24543538ea8de3e050eb41dae06368 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:39:22 -0400 Subject: [PATCH 045/272] Update Edit props type for images --- packages/js/product-editor/src/blocks/images/edit.tsx | 11 +++++++++-- packages/js/product-editor/src/blocks/images/index.ts | 2 +- 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/images/edit.tsx b/packages/js/product-editor/src/blocks/images/edit.tsx index ca4f3aff59c..9412a374de5 100644 --- a/packages/js/product-editor/src/blocks/images/edit.tsx +++ b/packages/js/product-editor/src/blocks/images/edit.tsx @@ -2,7 +2,7 @@ * External dependencies */ import { __ } from '@wordpress/i18n'; -import { BlockEditProps, BlockAttributes } from '@wordpress/blocks'; +import { BlockAttributes } from '@wordpress/blocks'; import { DropZone } from '@wordpress/components'; import classnames from 'classnames'; import { createElement, useState } from '@wordpress/element'; @@ -20,11 +20,18 @@ import { recordEvent } from '@woocommerce/tracks'; // eslint-disable-next-line @woocommerce/dependency-group import { useEntityProp } from '@wordpress/core-data'; +/** + * Internal dependencies + */ +import { ProductEditorBlockEditProps } from '../../types'; + type Image = MediaItem & { src: string; }; -export function Edit( { attributes }: BlockEditProps< BlockAttributes > ) { +export function Edit( { + attributes, +}: ProductEditorBlockEditProps< BlockAttributes > ) { const [ images, setImages ] = useEntityProp< MediaItem[] >( 'postType', 'product', diff --git a/packages/js/product-editor/src/blocks/images/index.ts b/packages/js/product-editor/src/blocks/images/index.ts index 37f321821db..5322eeb221e 100644 --- a/packages/js/product-editor/src/blocks/images/index.ts +++ b/packages/js/product-editor/src/blocks/images/index.ts @@ -22,5 +22,5 @@ export const init = () => registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); From 11d835aeb7fa2724fe3ee3776e5c39b774f79d52 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:39:31 -0400 Subject: [PATCH 046/272] Update Edit props type for inventory-email --- .../js/product-editor/src/blocks/inventory-email/edit.tsx | 4 ++-- .../js/product-editor/src/blocks/inventory-email/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/inventory-email/edit.tsx b/packages/js/product-editor/src/blocks/inventory-email/edit.tsx index 8c16acde552..e0d8509196e 100644 --- a/packages/js/product-editor/src/blocks/inventory-email/edit.tsx +++ b/packages/js/product-editor/src/blocks/inventory-email/edit.tsx @@ -11,7 +11,6 @@ import { createInterpolateElement, } from '@wordpress/element'; import { getSetting } from '@woocommerce/settings'; -import { BlockEditProps } from '@wordpress/blocks'; import { useInstanceId } from '@wordpress/compose'; import { BaseControl, @@ -28,11 +27,12 @@ import { useEntityProp } from '@wordpress/core-data'; */ import { useValidation } from '../../contexts/validation-context'; import { InventoryEmailBlockAttributes } from './types'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, clientId, -}: BlockEditProps< InventoryEmailBlockAttributes > ) { +}: ProductEditorBlockEditProps< InventoryEmailBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const notifyLowStockAmount = getSetting( 'notifyLowStockAmount', 2 ); diff --git a/packages/js/product-editor/src/blocks/inventory-email/index.ts b/packages/js/product-editor/src/blocks/inventory-email/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/inventory-email/index.ts +++ b/packages/js/product-editor/src/blocks/inventory-email/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From db0c738b12a6330b7e0e80fcf33867f07e4444db Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:39:43 -0400 Subject: [PATCH 047/272] Update Edit props type for inventory-quantity --- .../js/product-editor/src/blocks/inventory-quantity/edit.tsx | 4 ++-- .../js/product-editor/src/blocks/inventory-quantity/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/inventory-quantity/edit.tsx b/packages/js/product-editor/src/blocks/inventory-quantity/edit.tsx index 8f3e81bee31..5bde0357e3a 100644 --- a/packages/js/product-editor/src/blocks/inventory-quantity/edit.tsx +++ b/packages/js/product-editor/src/blocks/inventory-quantity/edit.tsx @@ -3,7 +3,6 @@ */ import { useWooBlockProps } from '@woocommerce/block-templates'; import { Product } from '@woocommerce/data'; -import { BlockEditProps } from '@wordpress/blocks'; import { useInstanceId } from '@wordpress/compose'; import { useEntityProp } from '@wordpress/core-data'; import { createElement, useEffect } from '@wordpress/element'; @@ -19,11 +18,12 @@ import { */ import { TrackInventoryBlockAttributes } from './types'; import { useValidation } from '../../contexts/validation-context'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, clientId, -}: BlockEditProps< TrackInventoryBlockAttributes > ) { +}: ProductEditorBlockEditProps< TrackInventoryBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const [ manageStock ] = useEntityProp< boolean >( diff --git a/packages/js/product-editor/src/blocks/inventory-quantity/index.ts b/packages/js/product-editor/src/blocks/inventory-quantity/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/inventory-quantity/index.ts +++ b/packages/js/product-editor/src/blocks/inventory-quantity/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 120efa302247393bd12c7886e2ca68434b1ceba5 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:39:55 -0400 Subject: [PATCH 048/272] Update Edit props type for inventory-sku --- .../product-editor/src/blocks/inventory-sku/edit.tsx | 11 +++++++++-- .../product-editor/src/blocks/inventory-sku/index.ts | 6 +++++- 2 files changed, 14 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/inventory-sku/edit.tsx b/packages/js/product-editor/src/blocks/inventory-sku/edit.tsx index 0ac680df75d..7c23713785f 100644 --- a/packages/js/product-editor/src/blocks/inventory-sku/edit.tsx +++ b/packages/js/product-editor/src/blocks/inventory-sku/edit.tsx @@ -2,7 +2,7 @@ * External dependencies */ import { __ } from '@wordpress/i18n'; -import { BlockEditProps, BlockAttributes } from '@wordpress/blocks'; +import { BlockAttributes } from '@wordpress/blocks'; import { createElement, createInterpolateElement } from '@wordpress/element'; import { useWooBlockProps } from '@woocommerce/block-templates'; @@ -19,8 +19,15 @@ import { useEntityProp } from '@wordpress/core-data'; /** * Internal dependencies */ +import { ProductEditorBlockEditProps } from '../../types'; -export function Edit( { attributes }: BlockEditProps< BlockAttributes > ) { +/** + * Internal dependencies + */ + +export function Edit( { + attributes, +}: ProductEditorBlockEditProps< BlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const [ sku, setSku ] = useEntityProp( 'postType', 'product', 'sku' ); diff --git a/packages/js/product-editor/src/blocks/inventory-sku/index.ts b/packages/js/product-editor/src/blocks/inventory-sku/index.ts index 23131cd2074..d670004d84d 100644 --- a/packages/js/product-editor/src/blocks/inventory-sku/index.ts +++ b/packages/js/product-editor/src/blocks/inventory-sku/index.ts @@ -19,4 +19,8 @@ export const settings = { }; export const init = () => - registerWooBlockType( { name, metadata: metadata as never, settings } ); + registerWooBlockType( { + name, + metadata: metadata as never, + settings: settings as never, + } ); From 2f116896727d9e5c120378f8d016c1e359f538c1 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:40:02 -0400 Subject: [PATCH 049/272] Update Edit props type for name --- packages/js/product-editor/src/blocks/name/edit.tsx | 6 ++++-- packages/js/product-editor/src/blocks/name/index.ts | 2 +- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/name/edit.tsx b/packages/js/product-editor/src/blocks/name/edit.tsx index ac5ff97cb6e..a05d08ac8c7 100644 --- a/packages/js/product-editor/src/blocks/name/edit.tsx +++ b/packages/js/product-editor/src/blocks/name/edit.tsx @@ -9,7 +9,6 @@ import { useState, } from '@wordpress/element'; -import { BlockEditProps } from '@wordpress/blocks'; import { useInstanceId } from '@wordpress/compose'; import { cleanForSlug } from '@wordpress/url'; import { useSelect, useDispatch } from '@wordpress/data'; @@ -39,8 +38,11 @@ import { EditProductLinkModal } from '../../components/edit-product-link-modal'; import { useValidation } from '../../contexts/validation-context'; import { NameBlockAttributes } from './types'; import { useProductEdits } from '../../hooks/use-product-edits'; +import { ProductEditorBlockEditProps } from '../../types'; -export function Edit( { attributes }: BlockEditProps< NameBlockAttributes > ) { +export function Edit( { + attributes, +}: ProductEditorBlockEditProps< NameBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { editEntityRecord, saveEntityRecord } = useDispatch( 'core' ); diff --git a/packages/js/product-editor/src/blocks/name/index.ts b/packages/js/product-editor/src/blocks/name/index.ts index 37f321821db..5322eeb221e 100644 --- a/packages/js/product-editor/src/blocks/name/index.ts +++ b/packages/js/product-editor/src/blocks/name/index.ts @@ -22,5 +22,5 @@ export const init = () => registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); From 33e350d3d21e86d5e8bcdce6157c2ec073c77df5 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:40:10 -0400 Subject: [PATCH 050/272] Update Edit props type for notice --- packages/js/product-editor/src/blocks/notice/edit.tsx | 5 +++-- packages/js/product-editor/src/blocks/notice/index.ts | 6 +++++- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/notice/edit.tsx b/packages/js/product-editor/src/blocks/notice/edit.tsx index 61be266772b..0583bb5eae5 100644 --- a/packages/js/product-editor/src/blocks/notice/edit.tsx +++ b/packages/js/product-editor/src/blocks/notice/edit.tsx @@ -2,7 +2,7 @@ * External dependencies */ import { createElement } from '@wordpress/element'; -import type { BlockAttributes, BlockEditProps } from '@wordpress/blocks'; +import type { BlockAttributes } from '@wordpress/blocks'; import { Button } from '@wordpress/components'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { getNewPath, navigateTo } from '@woocommerce/navigation'; @@ -14,6 +14,7 @@ import { useEntityProp } from '@wordpress/core-data'; */ import { Notice } from '../../components/notice'; import { hasAttributesUsedForVariations } from '../../utils'; +import { ProductEditorBlockEditProps } from '../../types'; export interface NoticeBlockAttributes extends BlockAttributes { buttonText: string; @@ -24,7 +25,7 @@ export interface NoticeBlockAttributes extends BlockAttributes { export function Edit( { attributes, -}: BlockEditProps< NoticeBlockAttributes > ) { +}: ProductEditorBlockEditProps< NoticeBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { buttonText, content, title, type = 'info' } = attributes; diff --git a/packages/js/product-editor/src/blocks/notice/index.ts b/packages/js/product-editor/src/blocks/notice/index.ts index 98bcf30bafb..9e11ca076a8 100644 --- a/packages/js/product-editor/src/blocks/notice/index.ts +++ b/packages/js/product-editor/src/blocks/notice/index.ts @@ -16,5 +16,9 @@ export { metadata, name }; export const settings = { example: {}, edit: Edit }; export function init() { - registerWooBlockType( { name, metadata: metadata as never, settings } ); + registerWooBlockType( { + name, + metadata: metadata as never, + settings: settings as never, + } ); } From b56ced02c8f405313ca67ce0ee6e79c418ff44ab Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:40:19 -0400 Subject: [PATCH 051/272] Update Edit props type for password --- packages/js/product-editor/src/blocks/password/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/password/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/password/edit.tsx b/packages/js/product-editor/src/blocks/password/edit.tsx index 7fdcd717175..6f35b2cab50 100644 --- a/packages/js/product-editor/src/blocks/password/edit.tsx +++ b/packages/js/product-editor/src/blocks/password/edit.tsx @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockEditProps } from '@wordpress/blocks'; import { useInstanceId } from '@wordpress/compose'; import { useEntityProp } from '@wordpress/core-data'; import { createElement, useState } from '@wordpress/element'; @@ -19,10 +18,11 @@ import { */ import { RequirePasswordBlockAttributes } from './types'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, -}: BlockEditProps< RequirePasswordBlockAttributes > ) { +}: ProductEditorBlockEditProps< RequirePasswordBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { label } = attributes; diff --git a/packages/js/product-editor/src/blocks/password/index.ts b/packages/js/product-editor/src/blocks/password/index.ts index d384267be7e..d36ff2b8fc6 100644 --- a/packages/js/product-editor/src/blocks/password/index.ts +++ b/packages/js/product-editor/src/blocks/password/index.ts @@ -21,6 +21,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 5be0716466c336fda6c9fde29929dc7db7e780cb Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:40:26 -0400 Subject: [PATCH 052/272] Update Edit props type for pricing --- packages/js/product-editor/src/blocks/pricing/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/pricing/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/pricing/edit.tsx b/packages/js/product-editor/src/blocks/pricing/edit.tsx index 366a7370d41..b698159ea94 100644 --- a/packages/js/product-editor/src/blocks/pricing/edit.tsx +++ b/packages/js/product-editor/src/blocks/pricing/edit.tsx @@ -5,7 +5,6 @@ import { useWooBlockProps } from '@woocommerce/block-templates'; import { Link } from '@woocommerce/components'; import { getNewPath } from '@woocommerce/navigation'; import { recordEvent } from '@woocommerce/tracks'; -import { BlockEditProps } from '@wordpress/blocks'; import { useInstanceId } from '@wordpress/compose'; import { useEntityProp } from '@wordpress/core-data'; import { createElement, createInterpolateElement } from '@wordpress/element'; @@ -21,10 +20,11 @@ import { */ import { useCurrencyInputProps } from '../../hooks/use-currency-input-props'; import { PricingBlockAttributes } from './types'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, -}: BlockEditProps< PricingBlockAttributes > ) { +}: ProductEditorBlockEditProps< PricingBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { name, label, help } = attributes; const [ price, setPrice ] = useEntityProp< string >( diff --git a/packages/js/product-editor/src/blocks/pricing/index.ts b/packages/js/product-editor/src/blocks/pricing/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/pricing/index.ts +++ b/packages/js/product-editor/src/blocks/pricing/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 0ad7126f5f537239b1e3c0d2c0c0dd1c440facaa Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:40:34 -0400 Subject: [PATCH 053/272] Update Edit props type for radio --- packages/js/product-editor/src/blocks/radio/edit.tsx | 6 ++++-- packages/js/product-editor/src/blocks/radio/index.ts | 2 +- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/radio/edit.tsx b/packages/js/product-editor/src/blocks/radio/edit.tsx index b8ba2c2506d..f592dd26b1e 100644 --- a/packages/js/product-editor/src/blocks/radio/edit.tsx +++ b/packages/js/product-editor/src/blocks/radio/edit.tsx @@ -2,7 +2,6 @@ * External dependencies */ import { createElement } from '@wordpress/element'; -import { BlockEditProps } from '@wordpress/blocks'; import { useEntityProp } from '@wordpress/core-data'; import { useWooBlockProps } from '@woocommerce/block-templates'; @@ -11,8 +10,11 @@ import { useWooBlockProps } from '@woocommerce/block-templates'; */ import { RadioField } from '../../components/radio-field'; import { RadioBlockAttributes } from './types'; +import { ProductEditorBlockEditProps } from '../../types'; -export function Edit( { attributes }: BlockEditProps< RadioBlockAttributes > ) { +export function Edit( { + attributes, +}: ProductEditorBlockEditProps< RadioBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { description, options, property, title } = attributes; const [ value, setValue ] = useEntityProp< string >( diff --git a/packages/js/product-editor/src/blocks/radio/index.ts b/packages/js/product-editor/src/blocks/radio/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/radio/index.ts +++ b/packages/js/product-editor/src/blocks/radio/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 020a91e3fde183c0b6b5a75f040ebc65f5b0741e Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:40:43 -0400 Subject: [PATCH 054/272] Update Edit props type for regular-price --- packages/js/product-editor/src/blocks/regular-price/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/regular-price/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/regular-price/edit.tsx b/packages/js/product-editor/src/blocks/regular-price/edit.tsx index 78655a8335b..3d6de8ee260 100644 --- a/packages/js/product-editor/src/blocks/regular-price/edit.tsx +++ b/packages/js/product-editor/src/blocks/regular-price/edit.tsx @@ -7,7 +7,6 @@ import { Link } from '@woocommerce/components'; import { Product } from '@woocommerce/data'; import { getNewPath } from '@woocommerce/navigation'; import { recordEvent } from '@woocommerce/tracks'; -import { BlockEditProps } from '@wordpress/blocks'; import { useInstanceId } from '@wordpress/compose'; import { useEntityProp } from '@wordpress/core-data'; import { createElement, createInterpolateElement } from '@wordpress/element'; @@ -24,11 +23,12 @@ import { import { useValidation } from '../../contexts/validation-context'; import { useCurrencyInputProps } from '../../hooks/use-currency-input-props'; import { SalePriceBlockAttributes } from './types'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, clientId, -}: BlockEditProps< SalePriceBlockAttributes > ) { +}: ProductEditorBlockEditProps< SalePriceBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { label, help } = attributes; const [ regularPrice, setRegularPrice ] = useEntityProp< string >( diff --git a/packages/js/product-editor/src/blocks/regular-price/index.ts b/packages/js/product-editor/src/blocks/regular-price/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/regular-price/index.ts +++ b/packages/js/product-editor/src/blocks/regular-price/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 0c4782a238d65a2e2b29719fb66bdff7cb9582ec Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:40:52 -0400 Subject: [PATCH 055/272] Update Edit props type for sale price --- packages/js/product-editor/src/blocks/sale-price/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/sale-price/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/sale-price/edit.tsx b/packages/js/product-editor/src/blocks/sale-price/edit.tsx index 27d9f064091..9019fd00383 100644 --- a/packages/js/product-editor/src/blocks/sale-price/edit.tsx +++ b/packages/js/product-editor/src/blocks/sale-price/edit.tsx @@ -4,7 +4,6 @@ import classNames from 'classnames'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { Product } from '@woocommerce/data'; -import { BlockEditProps } from '@wordpress/blocks'; import { useInstanceId } from '@wordpress/compose'; import { useEntityProp } from '@wordpress/core-data'; import { createElement } from '@wordpress/element'; @@ -21,11 +20,12 @@ import { import { useValidation } from '../../contexts/validation-context'; import { useCurrencyInputProps } from '../../hooks/use-currency-input-props'; import { SalePriceBlockAttributes } from './types'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, clientId, -}: BlockEditProps< SalePriceBlockAttributes > ) { +}: ProductEditorBlockEditProps< SalePriceBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { label, help } = attributes; const [ regularPrice ] = useEntityProp< string >( diff --git a/packages/js/product-editor/src/blocks/sale-price/index.ts b/packages/js/product-editor/src/blocks/sale-price/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/sale-price/index.ts +++ b/packages/js/product-editor/src/blocks/sale-price/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From de7bb63183dc33cb493f9a09dd12de9ca101556c Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:41:01 -0400 Subject: [PATCH 056/272] Update Edit props type for schedule-sale --- packages/js/product-editor/src/blocks/schedule-sale/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/schedule-sale/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/schedule-sale/edit.tsx b/packages/js/product-editor/src/blocks/schedule-sale/edit.tsx index daa587f855e..24e749343d0 100644 --- a/packages/js/product-editor/src/blocks/schedule-sale/edit.tsx +++ b/packages/js/product-editor/src/blocks/schedule-sale/edit.tsx @@ -5,7 +5,6 @@ import { useWooBlockProps } from '@woocommerce/block-templates'; import { DateTimePickerControl } from '@woocommerce/components'; import { Product } from '@woocommerce/data'; import { recordEvent } from '@woocommerce/tracks'; -import { BlockEditProps } from '@wordpress/blocks'; import { ToggleControl } from '@wordpress/components'; import { useEntityProp } from '@wordpress/core-data'; import { createElement, useEffect, useState } from '@wordpress/element'; @@ -22,11 +21,12 @@ import { getSettings } from '@wordpress/date'; import { ScheduleSalePricingBlockAttributes } from './types'; import { useProductEdits } from '../../hooks/use-product-edits'; import { useValidation } from '../../contexts/validation-context'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, clientId, -}: BlockEditProps< ScheduleSalePricingBlockAttributes > ) { +}: ProductEditorBlockEditProps< ScheduleSalePricingBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { hasEdit } = useProductEdits(); diff --git a/packages/js/product-editor/src/blocks/schedule-sale/index.ts b/packages/js/product-editor/src/blocks/schedule-sale/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/schedule-sale/index.ts +++ b/packages/js/product-editor/src/blocks/schedule-sale/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From d0f02fe0d476c91f00b8ed0209a06af985348590 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:41:09 -0400 Subject: [PATCH 057/272] Update Edit props type for section --- packages/js/product-editor/src/blocks/section/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/section/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/section/edit.tsx b/packages/js/product-editor/src/blocks/section/edit.tsx index 3f18c455e4f..638f9a0851d 100644 --- a/packages/js/product-editor/src/blocks/section/edit.tsx +++ b/packages/js/product-editor/src/blocks/section/edit.tsx @@ -3,7 +3,6 @@ */ import classNames from 'classnames'; import { createElement } from '@wordpress/element'; -import type { BlockEditProps } from '@wordpress/blocks'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { // @ts-expect-error no exported member. @@ -15,10 +14,11 @@ import { */ import { sanitizeHTML } from '../../utils/sanitize-html'; import { SectionBlockAttributes } from './types'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, -}: BlockEditProps< SectionBlockAttributes > ) { +}: ProductEditorBlockEditProps< SectionBlockAttributes > ) { const { description, title, blockGap } = attributes; const blockProps = useWooBlockProps( attributes ); const innerBlockProps = useInnerBlocksProps( diff --git a/packages/js/product-editor/src/blocks/section/index.ts b/packages/js/product-editor/src/blocks/section/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/section/index.ts +++ b/packages/js/product-editor/src/blocks/section/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From db1f257895eeb8352b1bcde416d2d0e05dfba827 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:41:18 -0400 Subject: [PATCH 058/272] Update Edit props type for shipping-class --- packages/js/product-editor/src/blocks/shipping-class/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/shipping-class/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/shipping-class/edit.tsx b/packages/js/product-editor/src/blocks/shipping-class/edit.tsx index 8575360178c..39601c37e0e 100644 --- a/packages/js/product-editor/src/blocks/shipping-class/edit.tsx +++ b/packages/js/product-editor/src/blocks/shipping-class/edit.tsx @@ -1,7 +1,6 @@ /** * External dependencies */ -import { BlockEditProps } from '@wordpress/blocks'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { Link } from '@woocommerce/components'; import { @@ -29,6 +28,7 @@ import { useEntityProp } from '@wordpress/core-data'; import { ShippingClassBlockAttributes } from './types'; import { AddNewShippingClassModal } from '../../components'; import { ADD_NEW_SHIPPING_CLASS_OPTION_VALUE } from '../../constants'; +import { ProductEditorBlockEditProps } from '../../types'; type ServerErrorResponse = { code: string; @@ -71,7 +71,7 @@ function extractDefaultShippingClassFromProduct( export function Edit( { attributes, -}: BlockEditProps< ShippingClassBlockAttributes > ) { +}: ProductEditorBlockEditProps< ShippingClassBlockAttributes > ) { const [ showShippingClassModal, setShowShippingClassModal ] = useState( false ); diff --git a/packages/js/product-editor/src/blocks/shipping-class/index.ts b/packages/js/product-editor/src/blocks/shipping-class/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/shipping-class/index.ts +++ b/packages/js/product-editor/src/blocks/shipping-class/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 2c0117183ea8ee3e4f973ff6013d10b1a55c7844 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:41:27 -0400 Subject: [PATCH 059/272] Update Edit props type for shipping-dimensions --- .../js/product-editor/src/blocks/shipping-dimensions/edit.tsx | 4 ++-- .../js/product-editor/src/blocks/shipping-dimensions/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/shipping-dimensions/edit.tsx b/packages/js/product-editor/src/blocks/shipping-dimensions/edit.tsx index 0938e223813..7bff746c2a4 100644 --- a/packages/js/product-editor/src/blocks/shipping-dimensions/edit.tsx +++ b/packages/js/product-editor/src/blocks/shipping-dimensions/edit.tsx @@ -2,7 +2,6 @@ * External dependencies */ import { useWooBlockProps } from '@woocommerce/block-templates'; -import { BlockEditProps } from '@wordpress/blocks'; import { OPTIONS_STORE_NAME, Product, @@ -34,11 +33,12 @@ import { ShippingDimensionsImage, } from '../../components/shipping-dimensions-image'; import { useValidation } from '../../contexts/validation-context'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, clientId, -}: BlockEditProps< ShippingDimensionsBlockAttributes > ) { +}: ProductEditorBlockEditProps< ShippingDimensionsBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const [ dimensions, setDimensions ] = diff --git a/packages/js/product-editor/src/blocks/shipping-dimensions/index.ts b/packages/js/product-editor/src/blocks/shipping-dimensions/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/shipping-dimensions/index.ts +++ b/packages/js/product-editor/src/blocks/shipping-dimensions/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From abe02a4d6c8f3777ad09d690807f0c7b3bf3ef02 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:41:35 -0400 Subject: [PATCH 060/272] Update Edit props type for summary --- packages/js/product-editor/src/blocks/summary/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/summary/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/summary/edit.tsx b/packages/js/product-editor/src/blocks/summary/edit.tsx index bc72958de1b..9c174e57024 100644 --- a/packages/js/product-editor/src/blocks/summary/edit.tsx +++ b/packages/js/product-editor/src/blocks/summary/edit.tsx @@ -4,7 +4,6 @@ import { __ } from '@wordpress/i18n'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { createElement } from '@wordpress/element'; -import { BlockEditProps } from '@wordpress/blocks'; import { BaseControl } from '@wordpress/components'; import { useDispatch } from '@wordpress/data'; import { useEntityProp } from '@wordpress/core-data'; @@ -25,11 +24,12 @@ import { import { ParagraphRTLControl } from './paragraph-rtl-control'; import { SummaryAttributes } from './types'; import { ALIGNMENT_CONTROLS } from './constants'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, setAttributes, -}: BlockEditProps< SummaryAttributes > ) { +}: ProductEditorBlockEditProps< SummaryAttributes > ) { const { align, allowedFormats, direction, label } = attributes; const blockProps = useWooBlockProps( attributes, { style: { direction }, diff --git a/packages/js/product-editor/src/blocks/summary/index.ts b/packages/js/product-editor/src/blocks/summary/index.ts index 7801d49c280..55180b8de9d 100644 --- a/packages/js/product-editor/src/blocks/summary/index.ts +++ b/packages/js/product-editor/src/blocks/summary/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From f781940c27468078bb09617052cdffc2a580de00 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:41:58 -0400 Subject: [PATCH 061/272] Update Edit props type for taxonomy --- packages/js/product-editor/src/blocks/taxonomy/edit.tsx | 5 ++--- packages/js/product-editor/src/blocks/taxonomy/index.ts | 2 +- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/packages/js/product-editor/src/blocks/taxonomy/edit.tsx b/packages/js/product-editor/src/blocks/taxonomy/edit.tsx index 33e3a1fe570..6c4e590cad1 100644 --- a/packages/js/product-editor/src/blocks/taxonomy/edit.tsx +++ b/packages/js/product-editor/src/blocks/taxonomy/edit.tsx @@ -22,6 +22,7 @@ import { useSelect } from '@wordpress/data'; import { CreateTaxonomyModal } from './create-taxonomy-modal'; import { Taxonomy, TaxonomyMetadata } from './types'; import useTaxonomySearch from './use-taxonomy-search'; +import { ProductEditorBlockEditProps } from '../../types'; interface TaxonomyBlockAttributes extends BlockAttributes { label: string; @@ -34,9 +35,7 @@ interface TaxonomyBlockAttributes extends BlockAttributes { export function Edit( { attributes, -}: { - attributes: TaxonomyBlockAttributes; -} ) { +}: ProductEditorBlockEditProps< TaxonomyBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { hierarchical }: TaxonomyMetadata = useSelect( ( select ) => diff --git a/packages/js/product-editor/src/blocks/taxonomy/index.ts b/packages/js/product-editor/src/blocks/taxonomy/index.ts index 37f321821db..5322eeb221e 100644 --- a/packages/js/product-editor/src/blocks/taxonomy/index.ts +++ b/packages/js/product-editor/src/blocks/taxonomy/index.ts @@ -22,5 +22,5 @@ export const init = () => registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); From 1d21956def7d4446a325d47311dca22f55e6593f Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:42:05 -0400 Subject: [PATCH 062/272] Update Edit props type for toggle --- packages/js/product-editor/src/blocks/toggle/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/toggle/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/toggle/edit.tsx b/packages/js/product-editor/src/blocks/toggle/edit.tsx index 6b9a46dddb5..ab6a5474121 100644 --- a/packages/js/product-editor/src/blocks/toggle/edit.tsx +++ b/packages/js/product-editor/src/blocks/toggle/edit.tsx @@ -2,7 +2,6 @@ * External dependencies */ import { createElement } from '@wordpress/element'; -import { BlockEditProps } from '@wordpress/blocks'; import { useEntityProp } from '@wordpress/core-data'; import { ToggleControl } from '@wordpress/components'; import { useWooBlockProps } from '@woocommerce/block-templates'; @@ -12,10 +11,11 @@ import { useWooBlockProps } from '@woocommerce/block-templates'; */ import { ToggleBlockAttributes } from './types'; import { sanitizeHTML } from '../../utils/sanitize-html'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, -}: BlockEditProps< ToggleBlockAttributes > ) { +}: ProductEditorBlockEditProps< ToggleBlockAttributes > ) { const blockProps = useWooBlockProps( attributes ); const { label, property, disabled, disabledCopy } = attributes; const [ value, setValue ] = useEntityProp< boolean >( diff --git a/packages/js/product-editor/src/blocks/toggle/index.ts b/packages/js/product-editor/src/blocks/toggle/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/toggle/index.ts +++ b/packages/js/product-editor/src/blocks/toggle/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 99839030e9867246e32a30b3b1e30c0ce509d907 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:42:15 -0400 Subject: [PATCH 063/272] Update Edit props type for variation-options --- .../js/product-editor/src/blocks/variation-options/edit.tsx | 5 +++-- .../js/product-editor/src/blocks/variation-options/index.ts | 2 +- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/variation-options/edit.tsx b/packages/js/product-editor/src/blocks/variation-options/edit.tsx index f6aa0586da6..49de0799c70 100644 --- a/packages/js/product-editor/src/blocks/variation-options/edit.tsx +++ b/packages/js/product-editor/src/blocks/variation-options/edit.tsx @@ -2,7 +2,7 @@ * External dependencies */ import { __ } from '@wordpress/i18n'; -import { BlockEditProps, BlockAttributes } from '@wordpress/blocks'; +import { BlockAttributes } from '@wordpress/blocks'; import { createElement, createInterpolateElement, @@ -26,10 +26,11 @@ import { useEntityProp, useEntityId } from '@wordpress/core-data'; import { useProductAttributes } from '../../hooks/use-product-attributes'; import { AttributeControl } from '../../components/attribute-control'; import { useProductVariationsHelper } from '../../hooks/use-product-variations-helper'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes: blockAttributes, -}: BlockEditProps< BlockAttributes > ) { +}: ProductEditorBlockEditProps< BlockAttributes > ) { const blockProps = useWooBlockProps( blockAttributes ); const { generateProductVariations } = useProductVariationsHelper(); const { diff --git a/packages/js/product-editor/src/blocks/variation-options/index.ts b/packages/js/product-editor/src/blocks/variation-options/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/variation-options/index.ts +++ b/packages/js/product-editor/src/blocks/variation-options/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 435e24c58ca49b37085048098ca5245e66545814 Mon Sep 17 00:00:00 2001 From: Matt Sherman Date: Wed, 27 Sep 2023 23:42:29 -0400 Subject: [PATCH 064/272] Update Edit props type for variations --- packages/js/product-editor/src/blocks/variations/edit.tsx | 4 ++-- packages/js/product-editor/src/blocks/variations/index.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/js/product-editor/src/blocks/variations/edit.tsx b/packages/js/product-editor/src/blocks/variations/edit.tsx index 0ffaa045f6b..70a86e68644 100644 --- a/packages/js/product-editor/src/blocks/variations/edit.tsx +++ b/packages/js/product-editor/src/blocks/variations/edit.tsx @@ -2,7 +2,6 @@ * External dependencies */ import classNames from 'classnames'; -import type { BlockEditProps } from '@wordpress/blocks'; import { Button } from '@wordpress/components'; import { useWooBlockProps } from '@woocommerce/block-templates'; import { Product, ProductAttribute } from '@woocommerce/data'; @@ -33,10 +32,11 @@ import { getAttributeId } from '../../components/attribute-control/utils'; import { useProductVariationsHelper } from '../../hooks/use-product-variations-helper'; import { hasAttributesUsedForVariations } from '../../utils'; import { TRACKS_SOURCE } from '../../constants'; +import { ProductEditorBlockEditProps } from '../../types'; export function Edit( { attributes, -}: BlockEditProps< VariationsBlockAttributes > ) { +}: ProductEditorBlockEditProps< VariationsBlockAttributes > ) { const { description } = attributes; const { generateProductVariations } = useProductVariationsHelper(); diff --git a/packages/js/product-editor/src/blocks/variations/index.ts b/packages/js/product-editor/src/blocks/variations/index.ts index cd9e326744d..7829fccedb9 100644 --- a/packages/js/product-editor/src/blocks/variations/index.ts +++ b/packages/js/product-editor/src/blocks/variations/index.ts @@ -22,6 +22,6 @@ export function init() { return registerWooBlockType( { name, metadata: metadata as never, - settings, + settings: settings as never, } ); } From 96532b8fcff924cb915a2714e6e55598925466d3 Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 16:06:30 +0100 Subject: [PATCH 065/272] Move extensions search into functions, and add fetchJsonWithCache wrapper --- .../components/extensions/extensions.tsx | 51 +++--------- .../client/marketplace/utils/functions.tsx | 78 ++++++++++++++++--- 2 files changed, 79 insertions(+), 50 deletions(-) diff --git a/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx b/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx index 182ed93ad01..54225221ba6 100644 --- a/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx @@ -15,7 +15,7 @@ import ProductListContent from '../product-list-content/product-list-content'; import ProductLoader from '../product-loader/product-loader'; import NoResults from '../product-list-content/no-results'; import { Product, SearchAPIProductType } from '../product-list/types'; -import { MARKETPLACE_SEARCH_API_PATH, MARKETPLACE_HOST } from '../constants'; +import { fetchSearchResults } from '../../utils/functions'; import { getAdminSetting } from '../../../utils/admin-settings'; export default function Extensions(): JSX.Element { @@ -44,46 +44,15 @@ export default function Extensions(): JSX.Element { params.append( 'country', wccomSettings.storeCountry ); } - const wccomSearchEndpoint = - MARKETPLACE_HOST + - MARKETPLACE_SEARCH_API_PATH + - '?' + - params.toString(); - - // Fetch data from WCCOM API - fetch( wccomSearchEndpoint ) - .then( ( response ) => response.json() ) - .then( ( response ) => { - /** - * Product card component expects a Product type. - * So we build that object from the API response. - */ - const products = response.products.map( - ( product: SearchAPIProductType ): Product => { - return { - id: product.id, - title: product.title, - description: product.excerpt, - vendorName: product.vendor_name, - vendorUrl: product.vendor_url, - icon: product.icon, - url: product.link, - // Due to backwards compatibility, raw_price is from search API, price is from featured API - price: product.raw_price ?? product.price, - averageRating: product.rating ?? 0, - reviewsCount: product.reviews_count ?? 0, - }; - } - ); - - setProductList( products ); - } ) - .catch( () => { - setProductList( [] ); - } ) - .finally( () => { - setIsLoading( false ); - } ); + fetchSearchResults( params ).then( ( products ) => { + setProductList( products ); + } ) + .catch( () => { + setProductList( [] ); + } ) + .finally( () => { + setIsLoading( false ); + } ); }, [ query ] ); const products = productList.slice( 0, 60 ); diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index e46aca433f2..bd5db32ae43 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -6,10 +6,11 @@ import apiFetch from '@wordpress/api-fetch'; /** * Internal dependencies */ -import { Product } from '../components/product-list/types'; +import { Product, SearchAPIProductType } from '../components/product-list/types'; import { MARKETPLACE_HOST, MARKETPLACE_CATEGORY_API_PATH, + MARKETPLACE_SEARCH_API_PATH, } from '../components/constants'; import { CategoryAPIItem } from '../components/category-selector/types'; import { LOCALE } from '../../utils/admin-settings'; @@ -21,6 +22,71 @@ interface ProductGroup { url: string; } +// Wrapper around fetch() that caches results in memory +const fetchCache: { [ url: string ]: Object } = {}; +async function fetchJsonWithCache( url: string ): Promise< any > { + // Attempt to fetch from cache: + if ( fetchCache[ url ] ) { + return new Promise( ( resolve ) => { resolve( fetchCache[ url ] ) } ); + } + + // Failing that, fetch from net: + return new Promise( ( resolve, reject ) => { + fetch( url ).then( ( response ) => { + if ( ! response.ok ) { + throw new Error( response.statusText ); + } + return response.json(); + } ) + .then( ( json ) => { + fetchCache[ url ] = json; + resolve( json ); + } ) + .catch( () => { + reject(); + } ); + } ); +} + +// Fetch search results for a given set of URLSearchParams from the WooCommerce.com API +async function fetchSearchResults( params: URLSearchParams ): Promise< Product[] > { + const url = + MARKETPLACE_HOST + + MARKETPLACE_SEARCH_API_PATH + + '?' + + params.toString(); + + // Fetch data from WCCOM API + return new Promise( ( resolve, reject ) => { + fetchJsonWithCache( url ) + .then( ( json ) => { + /** + * Product card component expects a Product type. + * So we build that object from the API response. + */ + const products = json.products.map( + ( product: SearchAPIProductType ): Product => { + return { + id: product.id, + title: product.title, + description: product.excerpt, + vendorName: product.vendor_name, + vendorUrl: product.vendor_url, + icon: product.icon, + url: product.link, + // Due to backwards compatibility, raw_price is from search API, price is from featured API + price: product.raw_price ?? product.price, + averageRating: product.rating ?? 0, + reviewsCount: product.reviews_count ?? 0, + }; + } + ); + resolve( products ); + } ) + .catch( () => reject ); + } ); +} + // Fetch data for the discover page from the WooCommerce.com API async function fetchDiscoverPageData(): Promise< ProductGroup[] > { let url = '/wc/v3/marketplace/featured'; @@ -43,14 +109,7 @@ function fetchCategories(): Promise< CategoryAPIItem[] > { url = `${ url }?locale=${ LOCALE.userLocale }`; } - return fetch( url.toString() ) - .then( ( response ) => { - if ( ! response.ok ) { - throw new Error( response.statusText ); - } - - return response.json(); - } ) + return fetchJsonWithCache( url.toString() ) .then( ( json ) => { return json; } ) @@ -75,6 +134,7 @@ const appendURLParams = ( }; export { + fetchSearchResults, fetchDiscoverPageData, fetchCategories, ProductGroup, From 1252324ee2043a8d6eb4e2c0fc547a0d94afd1a5 Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 16:09:18 +0100 Subject: [PATCH 066/272] Better indentation --- .../components/extensions/extensions.tsx | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx b/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx index 54225221ba6..aecb17013bb 100644 --- a/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx @@ -44,15 +44,16 @@ export default function Extensions(): JSX.Element { params.append( 'country', wccomSettings.storeCountry ); } - fetchSearchResults( params ).then( ( products ) => { - setProductList( products ); - } ) - .catch( () => { - setProductList( [] ); - } ) - .finally( () => { - setIsLoading( false ); - } ); + fetchSearchResults( params ) + .then( ( products ) => { + setProductList( products ); + } ) + .catch( () => { + setProductList( [] ); + } ) + .finally( () => { + setIsLoading( false ); + } ); }, [ query ] ); const products = productList.slice( 0, 60 ); From b050266d618aa93bdef3142258b60a6a554ce8ab Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 16:09:37 +0100 Subject: [PATCH 067/272] Better linefeeds --- .../client/marketplace/utils/functions.tsx | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index bd5db32ae43..43fb1a571b8 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -6,7 +6,10 @@ import apiFetch from '@wordpress/api-fetch'; /** * Internal dependencies */ -import { Product, SearchAPIProductType } from '../components/product-list/types'; +import { + Product, + SearchAPIProductType, +} from '../components/product-list/types'; import { MARKETPLACE_HOST, MARKETPLACE_CATEGORY_API_PATH, @@ -27,7 +30,9 @@ const fetchCache: { [ url: string ]: Object } = {}; async function fetchJsonWithCache( url: string ): Promise< any > { // Attempt to fetch from cache: if ( fetchCache[ url ] ) { - return new Promise( ( resolve ) => { resolve( fetchCache[ url ] ) } ); + return new Promise( ( resolve ) => { + resolve( fetchCache[ url ] ); + } ); } // Failing that, fetch from net: @@ -49,7 +54,9 @@ async function fetchJsonWithCache( url: string ): Promise< any > { } // Fetch search results for a given set of URLSearchParams from the WooCommerce.com API -async function fetchSearchResults( params: URLSearchParams ): Promise< Product[] > { +async function fetchSearchResults( + params: URLSearchParams +): Promise< Product[] > { const url = MARKETPLACE_HOST + MARKETPLACE_SEARCH_API_PATH + From 6ffdda2ff7f33bb1c20aa7b1c51e4c1b3019f6a7 Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 16:09:44 +0100 Subject: [PATCH 068/272] Better indentation --- .../client/marketplace/utils/functions.tsx | 27 ++++++++++--------- 1 file changed, 14 insertions(+), 13 deletions(-) diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index 43fb1a571b8..2726de50e05 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -37,19 +37,20 @@ async function fetchJsonWithCache( url: string ): Promise< any > { // Failing that, fetch from net: return new Promise( ( resolve, reject ) => { - fetch( url ).then( ( response ) => { - if ( ! response.ok ) { - throw new Error( response.statusText ); - } - return response.json(); - } ) - .then( ( json ) => { - fetchCache[ url ] = json; - resolve( json ); - } ) - .catch( () => { - reject(); - } ); + fetch( url ) + .then( ( response ) => { + if ( ! response.ok ) { + throw new Error( response.statusText ); + } + return response.json(); + } ) + .then( ( json ) => { + fetchCache[ url ] = json; + resolve( json ); + } ) + .catch( () => { + reject(); + } ); } ); } From 5442ccd0656dc1e20db45e22b5ba5cd259aeb6d3 Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 16:10:51 +0100 Subject: [PATCH 069/272] Appease linter --- .../woocommerce-admin/client/marketplace/utils/functions.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index 2726de50e05..573600fe7e1 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -26,7 +26,7 @@ interface ProductGroup { } // Wrapper around fetch() that caches results in memory -const fetchCache: { [ url: string ]: Object } = {}; +const fetchCache: { [ url: string ]: object } = {}; async function fetchJsonWithCache( url: string ): Promise< any > { // Attempt to fetch from cache: if ( fetchCache[ url ] ) { From d4f54bfeb80bad28fe00114d06807c806c3acc27 Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 16:11:13 +0100 Subject: [PATCH 070/272] Remove unused type --- .../client/marketplace/components/extensions/extensions.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx b/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx index aecb17013bb..4f3f8a8c0c2 100644 --- a/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/components/extensions/extensions.tsx @@ -14,7 +14,7 @@ import { MarketplaceContext } from '../../contexts/marketplace-context'; import ProductListContent from '../product-list-content/product-list-content'; import ProductLoader from '../product-loader/product-loader'; import NoResults from '../product-list-content/no-results'; -import { Product, SearchAPIProductType } from '../product-list/types'; +import { Product } from '../product-list/types'; import { fetchSearchResults } from '../../utils/functions'; import { getAdminSetting } from '../../../utils/admin-settings'; From 1c1f36c7d0dc2d55bb1d133b97e8aa6e16d2951c Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 16:11:38 +0100 Subject: [PATCH 071/272] Happier TS types --- .../woocommerce-admin/client/marketplace/utils/functions.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index 573600fe7e1..a00c3718c18 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -27,7 +27,7 @@ interface ProductGroup { // Wrapper around fetch() that caches results in memory const fetchCache: { [ url: string ]: object } = {}; -async function fetchJsonWithCache( url: string ): Promise< any > { +async function fetchJsonWithCache( url: string ): Promise< object > { // Attempt to fetch from cache: if ( fetchCache[ url ] ) { return new Promise( ( resolve ) => { From f90dde0b069c7b65ba7f4820c1da9f2528f146ae Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 17:05:51 +0100 Subject: [PATCH 072/272] Add fetchCache pruning --- .../components/product-list/types.ts | 4 +++ .../client/marketplace/utils/functions.tsx | 26 ++++++++++++++----- 2 files changed, 24 insertions(+), 6 deletions(-) diff --git a/plugins/woocommerce-admin/client/marketplace/components/product-list/types.ts b/plugins/woocommerce-admin/client/marketplace/components/product-list/types.ts index dd29e3686a6..5b5b14ee9ff 100644 --- a/plugins/woocommerce-admin/client/marketplace/components/product-list/types.ts +++ b/plugins/woocommerce-admin/client/marketplace/components/product-list/types.ts @@ -1,3 +1,7 @@ +export type SearchAPIJSONType = { + products: Array; +} + export type SearchAPIProductType = { title: string; image: string; diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index a00c3718c18..558e41211dc 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -9,6 +9,7 @@ import apiFetch from '@wordpress/api-fetch'; import { Product, SearchAPIProductType, + SearchAPIJSONType, } from '../components/product-list/types'; import { MARKETPLACE_HOST, @@ -25,13 +26,25 @@ interface ProductGroup { url: string; } +// The fetchCache stores the results of GET fetch/apiFetch calls from the Marketplace, in RAM, for performance +const maxFetchCacheSize = 100; +const fetchCache = new Map(); + +function maybePruneFetchCache() { + console.log(fetchCache.size); + while ( fetchCache.size > maxFetchCacheSize ) { + console.log('pruning!'); + fetchCache.delete( fetchCache.keys().next().value ); + } + console.log(fetchCache.size); +} + // Wrapper around fetch() that caches results in memory -const fetchCache: { [ url: string ]: object } = {}; -async function fetchJsonWithCache( url: string ): Promise< object > { +async function fetchJsonWithCache( url: string ): Promise< any > { // Attempt to fetch from cache: - if ( fetchCache[ url ] ) { + if ( fetchCache.get( url ) ) { return new Promise( ( resolve ) => { - resolve( fetchCache[ url ] ); + resolve( fetchCache.get( url ) ); } ); } @@ -45,7 +58,8 @@ async function fetchJsonWithCache( url: string ): Promise< object > { return response.json(); } ) .then( ( json ) => { - fetchCache[ url ] = json; + fetchCache.set( url, json ); + maybePruneFetchCache(); resolve( json ); } ) .catch( () => { @@ -72,7 +86,7 @@ async function fetchSearchResults( * Product card component expects a Product type. * So we build that object from the API response. */ - const products = json.products.map( + const products = (json as SearchAPIJSONType).products.map( ( product: SearchAPIProductType ): Product => { return { id: product.id, From b70d60414ab03b6bd9fa5d1139fa2b8bb2d7d41d Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 17:10:10 +0100 Subject: [PATCH 073/272] Remove debug code --- plugins/woocommerce-admin/client/marketplace/utils/functions.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index 558e41211dc..a9058a8b19b 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -33,7 +33,6 @@ const fetchCache = new Map(); function maybePruneFetchCache() { console.log(fetchCache.size); while ( fetchCache.size > maxFetchCacheSize ) { - console.log('pruning!'); fetchCache.delete( fetchCache.keys().next().value ); } console.log(fetchCache.size); From 47422705227a47610c4fef759f62491e08a6adf3 Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 17:10:22 +0100 Subject: [PATCH 074/272] Remove debug code --- plugins/woocommerce-admin/client/marketplace/utils/functions.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index a9058a8b19b..4a5109900a4 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -31,7 +31,6 @@ const maxFetchCacheSize = 100; const fetchCache = new Map(); function maybePruneFetchCache() { - console.log(fetchCache.size); while ( fetchCache.size > maxFetchCacheSize ) { fetchCache.delete( fetchCache.keys().next().value ); } From 68d9fcff03ebf33bca223b18069f65ef67018d6c Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 17:11:57 +0100 Subject: [PATCH 075/272] Remove debug code --- plugins/woocommerce-admin/client/marketplace/utils/functions.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index 4a5109900a4..ea4f5cc75dc 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -34,7 +34,6 @@ function maybePruneFetchCache() { while ( fetchCache.size > maxFetchCacheSize ) { fetchCache.delete( fetchCache.keys().next().value ); } - console.log(fetchCache.size); } // Wrapper around fetch() that caches results in memory From 5e34eb4c7860e3bd80daa8f39f357176ed6ff5a8 Mon Sep 17 00:00:00 2001 From: Dan Q Date: Thu, 28 Sep 2023 17:14:02 +0100 Subject: [PATCH 076/272] Enable apiFetch to use cache too --- .../client/marketplace/utils/functions.tsx | 26 ++++++++++++++++++- 1 file changed, 25 insertions(+), 1 deletion(-) diff --git a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx index ea4f5cc75dc..63a5032b37a 100644 --- a/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx +++ b/plugins/woocommerce-admin/client/marketplace/utils/functions.tsx @@ -36,6 +36,30 @@ function maybePruneFetchCache() { } } +// Wrapper around apiFetch() that caches results in memory +async function apiFetchWithCache( params: any ): Promise< any > { + // Attempt to fetch from cache: + const cacheKey = JSON.stringify( params ); + if ( fetchCache.get( cacheKey ) ) { + return new Promise( ( resolve ) => { + resolve( fetchCache.get( cacheKey ) ); + } ); + } + + // Failing that, fetch using apiCache: + return new Promise( ( resolve, reject ) => { + apiFetch( params ) + .then( ( json ) => { + fetchCache.set( cacheKey, json ); + maybePruneFetchCache(); + resolve( json ); + } ) + .catch( () => { + reject(); + } ); + } ); +} + // Wrapper around fetch() that caches results in memory async function fetchJsonWithCache( url: string ): Promise< any > { // Attempt to fetch from cache: @@ -115,7 +139,7 @@ async function fetchDiscoverPageData(): Promise< ProductGroup[] > { } try { - return await apiFetch( { path: url.toString() } ); + return await apiFetchWithCache( { path: url.toString() } ); } catch ( error ) { return []; } From 86a535a224e379649497e5177674664b0cfd1f61 Mon Sep 17 00:00:00 2001 From: Fernando Marichal Date: Thu, 28 Sep 2023 15:22:23 -0300 Subject: [PATCH 077/272] Fix field label styling in the edit attribute modal (#40449) * Add prop readOnlyWhenClosed * Add changelog --- .../changelog/dev-40203_edit_attribute_modal_styles | 4 ++++ .../src/components/attribute-control/edit-attribute-modal.tsx | 1 + .../attribute-term-input-field/attribute-term-input-field.tsx | 3 +++ 3 files changed, 8 insertions(+) create mode 100644 packages/js/product-editor/changelog/dev-40203_edit_attribute_modal_styles diff --git a/packages/js/product-editor/changelog/dev-40203_edit_attribute_modal_styles b/packages/js/product-editor/changelog/dev-40203_edit_attribute_modal_styles new file mode 100644 index 00000000000..40ed406ffd1 --- /dev/null +++ b/packages/js/product-editor/changelog/dev-40203_edit_attribute_modal_styles @@ -0,0 +1,4 @@ +Significance: minor +Type: dev + +Fix field label styling in the edit attribute modal #40449 diff --git a/packages/js/product-editor/src/components/attribute-control/edit-attribute-modal.tsx b/packages/js/product-editor/src/components/attribute-control/edit-attribute-modal.tsx index 6e774430d43..27f4d8f2c64 100644 --- a/packages/js/product-editor/src/components/attribute-control/edit-attribute-modal.tsx +++ b/packages/js/product-editor/src/components/attribute-control/edit-attribute-modal.tsx @@ -124,6 +124,7 @@ export const EditAttributeModal: React.FC< EditAttributeModalProps > = ( { terms: val, } ); } } + readOnlyWhenClosed={ false } /> ) : ( { const attributeTermInputId = useRef( `woocommerce-attribute-term-field-${ ++uniqueId }` @@ -266,6 +268,7 @@ export const AttributeTermInputField: React.FC< selected={ value } onSelect={ onSelect } onRemove={ onRemove } + readOnlyWhenClosed={ readOnlyWhenClosed } className={ 'woocommerce-attribute-term-field ' + attributeTermInputId.current From fd6ac01fcd614cc78050eb7e528daa5e6c8b0c1c Mon Sep 17 00:00:00 2001 From: Fernando Marichal Date: Thu, 28 Sep 2023 15:38:42 -0300 Subject: [PATCH 078/272] Improve copy in variation management notifications (#40467) * Add method `getSnackbarText` * Add single variation update/delete * Add changelog * Refactor method `getSnackbarText` * Improve code --- ...opy_for_variation_management_notifications | 4 + .../variations-table/variations-table.tsx | 73 +++++++++++++------ 2 files changed, 53 insertions(+), 24 deletions(-) create mode 100644 packages/js/product-editor/changelog/dev-40245_improve_copy_for_variation_management_notifications diff --git a/packages/js/product-editor/changelog/dev-40245_improve_copy_for_variation_management_notifications b/packages/js/product-editor/changelog/dev-40245_improve_copy_for_variation_management_notifications new file mode 100644 index 00000000000..8b2580e948c --- /dev/null +++ b/packages/js/product-editor/changelog/dev-40245_improve_copy_for_variation_management_notifications @@ -0,0 +1,4 @@ +Significance: minor +Type: dev + +Improve copy in variation management notifications #40467 diff --git a/packages/js/product-editor/src/components/variations-table/variations-table.tsx b/packages/js/product-editor/src/components/variations-table/variations-table.tsx index f46f5c7594c..976590d9e17 100644 --- a/packages/js/product-editor/src/components/variations-table/variations-table.tsx +++ b/packages/js/product-editor/src/components/variations-table/variations-table.tsx @@ -75,6 +75,11 @@ type VariationsTableProps = { ) => void; }; +type VariationResponseProps = { + update?: Partial< ProductVariation >[]; + delete?: Partial< ProductVariation >[]; +}; + export const VariationsTable = forwardRef< HTMLDivElement, VariationsTableProps @@ -192,6 +197,40 @@ export const VariationsTable = forwardRef< const variationIds = variations.map( ( { id } ) => id ); + function getSnackbarText( + response: VariationResponseProps | ProductVariation, + type?: string + ): string { + if ( 'id' in response ) { + const action = type === 'update' ? 'updated' : 'deleted'; + return sprintf( + /* translators: The deleted or updated variations count */ + __( '1 variation %s.', 'woocommerce' ), + action + ); + } + + const { update = [], delete: deleted = [] } = response; + const updatedCount = update.length; + const deletedCount = deleted.length; + + if ( deletedCount > 0 ) { + return sprintf( + /* translators: The deleted variations count */ + __( '%s variations deleted.', 'woocommerce' ), + deletedCount + ); + } else if ( updatedCount > 0 ) { + return sprintf( + /* translators: The updated variations count */ + __( '%s variations updated.', 'woocommerce' ), + updatedCount + ); + } + + return ''; + } + function handleDeleteVariationClick( variationId: number ) { if ( isUpdating[ variationId ] ) return; setIsUpdating( ( prevState ) => ( { @@ -202,10 +241,11 @@ export const VariationsTable = forwardRef< product_id: productId, id: variationId, } ) - .then( () => { + .then( ( response: ProductVariation ) => { recordEvent( 'product_variations_delete', { source: TRACKS_SOURCE, } ); + createSuccessNotice( getSnackbarText( response, 'delete' ) ); invalidateResolution( 'getProductVariations', [ requestParams, ] ); @@ -232,11 +272,8 @@ export const VariationsTable = forwardRef< { product_id: productId, id: variationId }, variation ) - .then( () => { - createSuccessNotice( - /* translators: The updated variations count */ - sprintf( __( '%s variation/s updated.', 'woocommerce' ), 1 ) - ); + .then( ( response: ProductVariation ) => { + createSuccessNotice( getSnackbarText( response, 'update' ) ); } ) .catch( () => { createErrorNotice( @@ -257,19 +294,13 @@ export const VariationsTable = forwardRef< { product_id: productId }, { update } ) - .then( ( response ) => + .then( ( response: VariationResponseProps ) => invalidateResolution( 'getProductVariations', [ requestParams, ] ).then( () => response ) ) - .then( ( response ) => { - createSuccessNotice( - sprintf( - /* translators: The updated variations count */ - __( '%s variation/s updated.', 'woocommerce' ), - response.update.length - ) - ); + .then( ( response: VariationResponseProps ) => { + createSuccessNotice( getSnackbarText( response ) ); onVariationTableChange( 'update', update ); } ) .catch( () => { @@ -286,19 +317,13 @@ export const VariationsTable = forwardRef< delete: values.map( ( { id } ) => id ), } ) - .then( ( response ) => + .then( ( response: VariationResponseProps ) => invalidateResolution( 'getProductVariations', [ requestParams, ] ).then( () => response ) ) - .then( ( response ) => { - createSuccessNotice( - sprintf( - /* translators: The updated variations count */ - __( '%s variation/s updated.', 'woocommerce' ), - response.delete.length - ) - ); + .then( ( response: VariationResponseProps ) => { + createSuccessNotice( getSnackbarText( response ) ); onVariationTableChange( 'delete' ); } ) .catch( () => { From 2ed9eadaeb7665f92dc3885217a6f8e5d86b34e8 Mon Sep 17 00:00:00 2001 From: Nathan Silveira Date: Thu, 28 Sep 2023 15:40:50 -0300 Subject: [PATCH 079/272] Create initial version of Product Editor Development Handbook (#40309) * Add markdown for testing * Revert "Add markdown for testing" This reverts commit 63a9fc9f441b97db15bb9ee40c46c38033f2e235. * Add new folder with block product editor docs * Iterate over the documentation * Iterate over documentation * Add screenshot * Iterate over doc * Iterate over documentation * Iterate over documentation * Add sample comment * Rename folder * Add FAQ and comments * More changes * Remove unused README * Iterate over documentation * Implement lint changes * Implement lint changes * Add changelog * Remove placeholder readmes * Remove stale references * Remove _media folder and add images to developer.woocommerce.com * Remove placeholder docs * Improve wording for 'non-standard applications' * Convert example to new template API hook * Fix snippet * Iterate over code review suggestions * Replace product editor structure image * Update image reference * Increment example in common-tasks * Update add a field next to an existing one sample --- docs/product-editor-development/README.md | 18 ++++++++++ .../common-tasks.md | 34 +++++++++++++++++++ 2 files changed, 52 insertions(+) create mode 100644 docs/product-editor-development/README.md create mode 100644 docs/product-editor-development/common-tasks.md diff --git a/docs/product-editor-development/README.md b/docs/product-editor-development/README.md new file mode 100644 index 00000000000..ef66a11de0f --- /dev/null +++ b/docs/product-editor-development/README.md @@ -0,0 +1,18 @@ +# Developing extensions for the product editor + +> ⚠️ **Notice:** This documentation is currently a **work in progress**. Please be aware that some sections might be incomplete or subject to change. We appreciate your patience and welcome any contributions! + +This handbook is a guide for extension developers looking to add support for the new product editor in their extensions. The product editor uses [Gutenberg's Block Editor](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-editor), which is going to help WooCommerce evolve alongside the WordPress ecosystem. + +The product editor's UI consists of Groups (currently rendered as tabs), Sections, and Fields, which are all blocks. + +![Product editor structure](https://woocommerce.files.wordpress.com/2023/09/groups-sections-fields.jpg) + +The form's structure is defined in PHP using a Template. The template can be modified by using the Block Template API to add new Groups, Sections, and Fields as well as remove existing ones. + +Many extensibility implementations can be done using only the PHP-based Block Template API. More complex interactivity can be implemented using JavaScript and React (the same library used to implement the core blocks used in the product editor). [@woocommerce/create-product-editor-block](../../packages/js/create-product-editor-block/README.md) can help scaffold a development environment with JavaScript and React. + + +## Index + +- [Common tasks](common-tasks.md) diff --git a/docs/product-editor-development/common-tasks.md b/docs/product-editor-development/common-tasks.md new file mode 100644 index 00000000000..f283a70c685 --- /dev/null +++ b/docs/product-editor-development/common-tasks.md @@ -0,0 +1,34 @@ +# Common tasks + +> ⚠️ **Notice:** This documentation is currently a **work in progress**. Please be aware that some sections might be incomplete or subject to change. We appreciate your patience and welcome any contributions! + +## Adding a group/section/field next to an existing one + +Here's a snippet that adds a new block to the catalog section, between the first and second fields (order 15): + +```php +use Automattic\WooCommerce\Admin\BlockTemplates\BlockInterface; + +if ( ! function_exists( 'YOUR_PREFIX_add_block_after_categories' ) ) { + /** + * Add a new block to the template. + */ + function YOUR_PREFIX_add_block_after_categories( BlockInterface $product_categories_field ) { + $product_categories_field->get_parent()->add_block( + [ + 'id' => 'your-prefix-id', + 'blockName' => 'woocommerce/product-checkbox-field', + 'order' => $product_categories_field->get_order() + 5, + 'attributes' => [ + 'label' => 'Your Checkbox', + 'property' => 'your_checkbox_bool_property', + ], + ] + ); + } +} +add_action( 'woocommerce_block_template_area_product-form_after_add_block_product-categories', 'YOUR_PREFIX_add_block_after_categories' ); +``` + +Result: +![Adding field next to other field](https://woocommerce.files.wordpress.com/2023/09/adding-field-next-to-other-field.png) From ec61afd38739ae045124f6b91cc43ecbb2c9c256 Mon Sep 17 00:00:00 2001 From: Fernando Marichal Date: Thu, 28 Sep 2023 15:49:11 -0300 Subject: [PATCH 080/272] Remove "Feeling Stuck" tooltip (#40397) * Remove "Feeling Stuck" tooltip * Add changelog --- .../client/activity-panel/activity-panel.js | 4 - .../add-product-feedback-tour.tsx | 114 ------------------ .../dev-40130_remove_feeling_stuck_tooltip | 4 + 3 files changed, 4 insertions(+), 118 deletions(-) delete mode 100644 plugins/woocommerce-admin/client/guided-tours/add-product-feedback-tour.tsx create mode 100644 plugins/woocommerce/changelog/dev-40130_remove_feeling_stuck_tooltip diff --git a/plugins/woocommerce-admin/client/activity-panel/activity-panel.js b/plugins/woocommerce-admin/client/activity-panel/activity-panel.js index 2b275810c9d..a3ecf8cef0a 100644 --- a/plugins/woocommerce-admin/client/activity-panel/activity-panel.js +++ b/plugins/woocommerce-admin/client/activity-panel/activity-panel.js @@ -46,7 +46,6 @@ import { getUrlParams } from '~/utils'; import { useActiveSetupTasklist } from '~/task-lists'; import { getSegmentsFromPath } from '~/utils/url-helpers'; import { FeedbackIcon } from '~/products/images/feedback-icon'; -import { ProductFeedbackTour } from '~/guided-tours/add-product-feedback-tour'; const HelpPanel = lazy( () => import( /* webpackChunkName: "activity-panels-help" */ './panels/help' ) @@ -482,9 +481,6 @@ export const ActivityPanel = ( { isEmbedded, query } ) => { clearPanel={ () => clearPanel() } /> - { isAddProductPage() && ( - - ) } { showHelpHighlightTooltip ? ( { - const { hasShownTour } = useSelect( ( select ) => { - const { getOption } = select( OPTIONS_STORE_NAME ); - - return { - hasShownTour: getOption( FEEDBACK_TOUR_OPTION ) as - | boolean - | undefined, - }; - } ); - - return hasShownTour; -}; - -type ProductFeedbackTourProps = { - currentTab: string; -}; - -export const ProductFeedbackTour: React.FC< ProductFeedbackTourProps > = ( { - currentTab, -} ) => { - const hasShownTour = useShowProductFeedbackTour(); - const [ isTourVisible, setIsTourVisible ] = useState( false ); - const tourTimeout = useRef< ReturnType< typeof setTimeout > | null >( - null - ); - const { updateOptions } = useDispatch( OPTIONS_STORE_NAME ); - - const clearTourTimeout = () => { - clearTimeout( tourTimeout.current as ReturnType< typeof setTimeout > ); - tourTimeout.current = null; - }; - - useEffect( () => { - if ( hasShownTour !== false ) { - return; - } - - tourTimeout.current = setTimeout( () => { - setIsTourVisible( true ); - }, FEEDBACK_TIMEOUT_MS ); - - return () => clearTourTimeout(); - }, [ hasShownTour ] ); - - useEffect( () => { - if ( ! isTourVisible ) { - return; - } - updateOptions( { - [ FEEDBACK_TOUR_OPTION ]: true, - } ); - }, [ isTourVisible ] ); - - if ( - currentTab === 'feedback' && - ( isTourVisible || tourTimeout.current ) - ) { - setIsTourVisible( false ); - clearTourTimeout(); - } - - if ( ! isTourVisible ) { - return null; - } - - return ( - { - setIsTourVisible( false ); - }, - } } - /> - ); -}; diff --git a/plugins/woocommerce/changelog/dev-40130_remove_feeling_stuck_tooltip b/plugins/woocommerce/changelog/dev-40130_remove_feeling_stuck_tooltip new file mode 100644 index 00000000000..c1499e51e2a --- /dev/null +++ b/plugins/woocommerce/changelog/dev-40130_remove_feeling_stuck_tooltip @@ -0,0 +1,4 @@ +Significance: minor +Type: dev + +Remove "Feeling Stuck" tooltip #40397 From 57529230ca2f396c6e5dbc5f0378ecf394061d19 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Maikel=20David=20P=C3=A9rez=20G=C3=B3mez?= Date: Thu, 28 Sep 2023 15:13:03 -0400 Subject: [PATCH 081/272] Font sizes differ between chips used in the variations options table and variations list (#40447) * Fix font sizes difference between chips used in the variations options table and variations list * Add changelog file * Fix unit test --- .../js/product-editor/changelog/fix-40202 | 4 ++++ .../test/attribute-field.spec.tsx | 1 + .../attribute-list-item.scss | 14 -------------- .../attribute-list-item.tsx | 19 +++++++------------ 4 files changed, 12 insertions(+), 26 deletions(-) create mode 100644 packages/js/product-editor/changelog/fix-40202 diff --git a/packages/js/product-editor/changelog/fix-40202 b/packages/js/product-editor/changelog/fix-40202 new file mode 100644 index 00000000000..51036430cf4 --- /dev/null +++ b/packages/js/product-editor/changelog/fix-40202 @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Fix font sizes difference between chips used in the variations options table and variations list diff --git a/packages/js/product-editor/src/components/attribute-control/test/attribute-field.spec.tsx b/packages/js/product-editor/src/components/attribute-control/test/attribute-field.spec.tsx index 56f131f853a..13ba918b3f3 100644 --- a/packages/js/product-editor/src/components/attribute-control/test/attribute-field.spec.tsx +++ b/packages/js/product-editor/src/components/attribute-control/test/attribute-field.spec.tsx @@ -79,6 +79,7 @@ jest.mock( '@woocommerce/components', () => ( { __esModule: true, __experimentalSelectControlMenuSlot: () =>
, ListItem: ( { children }: { children: JSX.Element } ) => children, + Tag: ( { label }: { label: string } ) => { label }, Sortable: ( { onOrderChange, children, diff --git a/packages/js/product-editor/src/components/attribute-list-item/attribute-list-item.scss b/packages/js/product-editor/src/components/attribute-list-item/attribute-list-item.scss index bc06bef3f0d..edaeb9c6e24 100644 --- a/packages/js/product-editor/src/components/attribute-list-item/attribute-list-item.scss +++ b/packages/js/product-editor/src/components/attribute-list-item/attribute-list-item.scss @@ -16,20 +16,6 @@ margin-bottom: -1px; } - &__options { - display: flex; - flex-direction: row; - gap: $gap-smallest; - } - - &__option-chip { - padding: $gap-smallest $gap-smaller; - gap: 2px; - - background: $gray-100; - border-radius: 2px; - } - &__actions { display: flex; flex-direction: row; diff --git a/packages/js/product-editor/src/components/attribute-list-item/attribute-list-item.tsx b/packages/js/product-editor/src/components/attribute-list-item/attribute-list-item.tsx index f76e47625a8..32e2c68e030 100644 --- a/packages/js/product-editor/src/components/attribute-list-item/attribute-list-item.tsx +++ b/packages/js/product-editor/src/components/attribute-list-item/attribute-list-item.tsx @@ -2,7 +2,7 @@ * External dependencies */ import { DragEventHandler } from 'react'; -import { ListItem } from '@woocommerce/components'; +import { ListItem, Tag } from '@woocommerce/components'; import { ProductAttribute } from '@woocommerce/data'; import { sprintf, __ } from '@wordpress/i18n'; import { Button, Tooltip } from '@wordpress/components'; @@ -47,24 +47,19 @@ export const AttributeListItem: React.FC< AttributeListItemProps > = ( { onDragEnd={ onDragEnd } >
{ attribute.name }
-
+
{ attribute.options .slice( 0, attribute.options.length > 3 ? 2 : 3 ) - .map( ( option, index ) => ( -
- { option } -
+ .map( ( option ) => ( + ) ) } { attribute.options.length > 3 && ( -
- { sprintf( + + /> ) }
From 1a3ecebc5ee424e19ae69a9b83bc5d607e97193d Mon Sep 17 00:00:00 2001 From: louwie17 Date: Thu, 28 Sep 2023 17:08:19 -0300 Subject: [PATCH 082/272] Fix dropdown css conflict (#40494) Increase specificity of WooCommerce dropdown to avoid overwrites --- packages/js/components/changelog/fix-dropdown-css-conflict | 4 ++++ packages/js/components/src/dropdown-button/style.scss | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) create mode 100644 packages/js/components/changelog/fix-dropdown-css-conflict diff --git a/packages/js/components/changelog/fix-dropdown-css-conflict b/packages/js/components/changelog/fix-dropdown-css-conflict new file mode 100644 index 00000000000..328af18b070 --- /dev/null +++ b/packages/js/components/changelog/fix-dropdown-css-conflict @@ -0,0 +1,4 @@ +Significance: patch +Type: fix + +Add class back in for increase specificity of css for dropdown button. diff --git a/packages/js/components/src/dropdown-button/style.scss b/packages/js/components/src/dropdown-button/style.scss index 3c38e8da238..d265f38c834 100644 --- a/packages/js/components/src/dropdown-button/style.scss +++ b/packages/js/components/src/dropdown-button/style.scss @@ -1,4 +1,4 @@ -.woocommerce-dropdown-button { +.components-button.woocommerce-dropdown-button { background-color: $studio-white; position: relative; border: 1px solid $gray-700; From 73c90bd3b111f05d4f66084a2e758a16f1caa62c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?N=C3=A9stor=20Soriano?= Date: Thu, 28 Sep 2023 23:59:39 +0200 Subject: [PATCH 083/272] Fix: HPOS keeping disabled when the database tables were created via enabling the setting (#40466) * Fix: when the HPOS tables are created, HPOS was always disabled. After the fix HPOS will be disabled only if the creation of the tables fail. Additionally, failure to create the tables will be logged. * Add changelog file --- plugins/woocommerce/changelog/pr-40466 | 4 +++ .../Orders/CustomOrdersTableController.php | 34 ++++++------------- .../DataStores/Orders/DataSynchronizer.php | 12 +++++-- .../src/Internal/Utilities/DatabaseUtil.php | 2 +- 4 files changed, 26 insertions(+), 26 deletions(-) create mode 100644 plugins/woocommerce/changelog/pr-40466 diff --git a/plugins/woocommerce/changelog/pr-40466 b/plugins/woocommerce/changelog/pr-40466 new file mode 100644 index 00000000000..d69361e5ec9 --- /dev/null +++ b/plugins/woocommerce/changelog/pr-40466 @@ -0,0 +1,4 @@ +Significance: patch +Type: tweak + +Fix: HPOS keeping disabled when the database tables were created via enabling the setting \ No newline at end of file diff --git a/plugins/woocommerce/src/Internal/DataStores/Orders/CustomOrdersTableController.php b/plugins/woocommerce/src/Internal/DataStores/Orders/CustomOrdersTableController.php index a184eeb63bc..1d07e24efb3 100644 --- a/plugins/woocommerce/src/Internal/DataStores/Orders/CustomOrdersTableController.php +++ b/plugins/woocommerce/src/Internal/DataStores/Orders/CustomOrdersTableController.php @@ -252,23 +252,6 @@ class CustomOrdersTableController { return $tools_array; } - /** - * Create the custom orders tables in response to the user pressing the tool button. - * - * @param bool $verify_nonce True to perform the nonce verification, false to skip it. - * - * @throws \Exception Can't create the tables. - */ - private function create_custom_orders_tables( bool $verify_nonce = true ) { - // phpcs:ignore WordPress.Security.ValidatedSanitizedInput - if ( $verify_nonce && ( ! isset( $_REQUEST['_wpnonce'] ) || wp_verify_nonce( $_REQUEST['_wpnonce'], 'debug_action' ) === false ) ) { - throw new \Exception( 'Invalid nonce' ); - } - - $this->data_synchronizer->create_database_tables(); - update_option( self::CUSTOM_ORDERS_TABLE_USAGE_ENABLED_OPTION, 'no' ); - } - /** * Delete the custom orders tables and any related options and data in response to the user pressing the tool button. * @@ -371,7 +354,10 @@ class CustomOrdersTableController { } if ( ! $this->data_synchronizer->check_orders_table_exists() ) { - $this->create_custom_orders_tables( false ); + $success = $this->data_synchronizer->create_database_tables(); + if ( ! $success ) { + update_option( self::CUSTOM_ORDERS_TABLE_USAGE_ENABLED_OPTION, 'no' ); + } } } @@ -467,7 +453,7 @@ class CustomOrdersTableController { 'disabled' => $disabled_option, 'desc' => $plugin_incompat_warning, 'desc_at_end' => true, - 'row_class' => self::CUSTOM_ORDERS_TABLE_USAGE_ENABLED_OPTION, + 'row_class' => self::CUSTOM_ORDERS_TABLE_USAGE_ENABLED_OPTION, ); } @@ -501,10 +487,12 @@ class CustomOrdersTableController { wc_get_container()->get( FeaturesController::class )->get_features_page_url() ); - $sync_message[] = wp_kses_data( __( - 'You can switch order data storage only when the posts and orders tables are in sync.', - 'woocommerce' - ) ); + $sync_message[] = wp_kses_data( + __( + 'You can switch order data storage only when the posts and orders tables are in sync.', + 'woocommerce' + ) + ); $sync_message[] = sprintf( '%2$s', diff --git a/plugins/woocommerce/src/Internal/DataStores/Orders/DataSynchronizer.php b/plugins/woocommerce/src/Internal/DataStores/Orders/DataSynchronizer.php index 67cb39fcde9..5d6a383b636 100644 --- a/plugins/woocommerce/src/Internal/DataStores/Orders/DataSynchronizer.php +++ b/plugins/woocommerce/src/Internal/DataStores/Orders/DataSynchronizer.php @@ -175,11 +175,19 @@ class DataSynchronizer implements BatchProcessorInterface { } /** - * Create the custom orders database tables. + * Create the custom orders database tables and log an error if that's not possible. + * + * @return bool True if all the tables were successfully created, false otherwise. */ public function create_database_tables() { $this->database_util->dbdelta( $this->data_store->get_database_schema() ); - $this->check_orders_table_exists(); + $success = $this->check_orders_table_exists(); + if ( ! $success ) { + $missing_tables = $this->database_util->get_missing_tables( $this->data_store->get_database_schema() ); + $missing_tables = implode( ', ', $missing_tables ); + $this->error_logger->error( "HPOS tables are missing in the database and couldn't be created. The missing tables are: $missing_tables" ); + } + return $success; } /** diff --git a/plugins/woocommerce/src/Internal/Utilities/DatabaseUtil.php b/plugins/woocommerce/src/Internal/Utilities/DatabaseUtil.php index f115c90745f..b989c2d78f3 100644 --- a/plugins/woocommerce/src/Internal/Utilities/DatabaseUtil.php +++ b/plugins/woocommerce/src/Internal/Utilities/DatabaseUtil.php @@ -52,7 +52,7 @@ class DatabaseUtil { foreach ( $dbdelta_output as $table_name => $result ) { if ( "Created table $table_name" === $result ) { - $created_tables[] = $table_name; + $created_tables[] = str_replace( '(', '', $table_name ); } } From 4ac861d94c91bfde19cf3135f7dc31fb51d0477d Mon Sep 17 00:00:00 2001 From: Chi-Hsuan Huang Date: Fri, 29 Sep 2023 11:38:25 +0800 Subject: [PATCH 084/272] [Customize your store] Make the frame not navigable for the MVP (#40431) * Make the frame not navigable for the MVP * Add changelog --- .../assembler-hub/auto-block-preview.tsx | 258 ++++++++++-------- .../assembler-hub/block-editor.tsx | 1 + .../update-disable-cys-frame-navigation | 4 + 3 files changed, 142 insertions(+), 121 deletions(-) create mode 100644 plugins/woocommerce/changelog/update-disable-cys-frame-navigation diff --git a/plugins/woocommerce-admin/client/customize-store/assembler-hub/auto-block-preview.tsx b/plugins/woocommerce-admin/client/customize-store/assembler-hub/auto-block-preview.tsx index ad913716e43..1f55a21a95a 100644 --- a/plugins/woocommerce-admin/client/customize-store/assembler-hub/auto-block-preview.tsx +++ b/plugins/woocommerce-admin/client/customize-store/assembler-hub/auto-block-preview.tsx @@ -47,6 +47,7 @@ export type ScaledBlockPreviewProps = { }; additionalStyles: string; onClickNavigationItem: ( event: MouseEvent ) => void; + isNavigable: boolean; }; function ScaledBlockPreview( { @@ -55,6 +56,7 @@ function ScaledBlockPreview( { settings, additionalStyles, onClickNavigationItem, + isNavigable = false, }: ScaledBlockPreviewProps ) { const { setLogoBlock } = useContext( LogoBlockContext ); const [ fontFamilies ] = useGlobalSetting( @@ -77,139 +79,153 @@ function ScaledBlockPreview( { + + ); +} + +function IframeIfReady( props, ref ) { + const isInitialised = useSelect( + ( select ) => + select( blockEditorStore ).getSettings().__internalIsInitialized, + [] + ); + + // We shouldn't render the iframe until the editor settings are initialised. + // The initial settings are needed to get the styles for the srcDoc, which + // cannot be changed after the iframe is mounted. srcDoc is used to to set + // the initial iframe HTML, which is required to avoid a flash of unstyled + // content. + if ( ! isInitialised ) { + return null; + } + + return