diff --git a/packages/components/src/components/read-more/index.js b/packages/components/src/components/read-more/index.ts
similarity index 56%
rename from packages/components/src/components/read-more/index.js
rename to packages/components/src/components/read-more/index.ts
index 178079c1b3b6..d9965d5cdadd 100644
--- a/packages/components/src/components/read-more/index.js
+++ b/packages/components/src/components/read-more/index.ts
@@ -1,4 +1,4 @@
-import ReadMore from './read-more.jsx';
+import ReadMore from './read-more';
 import './read-more.scss';
 
 export default ReadMore;
diff --git a/packages/components/src/components/read-more/read-more.jsx b/packages/components/src/components/read-more/read-more.tsx
similarity index 83%
rename from packages/components/src/components/read-more/read-more.jsx
rename to packages/components/src/components/read-more/read-more.tsx
index 04bda4ef7507..040d8fe8b351 100644
--- a/packages/components/src/components/read-more/read-more.jsx
+++ b/packages/components/src/components/read-more/read-more.tsx
@@ -1,8 +1,16 @@
 import React from 'react';
 import classNames from 'classnames';
-import PropTypes from 'prop-types';
 
-const ReadMore = ({ className, collapse_length, expand_text, openDialog, show_dialog, text }) => {
+type TReadMore = {
+    className?: string;
+    collapse_length: number;
+    expand_text: string;
+    openDialog: () => void;
+    show_dialog?: boolean;
+    text: string;
+};
+
+const ReadMore = ({ className, collapse_length, expand_text, openDialog, show_dialog, text }: TReadMore) => {
     const [content, updateContent] = React.useState('');
     const [is_collapsed, setIsCollapsed] = React.useState(true);
 
@@ -41,14 +49,5 @@ const ReadMore = ({ className, collapse_length, expand_text, openDialog, show_di
         </React.Fragment>
     );
 };
-ReadMore.propTypes = {
-    className: PropTypes.string,
-    collapse_length: PropTypes.number,
-    collapse_text: PropTypes.string,
-    expand_text: PropTypes.string,
-    openDialog: PropTypes.func,
-    show_dialog: PropTypes.bool,
-    text: PropTypes.string,
-};
 
 export default ReadMore;