diff --git a/assets/js/src/newsletters/listings/queue_status.jsx b/assets/js/src/newsletters/listings/queue_status.jsx
index 6ac38106c3..69c0f34708 100644
--- a/assets/js/src/newsletters/listings/queue_status.jsx
+++ b/assets/js/src/newsletters/listings/queue_status.jsx
@@ -3,7 +3,7 @@ import MailPoet from 'mailpoet';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { Link } from 'react-router-dom';
-import APIErrorsNotice from 'notices/api_errors_notice.jsx';
+import APIErrorsNotice from 'notices/api_errors_notice.tsx';
const QueuePropType = PropTypes.shape({
status: PropTypes.string,
diff --git a/assets/js/src/notices/api_errors_notice.jsx b/assets/js/src/notices/api_errors_notice.tsx
similarity index 60%
rename from assets/js/src/notices/api_errors_notice.jsx
rename to assets/js/src/notices/api_errors_notice.tsx
index f014a28e17..036d609353 100644
--- a/assets/js/src/notices/api_errors_notice.jsx
+++ b/assets/js/src/notices/api_errors_notice.tsx
@@ -1,15 +1,18 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import React, { FC } from 'react';
+import PropTypes, { InferProps } from 'prop-types';
import Notice from 'notices/notice.tsx';
-const APIErrorsNotice = ({ errors }) => {
- if (errors.length < 1) return null;
- return {errors.map((err) => {err.message}
)};
-};
-APIErrorsNotice.propTypes = {
+const propTypes = {
errors: PropTypes.arrayOf(PropTypes.shape({
message: PropTypes.string.isRequired,
})).isRequired,
};
+const APIErrorsNotice: FC> = ({ errors }) => {
+ if (errors.length < 1) return null;
+ return {errors.map((err) => {err.message}
)};
+};
+
+APIErrorsNotice.propTypes = propTypes;
+
export default APIErrorsNotice;