diff --git a/packages/reports/src/Components/Form/CompositeCalendar/side-list.tsx b/packages/reports/src/Components/Form/CompositeCalendar/side-list.tsx
index 465710afbfad..4ff18952c172 100644
--- a/packages/reports/src/Components/Form/CompositeCalendar/side-list.tsx
+++ b/packages/reports/src/Components/Form/CompositeCalendar/side-list.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { toMoment } from '@deriv/shared';
-import ListItem from './list-item.tsx';
+import ListItem from './list-item';
 
 type TItem = {
     value: string;
diff --git a/packages/reports/src/Components/filter-component.jsx b/packages/reports/src/Components/filter-component.tsx
similarity index 80%
rename from packages/reports/src/Components/filter-component.jsx
rename to packages/reports/src/Components/filter-component.tsx
index 316995b171ff..608c1e6de178 100644
--- a/packages/reports/src/Components/filter-component.jsx
+++ b/packages/reports/src/Components/filter-component.tsx
@@ -1,9 +1,24 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 import { FilterDropdown } from '@deriv/components';
 import { localize } from '@deriv/translations';
 import { connect } from 'Stores/connect';
 import CompositeCalendar from './Form/CompositeCalendar';
+import { TRootStore } from 'Stores/index';
+
+type TFilterComponent = {
+    action_type: string;
+    date_from: number;
+    date_to: number;
+    filtered_date_range: {
+        duration: number;
+        label: string;
+        onClick?: () => void;
+        value?: string;
+    };
+    handleDateChange: () => void;
+    handleFilterChange: () => void;
+    suffix_icon: string;
+};
 
 const FilterComponent = ({
     action_type,
@@ -12,7 +27,7 @@ const FilterComponent = ({
     handleFilterChange,
     handleDateChange,
     filtered_date_range,
-}) => {
+}: TFilterComponent) => {
     const filter_list = [
         {
             text: localize('All transactions'),
@@ -58,17 +73,7 @@ const FilterComponent = ({
     );
 };
 
-FilterComponent.propTypes = {
-    action_type: PropTypes.string,
-    date_from: PropTypes.number,
-    date_to: PropTypes.number,
-    filtered_date_range: PropTypes.object,
-    handleDateChange: PropTypes.func,
-    handleFilterChange: PropTypes.func,
-    suffix_icon: PropTypes.string,
-};
-
-export default connect(({ modules }) => ({
+export default connect(({ modules }: TRootStore) => ({
     action_type: modules.statement.action_type,
     data: modules.statement.data,
     date_from: modules.statement.date_from,
diff --git a/packages/reports/src/Containers/statement.jsx b/packages/reports/src/Containers/statement.jsx
index 7d16b06ab0d9..a1539c7a56b5 100644
--- a/packages/reports/src/Containers/statement.jsx
+++ b/packages/reports/src/Containers/statement.jsx
@@ -11,7 +11,7 @@ import { connect } from 'Stores/connect';
 import { getStatementTableColumnsTemplate } from '../Constants/data-table-constants';
 import PlaceholderComponent from '../Components/placeholder-component';
 import AccountStatistics from '../Components/account-statistics';
-import FilterComponent from '../Components/filter-component.jsx';
+import FilterComponent from '../Components/filter-component';
 import { ReportsMeta } from '../Components/reports-meta';
 import EmptyTradeHistoryMessage from '../Components/empty-trade-history-message';