Merge branch 'del-dmx-gambling-licence-surrender-deriv-sign-up-flow' …

…into poa-poi-notifications
amina-deriv · Nov 2, 2021 · b33dbbd · b33dbbd
2 parents 0a4f9cc + 6fd79ba
commit b33dbbd
Show file tree

Hide file tree

Showing 43 changed files with 713 additions and 274 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -130,8 +130,7 @@ commands:
         type: string
         default: "Dockerfile"
     steps:
-      - setup_remote_docker:
-          docker_layer_caching: true
+      - setup_remote_docker
       - run:
           name: Building docker image
           command: |

diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
@@ -0,0 +1,34 @@
+## Changes:
+
+Please include a summary of the change and which issue is fixed below:
+-   ...
+
+## When you need to add unit test
+
+-   [ ] If this change disrupt current flow
+-   [ ] If this change is adding new flow
+
+## When you need to add integration test
+
+-   [ ] If components from external libraries are being used to define the flow, e.g. @deriv/components
+-   [ ] If it relies on a very specific set of props with no default behavior for the current component.
+
+## Test coverage checklist (for reviewer)
+
+-   [ ] Ensure utility / function has a test case 
+-   [ ] Ensure all the tests are passing
+
+## Type of change
+
+-   [ ] Bug fix
+-   [ ] New feature
+-   [ ] Update feature
+-   [ ] Refactor code
+-   [ ] Translation to code
+-   [ ] Translation to crowdin
+-   [ ] Script configuration
+-   [ ] Improve performance
+-   [ ] Style only
+-   [ ] Dependency update
+-   [ ] Documentation update
+-   [ ] Release
diff --git a/packages/account/src/Components/currency-selector/radio-button-group.jsx b/packages/account/src/Components/currency-selector/radio-button-group.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React from 'react';
 import classNames from 'classnames';
 import { localize } from '@deriv/translations';
 import { Text } from '@deriv/components';
