From 6bbb4d49299f5c4719c367ce0f11c45bb29f5f5e Mon Sep 17 00:00:00 2001 From: Jim Daniels Wasswa Date: Tue, 18 Apr 2023 10:02:17 +0800 Subject: [PATCH 1/5] refactor: remove connect from market-countdown-timer --- .../Components/Elements/market-countdown-timer.jsx | 13 ++++++------- 1 file changed, 6 insertions(+), 7 deletions(-) diff --git a/packages/trader/src/App/Components/Elements/market-countdown-timer.jsx b/packages/trader/src/App/Components/Elements/market-countdown-timer.jsx index 21fe0b757be3..833af29df84f 100644 --- a/packages/trader/src/App/Components/Elements/market-countdown-timer.jsx +++ b/packages/trader/src/App/Components/Elements/market-countdown-timer.jsx @@ -5,7 +5,8 @@ import moment from 'moment'; import { Text } from '@deriv/components'; import { useIsMounted, WS, convertTimeFormat, isMarketClosed } from '@deriv/shared'; import { Localize } from '@deriv/translations'; -import { connect } from 'Stores/connect'; +import { observer } from '@deriv/stores'; +import { useTraderStore } from 'Stores/useTraderStores'; // check market in coming 7 days const days_to_check_before_exit = 7; @@ -43,7 +44,8 @@ const calculateTimeLeft = remaining_time_to_open => { : {}; }; -const MarketCountdownTimer = ({ active_symbols, is_main_page, setIsTimerLoading, onMarketOpen, symbol }) => { +const MarketCountdownTimer = observer(({ is_main_page, setIsTimerLoading, onMarketOpen, symbol }) => { + const { active_symbols } = useTraderStore(); const isMounted = useIsMounted(); const [when_market_opens, setWhenMarketOpens] = React.useState({}); const [time_left, setTimeLeft] = React.useState(calculateTimeLeft(when_market_opens?.remaining_time_to_open)); @@ -195,16 +197,13 @@ const MarketCountdownTimer = ({ active_symbols, is_main_page, setIsTimerLoading,
); -}; +}); MarketCountdownTimer.propTypes = { - active_symbols: PropTypes.array, is_main_page: PropTypes.bool, setIsTimerLoading: PropTypes.func, onMarketOpen: PropTypes.func, symbol: PropTypes.string.isRequired, }; -export default connect(({ modules }) => ({ - active_symbols: modules.trade.active_symbols, -}))(MarketCountdownTimer); +export default MarketCountdownTimer; From 7b27e0b6791b4eb00a8ed7d6be49528a105a31c4 Mon Sep 17 00:00:00 2001 From: Jim Daniels Wasswa Date: Tue, 18 Apr 2023 10:05:54 +0800 Subject: [PATCH 2/5] refactor: remove connect from market-unavailable --- .../market-unavailable.jsx | 65 +++++++++---------- 1 file changed, 31 insertions(+), 34 deletions(-) diff --git a/packages/trader/src/App/Components/Elements/Modals/MarketUnavailableModal/market-unavailable.jsx b/packages/trader/src/App/Components/Elements/Modals/MarketUnavailableModal/market-unavailable.jsx index 393581f4c099..907d36a587e3 100644 --- a/packages/trader/src/App/Components/Elements/Modals/MarketUnavailableModal/market-unavailable.jsx +++ b/packages/trader/src/App/Components/Elements/Modals/MarketUnavailableModal/market-unavailable.jsx @@ -3,47 +3,44 @@ import React from 'react'; import { Dialog } from '@deriv/components'; import { getPlatformSettings } from '@deriv/shared'; import { localize, Localize } from '@deriv/translations'; -import { connect } from 'Stores/connect'; +import { observer, useStore } from '@deriv/stores'; -const MarketUnavailableModal = ({ disableApp, enableApp, is_loading, is_visible, onCancel, onConfirm }) => ( - - { + const { ui } = useStore(); + const { disableApp, enableApp, is_loading } = ui; + return ( + - -); + })} + onConfirm={onConfirm} + onCancel={onCancel} + is_mobile_full_width={false} + is_visible={is_visible} + disableApp={disableApp} + enableApp={enableApp} + is_loading={is_loading} + > + + + ); +}); MarketUnavailableModal.propTypes = { - disableApp: PropTypes.func, - enableApp: PropTypes.func, - is_loading: PropTypes.bool, is_visible: PropTypes.bool, onCancel: PropTypes.func, onConfirm: PropTypes.func, }; -export default connect(({ ui }) => ({ - disableApp: ui.disableApp, - enableApp: ui.enableApp, - is_loading: ui.is_loading, -}))(MarketUnavailableModal); +export default MarketUnavailableModal; From b69b46c262fef369dc1a5d43e09174e11717cd2d Mon Sep 17 00:00:00 2001 From: Jim Daniels Wasswa Date: Tue, 18 Apr 2023 10:27:20 +0800 Subject: [PATCH 3/5] refactor: remove connect from trade-modals --- .../App/Containers/Modals/trade-modals.jsx | 55 ++++++------------- 1 file changed, 17 insertions(+), 38 deletions(-) diff --git a/packages/trader/src/App/Containers/Modals/trade-modals.jsx b/packages/trader/src/App/Containers/Modals/trade-modals.jsx index 494e95485b37..b88679f7772c 100644 --- a/packages/trader/src/App/Containers/Modals/trade-modals.jsx +++ b/packages/trader/src/App/Containers/Modals/trade-modals.jsx @@ -1,25 +1,23 @@ import React from 'react'; import { getUrlSmartTrader, urlFor } from '@deriv/shared'; - -import { connect } from 'Stores/connect'; import UnsupportedContractModal from 'App/Components/Elements/Modals/UnsupportedContractModal'; import MarketUnavailableModal from 'App/Components/Elements/Modals/MarketUnavailableModal'; import ServicesErrorModal from 'App/Components/Elements/Modals/ServicesErrorModal'; +import { observer, useStore } from '@deriv/stores'; +import { useTraderStore } from 'Stores/useTraderStores'; -const TradeModals = ({ - clearPurchaseInfo, - is_unsupported_contract_modal_visible, - is_market_unavailable_visible, - is_services_error_visible, - is_virtual, - is_logged_in, - toggleUnsupportedContractModal, - setHasOnlyForwardingContracts, - resetPreviousSymbol, - toggleServicesErrorModal, - resetPurchase, - services_error, -}) => { +const TradeModals = observer(() => { + const { ui, client, common } = useStore(); + const { resetPreviousSymbol, clearPurchaseInfo, requestProposal: resetPurchase } = useTraderStore(); + const { is_virtual, is_logged_in } = client; + const { services_error } = common; + const { + is_services_error_visible, + is_unsupported_contract_modal_visible, + setHasOnlyForwardingContracts, + toggleServicesErrorModal, + toggleUnsupportedContractModal, + } = ui; const resetToPreviousMarket = () => { setHasOnlyForwardingContracts(false); resetPreviousSymbol(); @@ -60,11 +58,7 @@ const TradeModals = ({ is_visible={is_unsupported_contract_modal_visible} /> - + ); -}; +}); -export default connect(({ ui, modules, common, client }) => ({ - is_market_unavailable_visible: ui.has_only_forward_starting_contracts, - is_services_error_visible: ui.is_services_error_visible, - is_unsupported_contract_modal_visible: ui.is_unsupported_contract_modal_visible, - is_virtual: client.is_virtual, - is_logged_in: client.is_logged_in, - proposal_info: modules.trade.proposal_info, - purchase_info: modules.trade.purchase_info, - resetPreviousSymbol: modules.trade.resetPreviousSymbol, - clearPurchaseInfo: modules.trade.clearPurchaseInfo, - resetPurchase: modules.trade.requestProposal, - services_error: common.services_error, - setHasOnlyForwardingContracts: ui.setHasOnlyForwardingContracts, - toggleServicesErrorModal: ui.toggleServicesErrorModal, - toggleUnsupportedContractModal: ui.toggleUnsupportedContractModal, -}))(TradeModals); +export default TradeModals; From e75f3c972dee54f94215fef2c5cc1fbd1f1823a8 Mon Sep 17 00:00:00 2001 From: Jim Daniels Wasswa Date: Tue, 18 Apr 2023 10:28:52 +0800 Subject: [PATCH 4/5] refactor: move is_visible prop to market-unavailable --- .../Modals/MarketUnavailableModal/market-unavailable.jsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/trader/src/App/Components/Elements/Modals/MarketUnavailableModal/market-unavailable.jsx b/packages/trader/src/App/Components/Elements/Modals/MarketUnavailableModal/market-unavailable.jsx index 907d36a587e3..9cd8339d8614 100644 --- a/packages/trader/src/App/Components/Elements/Modals/MarketUnavailableModal/market-unavailable.jsx +++ b/packages/trader/src/App/Components/Elements/Modals/MarketUnavailableModal/market-unavailable.jsx @@ -5,9 +5,9 @@ import { getPlatformSettings } from '@deriv/shared'; import { localize, Localize } from '@deriv/translations'; import { observer, useStore } from '@deriv/stores'; -const MarketUnavailableModal = observer(({ is_visible, onCancel, onConfirm }) => { +const MarketUnavailableModal = observer(({ onCancel, onConfirm }) => { const { ui } = useStore(); - const { disableApp, enableApp, is_loading } = ui; + const { disableApp, enableApp, is_loading, has_only_forward_starting_contracts: is_visible } = ui; return ( }); MarketUnavailableModal.propTypes = { - is_visible: PropTypes.bool, onCancel: PropTypes.func, onConfirm: PropTypes.func, }; From 3c984e59389888aa97c11c83dd6b3535d929553b Mon Sep 17 00:00:00 2001 From: Jim Daniels Wasswa Date: Tue, 18 Apr 2023 10:42:52 +0800 Subject: [PATCH 5/5] refactor: remove connect from unsupported-contract-modal --- .../unsupported-contract-modal.jsx | 48 +++++++++---------- .../App/Containers/Modals/trade-modals.jsx | 7 +-- 2 files changed, 23 insertions(+), 32 deletions(-) diff --git a/packages/trader/src/App/Components/Elements/Modals/UnsupportedContractModal/unsupported-contract-modal.jsx b/packages/trader/src/App/Components/Elements/Modals/UnsupportedContractModal/unsupported-contract-modal.jsx index 4958fdce118c..8433687a8dc0 100644 --- a/packages/trader/src/App/Components/Elements/Modals/UnsupportedContractModal/unsupported-contract-modal.jsx +++ b/packages/trader/src/App/Components/Elements/Modals/UnsupportedContractModal/unsupported-contract-modal.jsx @@ -2,37 +2,33 @@ import PropTypes from 'prop-types'; import React from 'react'; import { Dialog } from '@deriv/components'; import { localize, Localize } from '@deriv/translations'; -import { connect } from 'Stores/connect'; import { website_name } from '@deriv/shared'; +import { observer, useStore } from '@deriv/stores'; -const UnsupportedContractModal = ({ disableApp, enableApp, is_loading, is_visible, onConfirm, onClose }) => ( - - - -); +const UnsupportedContractModal = observer(({ onConfirm, onClose }) => { + const { ui } = useStore(); + const { disableApp, enableApp, is_loading, is_unsupported_contract_modal_visible: is_visible } = ui; + return ( + + + + ); +}); UnsupportedContractModal.propTypes = { - disableApp: PropTypes.func, - enableApp: PropTypes.func, - is_loading: PropTypes.bool, - is_visible: PropTypes.bool, onClose: PropTypes.func, onConfirm: PropTypes.func, }; -export default connect(({ ui }) => ({ - disableApp: ui.disableApp, - enableApp: ui.enableApp, - is_loading: ui.is_loading, -}))(UnsupportedContractModal); +export default UnsupportedContractModal; diff --git a/packages/trader/src/App/Containers/Modals/trade-modals.jsx b/packages/trader/src/App/Containers/Modals/trade-modals.jsx index b88679f7772c..fee15a59ea4b 100644 --- a/packages/trader/src/App/Containers/Modals/trade-modals.jsx +++ b/packages/trader/src/App/Containers/Modals/trade-modals.jsx @@ -13,7 +13,6 @@ const TradeModals = observer(() => { const { services_error } = common; const { is_services_error_visible, - is_unsupported_contract_modal_visible, setHasOnlyForwardingContracts, toggleServicesErrorModal, toggleUnsupportedContractModal, @@ -52,11 +51,7 @@ const TradeModals = observer(() => { return ( - +