Maryia/fix: CompareAccountsModal Add button to open real account need…

…ed modal (#37) * Maryia/fix showing real acc needed when adding acc from compare acc modal * fixed compare accounts modal for logged out clients * removed unused loading state from poi/poa
maryia-deriv · Jul 27, 2022 · 127ffdf · 127ffdf
1 parent d99befd
commit 127ffdf
Show file tree

Hide file tree

Showing 4 changed files with 91 additions and 58 deletions.
diff --git a/packages/cfd/src/Containers/cfd-dashboard.tsx b/packages/cfd/src/Containers/cfd-dashboard.tsx
@@ -556,6 +556,7 @@ const CFDDashboard = (props: TCFDDashboardProps) => {
                                 platform={platform}
                                 is_demo_tab={is_demo_tab}
                                 openPasswordModal={openRealPasswordModal}
+                                is_real_enabled={is_real_enabled}
                             />
                             <JurisdictionModal
                                 platform={platform}

diff --git a/packages/cfd/src/Containers/cfd-dbvi-onboarding.tsx b/packages/cfd/src/Containers/cfd-dbvi-onboarding.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { DesktopWrapper, Loading, MobileDialog, MobileWrapper, Modal, UILoader } from '@deriv/components';
+import { DesktopWrapper, MobileDialog, MobileWrapper, Modal, UILoader } from '@deriv/components';
 import { localize } from '@deriv/translations';
 import RootStore from 'Stores/index';
 import { PoiPoaSubmitted } from '@deriv/account';
@@ -33,19 +33,17 @@ const CFDDbViOnBoarding = ({
     mt5_login_list,
     toggleJurisdictionModal,
 }: TVerificationModalProps) => {
-    const [is_loading, setIsLoading] = React.useState(true);
     const [showSubmittedModal, setShowSubmittedModal] = React.useState(false);
     const handleOpenJurisditionModal = () => {
         toggleCFDVerificationModal();
         toggleJurisdictionModal();
     };
-    const getAccountStausFromAPI = () => {
+    const getAccountStatusFromAPI = () => {
         WS.authorized.getAccountStatus().then((response: AccountStatusResponse) => {
             const { get_account_status } = response;
             if (get_account_status?.authentication) {
                 const identity_status = get_account_status?.authentication?.identity?.status;
                 const document_status = get_account_status?.authentication?.document?.status;
-                setIsLoading(false);
                 if (
                     (identity_status === 'pending' || identity_status === 'verified') &&
                     (document_status === 'pending' || document_status === 'verified')
@@ -59,8 +57,7 @@ const CFDDbViOnBoarding = ({
     };
     React.useEffect(() => {
         if (is_cfd_verification_modal_visible) {
-            setIsLoading(true);
-            getAccountStausFromAPI();
+            getAccountStatusFromAPI();
         }
     }, [is_cfd_verification_modal_visible]);
 
@@ -76,7 +73,7 @@ const CFDDbViOnBoarding = ({
                     toggleModal={toggleCFDVerificationModal}
                     height='700px'
                     width='996px'
-                    onMount={() => getAccountStausFromAPI()}
+                    onMount={() => getAccountStatusFromAPI()}
                     exit_classname='cfd-modal--custom-exit'
                 >
                     {showSubmittedModal ? (

diff --git a/packages/cfd/src/Containers/compare-accounts-modal.tsx b/packages/cfd/src/Containers/compare-accounts-modal.tsx
@@ -27,10 +27,12 @@ type TCompareAccountsModalProps = TCompareAccountsReusedProps & {
     is_loading: boolean;
     is_eu: boolean;
     is_eu_country: boolean;
+    is_real_enabled: boolean;
     residence: string;
     is_demo_tab: boolean;
     toggleCompareAccounts: () => void;
     openPasswordModal: (account_type: TOpenAccountTransferMeta) => void;
+    openDerivRealAccountNeededModal: () => void;
 };
 
 const CompareAccountsModal = ({
@@ -43,11 +45,13 @@ const CompareAccountsModal = ({
     is_eu,
     is_uk,
     is_eu_country,
+    is_real_enabled,
     platform,
     residence,
     is_demo_tab,
     toggleCompareAccounts,
     openPasswordModal,
+    openDerivRealAccountNeededModal,
 }: TCompareAccountsModalProps) => {
     const show_eu_related = (is_logged_in && is_eu) || (!is_logged_in && is_eu_country);
     const is_dxtrade = platform && platform === CFD_PLATFORMS.DXTRADE;
@@ -120,9 +124,12 @@ const CompareAccountsModal = ({
                             ) : (
                                 <DMT5CompareModalContent
                                     is_logged_in={is_logged_in}
+                                    openDerivRealAccountNeededModal={openDerivRealAccountNeededModal}
                                     openPasswordModal={openPasswordModal}
                                     is_demo_tab={is_demo_tab}
                                     show_eu_related={show_eu_related}
+                                    is_real_enabled={is_real_enabled}
+                                    toggleCompareAccounts={toggleCompareAccounts}
                                 />
                             )}
                         </Modal>
@@ -149,9 +156,12 @@ const CompareAccountsModal = ({
                             ) : (
                                 <DMT5CompareModalContent
                                     is_logged_in={is_logged_in}
+                                    openDerivRealAccountNeededModal={openDerivRealAccountNeededModal}
                                     openPasswordModal={openPasswordModal}
                                     is_demo_tab={is_demo_tab}
                                     show_eu_related={show_eu_related}
+                                    is_real_enabled={is_real_enabled}
+                                    toggleCompareAccounts={toggleCompareAccounts}
                                 />
                             )}
                         </MobileDialog>
@@ -174,4 +184,5 @@ export default connect(({ modules, ui, client }: RootStore) => ({
     landing_companies: client.landing_companies,
     residence: client.residence,
     toggleCompareAccounts: modules.cfd.toggleCompareAccountsModal,
+    openDerivRealAccountNeededModal: ui.openDerivRealAccountNeededModal,
 }))(CompareAccountsModal);