Reviews block: Convert editor-block.js to editor-block.tsx and replace propTypes with TypeScript definitions (#44594)

* Convert Reviews Editor code to TypeScript

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

---------

Co-authored-by: github-actions <github-actions@github.com>

plugins/woocommerce-blocks/assets/js/blocks/reviews/attributes.ts

@@ -110,7 +110,7 @@ export default {
 export type ReviewBlockAttributes = BlockAttributes & {
 	editMode: boolean;
 	imageType: string;
-	orderby: string;
+	orderby: 'most-recent' | 'highest-rating' | 'lowest-rating';
 	reviewsOnLoadMore: number;
 	reviewsOnPageLoad: number;
 	showLoadMore: boolean;

plugins/woocommerce-blocks/assets/js/blocks/reviews/editor-block.tsx

@@ -3,31 +3,39 @@
  */
 import { __ } from '@wordpress/i18n';
 import { Component } from '@wordpress/element';
-import PropTypes from 'prop-types';
 import { Disabled } from '@wordpress/components';
 import { getSetting } from '@woocommerce/settings';
-import ErrorPlaceholder from '@woocommerce/editor-components/error-placeholder';
+import ErrorPlaceholder, {
+	ErrorObject,
+} from '@woocommerce/editor-components/error-placeholder';
 import LoadMoreButton from '@woocommerce/base-components/load-more-button';
 import {
 	ReviewList,
 	ReviewSortSelect,
 } from '@woocommerce/base-components/reviews';
+import type { Review } from '@woocommerce/base-components/reviews/types';
 import withReviews from '@woocommerce/base-hocs/with-reviews';
 
+/**
+ * Internal dependencies
+ */
+import { ReviewBlockAttributes } from './attributes';
+
+interface EditorBlockProps {
+	attributes: ReviewBlockAttributes;
+	reviews: Review[];
+	totalReviews: number;
+	error?: ErrorObject;
+	isLoading: boolean;
+	noReviewsPlaceholder: React.ComponentType< {
+		attributes: EditorBlockProps[ 'attributes' ];
+	} >;
+}
+
 /**
  * Block rendered in the editor.
  */
-class EditorBlock extends Component {
-	static propTypes = {
-		/**
-		 * The attributes for this block.
-		 */
-		attributes: PropTypes.object.isRequired,
-		// from withReviews
-		reviews: PropTypes.array,
-		totalReviews: PropTypes.number,
-	};
-
+class EditorBlock extends Component< EditorBlockProps > {
 	render() {
 		const {
 			attributes,
@@ -63,6 +71,7 @@ class EditorBlock extends Component {
 						onChange={ () => null }
 					/>
 				) }
+
 				<ReviewList attributes={ attributes } reviews={ reviews } />
 				{ attributes.showLoadMore && totalReviews > reviews.length && (
 					<LoadMoreButton
@@ -70,6 +79,7 @@ class EditorBlock extends Component {
 							'Load more reviews',
 							'woocommerce'
 						) }
+						onClick={ () => null }
 					/>
 				) }
 			</Disabled>

plugins/woocommerce-blocks/assets/js/blocks/reviews/editor-container-block.tsx

@@ -10,7 +10,7 @@ import { EditorContainerBlockProps } from '@woocommerce/blocks/reviews/types';
 /**
  * Internal dependencies
  */
-import EditorBlock from './editor-block.js';
+import EditorBlock from './editor-block';
 import { getBlockClassName, getSortArgs } from './utils.js';
 
 const EditorContainerBlock = ( {

plugins/woocommerce/changelog/44594-chore-42294-convert-reviews-editor-block-file-to-typescript

@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+Comment: Convert editor-block.js from the Reviews block to editor-block.tsx and replace propTypes with TypeScript definitions.
+