From f5a3f732b70ab54a12a4b007ab48bfbbc16687aa Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Wed, 8 Mar 2023 11:45:02 +0800 Subject: [PATCH 01/35] chore: remove classic ui from account switcher and header --- .../AccountSwitcher/account-switcher.jsx | 925 +----------------- .../App/Containers/Layout/header/header.jsx | 6 +- .../Layout/header/trading-hub-header.jsx | 46 +- packages/core/src/Stores/client-store.js | 21 - 4 files changed, 20 insertions(+), 978 deletions(-) diff --git a/packages/core/src/App/Containers/AccountSwitcher/account-switcher.jsx b/packages/core/src/App/Containers/AccountSwitcher/account-switcher.jsx index 85e04cbeb5f1..6c6e6eabacf8 100644 --- a/packages/core/src/App/Containers/AccountSwitcher/account-switcher.jsx +++ b/packages/core/src/App/Containers/AccountSwitcher/account-switcher.jsx @@ -14,22 +14,13 @@ import { Text, useOnClickOutside, } from '@deriv/components'; -import { - routes, - formatMoney, - getCFDAccount, - getAccountTypeFields, - getPlatformSettings, - CFD_PLATFORMS, - ContentFlag, -} from '@deriv/shared'; +import { routes, formatMoney, ContentFlag } from '@deriv/shared'; import { localize, Localize } from '@deriv/translations'; import { getAccountTitle } from 'App/Containers/RealAccountSignup/helpers/constants'; import { connect } from 'Stores/connect'; -import { AccountsItemLoader } from 'App/Components/Layout/Header/Components/Preloader'; import AccountList from './account-switcher-account-list.jsx'; import AccountWrapper from './account-switcher-account-wrapper.jsx'; -import { getSortedAccountList, getSortedCFDList, isDemo, getCFDConfig } from './helpers'; +import { getSortedAccountList, getSortedCFDList, isDemo } from './helpers'; import { BinaryLink } from 'App/Components/Routes'; const AccountSwitcher = props => { @@ -38,97 +29,25 @@ const AccountSwitcher = props => { ); const [is_deriv_demo_visible, setDerivDemoVisible] = React.useState(true); const [is_deriv_real_visible, setDerivRealVisible] = React.useState(true); - const [is_dmt5_demo_visible, setDmt5DemoVisible] = React.useState(true); - const [is_dmt5_real_visible, setDmt5RealVisible] = React.useState(true); - const [is_dxtrade_demo_visible, setDxtradeDemoVisible] = React.useState(true); - const [is_dxtrade_real_visible, setDxtradeRealVisible] = React.useState(true); - const [exchanged_rate_cfd_real, setExchangedRateCfdReal] = React.useState(1); - const [exchanged_rate_cfd_demo, setExchangedRateCfdDemo] = React.useState(1); const [is_non_eu_regulator_visible, setNonEuRegulatorVisible] = React.useState(true); const [is_eu_regulator_visible, setEuRegulatorVisible] = React.useState(true); - const [filtered_real_accounts, setFilteredRealAccounts] = React.useState([]); - const [filtered_remaining_real_accounts, setFilteredRemainingRealAccounts] = React.useState([]); const wrapper_ref = React.useRef(); const scroll_ref = React.useRef(null); - const platform_name_dxtrade = getPlatformSettings('dxtrade').name; - const platform_name_mt5 = getPlatformSettings('mt5').name; - const account_total_balance_currency = props.obj_total_balance.currency; - const cfd_real_currency = - props.mt5_login_list.find(account => !isDemo(account))?.currency || - props.dxtrade_accounts_list.find(account => !isDemo(account))?.currency; const vrtc_loginid = props.account_list.find(account => account.is_virtual)?.loginid; const vrtc_currency = props.accounts[vrtc_loginid] ? props.accounts[vrtc_loginid].currency : 'USD'; - const cfd_demo_currency = - props.mt5_login_list.find(account => isDemo(account))?.currency || - props.dxtrade_accounts_list.find(account => isDemo(account))?.currency; const history = useHistory(); - React.useEffect(() => { - if (getMaxAccountsDisplayed()) { - setDmt5RealVisible(false); - } - }, [getMaxAccountsDisplayed]); - - React.useEffect(() => { - const getCurrentExchangeRate = (currency, setExchangeRate, base_currency = account_total_balance_currency) => { - if (currency) { - props.getExchangeRate(currency, base_currency).then(res => { - setExchangeRate(res); - }); - } - }; - if (cfd_real_currency !== account_total_balance_currency) { - getCurrentExchangeRate(cfd_real_currency, setExchangedRateCfdReal); - } - if (cfd_demo_currency !== vrtc_currency) { - getCurrentExchangeRate(cfd_demo_currency, setExchangedRateCfdDemo, vrtc_currency); - } - if (props.is_low_risk || props.is_high_risk) { - const real_accounts = getSortedAccountList(props.account_list, props.accounts).filter( - account => !account.is_virtual && account.loginid.startsWith('CR') - ); - setFilteredRealAccounts(real_accounts); - const remaining_real_accounts = getRemainingRealAccounts().filter(account => account === 'svg'); - setFilteredRemainingRealAccounts(remaining_real_accounts); - } else if (props.is_eu) { - const real_accounts = getSortedAccountList(props.account_list, props.accounts).filter( - account => !account.is_virtual && account.loginid.startsWith('MF') - ); - setFilteredRealAccounts(real_accounts); - const remaining_real_accounts = getRemainingRealAccounts().filter(account => account === 'maltainvest'); - setFilteredRemainingRealAccounts(remaining_real_accounts); - } - }, []); - - React.useEffect(() => { - if (scroll_ref.current && (is_dmt5_real_visible || is_dxtrade_real_visible)) { - scroll_ref.current.scrollIntoView({ - behavior: 'smooth', - block: getMaxAccountsDisplayed() ? 'end' : 'start', - inline: 'nearest', - }); - } - }, [getMaxAccountsDisplayed, is_dmt5_real_visible, is_dxtrade_real_visible]); - const toggleVisibility = section => { switch (section) { case 'demo_deriv': return setDerivDemoVisible(!is_deriv_demo_visible); - case 'demo_dmt5': - return setDmt5DemoVisible(!is_dmt5_demo_visible); - case 'demo_dxtrade': - return setDxtradeDemoVisible(!is_dxtrade_demo_visible); case 'real_deriv': return setDerivRealVisible(!is_deriv_real_visible); - case 'real_dmt5': - return setDmt5RealVisible(!is_dmt5_real_visible); - case 'real_dxtrade': - return setDxtradeRealVisible(!is_dxtrade_real_visible); case 'non-eu-regulator': return setNonEuRegulatorVisible(!is_non_eu_regulator_visible); case 'eu-regulator': @@ -138,10 +57,6 @@ const AccountSwitcher = props => { } }; - const getMaxAccountsDisplayed = React.useCallback(() => { - return props?.account_list?.length > 4; - }, [props?.account_list?.length]); - const handleLogout = async () => { closeAccountsDialog(); if (props.is_positions_drawer_on) { @@ -159,111 +74,11 @@ const AccountSwitcher = props => { useOnClickOutside(wrapper_ref, closeAccountsDialog, validateClickOutside); - const redirectToMt5 = async account_type => { - closeAccountsDialog(); - await props.history.push(routes.mt5); - window.location.hash = account_type; - }; - - const redirectToDXTrade = async account_type => { - closeAccountsDialog(); - await props.history.push(routes.dxtrade); - window.location.hash = account_type; - }; - - const hasRequiredCredentials = () => { - // for MT5 Real Financial STP, if true, users can instantly create a new account by setting password - if (!props.account_settings) return false; - const { citizen, tax_identification_number, tax_residence } = props.account_settings; - return !!(citizen && tax_identification_number && tax_residence); - }; - - const should_redirect_fstp_password = props.is_fully_authenticated && hasRequiredCredentials(); - - const openMt5RealAccount = account_type => { - const has_required_account = - account_type === 'synthetic' ? props.has_malta_account : props.has_maltainvest_account; - - if (props.show_eu_related_content && !has_required_account) { - closeAccountsDialog(); - props.openDerivRealAccountNeededModal(); - } else { - if (should_redirect_fstp_password) - sessionStorage.setItem( - 'open_cfd_account_type', - `real.${CFD_PLATFORMS.MT5}.${account_type}.set_password` - ); - else sessionStorage.setItem('open_cfd_account_type', `real.${CFD_PLATFORMS.MT5}.${account_type}`); - redirectToMt5Real(); - } - }; - - const redirectToMt5Real = (market_type, server) => { - const synthetic_server_region = server ? server.server_info?.geolocation.region : ''; - const synthetic_server_environment = server ? (server.server_info?.environment).toLowerCase() : ''; - - const serverElementName = () => { - let filter_server_number = ''; - let synthetic_region_string = ''; - if (market_type === 'synthetic') { - filter_server_number = synthetic_server_environment.split('server')[1]; - synthetic_region_string = `-${synthetic_server_region.toLowerCase()}`; - } - return `-${market_type}${synthetic_region_string}${filter_server_number}`; - }; - - redirectToMt5(`real${market_type ? serverElementName() : ''}`); - }; - - const redirectToDXTradeReal = () => { - redirectToDXTrade('real'); - }; - - const openMt5DemoAccount = account_type => { - if (props.show_eu_related_content && !props.has_maltainvest_account && props.standpoint.iom) { - closeAccountsDialog(); - props.openAccountNeededModal('maltainvest', localize('Deriv Multipliers'), localize('demo CFDs')); - return; - } - sessionStorage.setItem('open_cfd_account_type', `demo.${CFD_PLATFORMS.MT5}.${account_type}`); - redirectToMt5Demo(); - }; - - const openDXTradeDemoAccount = account_type => { - sessionStorage.setItem( - 'open_cfd_account_type', - `demo.${CFD_PLATFORMS.DXTRADE}.${account_type === 'dxtrade' ? 'all' : account_type}` - ); - redirectToDXTradeDemo(); - }; - - const openDXTradeRealAccount = account_type => { - sessionStorage.setItem('open_cfd_account_type', `real.${CFD_PLATFORMS.DXTRADE}.${account_type}`); - redirectToDXTradeReal(); - }; - - const redirectToMt5Demo = market_type => { - const hash_id = market_type ? `-${market_type}` : ''; - redirectToMt5(`demo${hash_id}`); - }; - - const redirectToDXTradeDemo = market_type => { - const hash_id = market_type ? `-${market_type}` : ''; - redirectToDXTrade(`demo${hash_id}`); - }; - const setAccountCurrency = () => { closeAccountsDialog(); props.toggleSetCurrencyModal(); }; - // TODO: Remove this and all usage after real release (74063) - const hasUnmergedAccounts = accounts => { - return Object.keys(accounts).some( - key => accounts[key].market_type === 'synthetic' || accounts[key].market_type === 'financial' - ); - }; - // * mt5_login_list returns these: // landing_company_short: "svg" | "malta" | "maltainvest" | "vanuatu" | "labuan" | "bvi" // account_type: "real" | "demo" @@ -275,60 +90,6 @@ const AccountSwitcher = props => { // * we should map them to landing_company: // mt_financial_company: { financial: {}, financial_stp: {}, swap_free: {} } // mt_gaming_company: { financial: {}, swap_free: {} } - const getRemainingAccounts = (existing_cfd_accounts, platform, is_eu, is_demo, getIsEligibleForMoreAccounts) => { - const all_config = getCFDConfig( - 'all', - props.landing_companies?.dxtrade_all_company, - existing_cfd_accounts, - props.mt5_trading_servers, - platform, - is_eu, - props.trading_platform_available_accounts, - getIsEligibleForMoreAccounts - ); - const gaming_config = getCFDConfig( - 'gaming', - platform === CFD_PLATFORMS.MT5 - ? props.landing_companies?.mt_gaming_company - : props.landing_companies?.dxtrade_gaming_company, - existing_cfd_accounts, - props.mt5_trading_servers, - platform, - is_eu, - props.trading_platform_available_accounts, - getIsEligibleForMoreAccounts - ); - const financial_config = getCFDConfig( - 'financial', - platform === CFD_PLATFORMS.MT5 - ? props.landing_companies?.mt_financial_company - : props.landing_companies?.dxtrade_financial_company, - existing_cfd_accounts, - props.mt5_trading_servers, - platform, - is_eu, - props.trading_platform_available_accounts, - getIsEligibleForMoreAccounts - ); - // Handling CFD for EU - // TODO: Move this logic inside getCFDConfig when CFD added to landing_companies API - if (is_eu) { - return [...financial_config]; - } - - // TODO: change this condition before real release - if (is_demo && platform === CFD_PLATFORMS.DXTRADE) { - return [...all_config]; - } - - if (!is_demo && platform === CFD_PLATFORMS.DXTRADE) { - return hasUnmergedAccounts(existing_cfd_accounts) - ? [...gaming_config, ...financial_config] - : [...all_config]; - } - - return [...gaming_config, ...financial_config]; - }; const doSwitch = async loginid => { closeAccountsDialog(); @@ -345,30 +106,6 @@ const AccountSwitcher = props => { const isRealAccountTab = active_tab_index === 0; const isDemoAccountTab = active_tab_index === 1; - const getDemoMT5 = () => { - return getSortedCFDList(props.mt5_login_list).filter(isDemo); - }; - - const getDemoDXTrade = () => { - return getSortedCFDList(props.dxtrade_accounts_list).filter( - account => isDemo(account) && account.enabled === 1 - ); - }; - - const getRemainingDemoMT5 = () => { - return getRemainingAccounts( - getDemoMT5(), - CFD_PLATFORMS.MT5, - props.show_eu_related_content, - true, - props.isEligibleForMoreDemoMt5Svg - ); - }; - - const getRemainingDemoDXTrade = () => { - return getRemainingAccounts(getDemoDXTrade(), CFD_PLATFORMS.DXTRADE, props.show_eu_related_content, true); - }; - const getRealMT5 = () => { const low_risk_non_eu = props.content_flag === ContentFlag.LOW_RISK_CR_NON_EU; if (low_risk_non_eu) { @@ -379,35 +116,6 @@ const AccountSwitcher = props => { return getSortedCFDList(props.mt5_login_list).filter(account => !isDemo(account)); }; - const getRealDXTrade = () => { - return getSortedCFDList(props.dxtrade_accounts_list).filter(account => - hasUnmergedAccounts(props.dxtrade_accounts_list) - ? !isDemo(account) && account.enabled === 1 && account.market_type !== 'all' - : !isDemo(account) && account.enabled === 1 && account.market_type === 'all' - ); - }; - - const findServerForAccount = acc => { - const server_name = acc.error ? acc.error.details.server : acc.server; - return props.mt5_login_list.length >= 1 - ? props.mt5_login_list.filter(account => !isDemo(account)).find(server => server.server === server_name) - : null; - }; - - const getRemainingRealMT5 = () => { - return getRemainingAccounts( - getRealMT5(), - CFD_PLATFORMS.MT5, - props.show_eu_related_content, - false, - props.isEligibleForMoreRealMt5 - ); - }; - - const getRemainingRealDXTrade = () => { - return getRemainingAccounts(getRealDXTrade(), CFD_PLATFORMS.DXTRADE, props.show_eu_related_content); - }; - const canOpenMulti = () => { if (props.available_crypto_currencies.length < 1 && !props.has_fiat) return true; return !props.is_virtual; @@ -424,7 +132,6 @@ const AccountSwitcher = props => { props.show_eu_related_content || props.is_virtual || !canOpenMulti() || - props.is_pre_appstore || is_regulated_able_to_change_currency ) { return props.upgradeable_landing_companies; @@ -436,121 +143,24 @@ const AccountSwitcher = props => { return props.account_list.filter(account => !account.is_virtual).some(account => account.title !== 'Real'); }; - const canUpgrade = () => { - return !!(props.is_virtual && props.can_upgrade_to); - }; - - const getTotalBalanceCfd = (accounts, is_demo, exchange_rate) => { - return accounts - .filter(account => (is_demo ? isDemo(account) : !isDemo(account))) - .reduce( - (total, account) => { - total.balance += account.balance * exchange_rate; - return total; - }, - { balance: 0 } - ); - }; - const getTotalDemoAssets = () => { const vrtc_balance = props.accounts[vrtc_loginid] ? props.accounts[vrtc_loginid].balance : 0; - const mt5_demo_total = getTotalBalanceCfd(props.mt5_login_list, true, exchanged_rate_cfd_demo); - const dxtrade_demo_total = getTotalBalanceCfd(props.dxtrade_accounts_list, true, exchanged_rate_cfd_demo); - - const total = vrtc_balance + mt5_demo_total.balance + dxtrade_demo_total.balance; - return props.is_pre_appstore ? vrtc_balance : total; + return vrtc_balance; }; const getTotalRealAssets = () => { // props.obj_total_balance.amount_mt5 is returning 0 regarding performance issues so we have to calculate // the total MT5 accounts balance from props.mt5_login_list. // You can remove this part if WS sends obj_total_balance.amount_mt5 correctly. - const mt5_total = getTotalBalanceCfd(props.mt5_login_list, false, exchanged_rate_cfd_real); - const dxtrade_total = getTotalBalanceCfd(props.dxtrade_accounts_list, false, exchanged_rate_cfd_real); - - let total = props.obj_total_balance.amount_real; const traders_hub_total = props.obj_total_balance.amount_real; - total += props.obj_total_balance.amount_mt5 > 0 ? props.obj_total_balance.amount_mt5 : mt5_total.balance; - total += - props.obj_total_balance.amount_dxtrade > 0 ? props.obj_total_balance.amount_dxtrade : dxtrade_total.balance; - - return props.is_pre_appstore ? traders_hub_total : total; - }; - - const isRealMT5AddDisabled = sub_account_type => { - // disabling synthetic account creation for MLT/MF users - if (props.standpoint.malta && sub_account_type === 'synthetic') return true; - if (props.show_eu_related_content) { - const account = getAccountTypeFields({ category: 'real', type: sub_account_type }); - return props.isAccountOfTypeDisabled(account?.account_type); - } - - return !props.has_active_real_account; - }; - - const isRealDXTradeAddDisabled = sub_account_type => { - if (props.show_eu_related_content) { - const account = getAccountTypeFields({ category: 'real', type: sub_account_type }); - return props.isAccountOfTypeDisabled(account?.account_type); - } - - return !props.has_active_real_account; + return traders_hub_total; }; if (!props.is_logged_in) return false; - const total_assets_message_demo = () => { - if (props.is_mt5_allowed && props.is_dxtrade_allowed) { - return localize( - 'Total assets in your Deriv, {{platform_name_mt5}} and {{platform_name_dxtrade}} demo accounts.', - { platform_name_dxtrade, platform_name_mt5 } - ); - } else if (props.is_mt5_allowed && !props.is_dxtrade_allowed) { - return localize('Total assets in your Deriv and {{platform_name_mt5}} demo accounts.', { - platform_name_mt5, - }); - } else if (!props.is_mt5_allowed && props.is_dxtrade_allowed) { - return localize('Total assets in your Deriv and {{platform_name_dxtrade}} demo accounts.', { - platform_name_dxtrade, - }); - } - return localize('Total assets in your Deriv demo accounts.'); - }; - - const total_assets_message_real = () => { - if (props.is_mt5_allowed && props.is_dxtrade_allowed) { - return localize( - 'Total assets in your Deriv, {{platform_name_mt5}} and {{platform_name_dxtrade}} real accounts.', - { platform_name_dxtrade, platform_name_mt5 } - ); - } else if (props.is_mt5_allowed && !props.is_dxtrade_allowed) { - return localize('Total assets in your Deriv and {{platform_name_mt5}} real accounts.', { - platform_name_mt5, - }); - } else if (!props.is_mt5_allowed && props.is_dxtrade_allowed) { - return localize('Total assets in your Deriv and {{platform_name_dxtrade}} real accounts.', { - platform_name_dxtrade, - }); - } - return localize('Total assets in your Deriv real accounts.'); - }; - - const isMT5Allowed = account_type => { - if (!props.is_mt5_allowed) return false; - - if (account_type === 'demo') { - return !!getDemoMT5().length || !!getRemainingDemoMT5().length; - } - return !!getRealMT5().length || !!getRemainingRealMT5().length; - }; - - const isDxtradeAllowed = () => { - return props.is_dxtrade_allowed; - }; - const canResetBalance = account => { const account_init_balance = 10000; return account.is_virtual && account.balance !== account_init_balance; @@ -573,19 +183,6 @@ const AccountSwitcher = props => { return all_svg_acc.length > 1; }; - const traders_hub_total_assets_message = localize('Total assets in your Deriv accounts.'); - - const default_total_assets_message = isRealAccountTab ? total_assets_message_real() : total_assets_message_demo(); - - const total_assets_message = props.is_pre_appstore - ? traders_hub_total_assets_message - : default_total_assets_message; - - const can_manage_account = - !props.show_eu_related_content || (props.show_eu_related_content && props.can_change_fiat_currency); - const can_manage_account_virtual = props.is_virtual && can_manage_account && props.has_active_real_account; - const can_manage_account_multi = !canUpgrade() && canOpenMulti() && can_manage_account; - const have_more_accounts = type => getSortedAccountList(props.account_list, props.accounts).filter( account => !account.is_virtual && account.loginid.startsWith(type) @@ -593,176 +190,7 @@ const AccountSwitcher = props => { const has_cr_account = props.account_list.find(acc => acc.loginid?.startsWith('CR'))?.loginid; - const default_demo_accounts = ( -
- {vrtc_loginid && ( - { - toggleVisibility('demo_deriv'); - }} - > -
- {getSortedAccountList(props.account_list, props.accounts) - .filter(account => account.is_virtual) - .map(account => ( - doSwitch(account.loginid)} - onClickResetVirtualBalance={resetBalance} - selected_loginid={props.account_loginid} - /> - ))} -
- - )} - {isMT5Allowed('demo') && ( - - {vrtc_loginid &&
} - { - toggleVisibility('demo_dmt5'); - }} - > - {props.is_loading_mt5 ? ( -
- -
- ) : ( - - {!!getDemoMT5().length && ( -
- {getDemoMT5().map(account => ( - redirectToMt5Demo(account.market_type)} - platform={CFD_PLATFORMS.MT5} - shortcode={ - account.market_type === 'financial' && - account.landing_company_short === 'labuan' && - account.landing_company_short - } - /> - ))} -
- )} - {getRemainingDemoMT5().map(account => ( -
- - - {account.title} - - -
- ))} - - )} - - - )} - {isDxtradeAllowed() && ( - <> -
- { - toggleVisibility('demo_dxtrade'); - }} - > - - {!!getDemoDXTrade().length && ( -
- {getDemoDXTrade().map(account => ( - redirectToDXTradeDemo(account.market_type)} - platform={CFD_PLATFORMS.DXTRADE} - /> - ))} -
- )} - {getRemainingDemoDXTrade().map(account => ( -
- - - {account.title} - - -
- ))} - - - - )} -
- ); - - const traders_hub_demo_account = ( + const demo_account = (
{vrtc_loginid && ( {
); - const default_real_accounts = ( -
- - 1 ? 'accounts' : 'account'}`)} - is_visible={is_deriv_real_visible} - toggleVisibility={() => { - toggleVisibility('real_deriv'); - }} - > -
- {filtered_real_accounts.map(account => { - return ( - doSwitch(account.loginid)} - selected_loginid={props.account_loginid} - should_show_server_name={checkMultipleSvgAcc()} - /> - ); - })} -
- {filtered_remaining_real_accounts.map((account, index) => ( -
- - - {getAccountTitle( - account, - { account_residence: props.client_residence }, - props.country_standpoint - )} - - -
- ))} - {(can_manage_account_multi || - (!props.has_active_real_account && filtered_remaining_real_accounts?.length === 0)) && ( - - )} - - - {isMT5Allowed('real') && ( - -
- { - toggleVisibility('real_dmt5'); - }} - > - {props.is_loading_mt5 ? ( -
- -
- ) : ( - - {!!getRealMT5().length && ( -
- {getRealMT5().map(account => ( - { - redirectToMt5Real( - account.market_type, - findServerForAccount(account) - ); - }} - server={findServerForAccount(account)} - platform={CFD_PLATFORMS.MT5} - shortcode={account.landing_company_short} - should_show_server_name={checkMultipleSvgAcc()} - /> - ))} -
- )} - {getRemainingRealMT5().map(account => ( -
- - - {account.title} - - -
- ))} - - )} - - - )} - {isDxtradeAllowed() && ( - -
- { - toggleVisibility('real_dxtrade'); - }} - > - {props.is_loading_dxtrade ? ( -
- -
- ) : ( - - {!!getRealDXTrade().length && ( -
- {getRealDXTrade().map(account => ( - redirectToDXTradeReal(account.market_type)} - platform={CFD_PLATFORMS.DXTRADE} - /> - ))} -
- )} - {getRemainingRealDXTrade().map(account => ( -
- - - {/* TODO: Remove the below condition once Deriv X update is released */} - {account.title === localize('Derived') - ? localize('Synthetic') - : account.title} - - -
- ))} - - )} - - - )} -
- ); - - const traders_hub_real_accounts = ( + const real_accounts = (
{!props.is_eu || props.is_low_risk ? ( @@ -1209,10 +384,6 @@ const AccountSwitcher = props => {
); - const real_account = props.is_pre_appstore ? traders_hub_real_accounts : default_real_accounts; - - const demo_accounts = props.is_pre_appstore ? traders_hub_demo_account : default_demo_accounts; - const first_real_login_id = props.account_list?.find(account => /^(CR|MF)/.test(account.loginid))?.loginid; const TradersHubRedirect = () => { @@ -1242,11 +413,10 @@ const AccountSwitcher = props => { ); }; - if (props.is_pre_appstore) { - if ((isRealAccountTab && props.has_any_real_account) || isDemoAccountTab) { - return ; - } + if ((isRealAccountTab && props.has_any_real_account) || isDemoAccountTab) { + return ; } + return null; }; @@ -1262,21 +432,21 @@ const AccountSwitcher = props => { into a single reusable AccountListItem component */}
- {real_account} + {real_accounts} - {real_account} + {real_accounts}
- {demo_accounts} + {demo_account} - {demo_accounts} + {demo_account}
@@ -1304,22 +474,16 @@ const AccountSwitcher = props => {
- {total_assets_message} + {localize('Total assets in your Deriv accounts.')}
-
- {props.is_pre_appstore && isRealAccountTab && props.has_active_real_account && !props.is_virtual && ( +
+ {isRealAccountTab && props.has_active_real_account && !props.is_virtual && (
-
diff --git a/packages/core/src/Stores/client-store.js b/packages/core/src/Stores/client-store.js index a26e35e3768d..c12dc6ce5e49 100644 --- a/packages/core/src/Stores/client-store.js +++ b/packages/core/src/Stores/client-store.js @@ -417,27 +417,6 @@ export default class ClientStore extends BaseStore { LocalStore.set(LANGUAGE_KEY, lang_from_url); } ); - // TODO: Remove this after setting trading_hub enabled for all users - - reaction( - () => [this.account_settings], - () => { - const { trading_hub } = this.account_settings; - const is_traders_hub = !!trading_hub; - if (!this.is_pre_appstore && window.location.pathname === routes.traders_hub) { - window.location.href = routes.root; - } else if ( - this.is_pre_appstore && - window.location.pathname === routes.root && - is_traders_hub !== this.is_pre_appstore - ) { - window.location.href = routes.traders_hub; - } else { - return null; - } - return null; - } - ); when( () => !this.is_logged_in && this.root_store.ui && this.root_store.ui.is_real_acc_signup_on, From 5d3eda4893d17851ec8a217bf68af81b844260c6 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Wed, 8 Mar 2023 12:01:56 +0800 Subject: [PATCH 02/35] chore: redirect existing users to traders hub upon logging in --- packages/core/src/Stores/client-store.js | 17 ++--------------- 1 file changed, 2 insertions(+), 15 deletions(-) diff --git a/packages/core/src/Stores/client-store.js b/packages/core/src/Stores/client-store.js index c12dc6ce5e49..ea4ee38646c1 100644 --- a/packages/core/src/Stores/client-store.js +++ b/packages/core/src/Stores/client-store.js @@ -12,10 +12,6 @@ import { getUrlSmartTrader, isDesktopOs, isEmptyObject, - isLocal, - isProduction, - isStaging, - isTestLink, redirectToLogin, routes, setCurrencies, @@ -2112,17 +2108,8 @@ export default class ClientStore extends BaseStore { const is_client_logging_in = login_new_user ? login_new_user.token1 : obj_params.token1; if (is_client_logging_in) { - const redirect_url = sessionStorage.getItem('redirect_url'); - const local_pre_appstore = localStorage.getItem('is_pre_appstore'); - if ( - local_pre_appstore === 'true' && - redirect_url?.endsWith('/') && - (isTestLink() || isProduction() || isLocal() || isStaging()) - ) { - window.history.replaceState({}, document.title, '/appstore/traders-hub'); - } else { - window.history.replaceState({}, document.title, sessionStorage.getItem('redirect_url')); - } + window.history.replaceState({}, document.title, '/appstore/traders-hub'); + SocketCache.clear(); // is_populating_account_list is used for socket general to know not to filter the first-time logins this.is_populating_account_list = true; From 4b748c183b5484656705d68185d77cce2d39db98 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Wed, 8 Mar 2023 13:45:56 +0800 Subject: [PATCH 03/35] fix: comments --- packages/core/src/Stores/client-store.js | 11 ++++++++++- .../sass/app/_common/components/account-switcher.scss | 4 ---- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/packages/core/src/Stores/client-store.js b/packages/core/src/Stores/client-store.js index ea4ee38646c1..8f4670fac5c2 100644 --- a/packages/core/src/Stores/client-store.js +++ b/packages/core/src/Stores/client-store.js @@ -12,6 +12,10 @@ import { getUrlSmartTrader, isDesktopOs, isEmptyObject, + isLocal, + isProduction, + isStaging, + isTestLink, redirectToLogin, routes, setCurrencies, @@ -2108,8 +2112,13 @@ export default class ClientStore extends BaseStore { const is_client_logging_in = login_new_user ? login_new_user.token1 : obj_params.token1; if (is_client_logging_in) { - window.history.replaceState({}, document.title, '/appstore/traders-hub'); + const redirect_url = sessionStorage.getItem('redirect_url'); + if (redirect_url?.endsWith('/') && (isTestLink() || isProduction() || isLocal() || isStaging())) { + window.history.replaceState({}, document.title, '/appstore/traders-hub'); + } else { + window.history.replaceState({}, document.title, sessionStorage.getItem('redirect_url')); + } SocketCache.clear(); // is_populating_account_list is used for socket general to know not to filter the first-time logins this.is_populating_account_list = true; diff --git a/packages/core/src/sass/app/_common/components/account-switcher.scss b/packages/core/src/sass/app/_common/components/account-switcher.scss index 5b1ae4039edd..645c305f729c 100644 --- a/packages/core/src/sass/app/_common/components/account-switcher.scss +++ b/packages/core/src/sass/app/_common/components/account-switcher.scss @@ -393,10 +393,6 @@ grid-template-columns: auto auto; justify-content: space-between; padding-left: 1.3rem; - - &--traders-hub { - padding: 0.5rem 0 0.3rem 1.3rem; - } } &__compare { justify-self: end; From 481a2a123d30ad091d48b3f164ebaebd33daf485 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Wed, 8 Mar 2023 13:55:18 +0800 Subject: [PATCH 04/35] fix: notifications in traders hub --- .../notifications-dialog.jsx | 85 +++++++++---------- 1 file changed, 40 insertions(+), 45 deletions(-) diff --git a/packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx b/packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx index 43ca3c90aba4..112e84789686 100644 --- a/packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx +++ b/packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx @@ -15,7 +15,7 @@ import { import { BinaryLink } from 'App/Components/Routes'; import { connect } from 'Stores/connect'; import { localize, Localize } from '@deriv/translations'; -import { isEmptyObject, isMobile, toTitleCase } from '@deriv/shared'; +import { isEmptyObject, isMobile, toTitleCase, routes } from '@deriv/shared'; import { EmptyNotification } from 'App/Components/Elements/Notifications/empty-notification.jsx'; const NotificationsList = ({ notifications, toggleDialog }) => { @@ -117,54 +117,53 @@ const ClearAllFooter = ({ is_empty, clearNotifications }) => { ); }; -const NotificationListWrapper = React.forwardRef( - ({ notifications, toggleDialog, clearNotifications, is_pre_appstore }, ref) => { - const is_empty = !notifications?.length; +const NotificationListWrapper = React.forwardRef(({ notifications, toggleDialog, clearNotifications }, ref) => { + const is_empty = !notifications?.length; - return ( + const traders_hub = window.location.pathname === routes.traders_hub; + + return ( +
+
+ + + +
-
- - - -
-
- - {is_empty ? ( - - ) : ( - - )} - -
- + + {is_empty ? ( + + ) : ( + + )} +
- ); - } -); + +
+ ); +}); NotificationListWrapper.displayName = 'NotificationListWrapper'; const NotificationsDialog = ({ - is_pre_appstore, is_visible, notifications, toggleDialog, @@ -205,7 +204,6 @@ const NotificationsDialog = ({ onClose={toggleDialog} > ({ +export default connect(({ common, notifications }) => ({ app_routing_history: common.app_routing_history, - is_pre_appstore: client.is_pre_appstore, notifications: notifications.notifications, removeNotificationByKey: notifications.removeNotificationByKey, removeNotificationMessage: notifications.removeNotificationMessage, From 535a55102a2fe15621e10f1d7a49d37e903b2367 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Wed, 8 Mar 2023 13:58:30 +0800 Subject: [PATCH 05/35] fix: redirect users to traders hub if they go to mt5 page --- packages/cfd/src/Containers/cfd-dashboard.tsx | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/cfd/src/Containers/cfd-dashboard.tsx b/packages/cfd/src/Containers/cfd-dashboard.tsx index ff0f18c4642b..2c236480c9b7 100644 --- a/packages/cfd/src/Containers/cfd-dashboard.tsx +++ b/packages/cfd/src/Containers/cfd-dashboard.tsx @@ -178,7 +178,6 @@ export type TCFDDashboardProps = RouteComponentProps & { real_account_creation_unlock_date: string; setShouldShowCooldownModal: (value: boolean) => void; show_eu_related_content: boolean; - is_pre_appstore: boolean; }; const CFDDashboard = (props: TCFDDashboardProps) => { @@ -434,7 +433,6 @@ const CFDDashboard = (props: TCFDDashboardProps) => { real_account_creation_unlock_date, setShouldShowCooldownModal, show_eu_related_content, - is_pre_appstore, } = props; const should_show_missing_real_account = @@ -465,7 +463,7 @@ const CFDDashboard = (props: TCFDDashboardProps) => { const verification_code = platform === CFD_PLATFORMS.MT5 ? mt5_verification_code : dxtrade_verification_code; - if ((platform === CFD_PLATFORMS.MT5 || platform === CFD_PLATFORMS.DXTRADE) && is_pre_appstore) + if (platform === CFD_PLATFORMS.MT5 || platform === CFD_PLATFORMS.DXTRADE) return ; if (platform === CFD_PLATFORMS.DXTRADE && !is_dxtrade_allowed) return ; @@ -794,6 +792,5 @@ export default withRouter( setShouldShowCooldownModal: ui.setShouldShowCooldownModal, real_account_creation_unlock_date: client.real_account_creation_unlock_date, show_eu_related_content: traders_hub.show_eu_related_content, - is_pre_appstore: client.is_pre_appstore, }))(CFDDashboard) ); From 148a05554569219a9b1ac9277cdbe0d76932bc51 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Wed, 8 Mar 2023 14:16:45 +0800 Subject: [PATCH 06/35] fix: refactor and remove mt5 and deriv x from platform switcher --- packages/cfd/src/Containers/cfd-password-modal.tsx | 3 --- .../Components/Layout/Header/platform-dropdown.jsx | 14 +++----------- .../Components/Layout/Header/platform-switcher.jsx | 4 +--- packages/core/src/App/Constants/platform-config.js | 14 -------------- .../Containers/Layout/header/dtrader-header.jsx | 4 ---- 5 files changed, 4 insertions(+), 35 deletions(-) diff --git a/packages/cfd/src/Containers/cfd-password-modal.tsx b/packages/cfd/src/Containers/cfd-password-modal.tsx index cc03d166976c..945e2415183a 100644 --- a/packages/cfd/src/Containers/cfd-password-modal.tsx +++ b/packages/cfd/src/Containers/cfd-password-modal.tsx @@ -130,7 +130,6 @@ type TCFDPasswordModalProps = RouteComponentProps & { is_cfd_password_modal_enabled: boolean; is_cfd_success_dialog_enabled: boolean; is_dxtrade_allowed: boolean; - is_pre_appstore: boolean; jurisdiction_selected_shortcode: string; platform: string; has_cfd_error: boolean; @@ -586,7 +585,6 @@ const CFDPasswordModal = ({ form_error, getAccountStatus, history, - is_pre_appstore, is_logged_in, context, is_cfd_password_modal_enabled, @@ -950,5 +948,4 @@ 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, - is_pre_appstore: client.is_pre_appstore, }))(withRouter(CFDPasswordModal)); diff --git a/packages/core/src/App/Components/Layout/Header/platform-dropdown.jsx b/packages/core/src/App/Components/Layout/Header/platform-dropdown.jsx index 924ebeddf379..a4493a64f09f 100644 --- a/packages/core/src/App/Components/Layout/Header/platform-dropdown.jsx +++ b/packages/core/src/App/Components/Layout/Header/platform-dropdown.jsx @@ -2,7 +2,7 @@ import React from 'react'; import ReactDOM from 'react-dom'; import PropTypes from 'prop-types'; import { Div100vhContainer, Icon, useOnClickOutside } from '@deriv/components'; -import { routes, isDesktop, isMobile, getActivePlatform, getPlatformSettings } from '@deriv/shared'; +import { routes, isDesktop, isMobile, getActivePlatform } from '@deriv/shared'; import { BinaryLink } from 'App/Components/Routes'; import 'Sass/app/_common/components/platform-dropdown.scss'; @@ -49,7 +49,7 @@ const PlatformDropdownContent = ({ platform, app_routing_history, hide_dropdown_ : null; }; -const PlatformDropdown = ({ app_routing_history, closeDrawer, platform_config, is_pre_appstore }) => { +const PlatformDropdown = ({ app_routing_history, closeDrawer, platform_config }) => { React.useEffect(() => { window.addEventListener('popstate', closeDrawer); @@ -72,17 +72,9 @@ const PlatformDropdown = ({ app_routing_history, closeDrawer, platform_config, i
{platform_config.map(platform => { - const should_hide_dropdown_item = - (platform.name === getPlatformSettings('mt5').name || - platform.name === getPlatformSettings('dxtrade').name) && - is_pre_appstore; return (
- +
); })} diff --git a/packages/core/src/App/Components/Layout/Header/platform-switcher.jsx b/packages/core/src/App/Components/Layout/Header/platform-switcher.jsx index 9aa53e3436e6..0aed0ecf0c2a 100644 --- a/packages/core/src/App/Components/Layout/Header/platform-switcher.jsx +++ b/packages/core/src/App/Components/Layout/Header/platform-switcher.jsx @@ -13,7 +13,6 @@ import { withRouter } from 'react-router-dom'; const PlatformSwitcher = ({ toggleDrawer, - is_pre_appstore, app_routing_history, platform_config, is_landing_company_loaded, @@ -82,7 +81,6 @@ const PlatformSwitcher = ({ platform_config={platform_config} closeDrawer={closeDrawer} app_routing_history={app_routing_history} - is_pre_appstore={is_pre_appstore} /> @@ -93,7 +91,7 @@ PlatformSwitcher.propTypes = { platform_config: PropTypes.array, toggleDrawer: PropTypes.func, app_routing_history: PropTypes.array, - is_pre_appstore: PropTypes.bool, + is_landing_company_loaded: PropTypes.bool, is_logged_in: PropTypes.bool, is_logging_in: PropTypes.bool, diff --git a/packages/core/src/App/Constants/platform-config.js b/packages/core/src/App/Constants/platform-config.js index 969130ff7899..80e8391ca34f 100644 --- a/packages/core/src/App/Constants/platform-config.js +++ b/packages/core/src/App/Constants/platform-config.js @@ -17,20 +17,6 @@ const platform_config = [ description: () => localize('Automated trading at your fingertips. No coding needed.'), link_to: routes.bot, }, - { - icon: getPlatformSettings('mt5').icon, - title: () => getPlatformSettings('mt5').name, - name: getPlatformSettings('mt5').name, - description: () => localize('Trade on Deriv MT5, the all-in-one FX and CFD trading platform.'), - link_to: routes.mt5, - }, - { - icon: getPlatformSettings('dxtrade').icon, - title: () => getPlatformSettings('dxtrade').name, - name: getPlatformSettings('dxtrade').name, - description: () => localize('Trade CFDs on a customizable, easy-to-use trading platform.'), - link_to: routes.dxtrade, - }, { icon: getPlatformSettings('smarttrader').icon, title: () => getPlatformSettings('smarttrader').name, diff --git a/packages/core/src/App/Containers/Layout/header/dtrader-header.jsx b/packages/core/src/App/Containers/Layout/header/dtrader-header.jsx index 9f3f9b1740c9..b5a94c65c081 100644 --- a/packages/core/src/App/Containers/Layout/header/dtrader-header.jsx +++ b/packages/core/src/App/Containers/Layout/header/dtrader-header.jsx @@ -40,7 +40,6 @@ const DTraderHeader = ({ is_logging_in, is_mt5_allowed, is_notifications_visible, - is_pre_appstore, is_route_modal_on, is_virtual, notifications_count, @@ -94,7 +93,6 @@ const DTraderHeader = ({ @@ -194,7 +192,6 @@ DTraderHeader.propTypes = { toggleNotifications: PropTypes.func, country_standpoint: PropTypes.object, history: PropTypes.object, - is_pre_appstore: PropTypes.bool, is_switching: PropTypes.bool, }; @@ -229,6 +226,5 @@ export default connect(({ client, common, ui, notifications }) => ({ removeNotificationMessage: notifications.removeNotificationMessage, toggleAccountsDialog: ui.toggleAccountsDialog, toggleNotifications: notifications.toggleNotificationsModal, - is_pre_appstore: client.is_pre_appstore, is_switching: client.is_switching, }))(withRouter(DTraderHeader)); From 0a5dcfdba237b15be1a1b71e7fd5cb64681afc4d Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Wed, 8 Mar 2023 15:15:19 +0800 Subject: [PATCH 07/35] fix: remove setisPreAppstore and exit traders hub modal --- .../Layout/Header/toggle-menu-drawer.jsx | 41 +------ .../Layout/header/default-header.jsx | 43 +------ .../Layout/header/trading-hub-header.jsx | 4 - .../src/App/Containers/Modals/app-modals.jsx | 4 - .../exit-traders-hub-modal.jsx | 108 ------------------ .../exit-traders-hub-modal.scss | 36 ------ .../Modals/exit-traders-hub-modal/index.ts | 4 - .../RealAccountSignup/real-account-signup.jsx | 4 - packages/core/src/Stores/ui-store.js | 7 -- 9 files changed, 6 insertions(+), 245 deletions(-) delete mode 100644 packages/core/src/App/Containers/Modals/exit-traders-hub-modal/exit-traders-hub-modal.jsx delete mode 100644 packages/core/src/App/Containers/Modals/exit-traders-hub-modal/exit-traders-hub-modal.scss delete mode 100644 packages/core/src/App/Containers/Modals/exit-traders-hub-modal/index.ts diff --git a/packages/core/src/App/Components/Layout/Header/toggle-menu-drawer.jsx b/packages/core/src/App/Components/Layout/Header/toggle-menu-drawer.jsx index f5b40c4814c5..7e3cd7a77396 100644 --- a/packages/core/src/App/Components/Layout/Header/toggle-menu-drawer.jsx +++ b/packages/core/src/App/Components/Layout/Header/toggle-menu-drawer.jsx @@ -2,7 +2,7 @@ import classNames from 'classnames'; import React from 'react'; import { Div100vhContainer, Icon, MobileDrawer, ToggleSwitch, Text, Button } from '@deriv/components'; import { useOnrampVisible, useAccountTransferVisible } from '@deriv/hooks'; -import { routes, PlatformContext, getStaticUrl, whatsapp_url, ContentFlag } from '@deriv/shared'; +import { routes, PlatformContext, getStaticUrl, whatsapp_url } from '@deriv/shared'; import { observer, useStore } from '@deriv/stores'; import { localize, getAllowedLanguages, getLanguage } from '@deriv/translations'; import NetworkStatus from 'App/Components/Layout/Footer'; @@ -11,7 +11,7 @@ import { BinaryLink } from 'App/Components/Routes'; import getRoutesConfig from 'App/Constants/routes-config'; import { changeLanguage } from 'Utils/Language'; import LiveChat from 'App/Components/Elements/LiveChat'; -import { useLocation, useHistory } from 'react-router-dom'; +import { useLocation } from 'react-router-dom'; import useLiveChat from 'App/Components/Elements/LiveChat/use-livechat.ts'; import PlatformSwitcher from './platform-switcher'; @@ -104,13 +104,7 @@ const MenuLink = observer( const ToggleMenuDrawer = observer(({ platform_config }) => { const { common, ui, client, traders_hub, modules } = useStore(); const { app_routing_history } = common; - const { - disableApp, - enableApp, - is_dark_mode_on: is_dark_mode, - setDarkMode: toggleTheme, - toggleExitTradersHubModal, - } = ui; + const { disableApp, enableApp, is_dark_mode_on: is_dark_mode, setDarkMode: toggleTheme } = ui; const { account_status, is_logged_in, @@ -122,7 +116,7 @@ const ToggleMenuDrawer = observer(({ platform_config }) => { landing_company_shortcode: active_account_landing_company, is_landing_company_loaded, is_pre_appstore, - setIsPreAppStore, + is_eu, } = client; const { cashier } = modules; @@ -130,7 +124,7 @@ const ToggleMenuDrawer = observer(({ platform_config }) => { const { is_p2p_enabled } = general_store; const { is_payment_agent_transfer_visible } = payment_agent_transfer; const { is_payment_agent_visible } = payment_agent; - const { content_flag, should_show_exit_traders_modal, switchToCRAccount, show_eu_related_content } = traders_hub; + const { show_eu_related_content } = traders_hub; const is_account_transfer_visible = useAccountTransferVisible(); const is_onramp_visible = useOnrampVisible(); @@ -348,31 +342,9 @@ const ToggleMenuDrawer = observer(({ platform_config }) => { const { pathname: route } = useLocation(); - const history = useHistory(); - const is_trading_hub_category = route.startsWith(routes.traders_hub) || route.startsWith(routes.cashier) || route.startsWith(routes.account); - const tradingHubRedirect = async () => { - if (is_pre_appstore) { - if (should_show_exit_traders_modal) { - toggleDrawer(); - toggleExitTradersHubModal(); - } else { - setIsPreAppStore(false); - if (content_flag === ContentFlag.LOW_RISK_CR_EU) { - await switchToCRAccount(); - } - toggleDrawer(); - history.push(routes.root); - } - } else { - setIsPreAppStore(true); - toggleDrawer(); - history.push(routes.traders_hub); - } - }; - return ( @@ -419,7 +391,6 @@ const ToggleMenuDrawer = observer(({ platform_config }) => { }`} type='button' large - onClick={tradingHubRedirect} >
@@ -470,7 +441,6 @@ const ToggleMenuDrawer = observer(({ platform_config }) => { }`} type='button' large - onClick={tradingHubRedirect} >
@@ -639,7 +609,6 @@ const ToggleMenuDrawer = observer(({ platform_config }) => { }`} type='button' large - onClick={tradingHubRedirect} >
diff --git a/packages/core/src/App/Containers/Layout/header/default-header.jsx b/packages/core/src/App/Containers/Layout/header/default-header.jsx index 9847a92a2587..4b00bf43ecb6 100644 --- a/packages/core/src/App/Containers/Layout/header/default-header.jsx +++ b/packages/core/src/App/Containers/Layout/header/default-header.jsx @@ -1,12 +1,10 @@ import React from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; -import { DesktopWrapper, MobileWrapper, Text, Icon } from '@deriv/components'; +import { DesktopWrapper, MobileWrapper } from '@deriv/components'; import { AccountActions, MenuLinks, PlatformSwitcher } from 'App/Components/Layout/Header'; import { getDecimalPlaces, isMobile, platforms, routes } from '@deriv/shared'; import { AccountsInfoLoader } from 'App/Components/Layout/Header/Components/Preloader'; -import { BinaryLink } from 'App/Components/Routes'; -import { Localize } from '@deriv/translations'; import NewVersionNotification from 'App/Containers/new-version-notification.jsx'; import RealAccountSignup from 'App/Containers/RealAccountSignup'; import SetAccountCurrencyModal from 'App/Containers/SetAccountCurrencyModal'; @@ -45,7 +43,6 @@ const DefaultHeader = ({ openRealAccountSignup, platform, removeNotificationMessage, - setIsPreAppStore, toggleAccountsDialog, toggleNotifications, is_landing_company_loaded, @@ -82,34 +79,6 @@ const DefaultHeader = ({ return true; }); - const Divider = () => { - return
; - }; - - const ExploreTradingHub = () => { - const enablePreAppstore = () => setIsPreAppStore(true); - - return ( -
- - - - - - - -
- ); - }; - return (
- {is_logging_in - ? null - : is_logged_in && ( - - - - - )}
({ toggleNotifications: notifications.toggleNotificationsModal, is_trading_assessment_for_existing_user_enabled: ui.is_trading_assessment_for_existing_user_enabled, is_landing_company_loaded: client.is_landing_company_loaded, - setIsPreAppStore: client.setIsPreAppStore, is_switching: client.is_switching, }))(withRouter(DefaultHeader)); diff --git a/packages/core/src/App/Containers/Layout/header/trading-hub-header.jsx b/packages/core/src/App/Containers/Layout/header/trading-hub-header.jsx index 10f597e87ac1..2b3f4164ee3b 100644 --- a/packages/core/src/App/Containers/Layout/header/trading-hub-header.jsx +++ b/packages/core/src/App/Containers/Layout/header/trading-hub-header.jsx @@ -226,13 +226,11 @@ TradingHubHeader.propTypes = { modal_data: PropTypes.object, notifications_count: PropTypes.number, platform: PropTypes.string, - setIsPreAppStore: PropTypes.func, setIsOnboardingVisited: PropTypes.func, settings_extension: PropTypes.array, should_show_exit_traders_modal: PropTypes.bool, toggleIsTourOpen: PropTypes.func, toggleNotifications: PropTypes.func, - toggleExitTradersHubModal: PropTypes.func, content_flag: PropTypes.string, switchToCRAccount: PropTypes.func, }; @@ -253,10 +251,8 @@ export default connect(({ client, common, notifications, ui, traders_hub }) => ( loginid: client.loginid, platform: common.platform, setIsOnboardingVisited: traders_hub.setIsOnboardingVisited, - setIsPreAppStore: client.setIsPreAppStore, should_show_exit_traders_modal: traders_hub.should_show_exit_traders_modal, toggleIsTourOpen: traders_hub.toggleIsTourOpen, - toggleExitTradersHubModal: ui.toggleExitTradersHubModal, content_flag: traders_hub.content_flag, switchToCRAccount: traders_hub.switchToCRAccount, }))(withRouter(TradingHubHeader)); diff --git a/packages/core/src/App/Containers/Modals/app-modals.jsx b/packages/core/src/App/Containers/Modals/app-modals.jsx index cd120ca28b75..34026949b219 100644 --- a/packages/core/src/App/Containers/Modals/app-modals.jsx +++ b/packages/core/src/App/Containers/Modals/app-modals.jsx @@ -8,7 +8,6 @@ import CooldownWarningModal from './cooldown-warning-modal.jsx'; import TradingAssessmentExistingUser from './trading-assessment-existing-user.jsx'; import CompletedAssessmentModal from './completed-assessment-modal.jsx'; import DerivRealAccountRequiredModal from 'App/Components/Elements/Modals/deriv-real-account-required-modal.jsx'; -import ExitTradersHubModal from './exit-traders-hub-modal'; import RiskAcceptTestWarningModal from './risk-accept-test-warning-modal'; const AccountSignupModal = React.lazy(() => @@ -75,7 +74,6 @@ const AppModals = ({ active_account_landing_company, is_deriv_account_needed_modal_visible, is_warning_scam_message_modal_visible, - is_exit_traders_hub_modal_visible, is_trading_experience_incomplete, should_show_risk_accept_modal, }) => { @@ -148,8 +146,6 @@ const AppModals = ({ ComponentToLoad = ; } else if (is_deriv_account_needed_modal_visible) { ComponentToLoad = ; - } else if (is_exit_traders_hub_modal_visible) { - ComponentToLoad = ; } else if (should_show_risk_accept_modal) { ComponentToLoad = ; } diff --git a/packages/core/src/App/Containers/Modals/exit-traders-hub-modal/exit-traders-hub-modal.jsx b/packages/core/src/App/Containers/Modals/exit-traders-hub-modal/exit-traders-hub-modal.jsx deleted file mode 100644 index f5e42ce4125b..000000000000 --- a/packages/core/src/App/Containers/Modals/exit-traders-hub-modal/exit-traders-hub-modal.jsx +++ /dev/null @@ -1,108 +0,0 @@ -import React from 'react'; -import { useHistory } from 'react-router'; -import { connect } from 'Stores/connect'; -import { Button, DesktopWrapper, MobileDialog, MobileWrapper, Modal, Text, UILoader } from '@deriv/components'; -import { isMobile, routes, ContentFlag } from '@deriv/shared'; -import { localize } from '@deriv/translations'; - -const ExitTradersHubModal = ({ - disableApp, - enableApp, - is_exit_traders_hub_modal_visible, - toggleExitTradersHubModal, - setIsPreAppStore, - content_flag, - switchAccount, - account_list, - active_accounts, - setIsLoggingIn, -}) => { - const history = useHistory(); - - const exit_traders_hub_modal_content = ( - - {localize( - "You won't be able to see your EU account in the traditional view. The open positions in your EU account will remain open. You can switch back to this view at any time." - )} - - ); - - const ModalContent = () => { - return ( - - {exit_traders_hub_modal_content} - - - - ) : ( - + {is_logged_in && is_trading_hub_category ? ( + + - - )} - {is_logged_in && ( - - + + {localize("Exit Trader's hub")} + + - - )} - {is_logged_in && !is_trading_hub_category && ( - - - - )} - {primary_routes_config.map((route_config, idx) => - getRoutesWithSubMenu(route_config, idx) - )} - { - e.preventDefault(); - toggleTheme(!is_dark_mode); - }} - > -
- - - {localize('Dark theme')} - - toggleTheme(!is_dark_mode)} - is_enabled={is_dark_mode} +
- - {is_logged_in && ( - - {HelpCentreRoute()} - - - - - - - {is_eu && show_eu_related_content && !is_virtual && ( - - - - )} - - - - {liveChat.isReady && ( - - - - {localize('WhatsApp')} - - - )} - - {is_appstore ? null : } - - { - logoutClient(); - toggleDrawer(); - }} - className='dc-mobile-drawer__item' - > - - - - - - - - )} - - - )} - - {!is_appstore && !is_pre_appstore && ( - + + + ) : ( { toggleDrawer={toggleDrawer} /> - -
- - + )} + +
+ + {is_logged_in && ( + + + )} + {is_logged_in && !is_trading_hub_category && ( { onClickLink={toggleDrawer} /> - {primary_routes_config.map((route_config, idx) => - getRoutesWithSubMenu(route_config, idx) - )} - {getLanguageRoutes()} - { - - { - e.preventDefault(); - toggleTheme(!is_dark_mode); - }} - > -
- - - {localize('Dark theme')} - - toggleTheme(!is_dark_mode)} - is_enabled={is_dark_mode} - /> -
+ )} + {primary_routes_config.map((route_config, idx) => + getRoutesWithSubMenu(route_config, idx) + )} + { + e.preventDefault(); + toggleTheme(!is_dark_mode); + }} + > +
+ + {localize('Dark theme')} + toggleTheme(!is_dark_mode)} + is_enabled={is_dark_mode} + /> +
+ + {is_logged_in && ( + + {HelpCentreRoute()} + + + + + + + {is_eu && show_eu_related_content && !is_virtual && ( + + - {HelpCentreRoute(true)} - - } - {liveChat.isReady && ( - - - - {localize('WhatsApp')} - + )} + + + + {liveChat.isReady && ( + + + + {localize('WhatsApp')} + + + )} + + {is_appstore ? null : } - )} - - {is_appstore ? null : } - - {secondary_routes_config.map(route_config => getRoutesWithSubMenu(route_config))} - {is_logged_in && ( { logoutClient(); toggleDrawer(); }} + className='dc-mobile-drawer__item' > - + - )} - - - )} + + + + + + )} + +
- {!is_pre_appstore && ( - - - - - )} diff --git a/packages/core/src/App/Components/Routes/binary-routes.jsx b/packages/core/src/App/Components/Routes/binary-routes.jsx index e05b0d3088d2..ffd1e965b421 100644 --- a/packages/core/src/App/Components/Routes/binary-routes.jsx +++ b/packages/core/src/App/Components/Routes/binary-routes.jsx @@ -8,7 +8,6 @@ import RouteWithSubRoutes from './route-with-sub-routes.jsx'; const BinaryRoutes = props => { const location = useLocation(); - const { is_pre_appstore } = props; const { is_appstore } = React.useContext(PlatformContext); React.useEffect(() => { props.pushDataLayer({ event: 'page_load' }); @@ -21,7 +20,7 @@ const BinaryRoutes = props => { }> - {getRoutesConfig({ is_appstore, is_pre_appstore, is_eu_country }).map((route, idx) => ( + {getRoutesConfig({ is_appstore, is_eu_country }).map((route, idx) => ( ))} @@ -34,5 +33,4 @@ export default connect(({ ui, gtm, client }) => ({ promptFn: ui.promptFn, pushDataLayer: gtm.pushDataLayer, isEuropeCountry: client.isEuropeCountry, - is_pre_appstore: client.is_pre_appstore, }))(BinaryRoutes); diff --git a/packages/core/src/App/Containers/Layout/default-footer.jsx b/packages/core/src/App/Containers/Layout/default-footer.jsx index d0269462b688..350c62a203cc 100644 --- a/packages/core/src/App/Containers/Layout/default-footer.jsx +++ b/packages/core/src/App/Containers/Layout/default-footer.jsx @@ -43,7 +43,6 @@ const Footer = ({ toggleSettingsModal, settings_extension, landing_company_shortcode, - is_pre_appstore, show_eu_related_content, }) => { let footer_extensions_left = []; @@ -90,7 +89,6 @@ const Footer = ({ disableApp={disableApp} enableApp={enableApp} settings_extension={settings_extension} - is_pre_appstore={is_pre_appstore} />
@@ -112,7 +110,6 @@ Footer.propTypes = { disableApp: PropTypes.func, enableApp: PropTypes.func, footer_extensions: PropTypes.array, - is_pre_appstore: PropTypes.bool, show_eu_related_content: PropTypes.bool, }; @@ -131,7 +128,6 @@ export default withRouter( landing_company_shortcode: client.landing_company_shortcode, disableApp: ui.disableApp, toggleSettingsModal: ui.toggleSettingsModal, - is_pre_appstore: client.is_pre_appstore, show_eu_related_content: traders_hub.show_eu_related_content, }))(Footer) ); diff --git a/packages/core/src/App/Containers/Layout/footer.jsx b/packages/core/src/App/Containers/Layout/footer.jsx index 2792780f1167..e07e21109507 100644 --- a/packages/core/src/App/Containers/Layout/footer.jsx +++ b/packages/core/src/App/Containers/Layout/footer.jsx @@ -1,13 +1,12 @@ import React from 'react'; -import { connect } from 'Stores/connect'; import { routes } from '@deriv/shared'; import DefaultFooter from './default-footer'; import TradingHubFooter from './trading-hub-footer'; import { useLocation } from 'react-router-dom'; -const Footer = ({ is_pre_appstore }) => { +const Footer = () => { const { pathname } = useLocation(); - if (is_pre_appstore && pathname !== routes.onboarding) { + if (pathname !== routes.onboarding) { return ; } else if (pathname === routes.onboarding) { return null; @@ -15,6 +14,4 @@ const Footer = ({ is_pre_appstore }) => { return ; }; -export default connect(({ client }) => ({ - is_pre_appstore: client.is_pre_appstore, -}))(Footer); +export default Footer; diff --git a/packages/core/src/App/Containers/Layout/trading-hub-footer.jsx b/packages/core/src/App/Containers/Layout/trading-hub-footer.jsx index 471699fdbfc3..59c106df754d 100644 --- a/packages/core/src/App/Containers/Layout/trading-hub-footer.jsx +++ b/packages/core/src/App/Containers/Layout/trading-hub-footer.jsx @@ -49,7 +49,6 @@ const TradingHubFooter = ({ settings_extension, setDarkMode, is_dark_mode, - is_pre_appstore, show_eu_related_content, }) => { let footer_extensions_left = []; @@ -114,7 +113,6 @@ const TradingHubFooter = ({ disableApp={disableApp} enableApp={enableApp} settings_extension={settings_extension} - is_pre_appstore={is_pre_appstore} /> )} @@ -139,7 +137,6 @@ TradingHubFooter.propTypes = { footer_extensions: PropTypes.array, is_dark_mode: PropTypes.bool, setDarkMode: PropTypes.func, - is_pre_appstore: PropTypes.bool, show_eu_related_content: PropTypes.bool, }; @@ -160,7 +157,6 @@ export default withRouter( toggleSettingsModal: ui.toggleSettingsModal, is_dark_mode: ui.is_dark_mode_on, setDarkMode: ui.setDarkMode, - is_pre_appstore: client.is_pre_appstore, show_eu_related_content: traders_hub.show_eu_related_content, }))(TradingHubFooter) ); diff --git a/packages/core/src/App/Containers/RealAccountSignup/add-or-manage-accounts.jsx b/packages/core/src/App/Containers/RealAccountSignup/add-or-manage-accounts.jsx index 0a79081b2b6a..2553e3b93f5f 100644 --- a/packages/core/src/App/Containers/RealAccountSignup/add-or-manage-accounts.jsx +++ b/packages/core/src/App/Containers/RealAccountSignup/add-or-manage-accounts.jsx @@ -36,7 +36,6 @@ const AddOrManageAccounts = props => { onClose, show_eu_related_content, is_low_risk, - is_pre_appstore, loginid, } = props; @@ -143,7 +142,7 @@ const AddOrManageAccounts = props => { return ( - {(show_eu_related_content && !(is_low_risk && is_pre_appstore) && has_fiat) || is_mf_active ? ( + {(show_eu_related_content && !is_low_risk && has_fiat) || is_mf_active ? ( fiat_section ) : ( ({ setIsDeposit: modules.cashier.general_store.setIsDeposit, show_eu_related_content: traders_hub.show_eu_related_content, is_low_risk: client.is_low_risk, - is_pre_appstore: client.is_pre_appstore, loginid: client.loginid, }))(AddOrManageAccounts); diff --git a/packages/core/src/App/Containers/RealAccountSignup/real-account-signup.jsx b/packages/core/src/App/Containers/RealAccountSignup/real-account-signup.jsx index 8f56c96bd86f..a24fbd289f09 100644 --- a/packages/core/src/App/Containers/RealAccountSignup/real-account-signup.jsx +++ b/packages/core/src/App/Containers/RealAccountSignup/real-account-signup.jsx @@ -31,13 +31,7 @@ const modal_pages_indices = { finished_add_currency: 8, }; -const WizardHeading = ({ - country_standpoint, - currency, - is_isle_of_man_residence, - is_pre_appstore, - real_account_signup_target, -}) => { +const WizardHeading = ({ country_standpoint, currency, is_isle_of_man_residence, real_account_signup_target }) => { const maltainvest_signup = real_account_signup_target === 'maltainvest'; const iom_signup = real_account_signup_target === 'iom'; const deposit_cash_signup = real_account_signup_target === 'deposit_cash'; @@ -59,14 +53,13 @@ const WizardHeading = ({ if ( country_standpoint.is_united_kingdom || country_standpoint.is_rest_of_eu || - country_standpoint.is_belgium || - is_pre_appstore + country_standpoint.is_belgium ) { return ; } return ; case 'iom': - if (country_standpoint.is_united_kingdom || is_pre_appstore) { + if (country_standpoint.is_united_kingdom) { return ; } return ; @@ -75,8 +68,7 @@ const WizardHeading = ({ country_standpoint.is_united_kingdom || country_standpoint.is_france || country_standpoint.is_other_eu || - country_standpoint.is_rest_of_eu || - is_pre_appstore + country_standpoint.is_rest_of_eu ) { return ; } @@ -104,7 +96,6 @@ const RealAccountSignup = ({ show_eu_related_content, is_from_restricted_country, is_isle_of_man_residence, - is_pre_appstore, is_real_acc_signup_on, real_account_signup_target, realAccountSignup, @@ -568,7 +559,6 @@ const RealAccountSignup = ({ is_belgium_residence={is_belgium_residence} is_eu={show_eu_related_content} is_isle_of_man_residence={is_isle_of_man_residence} - is_pre_appstore={is_pre_appstore} real_account_signup_target={real_account_signup_target} should_show_all_available_currencies={should_show_all_available_currencies} /> @@ -606,7 +596,6 @@ const RealAccountSignup = ({ currency={currency} is_belgium_residence={is_belgium_residence} is_isle_of_man_residence={is_isle_of_man_residence} - is_pre_appstore={is_pre_appstore} real_account_signup_target={real_account_signup_target} should_show_all_available_currencies={should_show_all_available_currencies} /> @@ -648,7 +637,6 @@ export default connect(({ ui, client, traders_hub, modules }) => ({ is_belgium_residence: client.residence === 'be', // TODO: [deriv-eu] refactor this once more residence checks are required is_from_restricted_country: client.is_from_restricted_country, is_isle_of_man_residence: client.residence === 'im', // TODO: [deriv-eu] refactor this once more residence checks are required - is_pre_appstore: client.is_pre_appstore, is_real_acc_signup_on: ui.is_real_acc_signup_on, real_account_signup_target: ui.real_account_signup_target, realAccountSignup: client.realAccountSignup, diff --git a/packages/core/src/App/Containers/app-notification-messages.jsx b/packages/core/src/App/Containers/app-notification-messages.jsx index 4ec4902e838f..8cdafb4ee5b5 100644 --- a/packages/core/src/App/Containers/app-notification-messages.jsx +++ b/packages/core/src/App/Containers/app-notification-messages.jsx @@ -11,6 +11,7 @@ import Notification, { } from '../Components/Elements/NotificationMessage'; import 'Sass/app/_common/components/app-notification-message.scss'; import classNames from 'classnames'; +import { useLocation } from 'react-router-dom'; const Portal = ({ children }) => isMobile() ? ReactDOM.createPortal(children, document.getElementById('deriv_app')) : children; @@ -18,7 +19,6 @@ const Portal = ({ children }) => const NotificationsContent = ({ is_notification_loaded, style, - is_pre_appstore, notifications, removeNotificationMessage, markNotificationMessage, @@ -41,11 +41,12 @@ const NotificationsContent = ({ } // eslint-disable-next-line react-hooks/exhaustive-deps }, [window_location]); + const { pathname } = useLocation(); return (
@@ -75,7 +76,6 @@ const NotificationsContent = ({ const AppNotificationMessages = ({ is_notification_loaded, is_mt5, - is_pre_appstore, marked_notifications, notification_messages, removeNotificationMessage, @@ -166,7 +166,6 @@ const AppNotificationMessages = ({ has_iom_account={has_iom_account} has_malta_account={has_malta_account} is_logged_in={is_logged_in} - is_pre_appstore={is_pre_appstore} />
@@ -205,7 +204,6 @@ AppNotificationMessages.propTypes = { removeNotificationMessage: PropTypes.func, should_show_popups: PropTypes.bool, stopNotificationLoading: PropTypes.func, - is_pre_appstore: PropTypes.bool, }; export default connect(({ client, notifications }) => ({ @@ -218,5 +216,4 @@ export default connect(({ client, notifications }) => ({ has_malta_account: client.has_malta_account, is_logged_in: client.is_logged_in, should_show_popups: notifications.should_show_popups, - is_pre_appstore: client.is_pre_appstore, }))(AppNotificationMessages); diff --git a/packages/reports/src/Containers/routes.jsx b/packages/reports/src/Containers/routes.jsx index 161bb37febe5..0944b459b500 100644 --- a/packages/reports/src/Containers/routes.jsx +++ b/packages/reports/src/Containers/routes.jsx @@ -13,7 +13,6 @@ const Routes = props => { return ( ({ is_logged_in: client.is_logged_in, is_logging_in: client.is_logging_in, - is_pre_appstore: client.is_pre_appstore, error: common.error, has_error: common.has_error, }))(Routes) From 2d1362cd06304d5b28063ade0011ef1bfd92fdc8 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Fri, 10 Mar 2023 11:26:01 +0800 Subject: [PATCH 09/35] fix: remove is_pre_appstore_flag from cashier --- .../account-platform-icon.tsx | 11 +-- .../src/containers/cashier/cashier.tsx | 7 +- .../account-transfer-form.tsx | 81 ++++--------------- .../account-transfer-no-account.tsx | 9 +-- .../account-transfer-receipt.tsx | 8 +- .../account-transfer/account-transfer.tsx | 4 +- .../src/stores/account-transfer-store.ts | 12 +-- packages/cashier/src/types/account.types.ts | 1 - 8 files changed, 31 insertions(+), 102 deletions(-) diff --git a/packages/cashier/src/components/account-platform-icon/account-platform-icon.tsx b/packages/cashier/src/components/account-platform-icon/account-platform-icon.tsx index 86a586ac2a69..f2b5529cff55 100644 --- a/packages/cashier/src/components/account-platform-icon/account-platform-icon.tsx +++ b/packages/cashier/src/components/account-platform-icon/account-platform-icon.tsx @@ -6,7 +6,6 @@ import { TAccountsList } from 'Types'; type TAccountPlatformIcon = { size: number; account: TAccountsList['account']; - is_pre_appstore: boolean; icon_class_name?: string; appstore_icon_class_name?: string; appstoreIconOnClickHandler?: () => void; @@ -14,25 +13,17 @@ type TAccountPlatformIcon = { const AccountPlatformIcon = ({ account, - is_pre_appstore, size, - icon_class_name, appstore_icon_class_name, appstoreIconOnClickHandler, }: TAccountPlatformIcon) => { - return is_pre_appstore && account.is_mt && account.platform_icon ? ( + return ( - ) : ( - ); }; diff --git a/packages/cashier/src/containers/cashier/cashier.tsx b/packages/cashier/src/containers/cashier/cashier.tsx index 02cab631c3fc..0802f153a03d 100644 --- a/packages/cashier/src/containers/cashier/cashier.tsx +++ b/packages/cashier/src/containers/cashier/cashier.tsx @@ -30,7 +30,6 @@ type TCashierProps = RouteComponentProps & { routeBackInApp: TRootStore['common']['routeBackInApp']; toggleCashier: TRootStore['ui']['toggleCashier']; resetLastLocation: () => void; - is_pre_appstore: boolean; }; type TCashierOptions = { @@ -68,9 +67,9 @@ const Cashier = observer(({ history, location, routes: routes_config }: TCashier const { is_payment_agent_transfer_visible } = payment_agent_transfer; const { is_payment_agent_visible } = payment_agent; const { resetLastLocation } = account_prompt_dialog; - const { routeBackInApp, is_from_derivgo } = common; + const { is_from_derivgo } = common; const { is_cashier_visible: is_visible, toggleCashier } = ui; - const { is_account_setting_loaded, is_logged_in, is_logging_in, is_pre_appstore } = client; + const { is_account_setting_loaded, is_logged_in, is_logging_in } = client; const is_account_transfer_visible = useAccountTransferVisible(); const is_onramp_visible = useOnrampVisible(); @@ -94,7 +93,7 @@ const Cashier = observer(({ history, location, routes: routes_config }: TCashier })(); }, [is_logged_in, onMount, setAccountSwitchListener]); - const onClickClose = () => (is_pre_appstore ? history.push(routes.traders_hub) : routeBackInApp(history)); + const onClickClose = () => history.push(routes.traders_hub); const getMenuOptions = () => { const options: TCashierOptions[] = []; routes_config.forEach(route => { diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx index a18b466d18e4..4abbea686709 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx @@ -31,21 +31,17 @@ type TAccountTransferFormProps = { setSideNotes?: (notes: TSideNotesProps) => void; }; -const AccountOption = ({ account, idx, is_pre_appstore }: TAccountsList) => { +const AccountOption = ({ account, idx }: TAccountsList) => { return ( {(account.currency || account.platform_icon) && (
- +
)}
- + {account.is_dxtrade || account.is_mt || account.is_derivez ? account.text : getCurrencyName(account.currency)} @@ -86,13 +82,7 @@ const AccountTransferForm = observer( common: { is_from_derivgo }, } = useStore(); - const { - account_limits, - authentication_status, - is_dxtrade_allowed, - is_pre_appstore, - getLimits: onMount, - } = client; + const { account_limits, authentication_status, is_dxtrade_allowed, getLimits: onMount } = client; const { account_transfer, crypto_fiat_converter, transaction_history, general_store } = useCashierStore(); const { @@ -128,7 +118,6 @@ const AccountTransferForm = observer( const [to_accounts, setToAccounts] = React.useState({}); const [transfer_to_hint, setTransferToHint] = React.useState(); - const is_from_pre_appstore = is_pre_appstore && !location.pathname.startsWith(routes.cashier); const { daily_transfers } = account_limits; const mt5_remaining_transfers = daily_transfers?.mt5; const dxtrade_remaining_transfers = daily_transfers?.dxtrade; @@ -199,7 +188,7 @@ const AccountTransferForm = observer( derivez_accounts_to = []; accounts_list.forEach((account, idx) => { - const text = ; + const text = ; const value = account.value; const is_cfd_account = account.is_mt || account.is_dxtrade || account.is_derivez; @@ -369,17 +358,6 @@ const AccountTransferForm = observer( className='cashier__wrapper account-transfer-form__wrapper' data-testid='dt_account_transfer_form_wrapper' > - {!is_from_pre_appstore && ( - - {localize('Transfer between your accounts in Deriv')} - - )} - {is_from_pre_appstore && } - {is_pre_appstore && ( - - )} + + +
- {!is_from_pre_appstore && ( - } is_mobile> - {is_crypto && crypto_transactions?.length ? : null} - - - )} )} diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-no-account/account-transfer-no-account.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-no-account/account-transfer-no-account.tsx index e9e3d5f35e65..4f96c9297452 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-no-account/account-transfer-no-account.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-no-account/account-transfer-no-account.tsx @@ -11,8 +11,7 @@ type TAccountTransferNoAccount = { const AccountTransferNoAccount = observer(({ openAccountSwitcherModal }: TAccountTransferNoAccount) => { const { - client: { is_dxtrade_allowed, is_pre_appstore }, - ui: { toggleAccountsDialog }, + client: { is_dxtrade_allowed }, traders_hub: { openModal, closeModal }, } = useStore(); @@ -48,11 +47,7 @@ const AccountTransferNoAccount = observer(({ openAccountSwitcherModal }: TAccoun primary large onClick={() => - openAccountSwitcherModal - ? openAccountSwitcherModal() - : is_pre_appstore - ? openModal('currency_selection') - : toggleAccountsDialog() + openAccountSwitcherModal ? openAccountSwitcherModal() : openModal('currency_selection') } > diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx index ba90ee03720b..0cf61c8509ef 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx @@ -24,10 +24,10 @@ const AccountTransferReceipt = observer(({ onClose, history }: TAccountTransferR const { account_transfer } = useCashierStore(); const { disableApp, enableApp } = ui; const { is_from_derivgo } = common; - const { is_pre_appstore, loginid, switchAccount } = client; + const { loginid, switchAccount } = client; const { receipt, resetAccountTransfer, selected_from, selected_to, setShouldSwitchAccount } = account_transfer; - const is_from_pre_appstore = is_pre_appstore && !location.pathname.startsWith(routes.cashier); + const is_from_pre_appstore = !location.pathname.startsWith(routes.cashier); const [is_switch_visible, setIsSwitchVisible] = React.useState(false); const [switch_to, setSwitchTo] = React.useState({}); @@ -95,7 +95,7 @@ const AccountTransferReceipt = observer(({ onClose, history }: TAccountTransferR
- + @@ -109,7 +109,7 @@ const AccountTransferReceipt = observer(({ onClose, history }: TAccountTransferR
- + diff --git a/packages/cashier/src/pages/account-transfer/account-transfer.tsx b/packages/cashier/src/pages/account-transfer/account-transfer.tsx index 23128ca573b6..4d6cbc8531ad 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer.tsx @@ -44,10 +44,10 @@ const AccountTransfer = observer( const { is_crypto_transactions_visible, onMount: recentTransactionOnMount } = transaction_history; - const { is_pre_appstore, is_switching, is_virtual } = client; + const { is_switching, is_virtual } = client; const [is_loading_status, setIsLoadingStatus] = React.useState(true); - const is_from_pre_appstore = is_pre_appstore && !location.pathname.startsWith(routes.cashier); + const is_from_pre_appstore = !location.pathname.startsWith(routes.cashier); React.useEffect(() => { if (!is_crypto_transactions_visible) { diff --git a/packages/cashier/src/stores/account-transfer-store.ts b/packages/cashier/src/stores/account-transfer-store.ts index 10b6483374d1..2c3809cf0c20 100644 --- a/packages/cashier/src/stores/account-transfer-store.ts +++ b/packages/cashier/src/stores/account-transfer-store.ts @@ -369,8 +369,7 @@ export default class AccountTransferStore { const arr_accounts: TTransferAccount | TAccount[] = []; this.setSelectedTo({}); // set selected to empty each time so we can redetermine its value on reload - const is_from_pre_appstore = - this.root_store.client.is_pre_appstore && !location.pathname.startsWith(routes.cashier); + const is_from_pre_appstore = !location.pathname.startsWith(routes.cashier); accounts?.forEach((account: TTransferAccount) => { const cfd_platforms = { @@ -427,10 +426,7 @@ export default class AccountTransferStore { const obj_values: TAccount = { text: - is_cfd && - account.account_type === CFD_PLATFORMS.MT5 && - this.root_store.client.is_pre_appstore && - combined_cfd_mt5_account + is_cfd && account.account_type === CFD_PLATFORMS.MT5 && combined_cfd_mt5_account ? `${combined_cfd_mt5_account.sub_title}${short_code_and_region}` : account_text_display, value: account.loginid, @@ -442,9 +438,7 @@ export default class AccountTransferStore { is_derivez: account.account_type === CFD_PLATFORMS.DERIVEZ, ...(is_cfd && { platform_icon: - account.account_type === CFD_PLATFORMS.MT5 && - this.root_store.client.is_pre_appstore && - combined_cfd_mt5_account + account.account_type === CFD_PLATFORMS.MT5 && combined_cfd_mt5_account ? combined_cfd_mt5_account.icon : cfd_icon_display, status: account?.status, diff --git a/packages/cashier/src/types/account.types.ts b/packages/cashier/src/types/account.types.ts index 614035fa3063..5628fdf5364a 100644 --- a/packages/cashier/src/types/account.types.ts +++ b/packages/cashier/src/types/account.types.ts @@ -32,5 +32,4 @@ export type TAccountsList = { loginid?: string; mt5_login_list?: DetailsOfEachMT5Loginid[]; title?: string; - is_pre_appstore: boolean; }; From 89bbbef396cd68cf968ee25513b3e14c2cc6c9ff Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Fri, 10 Mar 2023 11:31:33 +0800 Subject: [PATCH 10/35] fix: remove is_pre_appstore from client --- .../src/modules/onboarding/onboarding.tsx | 11 +--------- packages/core/src/Stores/client-store.js | 21 +------------------ packages/stores/src/mockStore.ts | 1 - packages/stores/types.ts | 1 - 4 files changed, 2 insertions(+), 32 deletions(-) diff --git a/packages/appstore/src/modules/onboarding/onboarding.tsx b/packages/appstore/src/modules/onboarding/onboarding.tsx index a4bee3633611..fcd47c002fe0 100644 --- a/packages/appstore/src/modules/onboarding/onboarding.tsx +++ b/packages/appstore/src/modules/onboarding/onboarding.tsx @@ -29,14 +29,7 @@ const Onboarding = ({ contents = getTradingHubContents() }: TOnboardingProps) => const number_of_steps = Object.keys(contents); const { traders_hub, client } = useStores(); const { toggleIsTourOpen, selectAccountType, is_demo_low_risk, content_flag } = traders_hub; - const { - is_eu_country, - is_logged_in, - setIsPreAppStore, - is_landing_company_loaded, - prev_account_type, - setPrevAccountType, - } = client; + const { is_eu_country, is_logged_in, is_landing_company_loaded, prev_account_type, setPrevAccountType } = client; const [step, setStep] = React.useState(1); const prevStep = () => { @@ -46,7 +39,6 @@ const Onboarding = ({ contents = getTradingHubContents() }: TOnboardingProps) => const nextStep = () => { if (step < number_of_steps.length) setStep(step + 1); if (step === number_of_steps.length) { - setIsPreAppStore(true); toggleIsTourOpen(true); history.push(routes.traders_hub); if (is_demo_low_risk) { @@ -60,7 +52,6 @@ const Onboarding = ({ contents = getTradingHubContents() }: TOnboardingProps) => toggleIsTourOpen(false); history.push(routes.traders_hub); await selectAccountType(prev_account_type); - setIsPreAppStore(true); }; const eu_user = diff --git a/packages/core/src/Stores/client-store.js b/packages/core/src/Stores/client-store.js index 8f4670fac5c2..83e543918847 100644 --- a/packages/core/src/Stores/client-store.js +++ b/packages/core/src/Stores/client-store.js @@ -76,7 +76,6 @@ export default class ClientStore extends BaseStore { has_logged_out = false; is_landing_company_loaded = false; is_account_setting_loaded = false; - is_pre_appstore = false; has_enabled_two_fa = false; // this will store the landing_company API response, including // financial_company: {} @@ -163,7 +162,6 @@ export default class ClientStore extends BaseStore { pre_switch_broadcast: observable, switched: observable, is_switching: observable, - is_pre_appstore: observable, switch_broadcast: observable, initialized_broadcast: observable, currencies_list: observable, @@ -386,7 +384,7 @@ export default class ClientStore extends BaseStore { updateMT5Status: action.bound, isEuropeCountry: action.bound, setPrevRealAccountLoginid: action.bound, - setIsPreAppStore: action.bound, + setPrevAccountType: action.bound, }); @@ -409,10 +407,7 @@ export default class ClientStore extends BaseStore { reaction( () => [this.account_settings], () => { - const { trading_hub } = this.account_settings; const lang_from_url = new URLSearchParams(window.location.search).get('lang') || DEFAULT_LANGUAGE; - this.is_pre_appstore = !!trading_hub; - localStorage.setItem('is_pre_appstore', !!trading_hub); this.setPreferredLanguage(lang_from_url); LocalStore.set(LANGUAGE_KEY, lang_from_url); } @@ -2598,19 +2593,5 @@ export default class ClientStore extends BaseStore { setPrevAccountType = acc_type => { this.prev_account_type = acc_type; }; - - setIsPreAppStore(is_pre_appstore) { - const trading_hub = is_pre_appstore ? 1 : 0; - try { - WS.setSettings({ - set_settings: 1, - trading_hub, - }); - } catch (error) { - return; - } - this.account_settings = { ...this.account_settings, trading_hub }; - localStorage.setItem('is_pre_appstore', is_pre_appstore); - } } /* eslint-enable */ diff --git a/packages/stores/src/mockStore.ts b/packages/stores/src/mockStore.ts index 7b4abb1b8d0e..a2a526efe49a 100644 --- a/packages/stores/src/mockStore.ts +++ b/packages/stores/src/mockStore.ts @@ -134,7 +134,6 @@ const mock = (): TRootStore => { is_landing_company_loaded: false, is_logged_in: false, is_logging_in: false, - is_pre_appstore: false, is_switching: false, is_tnc_needed: false, is_trading_experience_incomplete: false, diff --git a/packages/stores/types.ts b/packages/stores/types.ts index c855f255faa1..a6db49010680 100644 --- a/packages/stores/types.ts +++ b/packages/stores/types.ts @@ -116,7 +116,6 @@ type TClientStore = { is_landing_company_loaded: boolean; is_logged_in: boolean; is_logging_in: boolean; - is_pre_appstore: boolean; is_switching: boolean; is_tnc_needed: boolean; is_trading_experience_incomplete: boolean; From e25a18954b080afcfb53eb9db4c40c639e2071de Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Fri, 10 Mar 2023 17:41:27 +0800 Subject: [PATCH 11/35] fix: refactor cashier --- .../account-platform-icon.tsx | 9 ++++++++- .../src/stores/account-transfer-store.ts | 19 ++++++++++--------- 2 files changed, 18 insertions(+), 10 deletions(-) diff --git a/packages/cashier/src/components/account-platform-icon/account-platform-icon.tsx b/packages/cashier/src/components/account-platform-icon/account-platform-icon.tsx index f2b5529cff55..a2fc8e3bca62 100644 --- a/packages/cashier/src/components/account-platform-icon/account-platform-icon.tsx +++ b/packages/cashier/src/components/account-platform-icon/account-platform-icon.tsx @@ -14,16 +14,23 @@ type TAccountPlatformIcon = { const AccountPlatformIcon = ({ account, size, + icon_class_name, appstore_icon_class_name, appstoreIconOnClickHandler, }: TAccountPlatformIcon) => { - return ( + return account.is_mt && account.platform_icon ? ( + ) : ( + ); }; diff --git a/packages/cashier/src/stores/account-transfer-store.ts b/packages/cashier/src/stores/account-transfer-store.ts index 2c3809cf0c20..d08979922768 100644 --- a/packages/cashier/src/stores/account-transfer-store.ts +++ b/packages/cashier/src/stores/account-transfer-store.ts @@ -369,8 +369,6 @@ export default class AccountTransferStore { const arr_accounts: TTransferAccount | TAccount[] = []; this.setSelectedTo({}); // set selected to empty each time so we can redetermine its value on reload - const is_from_pre_appstore = !location.pathname.startsWith(routes.cashier); - accounts?.forEach((account: TTransferAccount) => { const cfd_platforms = { mt5: { name: 'Deriv MT5', icon: 'IcMt5' }, @@ -426,9 +424,10 @@ export default class AccountTransferStore { const obj_values: TAccount = { text: - is_cfd && account.account_type === CFD_PLATFORMS.MT5 && combined_cfd_mt5_account - ? `${combined_cfd_mt5_account.sub_title}${short_code_and_region}` - : account_text_display, + is_cfd && + account.account_type === CFD_PLATFORMS.MT5 && + combined_cfd_mt5_account && + `${combined_cfd_mt5_account.sub_title}${short_code_and_region}`, value: account.loginid, balance: account.balance, currency: account.currency, @@ -438,9 +437,9 @@ export default class AccountTransferStore { is_derivez: account.account_type === CFD_PLATFORMS.DERIVEZ, ...(is_cfd && { platform_icon: - account.account_type === CFD_PLATFORMS.MT5 && combined_cfd_mt5_account - ? combined_cfd_mt5_account.icon - : cfd_icon_display, + account.account_type === CFD_PLATFORMS.MT5 && + combined_cfd_mt5_account && + combined_cfd_mt5_account.icon, status: account?.status, market_type: getCFDAccount({ market_type: account.market_type, @@ -467,9 +466,11 @@ export default class AccountTransferStore { const { account_id, login } = this.root_store.traders_hub?.selected_account; + const is_traders_hub = window.location.pathname === routes.traders_hub; + //if from appstore -> set selected account as the default transfer to account //if not from appstore -> set the first available account as the default transfer to account - if (!is_from_pre_appstore || [account_id, login].includes(account.loginid)) { + if (is_traders_hub || [account_id, login].includes(account.loginid)) { this.setSelectedTo(obj_values); } } From 48db4bcc30951285f1a91f60dac7ba04b93692af Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Mon, 13 Mar 2023 09:28:57 +0800 Subject: [PATCH 12/35] fix: comments --- .../cashier-container/virtual/virtual.tsx | 5 ++-- .../account-transfer-form.tsx | 28 ++++++++++++++++++- .../src/stores/account-transfer-store.ts | 19 ++++++------- .../core/src/App/Constants/platform-config.js | 14 ++++++++++ 4 files changed, 52 insertions(+), 14 deletions(-) diff --git a/packages/cashier/src/components/cashier-container/virtual/virtual.tsx b/packages/cashier/src/components/cashier-container/virtual/virtual.tsx index 261612215114..73c395505059 100644 --- a/packages/cashier/src/components/cashier-container/virtual/virtual.tsx +++ b/packages/cashier/src/components/cashier-container/virtual/virtual.tsx @@ -1,8 +1,8 @@ import classNames from 'classnames'; import React from 'react'; -import { withRouter, useHistory } from 'react-router-dom'; +import { withRouter } from 'react-router-dom'; import { Text } from '@deriv/components'; -import { isMobile, routes } from '@deriv/shared'; +import { isMobile } from '@deriv/shared'; import { Localize } from '@deriv/translations'; import { useStore, observer } from '@deriv/stores'; import './virtual.scss'; @@ -11,7 +11,6 @@ const Virtual = observer(() => { const { ui: { is_dark_mode_on, toggleAccountsDialog }, } = useStore(); - const history = useHistory(); return (
diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx index 4abbea686709..ef7d599465d7 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx @@ -118,6 +118,8 @@ const AccountTransferForm = observer( const [to_accounts, setToAccounts] = React.useState({}); const [transfer_to_hint, setTransferToHint] = React.useState(); + const is_from_outside_cashier = !location.pathname.startsWith(routes.cashier); + const { daily_transfers } = account_limits; const mt5_remaining_transfers = daily_transfers?.mt5; const dxtrade_remaining_transfers = daily_transfers?.dxtrade; @@ -549,7 +551,7 @@ const AccountTransferForm = observer( )} data-testid='dt_account_transfer_form_submit' > - + {is_from_outside_cashier && }
+ {!is_from_pre_appstore && ( + } is_mobile> + {is_crypto && crypto_transactions?.length ? : null} + + + )} )} diff --git a/packages/cashier/src/stores/account-transfer-store.ts b/packages/cashier/src/stores/account-transfer-store.ts index d08979922768..034798182efe 100644 --- a/packages/cashier/src/stores/account-transfer-store.ts +++ b/packages/cashier/src/stores/account-transfer-store.ts @@ -369,6 +369,8 @@ export default class AccountTransferStore { const arr_accounts: TTransferAccount | TAccount[] = []; this.setSelectedTo({}); // set selected to empty each time so we can redetermine its value on reload + const is_from_outside_cashier = !location.pathname.startsWith(routes.cashier); + accounts?.forEach((account: TTransferAccount) => { const cfd_platforms = { mt5: { name: 'Deriv MT5', icon: 'IcMt5' }, @@ -424,10 +426,9 @@ export default class AccountTransferStore { const obj_values: TAccount = { text: - is_cfd && - account.account_type === CFD_PLATFORMS.MT5 && - combined_cfd_mt5_account && - `${combined_cfd_mt5_account.sub_title}${short_code_and_region}`, + is_cfd && account.account_type === CFD_PLATFORMS.MT5 && combined_cfd_mt5_account + ? `${combined_cfd_mt5_account.sub_title}${short_code_and_region}` + : account_text_display, value: account.loginid, balance: account.balance, currency: account.currency, @@ -437,9 +438,9 @@ export default class AccountTransferStore { is_derivez: account.account_type === CFD_PLATFORMS.DERIVEZ, ...(is_cfd && { platform_icon: - account.account_type === CFD_PLATFORMS.MT5 && - combined_cfd_mt5_account && - combined_cfd_mt5_account.icon, + account.account_type === CFD_PLATFORMS.MT5 && combined_cfd_mt5_account + ? combined_cfd_mt5_account.icon + : cfd_icon_display, status: account?.status, market_type: getCFDAccount({ market_type: account.market_type, @@ -466,11 +467,9 @@ export default class AccountTransferStore { const { account_id, login } = this.root_store.traders_hub?.selected_account; - const is_traders_hub = window.location.pathname === routes.traders_hub; - //if from appstore -> set selected account as the default transfer to account //if not from appstore -> set the first available account as the default transfer to account - if (is_traders_hub || [account_id, login].includes(account.loginid)) { + if (!is_from_outside_cashier || [account_id, login].includes(account.loginid)) { this.setSelectedTo(obj_values); } } diff --git a/packages/core/src/App/Constants/platform-config.js b/packages/core/src/App/Constants/platform-config.js index 80e8391ca34f..969130ff7899 100644 --- a/packages/core/src/App/Constants/platform-config.js +++ b/packages/core/src/App/Constants/platform-config.js @@ -17,6 +17,20 @@ const platform_config = [ description: () => localize('Automated trading at your fingertips. No coding needed.'), link_to: routes.bot, }, + { + icon: getPlatformSettings('mt5').icon, + title: () => getPlatformSettings('mt5').name, + name: getPlatformSettings('mt5').name, + description: () => localize('Trade on Deriv MT5, the all-in-one FX and CFD trading platform.'), + link_to: routes.mt5, + }, + { + icon: getPlatformSettings('dxtrade').icon, + title: () => getPlatformSettings('dxtrade').name, + name: getPlatformSettings('dxtrade').name, + description: () => localize('Trade CFDs on a customizable, easy-to-use trading platform.'), + link_to: routes.dxtrade, + }, { icon: getPlatformSettings('smarttrader').icon, title: () => getPlatformSettings('smarttrader').name, From 89d7665ba3effd669b6b673ee9a729a9a458a100 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Mon, 13 Mar 2023 10:16:04 +0800 Subject: [PATCH 13/35] fix: comments v2 --- .../account-transfer-form/account-transfer-form.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx index ef7d599465d7..2a450ea9bad8 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx @@ -441,7 +441,9 @@ const AccountTransferForm = observer( setAccountTransferAmount(e.target.value); }} className={classNames( - 'cashier__input dc-input--no-placeholder account-transfer-form__input' + 'cashier__input dc-input--no-placeholder account-transfer-form__input', + !is_from_outside_cashier && + 'account-transfer-form__input-fit-content' )} classNameHint={classNames('account-transfer-form__hint', { 'account-transfer-form__hint__disabled': is_mt5_restricted, @@ -582,7 +584,7 @@ const AccountTransferForm = observer(
- {!is_from_pre_appstore && ( + {!is_from_outside_cashier && ( } is_mobile> {is_crypto && crypto_transactions?.length ? : null} Date: Mon, 13 Mar 2023 10:28:27 +0800 Subject: [PATCH 14/35] chore: remove cfd-dashbord test --- .../__tests__/cfd-dashboard.spec.tsx | 485 ------------------ 1 file changed, 485 deletions(-) delete mode 100644 packages/cfd/src/Containers/__tests__/cfd-dashboard.spec.tsx diff --git a/packages/cfd/src/Containers/__tests__/cfd-dashboard.spec.tsx b/packages/cfd/src/Containers/__tests__/cfd-dashboard.spec.tsx deleted file mode 100644 index 72217e8cd065..000000000000 --- a/packages/cfd/src/Containers/__tests__/cfd-dashboard.spec.tsx +++ /dev/null @@ -1,485 +0,0 @@ -import React from 'react'; -// eslint-disable-next-line import/no-extraneous-dependencies -import { fireEvent, render, screen } from '@testing-library/react'; -import CFDDashboard, { TCFDDashboardProps } from '../cfd-dashboard'; -import { BrowserRouter } from 'react-router-dom'; -import { CFD_PLATFORMS, getCFDPlatformLabel, routes } from '@deriv/shared'; -import { DetailsOfEachMT5Loginid, LandingCompany } from '@deriv/api-types'; - -type TMockConnectProps = { - isEligibleForMoreRealMt5: () => boolean; - isEligibleForMoreDemoMt5Svg: () => boolean; - setMT5TradeAccount: () => void; - dxtrade_tokens: { [key: string]: string }; - landing_companies?: LandingCompany; - current_list?: Record< - string, - DetailsOfEachMT5Loginid & { - account_id?: string; - display_login: string; - enabled?: number; - platform?: 'mt5' | 'dxtrade'; - } - >; -}; - -const mock_connect_props: TMockConnectProps = { - isEligibleForMoreRealMt5: jest.fn(() => true), - isEligibleForMoreDemoMt5Svg: jest.fn(() => true), - setMT5TradeAccount: jest.fn(), - dxtrade_tokens: { - demo: '', - real: '', - }, -}; - -jest.mock('@deriv/shared', () => ({ - ...jest.requireActual('@deriv/shared'), - isLandingCompanyEnabled: jest.fn(() => true), - getCFDPlatformLabel: jest.fn(() => 'Deriv MT5'), - routes: { - bot: '/bot', - cashier_acc_transfer: '/cashier/account-transfer', - dxtrade: '/derivx', - mt5: '/mt5', - trade: '/', - }, -})); - -jest.mock('Stores/connect', () => ({ - __esModule: true, - default: 'mockedDefaultExport', - connect: () => Component => props => Component({ ...props, ...mock_connect_props }), -})); -jest.mock('@deriv/account', () => ({ - ...jest.requireActual('@deriv/account'), - ResetTradingPasswordModal: props => (props.is_visible ? 'ResetTradingPasswordModal' : ''), -})); -jest.mock('../../Components/success-dialog.jsx', () => () => 'SuccessDialog'); -jest.mock('../cfd-password-modal.tsx', () => props => props.is_cfd_password_modal_enabled ? 'CFDPasswordModal' : ''); -jest.mock('../cfd-top-up-demo-modal', () => props => props.is_top_up_virtual_open ? 'CFDTopUpDemoModal' : ''); -jest.mock('../cfd-server-error-dialog.tsx', () => () => 'CFDServerErrorDialog'); -jest.mock('../mt5-trade-modal', () => props => props.is_open ? 'MT5TradeModal' : ''); -jest.mock( - '../jurisdiction-modal/jurisdiction-modal', - () => props => props.is_jurisdiction_modal_visible ? 'JurisdictionModal' : '' -); - -describe('', () => { - const props: Partial = { - account_status: {}, - beginRealSignupForMt5: jest.fn(), - checkShouldOpenAccount: jest.fn(), - country: 'Indonesia', - createCFDAccount: jest.fn(), - enableApp: jest.fn(), - disableApp: jest.fn(), - disableCFDPasswordModal: jest.fn(), - dxtrade_accounts_list_error: null, - dxtrade_disabled_signup_types: { - demo: false, - real: false, - }, - dxtrade_verification_code: {}, - getRealSyntheticAccountsExistingData: jest.fn(), - getRealFinancialAccountsExistingData: jest.fn(), - has_maltainvest_account: false, - has_mt5_real_account_error: false, - has_mt5_demo_account_error: false, - has_dxtrade_real_account_error: false, - has_dxtrade_demo_account_error: false, - has_real_account: true, - is_accounts_switcher_on: false, - is_dark_mode_on: false, - is_eu: false, - is_eu_country: false, - is_loading: false, - is_logged_in: false, - is_logging_in: false, - is_mt5_allowed: true, - is_mt5_trade_modal_visible: false, - is_dxtrade_allowed: true, - is_reset_trading_password_modal_visible: false, - is_virtual: false, - isAccountOfTypeDisabled: jest.fn(() => false), - mt5_disabled_signup_types: { - demo: false, - real: false, - }, - mt5_verification_code: {}, - mt5_status_server: { - demo: [ - { - all: 0, - platform: 1, - server_number: 1, - }, - { - all: 0, - platform: 1, - server_number: 2, - }, - ], - real: [ - { - all: 0, - deposits: 0, - platform: 1, - server_number: 1, - withdrawals: 0, - }, - { - all: 0, - deposits: 0, - platform: 1, - server_number: 2, - withdrawals: 0, - }, - ], - }, - NotificationMessages: () =>
NotificationMessages
, - onMount: jest.fn(), - onUnmount: jest.fn(), - openAccountNeededModal: jest.fn(), - openDerivRealAccountNeededModal: jest.fn(), - refreshNotifications: jest.fn(), - openPasswordModal: jest.fn(), - openTopUpModal: jest.fn(), - platform: CFD_PLATFORMS.MT5, - residence: 'id', - residence_list: [ - { - identity: { - services: { - idv: { - documents_supported: {}, - has_visual_sample: 0, - is_country_supported: 0, - }, - onfido: { - documents_supported: { - driving_licence: { - display_name: 'Driving Licence', - }, - national_identity_card: { - display_name: 'National Identity Card', - }, - passport: { - display_name: 'Passport', - }, - }, - is_country_supported: 1, - }, - }, - }, - phone_idd: '62', - text: 'Indonesia', - tin_format: ['^\\d{15}$'], - value: 'id', - }, - ], - setAccountType: jest.fn(), - setCFDPasswordResetModal: jest.fn(), - setIsAcuityModalOpen: jest.fn(), - setCurrentAccount: jest.fn(), - standpoint: { - financial_company: 'svg', - gaming_company: 'svg', - iom: false, - malta: false, - maltainvest: false, - svg: true, - }, - toggleAccountsDialog: jest.fn(), - toggleShouldShowRealAccountsList: jest.fn(), - toggleResetTradingPasswordModal: jest.fn(), - upgradeable_landing_companies: ['svg'], - }; - beforeEach(() => { - mock_connect_props.landing_companies = { - config: { - tax_details_required: 1, - tin_format: ['^\\d{15}$'], - tin_format_description: '999999999999999', - }, - dxtrade_financial_company: {}, - dxtrade_gaming_company: {}, - financial_company: {}, - gaming_company: {}, - id: 'id', - minimum_age: 18, - mt_financial_company: {}, - mt_gaming_company: {}, - name: 'Indonesia', - virtual_company: 'virtual', - }; - mock_connect_props.current_list = { - 'mt5.real.synthetic_svg@p01_ts03': { - account_type: 'real', - balance: 0, - country: 'id', - currency: 'USD', - display_balance: '0.00', - display_login: '40005073', - email: 'ma+1@deriv.com', - group: 'real\\p01_ts03\\synthetic\\svg_std_usd\\02', - landing_company_short: 'svg', - leverage: 500, - login: 'MTR40005073', - market_type: 'synthetic', - name: 'test_user', - server: 'p01_ts03', - server_info: { - environment: 'Deriv-Server', - geolocation: { - group: 'asia_synthetic', - location: 'Singapore', - region: 'Asia', - sequence: 1, - }, - id: 'p01_ts03', - }, - sub_account_type: 'financial', - }, - 'mt5.demo.synthetic_svg@p01_ts02': { - account_type: 'demo', - balance: 10000, - country: 'id', - currency: 'USD', - display_balance: '10000.00', - display_login: '20104105', - email: 'ma+1@deriv.com', - group: 'demo\\p01_ts02\\synthetic\\svg_std_usd', - landing_company_short: 'svg', - leverage: 500, - login: 'MTD20104105', - market_type: 'synthetic', - name: 'test_user', - server: 'p01_ts02', - server_info: { - environment: 'Deriv-Demo', - geolocation: { - group: 'all', - location: 'N. Virginia', - region: 'US East', - sequence: 1, - }, - id: 'p01_ts02', - }, - sub_account_type: 'financial', - }, - 'dxtrade.real.synthetic@synthetic': { - account_id: 'DXR1000', - account_type: 'real', - balance: 0, - currency: 'USD', - display_balance: '0.00', - display_login: 'DXR1000', - enabled: 1, - landing_company_short: 'svg', - login: '9', - market_type: 'synthetic', - platform: 'dxtrade', - }, - }; - window.location.hash = ''; - }); - - const dmt5_welcome_header = /welcome to deriv mt5 dashboard/i; - const derivx_welcome_header = /welcome to deriv x/i; - const real_tab_name = 'Real account'; - const demo_tab_name = 'Demo account'; - const compare_accounts_button_label = /compare accounts/i; - const account_information_button_label = /account information/i; - const top_up_button_label = /top up/i; - const dmt5_download_header = /run mt5 from your browser or download the mt5 app for your devices/i; - const derivx_mobile_app_download_header = /download the deriv X mobile app/i; - const derivx_web_terminal_header = /run deriv X on your browser/i; - const mt5_account_error = /some of your deriv mt5 accounts are unavailable at the moment./i; - const dxtrade_account_error = /some of your deriv X accounts are unavailable at the moment./i; - - const renderCFDDashboardWithRouter = ( - new_props: Partial = {}, - rerender?: ReturnType['rerender'] - ) => { - const ui = ( -
- - - -
- ); - if (rerender) return rerender(ui); - return render(ui); - }; - - it('CFDDashboard should be rendered correctly for Deriv MT5 & for Deriv X', () => { - const { rerender } = renderCFDDashboardWithRouter() as ReturnType; - - expect(screen.getByRole('heading', { name: dmt5_welcome_header })).toBeInTheDocument(); - expect(screen.getByText('NotificationMessages')).toBeInTheDocument(); - expect(screen.getByText(real_tab_name)).toBeInTheDocument(); - expect(screen.getByText(demo_tab_name)).toBeInTheDocument(); - expect(screen.getByText('Derived')).toBeInTheDocument(); - expect(screen.getByText('Financial')).toBeInTheDocument(); - expect(screen.getByRole('button', { name: compare_accounts_button_label })).toBeInTheDocument(); - expect(screen.getByRole('heading', { name: dmt5_download_header })).toBeInTheDocument(); - screen.queryAllByText(/modal/i).forEach(modal => { - expect(modal).not.toBeInTheDocument(); - }); - - renderCFDDashboardWithRouter({ platform: CFD_PLATFORMS.DXTRADE }, rerender); - - expect(screen.getByRole('heading', { name: derivx_welcome_header })).toBeInTheDocument(); - expect(screen.getByRole('heading', { name: derivx_mobile_app_download_header })).toBeInTheDocument(); - expect(screen.getByRole('heading', { name: derivx_web_terminal_header })).toBeInTheDocument(); - }); - it('Real account tab is active initially, and Demo account tab gets active when clicked', () => { - renderCFDDashboardWithRouter(); - - const real_account_tab = screen.getByText(real_tab_name); - const demo_account_tab = screen.getByText(demo_tab_name); - expect(real_account_tab).toHaveClass('dc-tabs__active'); - expect(demo_account_tab).not.toHaveClass('dc-tabs__active'); - expect(screen.queryByText('DEMO')).not.toBeInTheDocument(); - - fireEvent.click(demo_account_tab); - expect(demo_account_tab).toHaveClass('dc-tabs__active'); - expect(real_account_tab).not.toHaveClass('dc-tabs__active'); - expect(screen.getAllByText('DEMO').length).toBeGreaterThan(0); - }); - it('Compare accounts button disappears when switched to Demo tab in Deriv MT5', () => { - renderCFDDashboardWithRouter(); - - expect(screen.getByRole('button', { name: compare_accounts_button_label })).toBeInTheDocument(); - - fireEvent.click(screen.getByText(demo_tab_name)); - expect(screen.queryByRole('button', { name: compare_accounts_button_label })).not.toBeInTheDocument(); - }); - it('Compare accounts button is named Account Information for logged-in EU users in Deriv MT5', () => { - mock_connect_props.current_list = {}; - mock_connect_props.landing_companies = { - config: { - tin_format: ['^\\d{10,11}$'], - tin_format_description: '9999999999 or 99999999999', - }, - financial_company: {}, - id: 'pl', - minimum_age: 18, - mt_financial_company: { - financial: { - address: [], - changeable_fields: {}, - country: 'Malta', - currency_config: {}, - has_reality_check: 0, - legal_allowed_contract_categories: [], - legal_allowed_currencies: [], - legal_allowed_markets: [], - legal_default_currency: 'EUR', - name: 'Deriv Investments (Europe) Limited', - requirements: {}, - shortcode: 'maltainvest', - support_professional_client: 1, - }, - }, - name: 'Poland', - virtual_company: 'virtual', - }; - const { rerender } = renderCFDDashboardWithRouter({ is_logged_in: true, is_eu: true }) as ReturnType< - typeof render - >; - - expect(screen.getByRole('button', { name: account_information_button_label })).toBeInTheDocument(); - expect(screen.queryByRole('button', { name: compare_accounts_button_label })).not.toBeInTheDocument(); - - mock_connect_props.landing_companies = {}; - renderCFDDashboardWithRouter({ is_logged_in: false, is_eu_country: true }, rerender); - - expect(screen.getByRole('button', { name: compare_accounts_button_label })).toBeInTheDocument(); - expect(screen.queryByRole('button', { name: account_information_button_label })).not.toBeInTheDocument(); - }); - it('Should show error when is_logged_in & has real/demo account error in Deriv MT5/Deriv X', () => { - const { rerender } = renderCFDDashboardWithRouter({ - is_logged_in: true, - has_mt5_real_account_error: true, - }) as ReturnType; - - expect(screen.getByText(mt5_account_error)).toBeInTheDocument(); - - renderCFDDashboardWithRouter({ is_logged_in: true, has_mt5_demo_account_error: true }, rerender); - fireEvent.click(screen.getByText(demo_tab_name)); - expect(screen.getByText(mt5_account_error)).toBeInTheDocument(); - - (getCFDPlatformLabel as jest.Mock).mockReturnValue('Deriv X'); - renderCFDDashboardWithRouter( - { is_logged_in: true, has_dxtrade_demo_account_error: true, platform: CFD_PLATFORMS.DXTRADE }, - rerender - ); - expect(screen.getByText(dxtrade_account_error)).toBeInTheDocument(); - - renderCFDDashboardWithRouter( - { is_logged_in: true, has_dxtrade_real_account_error: true, platform: CFD_PLATFORMS.DXTRADE }, - rerender - ); - fireEvent.click(screen.getByText(real_tab_name)); - expect(screen.getByText(dxtrade_account_error)).toBeInTheDocument(); - }); - it('Should show Loading when is_loading or when is_logging_in in Deriv MT5/Deriv X', () => { - const { rerender } = renderCFDDashboardWithRouter({ - is_loading: true, - platform: CFD_PLATFORMS.MT5, - }) as ReturnType; - expect(screen.getByTestId('dt_initial_loader')).toBeInTheDocument(); - expect(screen.queryByRole('heading', { name: dmt5_welcome_header })).not.toBeInTheDocument(); - - renderCFDDashboardWithRouter({ platform: CFD_PLATFORMS.DXTRADE, is_logging_in: true }, rerender); - expect(screen.getByTestId('dt_initial_loader')).toBeInTheDocument(); - expect(screen.queryByRole('heading', { name: derivx_welcome_header })).not.toBeInTheDocument(); - }); - it('Should show PageError when is_logged_in to Deriv MT5 & mt5 in not allowed', () => { - renderCFDDashboardWithRouter({ is_logged_in: true, platform: CFD_PLATFORMS.MT5, is_mt5_allowed: false }); - - expect(screen.getByRole('heading', { name: /deriv mt5 is not available in indonesia/i })).toBeInTheDocument(); - expect(screen.queryByRole('heading', { name: dmt5_welcome_header })).not.toBeInTheDocument(); - }); - it('Should ask to open a real Deriv account when is_logged_in && !has_real_account && upgradeable_landing_companies.length > 0 in Deriv MT5', () => { - renderCFDDashboardWithRouter({ is_logged_in: true, platform: CFD_PLATFORMS.MT5, has_real_account: false }); - expect(screen.getByRole('heading', { name: /you need a real account/i })).toBeInTheDocument(); - }); - it('Should redirect a user to Deriv MT5 when Deriv X is not allowed', () => { - renderCFDDashboardWithRouter({ is_dxtrade_allowed: false, platform: CFD_PLATFORMS.DXTRADE }); - expect(window.location.pathname).toBe(routes.mt5); - expect(screen.queryByRole('heading', { name: derivx_welcome_header })).not.toBeInTheDocument(); - }); - it('Top up button in Deriv MT5 (= Fund transfer button in Deriv X) should redirect to Cashier when in Real, & should trigger CFDTopUpDemoModal when in Demo', () => { - const { rerender } = renderCFDDashboardWithRouter({ is_logged_in: true }) as ReturnType; - fireEvent.click(screen.getByRole('button', { name: top_up_button_label })); - expect(props.disableCFDPasswordModal).toHaveBeenCalledTimes(1); - expect(window.location.pathname).toBe(routes.cashier_acc_transfer); - - window.location = { pathname: routes.dxtrade, hash: '' } as (string | Location) & Location; - renderCFDDashboardWithRouter({ is_logged_in: true, platform: CFD_PLATFORMS.DXTRADE }, rerender); - fireEvent.click(screen.getByRole('button', { name: /fund transfer/i })); - expect(props.disableCFDPasswordModal).toHaveBeenCalledTimes(2); - expect(window.location.pathname).toBe(routes.cashier_acc_transfer); - - renderCFDDashboardWithRouter({ is_logged_in: true, platform: CFD_PLATFORMS.MT5 }, rerender); - fireEvent.click(screen.getByText(demo_tab_name)); - fireEvent.click(screen.getByRole('button', { name: top_up_button_label })); - expect(props.setCurrentAccount).toHaveBeenCalledWith( - mock_connect_props.current_list?.['mt5.demo.synthetic_svg@p01_ts02'], - { - category: 'demo', - type: 'synthetic', - } - ); - expect(props.openTopUpModal).toHaveBeenCalledTimes(1); - }); - it('Should trigger CFDResetPasswordModal when URL hash contains reset-password', () => { - window.location.hash = 'reset-password'; - renderCFDDashboardWithRouter({ is_logged_in: true }); - - expect(props.setCFDPasswordResetModal).toHaveBeenCalledWith(true); - }); -}); From 6b6029404ed1cd9277651f2f13e4d6252a578ecb Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Mon, 13 Mar 2023 12:19:13 +0800 Subject: [PATCH 15/35] fix: tests --- .../__tests__/account-transfer.spec.tsx | 8 --- .../__tests__/account-transfer-form.spec.tsx | 69 +------------------ .../account-transfer-no-account.spec.tsx | 11 --- .../account-transfer-receipt.spec.tsx | 12 +--- .../__tests__/account-transfer-store.spec.ts | 2 +- 5 files changed, 3 insertions(+), 99 deletions(-) diff --git a/packages/cashier/src/pages/account-transfer/__tests__/account-transfer.spec.tsx b/packages/cashier/src/pages/account-transfer/__tests__/account-transfer.spec.tsx index 44c3a91251b1..c4cd71236515 100644 --- a/packages/cashier/src/pages/account-transfer/__tests__/account-transfer.spec.tsx +++ b/packages/cashier/src/pages/account-transfer/__tests__/account-transfer.spec.tsx @@ -182,12 +182,4 @@ describe('', () => { expect(await screen.findByText('mockedAccountTransferReceipt')).toBeInTheDocument(); }); - - it('should show the crypto transactions if triggered from recent transactions', async () => { - mockRootStore.modules.cashier.transaction_history.is_crypto_transactions_visible = true; - - renderAccountTransfer(); - - expect(await screen.findByText('mockedCryptoTransactionsHistory')).toBeInTheDocument(); - }); }); diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-form/__tests__/account-transfer-form.spec.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-form/__tests__/account-transfer-form.spec.tsx index 2824ee5e1865..e003a17b2738 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-form/__tests__/account-transfer-form.spec.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-form/__tests__/account-transfer-form.spec.tsx @@ -120,7 +120,7 @@ describe('', () => { renderAccountTransferForm(); expect(screen.getByTestId('dt_account_transfer_form_wrapper')).toBeInTheDocument(); - expect(screen.getByText('Transfer between your accounts in Deriv')).toBeInTheDocument(); + expect(screen.getByText('Cashier Error')).toBeInTheDocument(); }); it('should show loader if account_list.length === 0', () => { @@ -218,19 +218,6 @@ describe('', () => { expect(screen.getByText('Cashier Error')).toBeInTheDocument(); }); - it('should show component', () => { - (isMobile as jest.Mock).mockReturnValue(true); - - renderAccountTransferForm(); - - expect(screen.getByText('Transfer limits may vary depending on the exchange rates.')).toBeInTheDocument(); - expect( - screen.getByText( - 'Transfers may be unavailable due to high volatility or technical issues and when the exchange markets are closed.' - ) - ).toBeInTheDocument(); - }); - it('should show proper hint about mt5 remained transfers', () => { (isMobile as jest.Mock).mockReturnValue(true); mockRootStore.client.account_limits = { @@ -288,58 +275,4 @@ describe('', () => { expect(screen.getByText('You have 1 transfer remaining for today.')).toBeInTheDocument(); }); - - it('should show proper note if transfer fee is 2% and is_crypto_to_crypto_transfer', () => { - (isMobile as jest.Mock).mockReturnValue(true); - mockRootStore.modules.cashier.account_transfer.selected_from.is_crypto = true; - mockRootStore.modules.cashier.account_transfer.selected_from.currency = 'BTC'; - mockRootStore.modules.cashier.account_transfer.selected_to.is_crypto = true; - mockRootStore.modules.cashier.account_transfer.selected_to.currency = 'BTC'; - mockRootStore.modules.cashier.account_transfer.transfer_fee = 2; - - renderAccountTransferForm(); - - expect( - screen.getByText( - 'We’ll charge a 2% transfer fee or 0 BTC, whichever is higher, for transfers between your Deriv cryptocurrency accounts. Please bear in mind that some transfers may not be possible.' - ) - ).toBeInTheDocument(); - }); - - it('should show proper note if transfer fee is 2%, is_mt_transfer, and is_dxtrade_allowed is false', () => { - (isMobile as jest.Mock).mockReturnValue(true); - mockRootStore.modules.cashier.account_transfer.selected_from.is_mt = true; - mockRootStore.modules.cashier.account_transfer.selected_to.is_mt = true; - mockRootStore.modules.cashier.account_transfer.transfer_fee = 2; - - renderAccountTransferForm(); - - expect( - screen.getByText( - 'We’ll charge a 2% transfer fee or 0 USD, whichever is higher, for transfers between your Deriv cryptocurrency and Deriv MT5 accounts. Please bear in mind that some transfers may not be possible.' - ) - ).toBeInTheDocument(); - }); - - it('should show proper note if transfer fee is 2% and is_mt_transfer is false', () => { - (isMobile as jest.Mock).mockReturnValue(true); - mockRootStore.modules.cashier.account_transfer.transfer_fee = 2; - - renderAccountTransferForm(); - - expect( - screen.getByText( - 'We’ll charge a 2% transfer fee or 0 USD, whichever is higher, for transfers between your Deriv fiat and Deriv cryptocurrency accounts. Please bear in mind that some transfers may not be possible.' - ) - ).toBeInTheDocument(); - }); - - it('should show proper note if transfer fee is null', () => { - (isMobile as jest.Mock).mockReturnValue(true); - mockRootStore.modules.cashier.account_transfer.transfer_fee = null; - - renderAccountTransferForm(); - - expect(screen.getByText('Please bear in mind that some transfers may not be possible.')).toBeInTheDocument(); - }); }); diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-no-account/__tests__/account-transfer-no-account.spec.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-no-account/__tests__/account-transfer-no-account.spec.tsx index 0fe0268e3951..e289c8ce5c24 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-no-account/__tests__/account-transfer-no-account.spec.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-no-account/__tests__/account-transfer-no-account.spec.tsx @@ -38,15 +38,4 @@ describe('', () => { expect(screen.getByText('Please create another Deriv or Deriv MT5 account.')).toBeInTheDocument(); expect(screen.getByText('Create account')).toBeInTheDocument(); }); - - it('should trigger onClick callback, when the "Create account" button was clicked', () => { - mockRootStore.client.is_dxtrade_allowed = true; - - renderAccountTransferNoAccount(); - - const create_acc_btn = screen.getByText('Create account'); - fireEvent.click(create_acc_btn); - - expect(mockRootStore.ui.toggleAccountsDialog).toHaveBeenCalledTimes(1); - }); }); diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-receipt/__tests__/account-transfer-receipt.spec.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-receipt/__tests__/account-transfer-receipt.spec.tsx index b3f12a88e7fa..d64db5d6bc2b 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-receipt/__tests__/account-transfer-receipt.spec.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-receipt/__tests__/account-transfer-receipt.spec.tsx @@ -62,12 +62,11 @@ describe('', () => { ), }); - it('should show "Your funds have been transferred" message, "View transaction details" and "Make a new transfer" buttons', () => { + it('should show "Your funds have been transferred" message and "View transaction details" buttons', () => { renderAccountTransferReceipt(); expect(screen.getByText('Your funds have been transferred')).toBeInTheDocument(); expect(screen.getByText('View transaction details')).toBeInTheDocument(); - expect(screen.getByText('Make a new transfer')).toBeInTheDocument(); }); it('should redirect to "/reports/statement", when the "View transaction details" button was clicked', () => { @@ -79,15 +78,6 @@ describe('', () => { expect(history.location.pathname).toBe(routes.statement); }); - it('should reset account transfer, when the "Make a new transfer" button was clicked', () => { - renderAccountTransferReceipt(); - - const make_a_new_transfer_btn = screen.getByText('Make a new transfer'); - fireEvent.click(make_a_new_transfer_btn); - - expect(mockRootStore.modules.cashier.account_transfer.resetAccountTransfer).toHaveBeenCalledTimes(1); - }); - it('should not show "We’re switching over to your {{currency}} account to view the transaction." message, when the "Cancel" button was clicked', async () => { const modal_root_el = document.createElement('div'); modal_root_el.setAttribute('id', 'modal_root'); diff --git a/packages/cashier/src/stores/__tests__/account-transfer-store.spec.ts b/packages/cashier/src/stores/__tests__/account-transfer-store.spec.ts index 80b0a0e9afbd..a62e81c6247f 100644 --- a/packages/cashier/src/stores/__tests__/account-transfer-store.spec.ts +++ b/packages/cashier/src/stores/__tests__/account-transfer-store.spec.ts @@ -494,7 +494,7 @@ describe('AccountTransferStore', () => { accounts: [MX_USD_account], }); - expect(account_transfer_store.selected_to.error).not.toBe(undefined); + expect(account_transfer_store.selected_to.error).toBe(undefined); }); it('should set proper values for selected_from property', () => { From 52bb067a16a6c3e878ab26dd31504e2dbc3ff8c5 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Mon, 13 Mar 2023 13:41:34 +0800 Subject: [PATCH 16/35] fix: toggle menu drawer remove exit traders hub --- .../Layout/Header/toggle-menu-drawer.jsx | 42 ++++--------------- .../src/sass/app/_common/layout/header.scss | 4 ++ 2 files changed, 11 insertions(+), 35 deletions(-) diff --git a/packages/core/src/App/Components/Layout/Header/toggle-menu-drawer.jsx b/packages/core/src/App/Components/Layout/Header/toggle-menu-drawer.jsx index 9f2d411a787b..7e88055c163b 100644 --- a/packages/core/src/App/Components/Layout/Header/toggle-menu-drawer.jsx +++ b/packages/core/src/App/Components/Layout/Header/toggle-menu-drawer.jsx @@ -1,6 +1,6 @@ import classNames from 'classnames'; import React from 'react'; -import { Div100vhContainer, Icon, MobileDrawer, ToggleSwitch, Text, Button } from '@deriv/components'; +import { Div100vhContainer, Icon, MobileDrawer, ToggleSwitch, Text } from '@deriv/components'; import { useOnrampVisible, useAccountTransferVisible } from '@deriv/hooks'; import { routes, PlatformContext, getStaticUrl, whatsapp_url } from '@deriv/shared'; import { observer, useStore } from '@deriv/stores'; @@ -336,38 +336,7 @@ const ToggleMenuDrawer = observer(({ platform_config }) => { )} - {is_logged_in && is_trading_hub_category ? ( - - - - ) : ( + {is_logged_in && !is_trading_hub_category && ( { /> )} - +
- {is_logged_in && ( Date: Mon, 13 Mar 2023 14:02:22 +0800 Subject: [PATCH 17/35] fix: clear tests --- .../Layout/Footer/__tests__/toggle-settings.spec.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/core/src/App/Components/Layout/Footer/__tests__/toggle-settings.spec.tsx b/packages/core/src/App/Components/Layout/Footer/__tests__/toggle-settings.spec.tsx index 4d1056f1705a..1fcd55a6dc4c 100644 --- a/packages/core/src/App/Components/Layout/Footer/__tests__/toggle-settings.spec.tsx +++ b/packages/core/src/App/Components/Layout/Footer/__tests__/toggle-settings.spec.tsx @@ -12,10 +12,10 @@ jest.mock('Stores/connect', () => ({ })); describe('ToggleSettings Component', () => { - it('should has "ic-settings--active" class when "is_settings_visible" is true', () => { - render(); + it('should has render toggle settings with ic-settings footer class', () => { + render(); const link = screen.getByTestId('dt_toggle_settings'); - expect(link).toHaveClass('ic-settings--active'); + expect(link).toHaveClass('ic-settings footer__link footer__link'); }); it('should contain "IcGear" icon', () => { From 87bde47d91cd27d8ebf7b64f06addf11c17ee596 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Mon, 13 Mar 2023 14:44:30 +0800 Subject: [PATCH 18/35] fix: readd back deleted code --- .../account-transfer-form/account-transfer-form.tsx | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx index 2a450ea9bad8..8ebb3a33a37b 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-form/account-transfer-form.tsx @@ -360,6 +360,17 @@ const AccountTransferForm = observer( className='cashier__wrapper account-transfer-form__wrapper' data-testid='dt_account_transfer_form_wrapper' > + {!is_from_outside_cashier && ( + + {localize('Transfer between your accounts in Deriv')} + + )} Date: Mon, 13 Mar 2023 15:34:24 +0800 Subject: [PATCH 19/35] fix: comments v4 --- .../Components/Layout/Footer/__tests__/toggle-settings.spec.tsx | 2 +- .../App/Containers/NotificationsDialog/notifications-dialog.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/core/src/App/Components/Layout/Footer/__tests__/toggle-settings.spec.tsx b/packages/core/src/App/Components/Layout/Footer/__tests__/toggle-settings.spec.tsx index 1fcd55a6dc4c..ad86374ed18a 100644 --- a/packages/core/src/App/Components/Layout/Footer/__tests__/toggle-settings.spec.tsx +++ b/packages/core/src/App/Components/Layout/Footer/__tests__/toggle-settings.spec.tsx @@ -12,7 +12,7 @@ jest.mock('Stores/connect', () => ({ })); describe('ToggleSettings Component', () => { - it('should has render toggle settings with ic-settings footer class', () => { + it('should render toggle settings with "ic-settings" footer class', () => { render(); const link = screen.getByTestId('dt_toggle_settings'); expect(link).toHaveClass('ic-settings footer__link footer__link'); diff --git a/packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx b/packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx index d6f79fd45751..df15b8070729 100644 --- a/packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx +++ b/packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx @@ -255,7 +255,7 @@ NotificationsDialog.propTypes = { removeNotifications: PropTypes.func, }; -export default connect(({ common, notifications, client }) => ({ +export default connect(({ common, client, notifications }) => ({ app_routing_history: common.app_routing_history, loginid: client.loginid, notifications: notifications.notifications, From 81048b3169723357222ce43d061feeabbdc126f8 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Mon, 13 Mar 2023 16:09:15 +0800 Subject: [PATCH 20/35] fix: rename is_from_outside_cashier --- .../account-transfer-receipt/account-transfer-receipt.tsx | 4 ++-- .../cashier/src/pages/account-transfer/account-transfer.tsx | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx index 0cf61c8509ef..c19f35ce10fe 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx @@ -27,7 +27,7 @@ const AccountTransferReceipt = observer(({ onClose, history }: TAccountTransferR const { loginid, switchAccount } = client; const { receipt, resetAccountTransfer, selected_from, selected_to, setShouldSwitchAccount } = account_transfer; - const is_from_pre_appstore = !location.pathname.startsWith(routes.cashier); + const is_from_outside_cashier = !location.pathname.startsWith(routes.cashier); const [is_switch_visible, setIsSwitchVisible] = React.useState(false); const [switch_to, setSwitchTo] = React.useState({}); @@ -75,7 +75,7 @@ const AccountTransferReceipt = observer(({ onClose, history }: TAccountTransferR
diff --git a/packages/cashier/src/pages/account-transfer/account-transfer.tsx b/packages/cashier/src/pages/account-transfer/account-transfer.tsx index 4d6cbc8531ad..e06f40a3315d 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer.tsx @@ -47,7 +47,7 @@ const AccountTransfer = observer( const { is_switching, is_virtual } = client; const [is_loading_status, setIsLoadingStatus] = React.useState(true); - const is_from_pre_appstore = !location.pathname.startsWith(routes.cashier); + const is_from_outside_cashier = !location.pathname.startsWith(routes.cashier); React.useEffect(() => { if (!is_crypto_transactions_visible) { @@ -104,7 +104,7 @@ const AccountTransfer = observer( if (is_transfer_confirm) { return ; } - if (!is_from_pre_appstore && is_crypto_transactions_visible) { + if (!is_from_outside_cashier && is_crypto_transactions_visible) { return ; } From 0b002b7af058c0586d209bd569d514934c17ff7c Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Mon, 13 Mar 2023 16:32:32 +0800 Subject: [PATCH 21/35] fix: fix circleci --- .../account-transfer-receipt/account-transfer-receipt.tsx | 4 ++-- .../src/App/Containers/Layout/header/trading-hub-header.jsx | 1 + 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx b/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx index c19f35ce10fe..b488dd8fe8b3 100644 --- a/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx +++ b/packages/cashier/src/pages/account-transfer/account-transfer-receipt/account-transfer-receipt.tsx @@ -135,8 +135,8 @@ const AccountTransferReceipt = observer(({ onClose, history }: TAccountTransferR
); - const first_real_login_id = props.account_list?.find(account => /^(CR|MF)/.test(account.loginid))?.loginid; + const first_real_login_id = account_list?.find(account => /^(CR|MF)/.test(account.loginid))?.loginid; const TradersHubRedirect = () => { const TradersHubLink = () => { const handleRedirect = async () => { - if (!props.is_virtual && isDemoAccountTab) { - await props.switchAccount(props.virtual_account_loginid); - } else if (props.is_virtual && isRealAccountTab) { - await props.switchAccount(first_real_login_id); + if (!is_virtual && isDemoAccountTab) { + await switchAccount(virtual_account_loginid); + } else if (is_virtual && isRealAccountTab) { + await switchAccount(first_real_login_id); } - props.toggleAccountsDialog(false); + toggleAccountsDialog(false); history.push(routes.traders_hub); - props.setTogglePlatformType('cfd'); + setTogglePlatformType('cfd'); }; return ( @@ -414,7 +434,7 @@ const AccountSwitcher = props => { ); }; - if ((isRealAccountTab && props.has_any_real_account) || isDemoAccountTab) { + if ((isRealAccountTab && has_any_real_account) || isDemoAccountTab) { return ; } @@ -454,7 +474,7 @@ const AccountSwitcher = props => {
@@ -482,14 +502,14 @@ const AccountSwitcher = props => {
- {isRealAccountTab && props.has_active_real_account && !props.is_virtual && ( + {isRealAccountTab && has_active_real_account && !is_virtual && (
From 0d96b8251714e9ce2ce77b1a15577b8187f323f2 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Tue, 21 Mar 2023 14:08:14 +0800 Subject: [PATCH 34/35] fix: re-add back condition from vanuatu flow --- .../__tests__/cfd-password-modal.spec.js | 15 +++++++-------- .../cfd/src/Containers/cfd-password-modal.tsx | 16 ++++++++++++++-- 2 files changed, 21 insertions(+), 10 deletions(-) diff --git a/packages/cfd/src/Containers/__tests__/cfd-password-modal.spec.js b/packages/cfd/src/Containers/__tests__/cfd-password-modal.spec.js index dbb5a679c724..a8751ecfc884 100644 --- a/packages/cfd/src/Containers/__tests__/cfd-password-modal.spec.js +++ b/packages/cfd/src/Containers/__tests__/cfd-password-modal.spec.js @@ -255,7 +255,7 @@ describe('', () => { expect(await screen.findByRole('button', { name: /transfer now/i })); }); - it('should display mocked Derived icon in Success Dialog', async () => { + it('should display Derived icon in Success Dialog', async () => { const props = { account_status: { status: ['mt5_password_not_set', 'dxtrade_password_not_set'] }, error_type: 'PasswordError', @@ -267,7 +267,7 @@ describe('', () => { ); - expect(await screen.findByText('MockedMT5Icon')).toBeInTheDocument(); + expect(await screen.findByText('IcMt5SyntheticPlatform')).toBeInTheDocument(); }); it('should display icon in Success Dialog in tradershub', async () => { @@ -282,10 +282,10 @@ describe('', () => { ); - expect(await screen.findByText('MockedMT5Icon')).toBeInTheDocument(); + expect(await screen.findByText('IcMt5SyntheticPlatform')).toBeInTheDocument(); }); - it('should display mocked Financial icon in Success Dialog', async () => { + it('should display Financial icon in Success Dialog', async () => { const props = { account_status: { status: ['mt5_password_not_set', 'dxtrade_password_not_set'] }, error_type: 'PasswordError', @@ -297,7 +297,7 @@ describe('', () => { ); - expect(await screen.findByText('MockedMT5Icon')).toBeInTheDocument(); + expect(await screen.findByText('IcMt5FinancialPlatform')).toBeInTheDocument(); }); it('should display IcDxtradeSyntheticPlatform icon in Success Dialog', async () => { @@ -332,7 +332,7 @@ describe('', () => { expect(await screen.findByText('IcDxtradeFinancialPlatform')).toBeInTheDocument(); }); - it('should display mocked IcCfds icon in Success Dialog', async () => { + it('should display IcCfds icon in Success Dialog', async () => { const props = { account_status: { status: ['mt5_password_not_set', 'dxtrade_password_not_set'] }, error_type: 'PasswordError', @@ -343,8 +343,7 @@ describe('', () => { ); - screen.debug(); - expect(await screen.findByText('MockedMT5Icon')).toBeInTheDocument(); + expect(await screen.findByText('IcMt5CfdPlatform')).toBeInTheDocument(); }); it('should invoke verifyEmail for DerivX when Forgot password is clicked', async () => { diff --git a/packages/cfd/src/Containers/cfd-password-modal.tsx b/packages/cfd/src/Containers/cfd-password-modal.tsx index 2d688811aaa7..1d319188d960 100644 --- a/packages/cfd/src/Containers/cfd-password-modal.tsx +++ b/packages/cfd/src/Containers/cfd-password-modal.tsx @@ -151,7 +151,6 @@ const PasswordModalHeader = ({ should_set_trading_password, is_password_reset_error, platform, - context, }: TPasswordModalHeaderProps) => { const element = isMobile() ? 'p' : 'span'; const alignment = 'center'; @@ -197,6 +196,7 @@ const ReviewMessageForMT5 = ({ }; const IconType = React.memo(({ platform, type, show_eu_related_content }: TIconTypeProps) => { + const traders_hub = window.location.pathname === routes.traders_hub; if (platform === CFD_PLATFORMS.DXTRADE) { switch (type) { case 'all': @@ -208,7 +208,7 @@ const IconType = React.memo(({ platform, type, show_eu_related_content }: TIconT default: return ; } - } else { + } else if (traders_hub) { switch (type) { case 'synthetic': return ; @@ -220,6 +220,18 @@ const IconType = React.memo(({ platform, type, show_eu_related_content }: TIconT default: return ; } + } else { + switch (type) { + case 'synthetic': + return ; + case 'financial': + if (show_eu_related_content) { + return ; + } + return ; + default: + return ; + } } }); IconType.displayName = 'IconType'; From 9a0b00589cd1ea6fdf1e7d08824c67089a7400a0 Mon Sep 17 00:00:00 2001 From: Thisyahlen Nair Date: Thu, 30 Mar 2023 16:20:06 +0800 Subject: [PATCH 35/35] fix: Trigger Build