Merge pull request #48 from shaheer-deriv/shaheer/DIEL_flow_change

Shaheer/diel flow change

packages/appstore/src/components/cfds-listing/cfds-listing.scss

@@ -3,12 +3,12 @@
         display: flex;
         flex-direction: column;
         @include desktop {
-            overflow: scroll;
+            overflow: auto;
         }
     }
     &__scrollable-content {
         @include desktop {
-            overflow: scroll;
+            overflow: auto;
         }
     }
     &__footer-content {

packages/cfd/src/Containers/cfd-password-modal.tsx

@@ -134,6 +134,7 @@ type TCFDPasswordModalProps = RouteComponentProps & {
     form_error?: string;
     getAccountStatus: (platform: string) => void;
     is_eu: boolean;
+    is_eu_user: boolean;
     is_logged_in: boolean;
     is_fully_authenticated: boolean;
     is_cfd_password_modal_enabled: boolean;
@@ -154,6 +155,7 @@ type TCFDPasswordModalProps = RouteComponentProps & {
         actions: FormikHelpers<TCFDPasswordFormValues>
     ) => void;
     updateAccountStatus: () => void;
+    toggleAccountTransferModal: () => void;
 };
 
 const getAccountTitle = (
@@ -215,8 +217,12 @@ const ReviewMessageForMT5 = ({
             return <Localize i18n_default_text='We’re reviewing your documents. This should take about 1 to 3 days.' />;
         }
         return <Localize i18n_default_text='We’re reviewing your documents. This should take about 5 minutes.' />;
-    } else if ([Jurisdiction.LABUAN, Jurisdiction.MALTA_INVEST].includes(jurisdiction_selected_shortcode)) {
+    } else if (jurisdiction_selected_shortcode === Jurisdiction.LABUAN) {
         return <Localize i18n_default_text='We’re reviewing your documents. This should take about 1 to 3 days.' />;
+    } else if (jurisdiction_selected_shortcode === Jurisdiction.MALTA_INVEST) {
+        return (
+            <Localize i18n_default_text='To start trading, transfer funds from your Deriv account into this account.' />
+        );
     }
     return null;
 };
@@ -654,6 +660,7 @@ const CFDPasswordModal = ({
     form_error,
     getAccountStatus,
     history,
+    is_eu_user,
     is_logged_in,
     context,
     is_cfd_password_modal_enabled,
@@ -671,6 +678,7 @@ const CFDPasswordModal = ({
     submitCFDPassword,
     updateAccountStatus,
     show_eu_related_content,
+    toggleAccountTransferModal,
 }: TCFDPasswordModalProps) => {
     const [is_password_modal_exited, setPasswordModalExited] = React.useState(true);
     const is_bvi = landing_companies?.mt_financial_company?.financial_stp?.shortcode === 'bvi';
@@ -757,8 +765,12 @@ const CFDPasswordModal = ({
         disableCFDPasswordModal();
         closeDialogs();
         if (account_type.category === 'real') {
-            sessionStorage.setItem('cfd_transfer_to_login_id', cfd_new_account.login || '');
-            history.push(routes.cashier_acc_transfer);
+            if (is_eu_user) {
+                toggleAccountTransferModal();
+            } else {
+                sessionStorage.setItem('cfd_transfer_to_login_id', cfd_new_account.login || '');
+                history.push(routes.cashier_acc_transfer);
+            }
         }
     };
 
@@ -829,12 +841,19 @@ const CFDPasswordModal = ({
     const success_modal_submit_label = React.useMemo(() => {
         if (account_type.category === 'real') {
             if (platform === CFD_PLATFORMS.MT5) {
-                return is_selected_mt5_verified ? localize('Transfer now') : localize('OK');
+                return is_eu_user || is_selected_mt5_verified ? localize('Transfer now') : localize('OK');
             }
             return localize('Transfer now');
         }
         return localize('Continue');
-    }, [platform, account_type, is_selected_mt5_verified]);
+    }, [platform, account_type, is_eu_user, is_selected_mt5_verified]);
+
+    const success_modal_cancel_label = React.useMemo(() => {
+        if (is_eu_user && account_type.category === 'real' && platform === CFD_PLATFORMS.MT5) {
+            return localize('Maybe later');
+        }
+        return '';
+    }, [platform, account_type, is_eu_user]);
 
     const getSubmitText = () => {
         const { category, type } = account_type;
@@ -870,30 +889,17 @@ const CFDPasswordModal = ({
         const mt5_platform_label = jurisdiction_selected_shortcode !== Jurisdiction.MALTA_INVEST ? 'Deriv MT5' : '';
 
         if (category === 'real') {
-            let platformName = '';
-            switch (platform) {
-                case CFD_PLATFORMS.MT5:
-                    platformName = mt5_platform_label;
-                    break;
-                case CFD_PLATFORMS.DERIVEZ:
-                    platformName = 'Deriv Ez';
-                    break;
-                default:
-                    platformName = 'Deriv X';
-                    break;
-            }
-
             return (
                 <React.Fragment>
                     <Localize
-                        i18n_default_text='Congratulations, you have successfully created your {{category}} <0>{{platform}}</0> <1>{{type}} {{jurisdiction_selected_shortcode}}</1> account. '
+                        i18n_default_text='Congratulations, you have successfully created your {{category}} <0>{{deriv_keyword}} {{platform}}</0> <1>{{type}} {{jurisdiction_selected_shortcode}}</1> account. '
                         values={{
+                            deriv_keyword: is_eu_user ? 'Deriv' : '',
                             type: type_label,
                             platform:
                                 platform === CFD_PLATFORMS.MT5 ? mt5_platform_label : getCFDPlatformLabel(platform),
                             category: category_label,
-                            jurisdiction_selected_shortcode:
-                                platform === CFD_PLATFORMS.MT5 && !show_eu_related_content ? jurisdiction_label : '',
+                            jurisdiction_selected_shortcode: platform === CFD_PLATFORMS.MT5 ? jurisdiction_label : '',
                         }}
                         components={[<span key={0} className='cfd-account__platform' />, <strong key={1} />]}
                     />
@@ -999,7 +1005,11 @@ const CFDPasswordModal = ({
                 is_open={should_show_success}
                 toggleModal={closeModal}
                 onCancel={closeModal}
-                onSubmit={platform === CFD_PLATFORMS.MT5 && !is_selected_mt5_verified ? closeModal : closeOpenSuccess}
+                onSubmit={
+                    !is_eu_user && platform === CFD_PLATFORMS.MT5 && !is_selected_mt5_verified
+                        ? closeModal
+                        : closeOpenSuccess
+                }
                 classNameMessage='cfd-password-modal__message'
                 message={getSubmitText()}
                 icon={
@@ -1011,9 +1021,10 @@ const CFDPasswordModal = ({
                 }
                 icon_size='xlarge'
                 text_submit={success_modal_submit_label}
+                text_cancel={success_modal_cancel_label}
                 has_cancel={
                     platform === CFD_PLATFORMS.MT5
-                        ? is_selected_mt5_verified && account_type.category === 'real'
+                        ? (is_eu_user || is_selected_mt5_verified) && account_type.category === 'real'
                         : account_type.category === 'real'
                 }
                 has_close_icon={false}
@@ -1043,6 +1054,7 @@ export default connect(({ client, modules, traders_hub }: RootStore) => ({
     landing_companies: client.landing_companies,
     is_eu: client.is_eu,
     is_eu_country: client.is_eu_country,
+    is_eu_user: traders_hub.is_eu_user,
     is_logged_in: client.is_logged_in,
     is_cfd_success_dialog_enabled: modules.cfd.is_cfd_success_dialog_enabled,
     is_cfd_password_modal_enabled: modules.cfd.is_cfd_password_modal_enabled,
@@ -1057,4 +1069,5 @@ export default connect(({ client, modules, traders_hub }: RootStore) => ({
     mt5_login_list: client.mt5_login_list,
     updateAccountStatus: client.updateAccountStatus,
     show_eu_related_content: traders_hub.show_eu_related_content,
+    toggleAccountTransferModal: traders_hub.toggleAccountTransferModal,
 }))(withRouter(CFDPasswordModal));

packages/cfd/src/Containers/jurisdiction-modal/jurisdiction-modal-content-wrapper.tsx

@@ -17,6 +17,7 @@ const JurisdictionModalContentWrapper = ({
     fetchAccountSettings,
     has_submitted_cfd_personal_details,
     is_jurisdiction_modal_visible,
+    is_eu_user,
     is_virtual,
     jurisdiction_selected_shortcode,
     openPasswordModal,
@@ -166,7 +167,7 @@ const JurisdictionModalContentWrapper = ({
                 toggleCFDVerificationModal();
             }
         } else if (is_maltainvest_selected) {
-            if (poi_acknowledged_for_vanuatu_maltainvest && poa_acknowledged) {
+            if (is_eu_user || (poi_acknowledged_for_vanuatu_maltainvest && poa_acknowledged)) {
                 openPasswordModal(type_of_account);
             } else {
                 toggleCFDVerificationModal();
@@ -241,6 +242,7 @@ export default connect(({ modules: { cfd }, client, traders_hub }: RootStore) =>
     fetchAccountSettings: client.fetchAccountSettings,
     has_submitted_cfd_personal_details: cfd.has_submitted_cfd_personal_details,
     is_jurisdiction_modal_visible: cfd.is_jurisdiction_modal_visible,
+    is_eu_user: traders_hub.is_eu_user,
     is_virtual: client.is_virtual,
     jurisdiction_selected_shortcode: cfd.jurisdiction_selected_shortcode,
     real_financial_accounts_existing_data: cfd.real_financial_accounts_existing_data,

packages/cfd/src/Containers/mt5-compare-table-content.tsx

@@ -369,7 +369,7 @@ const DMT5CompareModalContent = ({
             case 'financial_maltainvest':
                 setAppstorePlatform(CFD_PLATFORMS.MT5);
                 setJurisdictionSelectedShortcode(Jurisdiction.MALTA_INVEST);
-                if ((poi_acknowledged_for_vanuatu_maltainvest && poa_acknowledged) || is_demo_tab) {
+                if (is_eu_user || (poi_acknowledged_for_vanuatu_maltainvest && poa_acknowledged) || is_demo_tab) {
                     openPasswordModal(type_of_account);
                 } else {
                     toggleCFDVerificationModal();

packages/cfd/src/Containers/props.types.ts

@@ -267,6 +267,7 @@ export type TJurisdictionModalContentWrapperProps = TJurisdictionModalCommonProp
     account_status: GetAccountStatus;
     fetchAccountSettings: () => void;
     has_submitted_cfd_personal_details: boolean;
+    is_eu_user: boolean;
     is_virtual: boolean;
     jurisdiction_selected_shortcode: string;
     real_financial_accounts_existing_data: TExistingData;

packages/cfd/src/Stores/Modules/CFD/Helpers/cfd-config.ts

@@ -270,6 +270,9 @@ export const getFormattedJurisdictionCode = (jurisdiction_code: string) => {
         case Jurisdiction.VANUATU:
             formatted_label = localize('Vanuatu');
             break;
+        case Jurisdiction.MALTA_INVEST:
+            formatted_label = localize('Malta');
+            break;
         default:
             formatted_label = jurisdiction_code?.toUpperCase();
             break;