Lubega/TRAH: 5324/Change redirection for residence (#18005)

* [TRAH5324] Suisin/chore: fix to not check citizen and check residence instead (#17986) * chore: fix to not check citizen and check residence instead * chore: change hooks to only contain isHubRedirectionEnabled * fix: check redirection based on authorize country (#18004) * Change redirection for residence (#18006) * fix: check redirection based on authorize country * fix: remove trading_hub --------- Co-authored-by: Sui Sin <[email protected]> Co-authored-by: lubega-deriv <[email protected]>
deriv-com · Jan 22, 2025 · 021edab · 021edab
1 parent 7230c5b
commit 021edab
Show file tree

Hide file tree

Showing 17 changed files with 82 additions and 139 deletions.
diff --git a/packages/api-v2/src/hooks/useIsHubRedirectionEnabled.ts b/packages/api-v2/src/hooks/useIsHubRedirectionEnabled.ts
@@ -1,6 +1,6 @@
+import useAuthorize from './useAuthorize';
 import useClientCountry from './useClientCountry';
 import useGrowthbookGetFeatureValue from './useGrowthbookGetFeatureValue';
-import useSettings from './useSettings';
 
 type THubEnabledCountryList = {
     hub_enabled_country_list: string[];
@@ -11,24 +11,17 @@ const useIsHubRedirectionEnabled = () => {
         featureFlag: 'hub_enabled_country_list',
     });
     const { data: clientCountry } = useClientCountry();
-    const { data: accountSettings } = useSettings();
-    const { citizen } = accountSettings;
+    const { data: authorize } = useAuthorize();
+    const country = authorize?.country ? authorize.country : clientCountry;
 
     const isHubRedirectionEnabled =
         typeof hubEnabledCountryList === 'object' &&
         hubEnabledCountryList !== null &&
         Array.isArray((hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list) &&
-        citizen &&
-        (hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list.includes(citizen);
+        country &&
+        (hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list.includes(country);
 
-    const isChangingToHubAppId =
-        typeof hubEnabledCountryList === 'object' &&
-        hubEnabledCountryList !== null &&
-        Array.isArray((hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list) &&
-        clientCountry &&
-        (hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list.includes(clientCountry);
-
-    return { isHubRedirectionEnabled, isChangingToHubAppId };
+    return { isHubRedirectionEnabled };
 };
 
 export default useIsHubRedirectionEnabled;
diff --git a/packages/core/src/App/AppContent.tsx b/packages/core/src/App/AppContent.tsx
@@ -63,7 +63,7 @@ const AppContent: React.FC<{ passthrough: unknown }> = observer(({ passthrough }
             await logout();
         },
     });
-    const { isChangingToHubAppId } = useIsHubRedirectionEnabled();
+    const { isHubRedirectionEnabled } = useIsHubRedirectionEnabled();
 
     const is_app_id_set = localStorage.getItem('config.app_id');
     const is_change_login_app_id_set = localStorage.getItem('change_login_app_id');
@@ -110,13 +110,13 @@ const AppContent: React.FC<{ passthrough: unknown }> = observer(({ passthrough }
     useIntercom(token);
 
     React.useEffect(() => {
-        if (isChangingToHubAppId && !is_app_id_set) {
+        if (isHubRedirectionEnabled && !is_app_id_set) {
             const app_id = process.env.NODE_ENV === 'production' ? 61554 : 53503;
             localStorage.setItem('change_login_app_id', app_id.toString());
             return;
         }
         is_change_login_app_id_set && localStorage.removeItem('change_login_app_id');
-    }, [isChangingToHubAppId, is_app_id_set, is_change_login_app_id_set]);
+    }, [isHubRedirectionEnabled, is_app_id_set, is_change_login_app_id_set]);
 
     React.useEffect(() => {
         switchLanguage(current_language);

diff --git a/packages/core/src/App/Components/Layout/Header/platform-dropdown.jsx b/packages/core/src/App/Components/Layout/Header/platform-dropdown.jsx
@@ -1,14 +1,17 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
-import { Div100vhContainer, Icon, useOnClickOutside, Text } from '@deriv/components';
-import { routes, getActivePlatform, platforms } from '@deriv/shared';
-import { BinaryLink } from 'App/Components/Routes';
-import 'Sass/app/_common/components/platform-dropdown.scss';
-import { Localize } from '@deriv/translations';
 import { useHistory } from 'react-router';
-import { useDevice } from '@deriv-com/ui';
+
+import { Div100vhContainer, Icon, Text, useOnClickOutside } from '@deriv/components';
 import { useIsHubRedirectionEnabled } from '@deriv/hooks';
+import { getActivePlatform, platforms, routes } from '@deriv/shared';
 import { useStore } from '@deriv/stores';
+import { Localize } from '@deriv/translations';
+import { useDevice } from '@deriv-com/ui';
+
+import { BinaryLink } from 'App/Components/Routes';
+
+import 'Sass/app/_common/components/platform-dropdown.scss';
 
 const PlatformBox = ({ platform: { icon, description } }) => (
     <React.Fragment>
@@ -54,15 +57,14 @@ const PlatformDropdown = ({ app_routing_history, closeDrawer, platform_config, s
     const { isDesktop } = useDevice();
     const { isHubRedirectionEnabled } = useIsHubRedirectionEnabled();
     const { client } = useStore();
-    const { account_settings, has_wallet } = client;
-    const { trading_hub } = account_settings;
+    const { has_wallet } = client;
 
     const TradersHubRedirect = () => {
         return (
             <div className='platform-dropdown__cta'>
                 <BinaryLink
                     onClick={() => {
-                        if (isHubRedirectionEnabled && has_wallet && !!trading_hub) {
+                        if (isHubRedirectionEnabled && has_wallet) {
                             window.location.assign(platforms.tradershub_os.url);
                             return;
                         }

diff --git a/packages/core/src/App/Containers/AccountSwitcherWallet/account-switcher-wallet-mobile.tsx b/packages/core/src/App/Containers/AccountSwitcherWallet/account-switcher-wallet-mobile.tsx
@@ -1,11 +1,14 @@
 import React from 'react';
 import { useHistory } from 'react-router';
+
 import { Button, Icon, MobileDialog, Text } from '@deriv/components';
+import { useIsHubRedirectionEnabled, useIsRtl, useStoreWalletAccountsList } from '@deriv/hooks';
 import { platforms, routes } from '@deriv/shared';
+import { observer } from '@deriv/stores';
 import { Localize } from '@deriv/translations';
+
 import { AccountSwitcherWalletList } from './account-switcher-wallet-list';
-import { useIsHubRedirectionEnabled, useIsRtl, useStoreWalletAccountsList } from '@deriv/hooks';
-import { observer, useStore } from '@deriv/stores';
+
 import './account-switcher-wallet-mobile.scss';
 
 type TAccountSwitcherWalletMobile = {
@@ -18,9 +21,6 @@ export const AccountSwitcherWalletMobile = observer(({ is_visible, toggle, login
     const history = useHistory();
     const isRtl = useIsRtl();
     const { data: wallet_list } = useStoreWalletAccountsList();
-    const { client } = useStore();
-    const { account_settings } = client;
-    const { trading_hub } = account_settings;
 
     const dtrade_account_wallets = wallet_list?.filter(wallet => wallet.dtrade_loginid);
     const { isHubRedirectionEnabled } = useIsHubRedirectionEnabled();
@@ -30,7 +30,7 @@ export const AccountSwitcherWalletMobile = observer(({ is_visible, toggle, login
     }, [toggle]);
 
     const handleTradersHubRedirect = () => {
-        if (isHubRedirectionEnabled && !!trading_hub) {
+        if (isHubRedirectionEnabled) {
             window.location.assign(platforms.tradershub_os.url);
             return;
         }

diff --git a/packages/core/src/App/Containers/AccountSwitcherWallet/account-switcher-wallet.tsx b/packages/core/src/App/Containers/AccountSwitcherWallet/account-switcher-wallet.tsx
@@ -1,11 +1,14 @@
 import React from 'react';
 import { useHistory } from 'react-router';
+
 import { Icon, Text, ThemedScrollbars, useOnClickOutside } from '@deriv/components';
+import { useIsHubRedirectionEnabled, useStoreWalletAccountsList } from '@deriv/hooks';
 import { platforms, routes } from '@deriv/shared';
-import { observer, useStore } from '@deriv/stores';
+import { observer } from '@deriv/stores';
 import { Localize } from '@deriv/translations';
-import { useIsHubRedirectionEnabled, useStoreWalletAccountsList } from '@deriv/hooks';
+
 import { AccountSwitcherWalletList } from './account-switcher-wallet-list';
+
 import './account-switcher-wallet.scss';
 
 type TAccountSwitcherWalletProps = {
@@ -18,9 +21,6 @@ export const AccountSwitcherWallet = observer(({ is_visible, toggle }: TAccountS
     const dtrade_account_wallets = wallet_list?.filter(wallet => wallet.dtrade_loginid);
 
     const history = useHistory();
-    const { client } = useStore();
-    const { account_settings } = client;
-    const { trading_hub } = account_settings;
 
     const wrapper_ref = React.useRef<HTMLDivElement>(null);
     const { isHubRedirectionEnabled } = useIsHubRedirectionEnabled();
@@ -43,7 +43,7 @@ export const AccountSwitcherWallet = observer(({ is_visible, toggle }: TAccountS
     useOnClickOutside(wrapper_ref, closeAccountsDialog, validateClickOutside);
 
     const handleTradersHubRedirect = async () => {
-        if (isHubRedirectionEnabled && !!trading_hub) {
+        if (isHubRedirectionEnabled) {
             window.location.assign(platforms.tradershub_os.url);
             return;
         }

diff --git a/packages/core/src/App/Containers/RootComponent/root-component.jsx b/packages/core/src/App/Containers/RootComponent/root-component.jsx
@@ -25,8 +25,7 @@ const RootComponent = observer(props => {
         setIsWalletsOnboardingTourGuideVisible,
         notification_messages_ui,
     } = ui;
-    const { has_wallet, logout, account_settings, prevent_redirect_to_hub } = client;
-    const { trading_hub } = account_settings;
+    const { has_wallet, logout, prevent_redirect_to_hub } = client;
 
     const { oAuthLogout } = useOauth2({ handleLogout: logout });
 
@@ -39,11 +38,11 @@ const RootComponent = observer(props => {
     const STAGING_REDIRECT_URL = 'https://staging-hub.deriv.com/tradershub/options';
 
     useEffect(() => {
-        if (isHubRedirectionEnabled && has_wallet && !!trading_hub && !prevent_redirect_to_hub) {
+        if (isHubRedirectionEnabled && has_wallet && !prevent_redirect_to_hub) {
             const redirectUrl = process.env.NODE_ENV === 'production' ? PRODUCTION_REDIRECT_URL : STAGING_REDIRECT_URL;
             window.location.assign(redirectUrl);
         }
-    }, [isHubRedirectionEnabled, has_wallet, trading_hub, prevent_redirect_to_hub]);
+    }, [isHubRedirectionEnabled, has_wallet, prevent_redirect_to_hub]);
 
     return has_wallet ? (
         <Wallets
@@ -53,7 +52,7 @@ const RootComponent = observer(props => {
             }}
             notificationMessagesUi={notification_messages_ui}
             onWalletsOnboardingTourGuideCloseHandler={onWalletsOnboardingTourGuideCloseHandler}
-            isHubRedirectionEnabled={isHubRedirectionEnabled && !!trading_hub}
+            isHubRedirectionEnabled={isHubRedirectionEnabled}
         />
     ) : (
         <AppStore {...props} />

diff --git a/packages/hooks/src/__tests__/useIsHubRedirectionEnabled.spec.tsx b/packages/hooks/src/__tests__/useIsHubRedirectionEnabled.spec.tsx
@@ -1,9 +1,11 @@
 import React from 'react';
+
+import { mockStore, StoreProvider } from '@deriv/stores';
 import { renderHook } from '@testing-library/react-hooks';
 
+import useAuthorize from '../useAuthorize';
 import useGrowthbookGetFeatureValue from '../useGrowthbookGetFeatureValue';
 import useIsHubRedirectionEnabled from '../useIsHubRedirectionEnabled';
-import { mockStore, StoreProvider } from '@deriv/stores';
 
 jest.mock('../useGrowthbookGetFeatureValue', () =>
     jest.fn(() => [
@@ -13,65 +15,70 @@ jest.mock('../useGrowthbookGetFeatureValue', () =>
     ])
 );
 
+jest.mock('../useAuthorize', () =>
+    jest.fn(() => ({
+        data: {
+            country: 'UK',
+        },
+    }))
+);
+
 describe('useIsHubRedirectionEnabled', () => {
     const mock_store = mockStore({
         client: {
-            account_settings: { citizen: 'US' },
             clients_country: 'US',
         },
     });
 
     beforeEach(() => {
         mock_store.client.clients_country = 'US';
-        mock_store.client.account_settings.citizen = 'US';
         (useGrowthbookGetFeatureValue as jest.Mock).mockReturnValue([
             {
-                hub_enabled_country_list: ['AU'],
+                hub_enabled_country_list: ['US', 'AU', 'UK'],
             },
         ]);
+        (useAuthorize as jest.Mock).mockReturnValue({
+            data: {
+                country: 'UK',
+            },
+        });
     });
 
     const wrapper = ({ children }: { children: JSX.Element }) => (
         <StoreProvider store={mock_store}>{children}</StoreProvider>
     );
 
     it('should return initial state correctly', () => {
-        const { result } = renderHook(() => useIsHubRedirectionEnabled(), { wrapper });
-
-        expect(result.current.isHubRedirectionEnabled).toBe(false);
-        expect(result.current.isChangingToHubAppId).toBe(false);
-    });
-
-    it('should return false if client country is not in the hub enabled list', () => {
-        mock_store.client.account_settings.citizen = 'UK';
         (useGrowthbookGetFeatureValue as jest.Mock).mockReturnValue([
             {
-                hub_enabled_country_list: ['US', 'AU'],
+                hub_enabled_country_list: ['AU'],
             },
         ]);
         const { result } = renderHook(() => useIsHubRedirectionEnabled(), { wrapper });
+
         expect(result.current.isHubRedirectionEnabled).toBe(false);
     });
 
-    it('should return true if client country is in the hub enabled list', () => {
-        mock_store.client.clients_country = 'UK';
-        (useGrowthbookGetFeatureValue as jest.Mock).mockReturnValue([
-            {
-                hub_enabled_country_list: ['US', 'AU', 'UK'],
-            },
-        ]);
+    it('should return true if authorize country is in the hub enabled list', () => {
         const { result } = renderHook(() => useIsHubRedirectionEnabled(), { wrapper });
         expect(result.current.isHubRedirectionEnabled).toBe(true);
     });
 
-    it('should return isChangingToHubAppId true if client country is in the hub enabled list but not in the citizen list', () => {
-        mock_store.client.clients_country = 'UK';
+    it('should return true if client country is in the hub enabled list and authorize is undefined', () => {
+        (useAuthorize as jest.Mock).mockReturnValue({
+            data: undefined,
+        });
+        const { result } = renderHook(() => useIsHubRedirectionEnabled(), { wrapper });
+        expect(result.current.isHubRedirectionEnabled).toBe(true);
+    });
+
+    it('should return false if authorize and client country is not in the hub enabled list', () => {
         (useGrowthbookGetFeatureValue as jest.Mock).mockReturnValue([
             {
-                hub_enabled_country_list: ['US', 'AU', 'UK'],
+                hub_enabled_country_list: ['AU'],
             },
         ]);
         const { result } = renderHook(() => useIsHubRedirectionEnabled(), { wrapper });
-        expect(result.current.isChangingToHubAppId).toBe(true);
+        expect(result.current.isHubRedirectionEnabled).toBe(false);
     });
 });
diff --git a/packages/hooks/src/useIsHubRedirectionEnabled.ts b/packages/hooks/src/useIsHubRedirectionEnabled.ts
@@ -1,5 +1,6 @@
 import { useStore } from '@deriv/stores';
 
+import useAuthorize from './useAuthorize';
 import useGrowthbookGetFeatureValue from './useGrowthbookGetFeatureValue';
 
 type THubEnabledCountryList = {
@@ -10,24 +11,19 @@ const useIsHubRedirectionEnabled = () => {
     const [hubEnabledCountryList] = useGrowthbookGetFeatureValue({
         featureFlag: 'hub_enabled_country_list',
     });
+    const { data: authorize } = useAuthorize();
     const { client } = useStore();
-    const { account_settings, clients_country } = client;
+    const { clients_country } = client;
+    const country = authorize?.country ? authorize.country : clients_country;
 
     const isHubRedirectionEnabled =
         typeof hubEnabledCountryList === 'object' &&
         hubEnabledCountryList !== null &&
         Array.isArray((hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list) &&
-        account_settings.citizen &&
-        (hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list.includes(account_settings.citizen);
+        country &&
+        (hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list.includes(country);
 
-    const isChangingToHubAppId =
-        typeof hubEnabledCountryList === 'object' &&
-        hubEnabledCountryList !== null &&
-        Array.isArray((hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list) &&
-        clients_country &&
-        (hubEnabledCountryList as THubEnabledCountryList).hub_enabled_country_list.includes(clients_country);
-
-    return { isHubRedirectionEnabled, isChangingToHubAppId };
+    return { isHubRedirectionEnabled };
 };
 
 export default useIsHubRedirectionEnabled;
diff --git a/packages/wallets/src/components/ModalProvider/ModalProvider.tsx b/packages/wallets/src/components/ModalProvider/ModalProvider.tsx
@@ -2,9 +2,9 @@ import React, { createContext, useContext, useEffect, useMemo, useRef, useState
 import { createPortal } from 'react-dom';
 import { useHistory } from 'react-router-dom';
 import { useOnClickOutside } from 'usehooks-ts';
+import { useIsHubRedirectionEnabled } from '@deriv/api-v2';
 import { useDevice } from '@deriv-com/ui';
 import { THooks, TMarketTypes, TPlatforms } from '../../types';
-import { useIsHubRedirectionEnabled, useSettings } from '@deriv/api-v2';
 
 type TModalState = {
     accountId?: string;
@@ -48,8 +48,6 @@ const ModalProvider = ({ children }: React.PropsWithChildren<unknown>) => {
     const { isDesktop } = useDevice();
     const history = useHistory();
     const { isHubRedirectionEnabled } = useIsHubRedirectionEnabled();
-    const { data: accountSettings } = useSettings();
-    const { trading_hub: tradingHub } = accountSettings;
 
     const rootRef = useRef<HTMLElement>(document.getElementById('wallets_modal_root'));
     const rootHeaderRef = useRef<HTMLElement | null>(document.getElementById('wallets_modal_show_header_root'));
@@ -89,7 +87,7 @@ const ModalProvider = ({ children }: React.PropsWithChildren<unknown>) => {
         }));
         // We need to add this check here because wallets account is coming from Low-Code tradershub.
         // This condition is to reload the page when the modal is closed.
-        if (isHubRedirectionEnabled && !!tradingHub) {
+        if (isHubRedirectionEnabled) {
             window.location.reload();
         }
     };