diff --git a/plugins/woocommerce-blocks/assets/js/editor-components/feedback-prompt/index.js b/plugins/woocommerce-blocks/assets/js/editor-components/feedback-prompt/index.tsx
similarity index 77%
rename from plugins/woocommerce-blocks/assets/js/editor-components/feedback-prompt/index.js
rename to plugins/woocommerce-blocks/assets/js/editor-components/feedback-prompt/index.tsx
index 5c87e31c31e..ef1b2c0aad4 100644
--- a/plugins/woocommerce-blocks/assets/js/editor-components/feedback-prompt/index.js
+++ b/plugins/woocommerce-blocks/assets/js/editor-components/feedback-prompt/index.tsx
@@ -2,7 +2,6 @@
  * External dependencies
  */
 import { __ } from '@wordpress/i18n';
-import PropTypes from 'prop-types';
 import { Icon, commentContent, external } from '@wordpress/icons';
 import { useEffect, useState } from '@wordpress/element';
 
@@ -10,7 +9,11 @@ import { useEffect, useState } from '@wordpress/element';
  * Internal dependencies
  */
 import './style.scss';
-
+interface FeedbackPromptProps {
+	text: string;
+	title?: string;
+	url?: string;
+}
 /**
  * Component to render a Feedback prompt in the sidebar.
  *
@@ -23,7 +26,7 @@ const FeedbackPrompt = ( {
 	text,
 	title = __( 'Feedback?', 'woo-gutenberg-products-block' ),
 	url = 'https://ideas.woocommerce.com/forums/133476-woocommerce?category_id=384565',
-} ) => {
+}: FeedbackPromptProps ) => {
 	// By returning false we ensure that this component is not entered into the InspectorControls
 	// (which is a slot fill), children array on first render, on the second render when the state
 	// gets updated this component does get put into the InspectorControls children array but as the
@@ -34,33 +37,32 @@ const FeedbackPrompt = ( {
 	}, [] );
 
 	return (
-		isVisible && (
-			<div className="wc-block-feedback-prompt">
-				<Icon icon={ commentContent } />
-				<h2 className="wc-block-feedback-prompt__title">{ title }</h2>
-				<p className="wc-block-feedback-prompt__text">{ text }</p>
-				<a
-					href={ url }
-					className="wc-block-feedback-prompt__link"
-					rel="noreferrer noopener"
-					target="_blank"
-				>
-					{ __(
-						'Give us your feedback.',
-						'woo-gutenberg-products-block'
-					) }
-					<Icon icon={ external } size={ 16 } />
-				</a>
-			</div>
-		)
+		<>
+			{ isVisible && (
+				<div className="wc-block-feedback-prompt">
+					<Icon icon={ commentContent } />
+					<h2 className="wc-block-feedback-prompt__title">
+						{ title }
+					</h2>
+					<p className="wc-block-feedback-prompt__text">{ text }</p>
+					<a
+						href={ url }
+						className="wc-block-feedback-prompt__link"
+						rel="noreferrer noopener"
+						target="_blank"
+					>
+						{ __(
+							'Give us your feedback.',
+							'woo-gutenberg-products-block'
+						) }
+						<Icon icon={ external } size={ 16 } />
+					</a>
+				</div>
+			) }
+		</>
 	);
 };
 
-FeedbackPrompt.propTypes = {
-	text: PropTypes.string,
-	url: PropTypes.string,
-};
-
 export default FeedbackPrompt;
 
 export const CartCheckoutFeedbackPrompt = () => (