From 1e93e1f687c52cc477246d43d7ce89702502e65a Mon Sep 17 00:00:00 2001 From: Aizad Ridzo Date: Mon, 9 Jan 2023 16:57:22 +0800 Subject: [PATCH 1/5] chore: migrated filter component and fix some issues with composite-calendar --- .../Form/CompositeCalendar/index.js | 4 +-- ...ter-component.jsx => filter-component.tsx} | 25 +++++++++---------- packages/reports/src/Containers/statement.jsx | 2 +- 3 files changed, 14 insertions(+), 17 deletions(-) rename packages/reports/src/Components/{filter-component.jsx => filter-component.tsx} (83%) diff --git a/packages/reports/src/Components/Form/CompositeCalendar/index.js b/packages/reports/src/Components/Form/CompositeCalendar/index.js index b524dbf0caef..d8d748d8a924 100644 --- a/packages/reports/src/Components/Form/CompositeCalendar/index.js +++ b/packages/reports/src/Components/Form/CompositeCalendar/index.js @@ -1,3 +1 @@ -import CalendarIcon from './calendar-icon'; - -export default CalendarIcon; +export default from './composite-calendar.jsx'; diff --git a/packages/reports/src/Components/filter-component.jsx b/packages/reports/src/Components/filter-component.tsx similarity index 83% rename from packages/reports/src/Components/filter-component.jsx rename to packages/reports/src/Components/filter-component.tsx index 316995b171ff..d9e2a763657a 100644 --- a/packages/reports/src/Components/filter-component.jsx +++ b/packages/reports/src/Components/filter-component.tsx @@ -1,10 +1,19 @@ 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'; +type TFilterComponent = { + action_type: string; + date_from: number; + date_to: number; + filtered_date_range: object; + handleDateChange: () => void; + handleFilterChange: () => void; + suffix_icon: string; +}; + const FilterComponent = ({ action_type, date_from, @@ -12,7 +21,7 @@ const FilterComponent = ({ handleFilterChange, handleDateChange, filtered_date_range, -}) => { +}: TFilterComponent) => { const filter_list = [ { text: localize('All transactions'), @@ -58,17 +67,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 }: any) => ({ 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 71ab00441f6e..4bfa9c9cfffd 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.jsx'; import AccountStatistics from '../Components/account-statistics.jsx'; -import FilterComponent from '../Components/filter-component.jsx'; +import FilterComponent from '../Components/filter-component'; import { ReportsMeta } from '../Components/reports-meta.jsx'; import EmptyTradeHistoryMessage from '../Components/empty-trade-history-message.jsx'; From 5cc8a63254b144da72b42731e1eebf4accd04e84 Mon Sep 17 00:00:00 2001 From: aizad-deriv Date: Thu, 26 Jan 2023 11:09:33 +0800 Subject: [PATCH 2/5] fix: change export to CalendarIcon on index.js and added RootStore type to filter-components --- .../reports/src/Components/Form/CompositeCalendar/index.js | 4 ++-- packages/reports/src/Components/filter-component.tsx | 3 ++- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/reports/src/Components/Form/CompositeCalendar/index.js b/packages/reports/src/Components/Form/CompositeCalendar/index.js index 60fbdb343773..b524dbf0caef 100644 --- a/packages/reports/src/Components/Form/CompositeCalendar/index.js +++ b/packages/reports/src/Components/Form/CompositeCalendar/index.js @@ -1,3 +1,3 @@ -import CompositeCalendar from './composite-calendar.jsx'; +import CalendarIcon from './calendar-icon'; -export default CompositeCalendar; +export default CalendarIcon; diff --git a/packages/reports/src/Components/filter-component.tsx b/packages/reports/src/Components/filter-component.tsx index d9e2a763657a..e870fd97c529 100644 --- a/packages/reports/src/Components/filter-component.tsx +++ b/packages/reports/src/Components/filter-component.tsx @@ -3,6 +3,7 @@ import { FilterDropdown } from '@deriv/components'; import { localize } from '@deriv/translations'; import { connect } from 'Stores/connect'; import CompositeCalendar from './Form/CompositeCalendar'; +import { TRootStore } from '../../../stores/types'; type TFilterComponent = { action_type: string; @@ -67,7 +68,7 @@ const FilterComponent = ({ ); }; -export default connect(({ modules }: any) => ({ +export default connect(({ modules }: TRootStore) => ({ action_type: modules.statement.action_type, data: modules.statement.data, date_from: modules.statement.date_from, From 1285ce455c9d162fb54236a091967eafa9359077 Mon Sep 17 00:00:00 2001 From: aizad-deriv Date: Thu, 26 Jan 2023 11:26:43 +0800 Subject: [PATCH 3/5] fix: change TRootStore to RootStore --- packages/reports/src/Components/filter-component.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/reports/src/Components/filter-component.tsx b/packages/reports/src/Components/filter-component.tsx index e870fd97c529..06f7ffa6f8ee 100644 --- a/packages/reports/src/Components/filter-component.tsx +++ b/packages/reports/src/Components/filter-component.tsx @@ -3,7 +3,7 @@ import { FilterDropdown } from '@deriv/components'; import { localize } from '@deriv/translations'; import { connect } from 'Stores/connect'; import CompositeCalendar from './Form/CompositeCalendar'; -import { TRootStore } from '../../../stores/types'; +import RootStore from '../Stores/index'; type TFilterComponent = { action_type: string; @@ -68,7 +68,7 @@ const FilterComponent = ({ ); }; -export default connect(({ modules }: TRootStore) => ({ +export default connect(({ modules }: RootStore) => ({ action_type: modules.statement.action_type, data: modules.statement.data, date_from: modules.statement.date_from, From 540ad3d53b9bc0b4929cbb708c7430ee953a0867 Mon Sep 17 00:00:00 2001 From: aizad-deriv Date: Thu, 26 Jan 2023 18:02:12 +0800 Subject: [PATCH 4/5] fix: replace RootStore to TRootStore --- packages/reports/src/Components/filter-component.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/reports/src/Components/filter-component.tsx b/packages/reports/src/Components/filter-component.tsx index 06f7ffa6f8ee..944bb38b1dde 100644 --- a/packages/reports/src/Components/filter-component.tsx +++ b/packages/reports/src/Components/filter-component.tsx @@ -3,7 +3,7 @@ import { FilterDropdown } from '@deriv/components'; import { localize } from '@deriv/translations'; import { connect } from 'Stores/connect'; import CompositeCalendar from './Form/CompositeCalendar'; -import RootStore from '../Stores/index'; +import { TRootStore } from 'Stores/index'; type TFilterComponent = { action_type: string; @@ -68,7 +68,7 @@ const FilterComponent = ({ ); }; -export default connect(({ modules }: RootStore) => ({ +export default connect(({ modules }: TRootStore) => ({ action_type: modules.statement.action_type, data: modules.statement.data, date_from: modules.statement.date_from, From 208c1a966fcad73b877aa85d880d89a9e205d956 Mon Sep 17 00:00:00 2001 From: aizad-deriv Date: Tue, 31 Jan 2023 15:49:15 +0800 Subject: [PATCH 5/5] fix: expand object for filtered_date_range --- packages/reports/src/Components/filter-component.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/reports/src/Components/filter-component.tsx b/packages/reports/src/Components/filter-component.tsx index 944bb38b1dde..608c1e6de178 100644 --- a/packages/reports/src/Components/filter-component.tsx +++ b/packages/reports/src/Components/filter-component.tsx @@ -9,7 +9,12 @@ type TFilterComponent = { action_type: string; date_from: number; date_to: number; - filtered_date_range: object; + filtered_date_range: { + duration: number; + label: string; + onClick?: () => void; + value?: string; + }; handleDateChange: () => void; handleFilterChange: () => void; suffix_icon: string;