Maryia/task_push_labuan_bvi_vanuatu (#7164)

* Maryia/feat: removed Add region button

* feat: initialized Mt5GoToDerivBanner

* finilized Mt5GoToDerivBanner styling (desktop+responsive)

* made only button clickable not the whole banner

* Finalized popup for new clients (desktop + responsive)

* feat: filtering mt5 accounts to show only svg and labuan (stp)

* finalized existing clients flow

* fix: centered the go to deriv banner

* Maryia/fix: show existing STP even if missing from landing_company

Author: maryia-deriv

src/images/mt5_banner/mt5_go_to_deriv_banner_icons.svg

@@ -85,7 +85,9 @@ const Dialog = (() => {
                     }
 
                     el_btn_ok.addEventListener('click', () => {
-                        el_dialog.remove();
+                        if (!options.keep_open_on_confirm) {
+                            el_dialog.remove();
+                        }
                         if (typeof options.onConfirm === 'function') {
                             options.onConfirm();
                         }

src/javascript/app/common/attach_dom/dialog.js

@@ -0,0 +1,15 @@
+const getElementById = require('../../_common/common_functions').getElementById;
+const getLanguage    = require('../../_common/language').get;
+
+const Mt5GoToDerivBanner = (() => {
+    const classname = 'mt5_go_to_deriv_banner';
+
+    const onLoad = () => {
+        getElementById(`${classname}-link`).href = `https://app.deriv.com/mt5?lang=${getLanguage()}`;
+        getElementById(`${classname}_container`).setVisibility(1);
+    };
+
+    return { onLoad };
+})();
+
+module.exports = Mt5GoToDerivBanner;

src/javascript/app/common/mt5_go_to_deriv_banner.js

@@ -1,13 +1,14 @@
-const Metatrader = require('../../metatrader/metatrader');
-const BinarySocket = require('../../../../base/socket');
-const Client = require('../../../../base/client');
-const Currency = require('../../../../common/currency');
-const Url = require('../../../../../_common/url');
-const hasAccountType = require('../../../../../_common/base/client_base').hasAccountType;
-const getElementById = require('../../../../../_common/common_functions').getElementById;
-const localize = require('../../../../../_common/localize').localize;
+const Metatrader         = require('../../metatrader/metatrader');
+const MetaTraderConfig   = require('../../metatrader/metatrader.config');
+const BinarySocket       = require('../../../../base/socket');
+const Client             = require('../../../../base/client');
+const Currency           = require('../../../../common/currency');
+const Url                = require('../../../../../_common/url');
+const hasAccountType     = require('../../../../../_common/base/client_base').hasAccountType;
+const getElementById     = require('../../../../../_common/common_functions').getElementById;
+const localize           = require('../../../../../_common/localize').localize;
 const applyToAllElements = require('../../../../../_common/utility').applyToAllElements;
-const State = require('../../../../../_common/storage').State;
+const State              = require('../../../../../_common/storage').State;
 
 const AccountClosure = (() => {
     let reason_checkbox_list,
@@ -211,7 +212,7 @@ const AccountClosure = (() => {
     const getMT5MarketType = (mt5_account) => mt5_account.market_type === 'synthetic' ? 'gaming' : mt5_account.market_type;
 
     const showErrorPopUp = async (response) => {
-        const mt5_login_list = (await BinarySocket.wait('mt5_login_list')).mt5_login_list;
+        const filtered_mt5_login_list = MetaTraderConfig.getFilteredMt5LoginList((await BinarySocket.wait('mt5_login_list')).mt5_login_list);
         const dxtrade_accounts_list = (await BinarySocket.send({ trading_platform_accounts: 1, platform: 'dxtrade' })).trading_platform_accounts;
 
         // clear all previously added details first
@@ -240,7 +241,7 @@ const AccountClosure = (() => {
             el_section.setVisibility(1).appendChild(el_section_parent);
         };
         const getMTDisplay = (account) => {
-            const mt5_account = (mt5_login_list.find(acc => acc.login === account) || {});
+            const mt5_account = (filtered_mt5_login_list.find(acc => acc.login === account) || {});
             const market_type = getMT5MarketType(mt5_account);
             return Client.getMT5AccountDisplays(market_type, mt5_account.sub_account_type).short;
         };

src/javascript/app/pages/user/account/settings/account_closure.js

@@ -562,6 +562,10 @@ const MetaTraderConfig = (() => {
         return /\d$/.test(acc_type) ? acc_type.substr(0, acc_type.lastIndexOf('_')) : acc_type;
     };
 
+    // hide bvi and vanuatu (fx) mt5 accounts, display svg and stp (labuan) only:
+    const getFilteredMt5LoginList = (mt5_login_list) => mt5_login_list
+        .filter(mt5_account => mt5_account.landing_company_short === 'svg' || mt5_account.landing_company_short === 'labuan');
+
     // if no server exists yet, e.g. during new account creation
     // we want to get information like landing company etc which is shared
     // between all the servers, so we can disregard the server and return the first
@@ -606,6 +610,7 @@ const MetaTraderConfig = (() => {
         getCleanAccType,
         getCurrency,
         getDisplayLogin,
+        getFilteredMt5LoginList,
         getSampleAccount,
         isAuthenticated,
         isAuthenticationPromptNeeded,