fix: merge master and review comment

__mocks__/translation.mock.js

@@ -44,10 +44,7 @@ const useTranslations = () => ({
 
 const localize = mockFn;
 
-const getAllowedLanguages = jest.fn(unsupported_languages => {
-    if (unsupported_languages.includes('VI')) {
-        return { EN: 'English' };
-    }
+const getAllowedLanguages = jest.fn(() => {
     return { EN: 'English', VI: 'Tiếng Việt' };
 });
 

packages/account/package.json

@@ -38,7 +38,7 @@
         "@deriv-com/quill-ui": "1.24.2",
         "@deriv/components": "^1.0.0",
         "@deriv/hooks": "^1.0.0",
-        "@deriv/quill-icons": "1.23.3",
+        "@deriv/quill-icons": "2.2.1",
         "@deriv/shared": "^1.0.0",
         "@deriv/stores": "^1.0.0",
         "@deriv/translations": "^1.0.0",

packages/account/src/Containers/Account/__tests__/tradinghub-logout.spec.tsx

@@ -1,8 +1,17 @@
 import React from 'react';
+
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
+
 import TradingHubLogout from '../tradinghub-logout';
 
+jest.mock('@deriv/hooks', () => ({
+    ...jest.requireActual('@deriv/hooks'),
+    useOauth2: jest.fn(({ handleLogout }) => ({
+        isOAuth2Enabled: true,
+        oAuthLogout: jest.fn(() => handleLogout && handleLogout()),
+    })),
+}));
 describe('TradingHubLogout', () => {
     const mock_props: React.ComponentProps<typeof TradingHubLogout> = {
         handleOnLogout: jest.fn(),
@@ -13,10 +22,10 @@ describe('TradingHubLogout', () => {
         expect(screen.getByText('Log out')).toBeInTheDocument();
     });
 
-    it('should invoke handleOnLogout when logout tab is clicked', () => {
+    it('should invoke handleOnLogout when logout tab is clicked', async () => {
         render(<TradingHubLogout {...mock_props} />);
         const el_tab = screen.getByTestId('dt_logout_tab');
-        userEvent.click(el_tab);
-        expect(mock_props.handleOnLogout).toBeCalledTimes(1);
+        await userEvent.click(el_tab);
+        expect(mock_props.handleOnLogout).toHaveBeenCalledTimes(1);
     });
 });

packages/account/src/Sections/Profile/LanguageSettings/__tests__/language-settings.spec.tsx

@@ -1,11 +1,13 @@
 import React from 'react';
-import { screen, render } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+
 import { routes } from '@deriv/shared';
-import LanguageSettings from '../language-settings';
 import { mockStore, StoreProvider } from '@deriv/stores';
-import { useDevice } from '@deriv-com/ui';
 import { useTranslations } from '@deriv-com/translations';
+import { useDevice } from '@deriv-com/ui';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+
+import LanguageSettings from '../language-settings';
 
 jest.mock('@deriv-com/ui', () => ({
     ...jest.requireActual('@deriv-com/ui'),
@@ -42,9 +44,6 @@ describe('LanguageSettings', () => {
             common: {
                 current_language: 'lang_1',
             },
-            client: {
-                has_wallet: false,
-            },
         });
         (useTranslations as jest.Mock).mockReturnValue({
             currentLang: 'EN',
@@ -59,7 +58,7 @@ describe('LanguageSettings', () => {
         });
     };
 
-    it('should render LanguageSettings with all allowed languages for non-wallets accounts', () => {
+    it('should render LanguageSettings with all allowed languages', () => {
         renderLanguageSettings();
 
         expect(screen.getByText('Select language')).toBeInTheDocument();
@@ -73,27 +72,11 @@ describe('LanguageSettings', () => {
         expect(lang_2).toBeInTheDocument();
     });
 
-    it('should render LanguageSettings with only wallets-allowed languages for wallets accounts', () => {
-        mockRootStore.client.has_wallet = true;
-
-        renderLanguageSettings();
-
-        expect(screen.getByText('Select language')).toBeInTheDocument();
-
-        const lang_1 = screen.getByText('English');
-        const lang_2 = screen.queryByText('Tiếng Việt');
-
-        expect(screen.getByText(/Language 1 Flag/)).toBeInTheDocument();
-        expect(screen.queryByText(/Language 2 Flag/)).not.toBeInTheDocument();
-        expect(lang_1).toBeInTheDocument();
-        expect(lang_2).not.toBeInTheDocument();
-    });
-
-    it('should trigger language change', () => {
+    it('should trigger language change', async () => {
         renderLanguageSettings();
 
         const lang_2 = screen.getByText('Tiếng Việt');
-        userEvent.click(lang_2);
+        await userEvent.click(lang_2);
 
         expect(mockRootStore.common.changeSelectedLanguage).toHaveBeenCalled();
     });
@@ -110,17 +93,4 @@ describe('LanguageSettings', () => {
         expect(screen.queryByText('Select language')).not.toBeInTheDocument();
         expect(screen.getByText('Redirect')).toBeInTheDocument();
     });
-
-    it('should redirect when the user tries to reach `/account/languages` route having wallet accounts', () => {
-        mockRootStore.client.has_wallet = true;
-        Object.defineProperty(window, 'location', {
-            configurable: true,
-            value: { pathname: routes.languages },
-        });
-
-        renderLanguageSettings();
-
-        expect(screen.queryByText('Select language')).not.toBeInTheDocument();
-        expect(screen.getByText('Redirect')).toBeInTheDocument();
-    });
 });

packages/account/src/Sections/Profile/LanguageSettings/language-settings.tsx

@@ -1,17 +1,16 @@
 import { Redirect } from 'react-router-dom';
-import { UNSUPPORTED_LANGUAGES, WALLETS_UNSUPPORTED_LANGUAGES, routes } from '@deriv/shared';
+import { UNSUPPORTED_LANGUAGES, routes } from '@deriv/shared';
 import { observer, useStore } from '@deriv/stores';
 import { useTranslations, getAllowedLanguages } from '@deriv-com/translations';
 import FormSubHeader from '../../../Components/form-sub-header';
 import LanguageRadioButton from '../../../Components/language-settings';
 import { useDevice } from '@deriv-com/ui';
 
 const LanguageSettings = observer(() => {
-    const { client, common } = useStore();
+    const { common } = useStore();
     const { switchLanguage, currentLang, localize } = useTranslations();
     // [TODO]: Remove changeSelectedLanguage() when whole app starts to use @deriv-com/translations
     const { changeSelectedLanguage } = common;
-    const { has_wallet } = client;
     const { isDesktop } = useDevice();
 
     if (!isDesktop) {
@@ -25,9 +24,7 @@ const LanguageSettings = observer(() => {
         switchLanguage(language_key);
     };
 
-    const allowed_languages: Record<string, string> = getAllowedLanguages(
-        has_wallet ? WALLETS_UNSUPPORTED_LANGUAGES : UNSUPPORTED_LANGUAGES
-    );
+    const allowed_languages: Record<string, string> = getAllowedLanguages(UNSUPPORTED_LANGUAGES);
 
     return (
         <div className='settings-language'>

packages/account/src/Sections/Security/ClosingAccount/closing-account-pending-conditions/closing-account-pending-balance.tsx

@@ -1,11 +1,13 @@
 import { Money } from '@deriv/components';
 import { CFD_PLATFORMS, getCFDAccount, getCFDAccountDisplay, getCFDPlatformLabel, getMT5Icon } from '@deriv/shared';
-import { FormatUtils, CurrencyConstants } from '@deriv-com/utils';
 import { observer, useStore } from '@deriv/stores';
 import { Localize } from '@deriv-com/translations';
+import { CurrencyConstants, FormatUtils } from '@deriv-com/utils';
+
 import { TCFDPlatform, TDetailsOfDerivXAccount, TDetailsOfMT5Account } from '../../../../Types';
-import ClosingAccountPendingWrapper from './closing-account-pending-wrapper';
+
 import ClosingAccountPendingContent from './closing-account-pending-content';
+import ClosingAccountPendingWrapper from './closing-account-pending-wrapper';
 
 type TClosingAccountPendingBalanceProps = {
     platform: TCFDPlatform;
@@ -36,6 +38,7 @@ const ClosingAccountPendingBalance = observer(({ platform, account_balance }: TC
                             return `IcMt5-${getMT5Icon({
                                 market_type: account.market_type,
                                 is_eu: is_eu_user,
+                                product: account.product,
                             })}`;
                         case CFD_PLATFORMS.DXTRADE:
                             return `IcDxtrade-${getCFDAccount({

packages/account/src/Sections/Security/ClosingAccount/closing-account-pending-conditions/closing-account-pending-positions.tsx

@@ -35,6 +35,7 @@ const ClosingAccountPendingPositions = observer(
                                 return `IcMt5-${getMT5Icon({
                                     market_type: account.market_type,
                                     is_eu: is_eu_user,
+                                    product: account.product,
                                 })}`;
                             case CFD_PLATFORMS.DXTRADE:
                                 return `IcDxtrade-${getCFDAccount({

packages/account/src/Sections/Security/Passwords/__tests__/deriv-mt5-password.spec.tsx

@@ -6,7 +6,7 @@ import { mockStore, StoreProvider } from '@deriv/stores';
 
 jest.mock('@deriv/quill-icons', () => ({
     ...jest.requireActual('@deriv/quill-icons'),
-    PartnersProductDerivMt5BrandLightLogoHorizontalIcon: () => 'PartnersProductDerivMt5BrandLightLogoHorizontalIcon',
+    PartnersProductBrandLightDerivMt5LogoIcon: () => 'PartnersProductBrandLightDerivMt5LogoIcon',
 }));
 
 jest.mock('@deriv/api', () => ({
@@ -45,7 +45,7 @@ describe('<DerivMT5Password />', () => {
         expect(
             screen.getByText(/use your to log in to your Deriv MT5 accounts on the desktop, web and mobile apps\./i)
         ).toBeInTheDocument();
-        expect(screen.queryByText(/PartnersProductDerivMt5BrandLightLogoHorizontalIcon/i)).toBeInTheDocument();
+        expect(screen.queryByText(/PartnersProductBrandLightDerivMt5LogoIcon/i)).toBeInTheDocument();
         expect(screen.getByRole('button', { name: /Change password/i })).toBeInTheDocument();
         expect(screen.queryByText(/unlink from/i)).not.toBeInTheDocument();
     });

packages/account/src/Sections/Security/Passwords/__tests__/email-password-title.spec.tsx

@@ -6,7 +6,7 @@ import { AccountsDerivXIcon, BrandDerivLogoCoralIcon, LegacyEmailIcon } from '@d
 jest.mock('@deriv/quill-icons', () => ({
     AccountsDerivXIcon: jest.fn(() => null),
     BrandDerivLogoCoralIcon: jest.fn(() => null),
-    PartnersProductDerivMt5BrandLightLogoHorizontalIcon: jest.fn(() => null),
+    PartnersProductBrandLightDerivMt5LogoIcon: jest.fn(() => null),
     LegacyEmailIcon: jest.fn(() => null),
 }));
 

packages/account/src/Sections/Security/Passwords/email-password-title.tsx

@@ -3,7 +3,7 @@ import {
     AccountsDerivXIcon,
     BrandDerivLogoCoralIcon,
     LegacyEmailIcon,
-    PartnersProductDerivMt5BrandLightLogoHorizontalIcon,
+    PartnersProductBrandLightDerivMt5LogoIcon,
 } from '@deriv/quill-icons';
 
 type TEmailPasswordTitleProps = {
@@ -15,7 +15,7 @@ const EmailPasswordTitle = ({ icon, title }: TEmailPasswordTitleProps) => {
     const displayIcon = {
         deriv_email: <LegacyEmailIcon iconSize='sm' />,
         deriv_password: <BrandDerivLogoCoralIcon height={24} width={24} />,
-        deriv_mt5_password: <PartnersProductDerivMt5BrandLightLogoHorizontalIcon height={24} width={24} />,
+        deriv_mt5_password: <PartnersProductBrandLightDerivMt5LogoIcon height={24} width={24} />,
         deriv_x_password: <AccountsDerivXIcon iconSize='sm' />,
     };
 

packages/account/src/Types/common.type.ts

@@ -163,7 +163,7 @@ export type TIDVFormValues = {
     error_message?: string;
 };
 
-export type TPlatforms = typeof Platforms[keyof typeof Platforms];
+export type TPlatforms = (typeof Platforms)[keyof typeof Platforms];
 
 export type TServerError = {
     code?: string;
@@ -172,7 +172,7 @@ export type TServerError = {
     details?: { [key: string]: string };
     fields?: string[];
 };
-export type TCFDPlatform = typeof CFD_PLATFORMS[keyof typeof CFD_PLATFORMS];
+export type TCFDPlatform = (typeof CFD_PLATFORMS)[keyof typeof CFD_PLATFORMS];
 
 export type TClosingAccountFormValues = {
     'financial-priorities': boolean;
@@ -217,7 +217,7 @@ export type TAccounts = {
     title?: string;
 };
 
-type TProduct = 'financial' | 'synthetic' | 'swap_free' | 'zero_spread' | 'cTrader' | 'derivx';
+export type TProduct = 'financial' | 'synthetic' | 'swap_free' | 'zero_spread' | 'cTrader' | 'derivx' | 'gold';
 
 type TPendingAccountDetails = {
     balance?: number;
@@ -250,7 +250,7 @@ export type TAutoComplete = {
     value: boolean;
     text: string;
 };
-export type TPaymentMethodIdentifier = typeof IDENTIFIER_TYPES[keyof typeof IDENTIFIER_TYPES];
+export type TPaymentMethodIdentifier = (typeof IDENTIFIER_TYPES)[keyof typeof IDENTIFIER_TYPES];
 
 export type TPaymentMethodInfo = {
     documents_required: number;
@@ -285,11 +285,11 @@ export type TProofOfOwnershipErrors = Record<
 
 export type TFinancialInformationForm = Omit<SetFinancialAssessmentRequest, 'set_financial_assessment'>;
 
-export type TAuthStatusCodes = typeof AUTH_STATUS_CODES[keyof typeof AUTH_STATUS_CODES];
+export type TAuthStatusCodes = (typeof AUTH_STATUS_CODES)[keyof typeof AUTH_STATUS_CODES];
 
 export type TMT5AccountStatus =
-    | typeof MT5_ACCOUNT_STATUS[keyof typeof MT5_ACCOUNT_STATUS]
-    | typeof TRADING_PLATFORM_STATUS[keyof typeof TRADING_PLATFORM_STATUS];
+    | (typeof MT5_ACCOUNT_STATUS)[keyof typeof MT5_ACCOUNT_STATUS]
+    | (typeof TRADING_PLATFORM_STATUS)[keyof typeof TRADING_PLATFORM_STATUS];
 
 export type TFilesDescription = {
     descriptions: { id: string; value: JSX.Element }[];

packages/api-v2/src/hooks/__tests__/useSortedMT5Accounts.spec.ts

@@ -1,10 +1,11 @@
+import { cleanup } from '@testing-library/react';
 import { renderHook } from '@testing-library/react-hooks';
+
 import useActiveAccount from '../useActiveAccount';
 import useAvailableMT5Accounts from '../useAvailableMT5Accounts';
 import useIsEuRegion from '../useIsEuRegion';
 import useMT5AccountsList from '../useMT5AccountsList';
 import useSortedMT5Accounts from '../useSortedMT5Accounts';
-import { cleanup } from '@testing-library/react';
 
 jest.mock('../useActiveAccount', () => jest.fn());
 jest.mock('../useAvailableMT5Accounts', () => jest.fn());
@@ -42,6 +43,11 @@ const mockMT5NonEUAvailableAccounts = [
         product: 'zero_spread',
         shortcode: 'bvi',
     },
+    {
+        is_default_jurisdiction: 'true',
+        product: 'gold',
+        shortcode: 'bvi',
+    },
     {
         is_default_jurisdiction: 'true',
         product: 'swap_free',
@@ -65,6 +71,11 @@ const mockMT5NonEUAddedAccounts = [
         landing_company_short: 'bvi',
         product: 'zero_spread',
     },
+    {
+        is_virtual: false,
+        landing_company_short: 'bvi',
+        product: 'gold',
+    },
 ];
 
 const mockMT5EUAvailableAccounts = [
@@ -135,6 +146,12 @@ describe('useSortedMT5Accounts', () => {
                 product: 'zero_spread',
                 shortcode: 'bvi',
             },
+            {
+                is_added: false,
+                is_default_jurisdiction: 'true',
+                product: 'gold',
+                shortcode: 'bvi',
+            },
         ]);
     });
 
@@ -199,6 +216,12 @@ describe('useSortedMT5Accounts', () => {
                 landing_company_short: 'bvi',
                 product: 'zero_spread',
             },
+            {
+                is_added: true,
+                is_virtual: false,
+                landing_company_short: 'bvi',
+                product: 'gold',
+            },
         ]);
     });
 
@@ -241,6 +264,7 @@ describe('useSortedMT5Accounts', () => {
             'stp',
             'swap_free',
             'zero_spread',
+            'gold',
         ]);
     });
 
@@ -297,6 +321,12 @@ describe('useSortedMT5Accounts', () => {
                 landing_company_short: 'bvi',
                 product: 'zero_spread',
             },
+            {
+                is_added: true,
+                is_virtual: false,
+                landing_company_short: 'bvi',
+                product: 'gold',
+            },
         ]);
     });
 });