diff --git a/packages/account/src/Components/hooks/useToggleValidation.tsx b/packages/account/src/Components/hooks/useToggleValidation.tsx index f3000274db9b..338f152543c2 100644 --- a/packages/account/src/Components/hooks/useToggleValidation.tsx +++ b/packages/account/src/Components/hooks/useToggleValidation.tsx @@ -3,12 +3,12 @@ import React from 'react'; export const useToggleValidation = (hash: string) => { const [is_validation_enabled, setIsValidationEnabled] = React.useState(false); - const { is_deriv_app } = getPlatformFromUrl(); + const { is_staging_deriv_app } = getPlatformFromUrl(); React.useEffect(() => { // This effect allows to toggle IDV validation // for repetitive and sequential numbers - if (is_deriv_app || (hash && hash === '#toggle_id_validation')) { + if (!is_staging_deriv_app || (hash && hash === '#toggle_id_validation')) { setIsValidationEnabled(true); } else { setIsValidationEnabled(false); diff --git a/packages/account/src/Components/poi/idv-document-submit/idv-document-submit.jsx b/packages/account/src/Components/poi/idv-document-submit/idv-document-submit.jsx index ff398694839c..ce3f8b3679cf 100644 --- a/packages/account/src/Components/poi/idv-document-submit/idv-document-submit.jsx +++ b/packages/account/src/Components/poi/idv-document-submit/idv-document-submit.jsx @@ -6,7 +6,13 @@ import { Autocomplete, Button, DesktopWrapper, Input, MobileWrapper, Text, Selec import { Formik, Field } from 'formik'; import { localize, Localize } from '@deriv/translations'; import { formatInput, WS } from '@deriv/shared'; -import { isSequentialNumber, isRecurringNumberRegex, getDocumentData, getRegex } from './utils'; +import { + isSequentialNumber, + isRecurringNumberRegex, + getDocumentData, + getRegex, + preventEmptyClipboardPaste, +} from './utils'; import { useToggleValidation } from '../../hooks/useToggleValidation'; import FormFooter from 'Components/form-footer'; import BackButtonIcon from 'Assets/ic-poi-back-btn.svg'; @@ -96,7 +102,10 @@ const IdvDocumentSubmit = ({ handleBack, handleViewComplete, selected_country, i if (!document_number) { errors.document_number = localize('Please enter your document number. ') + getExampleFormat(document_type.example_format); - } else if (validation_is_enabled && (is_recurring_number || is_sequential_number)) { + } else if ( + (validation_is_enabled && (is_recurring_number || is_sequential_number)) || + document_number === document_type.example_format + ) { errors.document_number = localize('Please enter a valid ID number.'); } else { const format_regex = getRegex(document_type.value); @@ -238,7 +247,7 @@ const IdvDocumentSubmit = ({ handleBack, handleViewComplete, selected_country, i autoComplete='off' placeholder='Enter your document number' value={values.document_number} - onPaste={e => e.preventDefault()} + onPaste={preventEmptyClipboardPaste} onBlur={handleBlur} onChange={handleChange} onKeyUp={e => { diff --git a/packages/account/src/Components/poi/idv-document-submit/utils.js b/packages/account/src/Components/poi/idv-document-submit/utils.js index 7d8ea07ba6e6..65930186322c 100644 --- a/packages/account/src/Components/poi/idv-document-submit/utils.js +++ b/packages/account/src/Components/poi/idv-document-submit/utils.js @@ -51,6 +51,13 @@ export const getDocumentData = (country_code, document_type) => { const getImageLocation = image_name => getUrlBase(`/public/images/common/${image_name}`); +export const preventEmptyClipboardPaste = e => { + const clipboardData = (e.clipboardData || window.clipboardData).getData('text'); + if (clipboardData.length === 0) { + e.preventDefault(); + } +}; + // Unsupported Regex List const regex = [ { diff --git a/packages/account/src/Components/poi/poi-form-on-signup/idv-doc-submit-on-signup/idv-doc-submit-on-signup.jsx b/packages/account/src/Components/poi/poi-form-on-signup/idv-doc-submit-on-signup/idv-doc-submit-on-signup.jsx index 242536d2746e..546dab878e48 100644 --- a/packages/account/src/Components/poi/poi-form-on-signup/idv-doc-submit-on-signup/idv-doc-submit-on-signup.jsx +++ b/packages/account/src/Components/poi/poi-form-on-signup/idv-doc-submit-on-signup/idv-doc-submit-on-signup.jsx @@ -15,7 +15,13 @@ import { ThemedScrollbars, } from '@deriv/components'; import { isDesktop, formatInput, isMobile } from '@deriv/shared'; -import { getDocumentData, getRegex, isSequentialNumber, isRecurringNumberRegex } from '../../idv-document-submit/utils'; +import { + getDocumentData, + getRegex, + isSequentialNumber, + isRecurringNumberRegex, + preventEmptyClipboardPaste, +} from '../../idv-document-submit/utils'; import { useToggleValidation } from '../../../hooks/useToggleValidation'; import DocumentSubmitLogo from 'Assets/ic-document-submit-icon.svg'; @@ -88,7 +94,10 @@ export const IdvDocSubmitOnSignup = ({ citizen_data, has_previous, onPrevious, o if (!document_number) { errors.document_number = localize('Please enter your document number. ') + getExampleFormat(document_type.example_format); - } else if (validation_is_enabled && (is_recurring_number || is_sequential_number)) { + } else if ( + (validation_is_enabled && (is_recurring_number || is_sequential_number)) || + document_number === document_type.example_format + ) { errors.document_number = localize('Please enter a valid ID number.'); } else { const format_regex = getRegex(document_type.value); @@ -295,7 +304,7 @@ export const IdvDocSubmitOnSignup = ({ citizen_data, has_previous, onPrevious, o autoComplete='off' placeholder='Enter your document number' value={values.document_number} - onPaste={e => e.preventDefault()} + onPaste={preventEmptyClipboardPaste} onBlur={handleBlur} onChange={handleChange} onKeyUp={e => { diff --git a/packages/appstore/src/components/CFDs/cfd-accounts.tsx b/packages/appstore/src/components/CFDs/cfd-accounts.tsx index 6c91c60d1760..8bc5079c97de 100644 --- a/packages/appstore/src/components/CFDs/cfd-accounts.tsx +++ b/packages/appstore/src/components/CFDs/cfd-accounts.tsx @@ -90,7 +90,11 @@ const CFDAccounts = ({ account_type }: TCFDAccountsProps) => { {!is_demo_tab && (
- + {is_eu ? ( + + ) : ( + + )}
)} diff --git a/packages/appstore/src/components/CFDs/cfd-demo-accounts.tsx b/packages/appstore/src/components/CFDs/cfd-demo-accounts.tsx index 3d532dd3e7cd..8143a8c5bc70 100644 --- a/packages/appstore/src/components/CFDs/cfd-demo-accounts.tsx +++ b/packages/appstore/src/components/CFDs/cfd-demo-accounts.tsx @@ -9,10 +9,13 @@ import { DetailsOfEachMT5Loginid } from '@deriv/api-types'; const CFDDemoAccounts = ({ isDerivedVisible, isFinancialVisible, current_list }: TCFDAccountsProps) => { const { client, modules, common, ui }: TRootStore = useStores(); const { is_eu } = client; - const account_name = is_eu ? 'CFDs' : 'Financial'; + const account_name = is_eu ? localize('CFDs') : localize('Financial'); const account_desc = is_eu - ? 'Trade CFDs on MT5 with forex, stocks, stock indices, synthetics, cryptocurrencies, and commodities.' - : 'Trade CFDs on MT5 with forex, stocks, stock indices, commodities, and cryptocurrencies.'; + ? localize( + 'Trade CFDs on MT5 with forex, stocks, stock indices, synthetics, cryptocurrencies, and commodities.' + ) + : localize('Trade CFDs on MT5 with forex, stocks, stock indices, commodities, and cryptocurrencies.'); + const available_demo_accounts: TStaticAccountProps[] = [ { name: 'Derived', @@ -24,7 +27,7 @@ const CFDDemoAccounts = ({ isDerivedVisible, isFinancialVisible, current_list }: }, { name: account_name, - description: localize(account_desc), + description: account_desc, is_visible: isFinancialVisible(CFD_PLATFORMS.MT5), disabled: false, platform: CFD_PLATFORMS.MT5, diff --git a/packages/appstore/src/components/CFDs/cfd-real-accounts.tsx b/packages/appstore/src/components/CFDs/cfd-real-accounts.tsx index 8937455729f8..3e59a5767006 100644 --- a/packages/appstore/src/components/CFDs/cfd-real-accounts.tsx +++ b/packages/appstore/src/components/CFDs/cfd-real-accounts.tsx @@ -36,10 +36,12 @@ const CFDRealAccounts = ({ const { setAppstorePlatform, platform } = common; const { isEligibleForMoreRealMt5, is_eu } = client; const history = useHistory(); - const account_name = is_eu ? 'CFDs' : 'Financial'; + const account_name = is_eu ? localize('CFDs') : localize('Financial'); const account_desc = is_eu - ? 'Trade CFDs on MT5 with forex, stocks, stock indices, synthetics, cryptocurrencies, and commodities.' - : 'Trade CFDs on MT5 with forex, stocks, stock indices, commodities, and cryptocurrencies.'; + ? localize( + 'Trade CFDs on MT5 with forex, stocks, stock indices, synthetics, cryptocurrencies, and commodities.' + ) + : localize('Trade CFDs on MT5 with forex, stocks, stock indices, commodities, and cryptocurrencies.'); const available_real_accounts: TStaticAccountProps[] = [ { name: 'Derived', @@ -51,7 +53,7 @@ const CFDRealAccounts = ({ }, { name: account_name, - description: localize(account_desc), + description: account_desc, is_visible: isFinancialVisible(CFD_PLATFORMS.MT5), disabled: has_cfd_account_error(CFD_PLATFORMS.MT5), platform: CFD_PLATFORMS.MT5, @@ -79,10 +81,7 @@ const CFDRealAccounts = ({ return url; }; - const openAccountTransfer = ( - data: DetailsOfEachMT5Loginid & { account_id?: string; platform?: string }, - meta: { category: string; type?: string } - ) => { + const openAccountTransfer = (data: DetailsOfEachMT5Loginid & { account_id?: string; platform?: string }) => { if (data.platform === CFD_PLATFORMS.DXTRADE) sessionStorage.setItem('cfd_transfer_to_login_id', data.account_id as string); else sessionStorage.setItem('cfd_transfer_to_login_id', data.login as string); @@ -93,23 +92,9 @@ const CFDRealAccounts = ({ const onClickFundReal = (account: DetailsOfEachMT5Loginid) => { if (platform === 'dxtrade') { - return openAccountTransfer(current_list[getAccountListKey(account, platform)], { - category: account.account_type as keyof TOpenAccountTransferMeta, - type: getCFDAccountKey({ - market_type: account.market_type, - sub_account_type: account.sub_account_type, - platform, - }), - }); + return openAccountTransfer(current_list[getAccountListKey(account, platform)]); } - return openAccountTransfer(account, { - category: account.account_type as keyof TOpenAccountTransferMeta, - type: getCFDAccountKey({ - market_type: account.market_type, - sub_account_type: account.sub_account_type, - platform: CFD_PLATFORMS.MT5, - }), - }); + return openAccountTransfer(account); }; const OnClickGetAccount = (account: TStaticAccountProps) => { diff --git a/packages/appstore/src/components/main-title-bar/asset-summary.tsx b/packages/appstore/src/components/main-title-bar/asset-summary.tsx index 134ba52cb9c1..354ca1c35039 100644 --- a/packages/appstore/src/components/main-title-bar/asset-summary.tsx +++ b/packages/appstore/src/components/main-title-bar/asset-summary.tsx @@ -9,7 +9,7 @@ import './asset-summary.scss'; import TotalAssetsLoader from 'Components/pre-loader/total-assets-loader'; const AssetSummary = () => { - const { traders_hub, client } = useStores(); + const { traders_hub, client, common } = useStores(); const { selected_account_type, platform_real_balance, @@ -21,17 +21,48 @@ const AssetSummary = () => { no_MF_account, } = traders_hub; const { is_logging_in, is_switching } = client; + const { getExchangeRate } = common; + + const [exchanged_rate_cfd_real, setExchangedRateCfdReal] = React.useState(1); + const [exchanged_rate_cfd_demo, setExchangedRateCfdDemo] = React.useState(1); + + React.useEffect(() => { + const getCurrentExchangeRate = ( + currency: string, + setExchangeRate: React.Dispatch>, + base_currency = platform_real_balance.currency + ) => { + if (currency) { + getExchangeRate(currency, base_currency).then((res: number) => { + setExchangeRate(res); + }); + } + }; + + if (cfd_real_balance.currency !== platform_real_balance.currency) { + getCurrentExchangeRate(cfd_real_balance.currency, setExchangedRateCfdReal); + } + if (cfd_demo_balance.currency !== platform_demo_balance.currency) { + getCurrentExchangeRate(cfd_demo_balance.currency, setExchangedRateCfdDemo, platform_demo_balance.currency); + } + }, [ + cfd_demo_balance.currency, + cfd_real_balance.currency, + getExchangeRate, + platform_demo_balance.currency, + platform_real_balance.currency, + ]); const getTotalBalance = () => { if (selected_account_type === 'real') { return { - balance: platform_real_balance.balance + cfd_real_balance.balance, + balance: platform_real_balance.balance + cfd_real_balance.balance * exchanged_rate_cfd_real, currency: platform_real_balance.currency, }; } return { - balance: platform_demo_balance.balance + cfd_demo_balance.balance, + balance: platform_demo_balance.balance + cfd_demo_balance.balance * exchanged_rate_cfd_demo, currency: platform_demo_balance.currency, }; }; diff --git a/packages/appstore/src/components/main-title-bar/index.tsx b/packages/appstore/src/components/main-title-bar/index.tsx index cf68b5f34f0d..13450b67080e 100644 --- a/packages/appstore/src/components/main-title-bar/index.tsx +++ b/packages/appstore/src/components/main-title-bar/index.tsx @@ -66,7 +66,7 @@ const MainTitleBar = () => { ) : ( -
+
)} diff --git a/packages/appstore/src/components/main-title-bar/main-title-bar.scss b/packages/appstore/src/components/main-title-bar/main-title-bar.scss index 5152474a529c..c8c9efffc043 100644 --- a/packages/appstore/src/components/main-title-bar/main-title-bar.scss +++ b/packages/appstore/src/components/main-title-bar/main-title-bar.scss @@ -26,7 +26,7 @@ justify-content: flex-end; width: 14rem; - &__container.loader { + &__container.content-loader { width: 100%; height: 100%; padding: 0; diff --git a/packages/appstore/src/components/onboarding-new/static-dashboard.tsx b/packages/appstore/src/components/onboarding-new/static-dashboard.tsx index 862c26bcd9d6..4fd3f331e51e 100644 --- a/packages/appstore/src/components/onboarding-new/static-dashboard.tsx +++ b/packages/appstore/src/components/onboarding-new/static-dashboard.tsx @@ -239,7 +239,9 @@ const StaticDashboard = ({ type='all' platform='options' appname={is_eu_account_title} - description='Get a real Deriv account, start trading and manage your funds.' + description={localize( + 'Get a real Deriv account, start trading and manage your funds.' + )} currency={currency} has_account={has_account} is_blurry={is_blurry} @@ -261,7 +263,7 @@ const StaticDashboard = ({ return !!account.is_virtual && account.balance !== account_init_balance; }; - const is_eu_title = is_eu ? 'Multipliers' : 'Options & Multipliers'; + const is_eu_title = is_eu ? localize('Multipliers') : localize('Options & Multipliers'); - const is_eu_account_title = is_eu ? 'Multipliers account' : 'Options and Multipliers account'; + const is_eu_account_title = is_eu ? localize('Multipliers account') : localize('Options and Multipliers account'); const is_mf = loginid?.startsWith('MF'); return (
@@ -253,7 +253,7 @@ const OptionsAccounts = (props: TOptionsAccountsProps & RouteComponentProps) =>
@@ -268,7 +268,9 @@ const OptionsAccounts = (props: TOptionsAccountsProps & RouteComponentProps) => appname={is_eu_account_title} disabled={false} onClickGet={() => ui.openRealAccountSignup()} - description={`Get a real ${is_eu_title} account, start trading and manage your funds.`} + description={localize( + `Get a real ${is_eu_title} account, start trading and manage your funds.` + )} />
)} @@ -290,7 +292,7 @@ const OptionsAccounts = (props: TOptionsAccountsProps & RouteComponentProps) => footer={ } diff --git a/packages/appstore/src/components/platform-launcher/platform-launcher.tsx b/packages/appstore/src/components/platform-launcher/platform-launcher.tsx index 22c1020a202d..a5ff9433770b 100644 --- a/packages/appstore/src/components/platform-launcher/platform-launcher.tsx +++ b/packages/appstore/src/components/platform-launcher/platform-launcher.tsx @@ -29,10 +29,10 @@ const PlatformLauncher = ({ const { is_eu } = client; - const is_eu_description = 'Multipliers trading platform.'; + const is_eu_description = localize('Multipliers trading platform.'); const app_description = - app_desc === 'Options and multipliers trading platform.' && is_eu ? is_eu_description : app_desc; + app_desc === localize('Options and multipliers trading platform.') && is_eu ? is_eu_description : app_desc; const TradeButton = (