Merge pull request #3 from ali-hosseini-fs/customizable-signup-modal-…

…title Customizable signup modal title
amina-deriv · Oct 19, 2021 · 7d7db9e · 7d7db9e
2 parents 389905d + 71b5b14
commit 7d7db9e
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 26 deletions.
diff --git a/packages/core/src/App/Containers/AccountSwitcher/account-switcher.jsx b/packages/core/src/App/Containers/AccountSwitcher/account-switcher.jsx
@@ -616,29 +616,32 @@ const AccountSwitcher = props => {
                                 );
                             })}
                     </div>
-                    {getRemainingRealAccounts().map((account, index) => (
-                        <div key={index} className='acc-switcher__new-account'>
-                            <Icon icon='IcDeriv' size={24} />
-                            <Text size='xs' color='general' className='acc-switcher__new-account-text'>
-                                {getAccountTitle(
-                                    account,
-                                    { account_residence: props.client_residence },
-                                    props.country_standpoint
-                                )}
-                            </Text>
-                            <Button
-                                id='dt_core_account-switcher_add-new-account'
-                                onClick={() => {
-                                    props.openRealAccountSignup(account);
-                                }}
-                                className='acc-switcher__new-account-btn'
-                                secondary
-                                small
-                            >
-                                {localize('Add')}
-                            </Button>
-                        </div>
-                    ))}
+                    {getRemainingRealAccounts().map((account, index) => {
+                        const account_title = getAccountTitle(
+                            account,
+                            { account_residence: props.client_residence },
+                            props.country_standpoint
+                        );
+                        return (
+                            <div key={index} className='acc-switcher__new-account'>
+                                <Icon icon='IcDeriv' size={24} />
+                                <Text size='xs' color='general' className='acc-switcher__new-account-text'>
+                                    {account_title}
+                                </Text>
+                                <Button
+                                    id='dt_core_account-switcher_add-new-account'
+                                    onClick={() => {
+                                        props.openRealAccountSignup(account, `Deriv ${account_title}`);
+                                    }}
+                                    className='acc-switcher__new-account-btn'
+                                    secondary
+                                    small
+                                >
+                                    {localize('Add')}
+                                </Button>
+                            </div>
+                        );
+                    })}
                     {!canUpgrade() &&
                         canOpenMulti() &&
                         (!props.is_eu || (props.is_eu && props.can_change_fiat_currency)) && (

diff --git a/packages/core/src/App/Containers/RealAccountSignup/real-account-signup.jsx b/packages/core/src/App/Containers/RealAccountSignup/real-account-signup.jsx
@@ -30,7 +30,13 @@ const modal_pages_indices = {
     finished_add_currency: 8,
 };
 
-const WizardHeading = ({ real_account_signup_target, currency, is_isle_of_man_residence, country_standpoint }) => {
+const WizardHeading = ({
+    real_account_signup_target,
+    currency,
+    is_isle_of_man_residence,
+    country_standpoint,
+    signup_modal_real_account_title,
+}) => {
     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';
@@ -69,7 +75,7 @@ const WizardHeading = ({ real_account_signup_target, currency, is_isle_of_man_re
                 country_standpoint.is_other_eu ||
                 country_standpoint.is_rest_of_eu
             ) {
-                return <Localize i18n_default_text='Add a real Deriv Multipliers account' />;
+                return <Localize i18n_default_text={`Add a real ${signup_modal_real_account_title} account`} />;
             }
             return <Localize i18n_default_text='Add a Deriv Financial account' />;
         case 'samoa':
@@ -103,6 +109,7 @@ const RealAccountSignup = ({
     state_index,
     state_value,
     deposit_real_account_signup_target,
+    signup_modal_real_account_title,
 }) => {
     const [current_action, setCurrentAction] = React.useState(null);
     const [is_loading, setIsLoading] = React.useState(false);
@@ -427,6 +434,7 @@ const RealAccountSignup = ({
                                     available_crypto_currencies={available_crypto_currencies}
                                     should_show_all_available_currencies={should_show_all_available_currencies}
                                     country_standpoint={country_standpoint}
+                                    signup_modal_real_account_title={signup_modal_real_account_title}
                                 />
                             );
                         }
@@ -466,6 +474,7 @@ const RealAccountSignup = ({
                                     is_belgium_residence={is_belgium_residence}
                                     should_show_all_available_currencies={should_show_all_available_currencies}
                                     country_standpoint={country_standpoint}
+                                    signup_modal_real_account_title={signup_modal_real_account_title}
                                 />
                             );
                         }
@@ -510,4 +519,5 @@ export default connect(({ ui, client, common, modules }) => ({
     state_value: ui.real_account_signup,
     routing_history: common.app_routing_history,
     deposit_real_account_signup_target: ui.deposit_real_account_signup_target,
+    signup_modal_real_account_title: ui.signup_modal_real_account_title,
 }))(withRouter(RealAccountSignup));
diff --git a/packages/core/src/Stores/ui-store.js b/packages/core/src/Stores/ui-store.js
@@ -37,6 +37,7 @@ export default class UIStore extends BaseStore {
     @observable is_dark_mode_on = window?.matchMedia?.('(prefers-color-scheme: dark)').matches && isMobile();
     @observable is_settings_modal_on = false;
     @observable is_accounts_switcher_on = false;
+    @observable signup_modal_real_account_title = '';
     @observable account_switcher_disabled_message = '';
 
     @observable has_only_forward_starting_contracts = false;
@@ -411,10 +412,11 @@ export default class UIStore extends BaseStore {
     }
 
     @action.bound
-    openRealAccountSignup(target = this.root_store.client.upgradeable_landing_companies?.[0]) {
+    openRealAccountSignup(target = this.root_store.client.upgradeable_landing_companies?.[0], call_site) {
         this.is_real_acc_signup_on = true;
         this.real_account_signup_target = target;
         this.is_accounts_switcher_on = false;
+        this.signup_modal_real_account_title = call_site || this.signup_modal_real_account_title;
     }
 
     @action.bound