Task 88555 remove legacy connect from cfd (binary-com#8209)

* refactor: to use instead of * refactor: to use instead of * refactor: to use instead of * refactor: to use instead of * refactor: add root state type on cfd app * refactor: remove legacy connect in jurisdiction-card-banner * refactor: remove legacy connect in jurisdiction-modal * refactor: remove legacy connect on cfd modal components * refactor: remove legacy connect in cfd reset and demo modal * refactor: remove legacy connect from cfd dashboard and components * refactor: remove connect module and use useStore in cfd signup form * fix: type errors on components * refactor: use cfd store provider in the app * refactor: remove destrcturing of cfd state from useStore and add useCfdStore * refactor: wrap component with observer at top * fix: type errors on mock store * fix: type errors and resolve todo fixes * fix: circle ci build issue * fix: build errors on cfd package * fix: dashboard and app.tsx static errors * fix: use relative path to import useCFDStore * refactor: replace connect from test cases * fix: cfd account-card.spec.tsx suite * refactor: update mock props * refactor: change poi specs * fix: add cfd provider import int he test spec * fix: cdf poi and financial step form specs errors * fix: test spec for real account display * fix: add mockStore imports in the spec * refactor: cfd password modal spec * fix: cfd password modal spec * refactor: add store provider in cfd password manager modal spec * fix: failing test cases on cfd specs * fix: build error on mockstore * fix: compare accounts prop types * refactor: resolve review comments * fix: resolve review comments * refactor: make destructure more readable * fix: cfd package imports and context errors * fix: failing test cases on cfd-password-manager-modal * fix: deriv mt5 password modal issue * fix: resolve review comments Co-authored-by: mahdiyeh-deriv <82078941+mahdiyeh-deriv@users.noreply.github.com> * fix: resolve review comments * chore: update type in store * fix: type issue for `real_account_creation_unlock_date` * fix: cfd password test spec * fix: cfd compare account modal not closing * fix: store types * fix: initial value on mock store * fix: notification message element type * fix: path and types * fix: type error on cfd-top-up-demo-modal * fix: getChangeableField error in cfd-poi * fix: dmt5 modal content props --------- Co-authored-by: Jim Daniels Wasswa <104334373+jim-deriv@users.noreply.github.com> Co-authored-by: mahdiyeh-deriv <82078941+mahdiyeh-deriv@users.noreply.github.com> Co-authored-by: Ali(Ako) Hosseini <ali.hosseini@deriv.com>
ameerul-deriv · Jul 13, 2023 · 43f0c2e · 43f0c2e
1 parent f1c8266
commit 43f0c2e
Show file tree

Hide file tree

Showing 54 changed files with 2,915 additions and 3,053 deletions.
diff --git a/packages/appstore/src/components/app.tsx b/packages/appstore/src/components/app.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 import { setWebsocket, routes } from '@deriv/shared';
 import { StoreProvider, observer } from '@deriv/stores';
 import CashierStoreProvider from '@deriv/cashier/src/cashier-providers';
+import CFDStoreProvider from '@deriv/cfd/src/cfd-providers';
 import Routes from 'Components/routes/routes';
 import { useStores, initContext } from 'Stores';
 import { TRootStore } from 'Types';
@@ -21,20 +22,22 @@ const App = ({ passthrough: { WS, root_store } }: TAppProps) => {
     const { ui }: TRootStore = useStores();
 
     return (
-        <CashierStoreProvider store={root_store}>
-            <StoreProvider store={root_store as any}>
-                <main
-                    className={classNames('dashboard', {
-                        'theme--light': !ui.is_dark_mode_on,
-                        'theme--dark': ui.is_dark_mode_on,
-                        'dashboard-onboarding': window.location.pathname === routes.onboarding,
-                    })}
-                >
-                    <div className='dw-dashboard'>
-                        <Routes />
-                    </div>
-                </main>
-            </StoreProvider>
+        <CashierStoreProvider store={root_store as any}>
+            <CFDStoreProvider store={root_store as any}>
+                <StoreProvider store={root_store as any}>
+                    <main
+                        className={classNames('dashboard', {
+                            'theme--light': !ui.is_dark_mode_on,
+                            'theme--dark': ui.is_dark_mode_on,
+                            'dashboard-onboarding': window.location.pathname === routes.onboarding,
+                        })}
+                    >
+                        <div className='dw-dashboard'>
+                            <Routes />
+                        </div>
+                    </main>
+                </StoreProvider>
+            </CFDStoreProvider>
         </CashierStoreProvider>
     );
 };

diff --git a/packages/appstore/src/components/modals/modal-manager.tsx b/packages/appstore/src/components/modals/modal-manager.tsx
@@ -1,21 +1,19 @@
 import React from 'react';
 import { observer } from 'mobx-react-lite';
 import { ResetTradingPasswordModal } from '@deriv/account';
-import {
-    JurisdictionModal,
-    CFDPasswordModal,
-    CFDDbviOnBoarding,
-    CFDResetPasswordModal,
-    CFDTopUpDemoModal,
-    MT5TradeModal,
-    CFDPasswordManagerModal,
-    CompareAccountsModal,
-} from '@deriv/cfd';
 import { TTradingPlatformAvailableAccount } from './account-type-modal/types';
 import MT5AccountTypeModal from './account-type-modal';
 import RegulatorsCompareModal from './regulators-compare-modal';
 import { useStores } from 'Stores';
 import CFDServerErrorDialog from '@deriv/cfd/src/Containers/cfd-server-error-dialog';
+import JurisdictionModal from '@deriv/cfd/src/Containers/jurisdiction-modal/jurisdiction-modal';
+import CFDPasswordModal from '@deriv/cfd/src/Containers/cfd-password-modal';
+import CFDDbviOnBoarding from '@deriv/cfd/src/Containers/cfd-dbvi-onboarding';
+import CFDResetPasswordModal from '@deriv/cfd/src/Containers/cfd-reset-password-modal';
+import CFDTopUpDemoModal from '@deriv/cfd/src/Containers/cfd-top-up-demo-modal';
+import MT5TradeModal from '@deriv/cfd/src/Containers/mt5-trade-modal';
+import CFDPasswordManagerModal from '@deriv/cfd/src/Containers/cfd-password-manager-modal';
+import CompareAccountsModal from '@deriv/cfd/src/Containers/compare-accounts-modal';
 import { TOpenAccountTransferMeta } from 'Types';
 import { DetailsOfEachMT5Loginid } from '@deriv/api-types';
 import FailedVerificationModal from './failed-veriification-modal';
@@ -47,20 +45,10 @@ const ModalManager = () => {
         getRealSyntheticAccountsExistingData,
         getRealFinancialAccountsExistingData,
         getRealSwapfreeAccountsExistingData,
-        current_account,
-        dxtrade_companies,
-        derivez_companies,
-        mt5_companies,
-        topUpVirtual,
     } = modules.cfd;
     const {
         enableApp,
         disableApp,
-        is_top_up_virtual_open,
-        is_top_up_virtual_in_progress,
-        is_top_up_virtual_success,
-        closeTopUpModal,
-        closeSuccessTopUpModal,
         setShouldShowCooldownModal,
         is_reset_trading_password_modal_visible,
         setResetTradingPasswordModalOpen,
@@ -71,9 +59,9 @@ const ModalManager = () => {
         is_visible: boolean;
         selected_login: string;
         selected_account: string;
-        selected_account_type?: string;
-        selected_account_group?: string;
-        selected_server?: string;
+        selected_account_type: string;
+        selected_account_group: '' | 'demo' | 'real';
+        selected_server: string;
     }>({
         is_visible: false,
         selected_login: '',
@@ -86,17 +74,17 @@ const ModalManager = () => {
     const togglePasswordManagerModal = (
         login?: string,
         title?: string,
-        group?: string,
+        group?: 'demo' | 'real' | '',
         type?: string,
         server?: string
     ) => {
         setPasswordManager(prev_state => ({
             is_visible: !prev_state.is_visible,
             selected_login: typeof login === 'string' ? login : '',
             selected_account: typeof title === 'string' ? title : '',
-            selected_account_group: group,
-            selected_account_type: type,
-            selected_server: server,
+            selected_account_group: group || '',
+            selected_account_type: type || '',
+            selected_server: server || '',
         }));
     };
 
@@ -130,28 +118,13 @@ const ModalManager = () => {
 
     return (
         <React.Fragment>
-            <JurisdictionModal context={store} openPasswordModal={openRealPasswordModal} />
-            <CFDPasswordModal context={store} platform={platform} />
-            <CFDDbviOnBoarding context={store} />
-            <CFDResetPasswordModal context={store} platform={platform} />
+            <JurisdictionModal openPasswordModal={openRealPasswordModal} />
+            <CFDPasswordModal platform={platform} />
+            <CFDDbviOnBoarding />
+            <CFDResetPasswordModal platform={platform} />
             <CFDServerErrorDialog />
-            <CFDTopUpDemoModal
-                context={store}
-                dxtrade_companies={dxtrade_companies}
-                derivez_companies={derivez_companies}
-                mt5_companies={mt5_companies}
-                current_account={current_account}
-                closeSuccessTopUpModal={closeSuccessTopUpModal}
-                closeTopUpModal={closeTopUpModal}
-                is_top_up_virtual_open={is_top_up_virtual_open}
-                is_top_up_virtual_in_progress={is_top_up_virtual_in_progress}
-                is_top_up_virtual_success={is_top_up_virtual_success}
-                platform={platform}
-                topUpVirtual={topUpVirtual}
-            />
+            <CFDTopUpDemoModal platform={platform} />
             <MT5TradeModal
-                context={store}
-                current_list={current_list}
                 is_open={is_mt5_trade_modal_visible}
                 onPasswordManager={togglePasswordManagerModal}
                 toggleModal={toggleMT5TradeModal}
@@ -161,11 +134,9 @@ const ModalManager = () => {
             <CFDPasswordManagerModal
                 is_visible={password_manager.is_visible}
                 selected_login={password_manager.selected_login}
-                selected_account={password_manager.selected_account}
                 selected_account_group={password_manager.selected_account_group}
                 selected_account_type={password_manager.selected_account_type}
                 selected_server={password_manager.selected_server}
-                context={store}
                 platform={platform}
                 toggleModal={togglePasswordManagerModal}
             />
@@ -182,12 +153,13 @@ const ModalManager = () => {
             <MT5AccountTypeModal />
             <RegulatorsCompareModal />
             <CompareAccountsModal
-                context={store}
+                platform={platform}
                 is_demo_tab={is_demo}
                 openPasswordModal={openRealPasswordModal}
                 is_real_enabled={has_active_real_account || !is_demo}
                 real_account_creation_unlock_date={real_account_creation_unlock_date}
                 setShouldShowCooldownModal={setShouldShowCooldownModal}
+                has_unmerged_account={false}
             />
             <AccountTransferModal
                 is_modal_open={is_account_transfer_modal_open}

diff --git a/packages/cfd/@deriv-stores.d.ts b/packages/cfd/@deriv-stores.d.ts