@@ -13,11 +13,6 @@ const RadioButtonGroup = ({
     description,
     has_fiat,
 }) => {
-    const [is_currency_selected, setIsCurrencySelected] = useState(false);
-
-    const onCurrencyClicked = () => {
-        setIsCurrencySelected(true);
-    };
     return (
         <div className={className}>
             {is_title_enabled && (
@@ -40,11 +35,10 @@ const RadioButtonGroup = ({
                     'currency-list__items__is-fiat': is_fiat,
                     'currency-list__items__is-crypto': !is_fiat,
                 })}
-                onClick={onCurrencyClicked}
             >
                 {children}
             </div>
-            {is_fiat && is_currency_selected && <p className='currency-selector__description'>{description}</p>}
+            {is_fiat && <p className='currency-selector__description'>{description}</p>}
         </div>
     );
 };

diff --git a/packages/account/src/Components/personal-details/personal-details.jsx b/packages/account/src/Components/personal-details/personal-details.jsx
@@ -1,5 +1,6 @@
 import { Formik, Field } from 'formik';
 import React from 'react';
+import { Link } from 'react-router-dom';
 import {
     Modal,
     Autocomplete,
@@ -19,7 +20,7 @@ import {
     Text,
 } from '@deriv/components';
 import { localize, Localize } from '@deriv/translations';
-import { isDesktop, isMobile, toMoment, PlatformContext } from '@deriv/shared';
+import { isDesktop, isMobile, toMoment, PlatformContext, routes } from '@deriv/shared';
 import { splitValidationResultTypes } from '../real-account-signup/helpers/utils';
 import FormSubHeader from '../form-sub-header';
 
@@ -49,7 +50,7 @@ const DateOfBirthField = props => (
     </Field>
 );
 
-const FormInputField = ({ name, optional = false, warn, ...props }) => (
+const FormInputField = ({ name, optional = false, warn, hint, ...props }) => (
     <Field name={name}>
         {({ field, form: { errors, touched } }) => (
             <Input
@@ -60,6 +61,7 @@ const FormInputField = ({ name, optional = false, warn, ...props }) => (
                 maxLength={props.maxLength || '30'}
                 error={touched[field.name] && errors[field.name]}
                 warn={warn}
+                hint={hint}
                 {...field}
                 {...props}
             />
@@ -172,7 +174,17 @@ const PersonalDetails = ({
                                         {'salutation' in props.value && (
                                             <div>
                                                 <Text size={isMobile() ? 'xs' : 'xxs'} align={isMobile() && 'center'}>
-                                                    <Localize i18n_default_text='Please remember that it is your responsibility to keep your answers accurate and up to date. You can update your personal details at any time in your account settings.' />
+                                                    <Localize
+                                                        i18n_default_text='Please remember that it is your responsibility to keep your answers accurate and up to date. You can update your personal details at any time in your <0>account settings.</0>'
+                                                        components={[
+                                                            <Link
+                                                                to={routes.personal_details}
+                                                                key={0}
+                                                                className='link'
+                                                                target='_blank'
+                                                            />,
+                                                        ]}
+                                                    />
                                                 </Text>
                                             </div>
                                         )}
@@ -217,6 +229,9 @@ const PersonalDetails = ({
                                                 }
                                                 disabled={disabled_items.includes('first_name')}
                                                 placeholder={localize('John')}
+                                                hint={localize(
+                                                    'Please provide your name as it appears in your identity document'
+                                                )}
                                             />
                                         )}
                                         {'last_name' in props.value && (

diff --git a/packages/account/src/Components/poi-idv-document-submit/poi-idv-document-submit.jsx b/packages/account/src/Components/poi-idv-document-submit/poi-idv-document-submit.jsx
@@ -27,10 +27,9 @@ const IdvDocumentSubmit = ({ handleBack, handleViewComplete, selected_country })
 
     React.useEffect(() => {
         // NOTE: This is a temporary filter. Remove after backend handles this from their side
-        const filtered_documents =
-            country_code === 'gh'
-                ? Object.keys(document_data).filter(d => d !== 'voter_id')
-                : Object.keys(document_data);
+        const filtered_documents = ['gh', 'ng'].includes(country_code)
+            ? Object.keys(document_data).filter(d => d !== 'voter_id')
+            : Object.keys(document_data);
 
         setDocumentList(
             filtered_documents.map(key => {

diff --git a/packages/account/src/Sections/Verification/Helpers/verification.js b/packages/account/src/Sections/Verification/Helpers/verification.js
@@ -1,18 +1,19 @@
 const populateVerificationStatus = account_status => {
     const { attempts, document, identity, needs_verification } = {
-        ...account_status.authentication,
-        attempts: account_status.authentication.attempts || {},
-        needs_verification: account_status.authentication.needs_verification || {},
+        ...account_status?.authentication,
+        attempts: account_status?.authentication?.attempts || {},
+        needs_verification: account_status?.authentication?.needs_verification || {},
     };
     const has_poa = !(document && document.status === 'none');
     const has_poi = !(identity && identity.status === 'none');
     const needs_poa = needs_verification.length && needs_verification.includes('document');
     const needs_poi = needs_verification.length && needs_verification.includes('identity');
-
-    const allow_document_upload = account_status?.status?.some(status => status === 'allow_document_upload');
-    const allow_poi_resubmission = account_status?.status?.some(status => status === 'allow_poi_resubmission');
-    const is_idv_disallowed = account_status?.status?.some(status => status === 'idv_disallowed');
-
+    const accountStatusChecker = valueToCheck => {
+        return account_status?.status?.some(status => status === valueToCheck);
+    };
+    const allow_document_upload = accountStatusChecker('allow_document_upload');
+    const allow_poi_resubmission = accountStatusChecker('allow_poi_resubmission');
+    const is_idv_disallowed = accountStatusChecker('idv_disallowed');
     const identity_status = identity?.status;
 
     const idv = identity?.services?.idv;

diff --git a/packages/account/src/Sections/Verification/ProofOfIdentity/proof-of-identity-container.jsx b/packages/account/src/Sections/Verification/ProofOfIdentity/proof-of-identity-container.jsx
@@ -113,8 +113,11 @@ const ProofOfIdentityContainer = ({
                 residence_list={residence_list}
             />
         );
-        // Client status modified from BO does not get their latest attempts populated
-    } else if (!identity_last_attempt) {
+    } else if (
+        !identity_last_attempt ||
+        // Prioritise verified status from back office. How we know this is if there is mismatch between current statuses (Should be refactored)
+        (identity_status === 'verified' && identity_status !== identity_last_attempt.status)
+    ) {
         switch (identity_status) {
             case identity_status_codes.pending:
                 return (

diff --git a/packages/components/src/components/form-submit-button/form-submit-button.scss b/packages/components/src/components/form-submit-button/form-submit-button.scss
@@ -3,7 +3,7 @@
     align-items: center;
     justify-content: flex-end;
     align-self: flex-end;
-    background-color: var(--general-main-1);
+    background-color: transparent;
 
     &:only-child {
         width: 100%;

diff --git a/packages/core/build/config.js b/packages/core/build/config.js
@@ -37,8 +37,8 @@ const copyConfig = base => {
             to: 'cashier/css',
         },
         {
-            from: path.resolve(__dirname, '../node_modules/@deriv/cashier/dist/cashier/public/'),
-            to: 'public',
+            from: path.resolve(__dirname, '../node_modules/@deriv/cashier/dist/cashier/public'),
+            to: 'cashier/public',
             transformPath(context) {
                 return context.split('node_modules/@deriv/cashier/dist/')[1];
             },
@@ -117,7 +117,26 @@ const copyConfig = base => {
 
 const generateSWConfig = is_release => ({
     cleanupOutdatedCaches: true,
-    exclude: [/CNAME$/, /index\.html$/, /404\.html$/, /^localstorage-sync\.html$/, /\.map$/],
+    exclude: [
+        /CNAME$/,
+        /index\.html$/,
+        /404\.html$/,
+        /^localstorage-sync\.html$/,
+        /\.map$/,
+        /sitemap\.xml$/,
+        /robots\.txt$/,
+        /manifest\.json$/,
+        /^apple-app-site-association/,
+        /^assetlinks.json/,
+        /^.well-known\//,
+        /^account\//,
+        /^js\/smartcharts\//,
+        /^bot\//,
+        /^media\//,
+        /^trader\//,
+        /^cashier\//,
+        /^js\/core\.[a-z_]*-json\./,
+    ],
     skipWaiting: true,
     clientsClaim: true,
     ...(is_release && {

diff --git a/packages/core/src/App/Containers/AccountSwitcher/account-switcher.jsx b/packages/core/src/App/Containers/AccountSwitcher/account-switcher.jsx
@@ -120,6 +120,7 @@ const AccountSwitcher = props => {
             account_type === 'synthetic' ? props.has_malta_account : props.has_maltainvest_account;
 
         if (props.is_eu && !has_required_account) {
+            sessionStorage.setItem('cfd_account_needed', 1);
             closeAccountsDialog();
             props.openAccountNeededModal(
                 account_type === 'synthetic' ? props.standpoint.gaming_company : props.standpoint.financial_company,

diff --git a/packages/core/src/App/Containers/Modals/app-modals.jsx b/packages/core/src/App/Containers/Modals/app-modals.jsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import { useLocation } from 'react-router-dom';
-import MT5AccountNeededModal from 'App/Components/Elements/Modals/mt5-account-needed-modal.jsx';
 import RedirectNoticeModal from 'App/Components/Elements/Modals/RedirectNotice';
 import { connect } from 'Stores/connect';
+import { localize } from '@deriv/translations';
 
 const AccountSignupModal = React.lazy(() =>
     import(/* webpackChunkName: "account-signup-modal" */ '../AccountSignupModal')
@@ -28,10 +28,12 @@ const AppModals = ({
     is_set_residence_modal_visible,
     is_eu,
     is_logged_in,
+    account_needed_modal_props: { target },
+    openRealAccountSignup,
+    closeAccountNeededModal,
 }) => {
     const url_params = new URLSearchParams(useLocation().search);
     const url_action_param = url_params.get('action');
-
     let ComponentToLoad = null;
     switch (url_action_param) {
         case 'redirect_to_login':
@@ -55,7 +57,8 @@ const AppModals = ({
     }
 
     if (is_account_needed_modal_on) {
-        ComponentToLoad = <MT5AccountNeededModal />;
+        openRealAccountSignup(target, localize('DMT5 CFDs'));
+        closeAccountNeededModal();
     }
 
     if (is_reality_check_visible) {
@@ -78,4 +81,7 @@ export default connect(({ client, ui }) => ({
     is_eu: client.is_eu,
     is_logged_in: client.is_logged_in,
     is_reality_check_visible: client.is_reality_check_visible,
+    account_needed_modal_props: ui.account_needed_modal_props,
+    openRealAccountSignup: ui.openRealAccountSignup,
+    closeAccountNeededModal: ui.closeAccountNeededModal,
 }))(AppModals);
diff --git a/packages/core/src/App/Containers/RealAccountSignup/accept-risk-form.jsx b/packages/core/src/App/Containers/RealAccountSignup/accept-risk-form.jsx
@@ -27,10 +27,7 @@ const AcceptRiskForm = ({ onSubmit }) => {
                                             </Text>
                                         </div>
                                         <Text as='p' size='xs'>
-                                            <Localize
-                                                i18n_default_text="Our products and services may expose you to risks that can be substantial at times, including the risk of losing your entire investment. Please note that by clicking <0>Continue</0>, you'll be accepting these risks."
-                                                components={[<strong key={0} />]}
-                                            />
+                                            <Localize i18n_default_text="Our products and services may expose you to risks that can be substantial at times, including the risk of losing your entire investment. Please note that by clicking Continue, you'll be accepting these risks." />
                                         </Text>
                                     </div>
                                 </ThemedScrollbars>

diff --git a/packages/core/src/App/Containers/RealAccountSignup/real-account-signup.jsx b/packages/core/src/App/Containers/RealAccountSignup/real-account-signup.jsx
@@ -3,8 +3,9 @@ import classNames from 'classnames';
 import React from 'react';
 import { withRouter } from 'react-router-dom';
 import { Modal, DesktopWrapper, MobileDialog, MobileWrapper } from '@deriv/components';
-import { routes, isNavigationFromPlatform } from '@deriv/shared';
+import { routes, isNavigationFromExternalPlatform } from '@deriv/shared';
 import { localize, Localize } from '@deriv/translations';
+import { CFD_PASSWORD_MODAL_SESSION_STORAGE_STRING } from '@deriv/shared/src/utils/constants-storage/CFD';
 import { connect } from 'Stores/connect';
 import AccountWizard from './account-wizard.jsx';
 import AddCurrency from './add-currency.jsx';
@@ -254,10 +255,14 @@ const RealAccountSignup = ({
     };
 
     const showStatusDialog = curr => {
-        setParams({
-            active_modal_index: modal_pages_indices.status_dialog,
-            currency: curr,
-        });
+        if (sessionStorage.getItem('cfd_account_needed')) {
+            closeModalThenOpenCFD();
+        } else {
+            setParams({
+                active_modal_index: modal_pages_indices.status_dialog,
+                currency: curr,
+            });
+        }
     };
 
     const closeModalthenOpenWelcomeModal = curr => {
@@ -267,6 +272,12 @@ const RealAccountSignup = ({
         });
     };
 
+    const closeModalThenOpenCFD = () => {
+        closeRealAccountSignup();
+        sessionStorage.setItem(CFD_PASSWORD_MODAL_SESSION_STORAGE_STRING, '1');
+        history.push(`${routes.mt5}#real`);
+    };
+
     const closeModalThenOpenCashier = () => {
         replaceCashierMenuOnclick();
         closeRealAccountSignup();
@@ -342,14 +353,19 @@ const RealAccountSignup = ({
             return;
         }
         if (getActiveModalIndex() !== modal_pages_indices.status_dialog) {
+            sessionStorage.removeItem('cfd_account_needed');
             sessionStorage.removeItem('post_real_account_signup');
             localStorage.removeItem('real_account_signup_wizard');
         }
         closeRealAccountSignup();
 
-        if (isNavigationFromPlatform(routing_history, routes.smarttrader)) {
+        if (isNavigationFromExternalPlatform(routing_history, routes.smarttrader)) {
             window.location = routes.smarttrader;
         }
+
+        if (isNavigationFromExternalPlatform(routing_history, routes.binarybot)) {
+            window.location = routes.binarybot;
+        }
     };
 
     const onErrorConfirm = () => {

diff --git a/packages/core/src/App/Containers/WelcomeModal/welcome-modal-1.jsx b/packages/core/src/App/Containers/WelcomeModal/welcome-modal-1.jsx
@@ -5,7 +5,7 @@ import { Modal, ThemedScrollbars } from '@deriv/components';
 import Welcome from './welcome.jsx';
 
 const WelcomeModal = props => {
-    const { country_standpoint, is_eu, toggleWelcomeModal, history, toggleShouldShowMultipliersOnboarding } = props;
+    const { is_eu, toggleWelcomeModal, history, toggleShouldShowMultipliersOnboarding } = props;
     const switchPlatform = React.useCallback(
         ({ route, should_show_multiplier } = {}) => {
             toggleWelcomeModal({ is_visible: false, should_persist: true });
@@ -18,15 +18,14 @@ const WelcomeModal = props => {
     return (
         <Modal width='760px' className='welcome welcome-cr' is_open has_close_icon={false} has_outer_content>
             <ThemedScrollbars height={700}>
-                <Welcome country_standpoint={country_standpoint} is_eu={is_eu} switchPlatform={switchPlatform} />
+                <Welcome is_eu={is_eu} switchPlatform={switchPlatform} />
             </ThemedScrollbars>
         </Modal>
     );
 };
 
 export default withRouter(
     connect(({ client, ui }) => ({
-        country_standpoint: client.country_standpoint,
         is_eu: client.is_eu,
         toggleWelcomeModal: ui.toggleWelcomeModal,
         toggleShouldShowMultipliersOnboarding: ui.toggleShouldShowMultipliersOnboarding,