fix TS issues

packages/js/product-editor/src/blocks/product-fields/description/components/withFullEditorToolbarButton.tsx

@@ -13,59 +13,64 @@ import { useDispatch } from '@wordpress/data';
  * Internal dependencies
  */
 import { store } from '../../../../store/product-editor-ai';
+import type {
+	DescriptionBlockEditComponent,
+	DescriptionBlockEditProps,
+} from '../types';
 
-/**
- * Internal dependencies
- */
-// import type { ProductEditorBlockEditProps } from '../../../types';
+const wooBlockwithFullEditorToolbarButton =
+	createHigherOrderComponent< DescriptionBlockEditComponent >(
+		( BlockEdit: DescriptionBlockEditComponent ) => {
+			return ( props: DescriptionBlockEditProps ) => {
+				const { openModalEditor } = useDispatch( store );
 
-const wooBlockwithFullEditorToolbarButton = createHigherOrderComponent<
-	Record< string, unknown >
->( ( BlockEdit ) => {
-	return ( props ) => {
-		const { openModalEditor } = useDispatch( store );
+				// Only extend summary field block instances
+				if ( props?.name !== 'woocommerce/product-summary-field' ) {
+					return <BlockEdit { ...props } />;
+				}
 
-		// Only extend summary field block instances
-		if ( props?.name !== 'woocommerce/product-summary-field' ) {
-			return <BlockEdit { ...props } />;
-		}
+				// Only add the `Full editor` button when the block is selected
+				if ( ! props?.isSelected ) {
+					return <BlockEdit { ...props } />;
+				}
 
-		// Only add the `Full editor` button when the block is selected
-		if ( ! props?.isSelected ) {
-			return <BlockEdit { ...props } />;
-		}
+				/*
+				 * Extend the toolbar only to the sumary field block instance
+				 * that has the `woocommerce/product-description-field__content` template block ID.
+				 */
+				if (
+					props?.attributes?._templateBlockId !==
+					'product-description__content'
+				) {
+					return <BlockEdit { ...props } />;
+				}
 
-		/*
-		 * Extend the toolbar only to the sumary field block instance
-		 * that has the `woocommerce/product-description-field__content` template block ID.
-		 */
-		if (
-			props?.attributes?._templateBlockId !==
-			'product-description__content'
-		) {
-			return <BlockEdit { ...props } />;
-		}
+				const blockControlProps = { group: 'other' };
 
-		return (
-			<>
-				<BlockControls group="other">
-					<ToolbarButton
-						label={ __(
-							'Edit Product description',
-							'woocommerce'
-						) }
-						onClick={ () => {
-							recordEvent( 'product_add_description_click' );
-							openModalEditor();
-						} }
-					>
-						{ __( 'Full editor', 'woocommerce' ) }
-					</ToolbarButton>
-				</BlockControls>
-				<BlockEdit { ...props } />
-			</>
-		);
-	};
-}, 'wooBlockwithFullEditorToolbarButton' );
+				return (
+					<>
+						<BlockControls { ...blockControlProps }>
+							<ToolbarButton
+								label={ __(
+									'Edit Product description',
+									'woocommerce'
+								) }
+								onClick={ () => {
+									recordEvent(
+										'product_add_description_click'
+									);
+									openModalEditor();
+								} }
+							>
+								{ __( 'Full editor', 'woocommerce' ) }
+							</ToolbarButton>
+						</BlockControls>
+						<BlockEdit { ...props } />
+					</>
+				);
+			};
+		},
+		'wooBlockwithFullEditorToolbarButton'
+	);
 
 export default wooBlockwithFullEditorToolbarButton;

packages/js/product-editor/src/blocks/product-fields/description/edit.tsx

@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { createElement, useEffect } from '@wordpress/element';
-import { BlockAttributes, BlockInstance, serialize } from '@wordpress/blocks';
+import { BlockInstance, serialize } from '@wordpress/blocks';
 import { useSelect } from '@wordpress/data';
 import { useWooBlockProps } from '@woocommerce/block-templates';
 import { useEntityProp } from '@wordpress/core-data';
@@ -15,9 +15,9 @@ import {
  * Internal dependencies
  */
 import { ContentPreview } from '../../../components/content-preview';
-import { ProductEditorBlockEditProps } from '../../../types';
 import ModalEditorWelcomeGuide from '../../../components/modal-editor-welcome-guide';
 import { store } from '../../../store/product-editor-ui';
+import type { DescriptionBlockEditComponent } from './types';
 
 /**
  * Internal dependencies
@@ -45,7 +45,7 @@ function clearDescriptionIfEmpty( blocks: BlockInstance[] ) {
 
 export function DescriptionBlockEdit( {
 	attributes,
-}: ProductEditorBlockEditProps< BlockAttributes > ) {
+}: DescriptionBlockEditComponent ) {
 	const blockProps = useWooBlockProps( attributes );
 	const [ description, setDescription ] = useEntityProp< string >(
 		'postType',

packages/js/product-editor/src/blocks/product-fields/description/types.ts

@@ -0,0 +1,20 @@
+/**
+ * External dependencies
+ */
+import {
+	// @ts-expect-error no exported member.
+	ComponentType,
+} from '@wordpress/element';
+/**
+ * Internal dependencies
+ */
+import {
+	ProductEditorBlockAttributes,
+	ProductEditorBlockEditProps,
+} from '../../../types';
+
+export type DescriptionBlockEditProps =
+	ProductEditorBlockEditProps< ProductEditorBlockAttributes >;
+
+export type DescriptionBlockEditComponent =
+	ComponentType< DescriptionBlockEditProps >;