diff --git a/src/App.tsx b/src/App.tsx index 557b074b..9020d926 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,10 +1,14 @@ +/* eslint-disable no-console */ +import { useEffect } from 'react'; import { BrowserRouter } from 'react-router-dom'; import { QueryParamProvider } from 'use-query-params'; import { ReactRouter5Adapter } from 'use-query-params/adapters/react-router-5'; import { AppFooter, AppHeader, DerivIframe } from '@/components'; +import { useAccountList, useAuthData } from '@deriv-com/api-hooks'; import { initializeI18n, TranslationProvider } from '@deriv-com/translations'; import { useDevice } from '@deriv-com/ui'; import AppContent from './routes/AppContent'; +import { getOauthUrl } from './constants'; const { VITE_CROWDIN_BRANCH_NAME, VITE_PROJECT_NAME, VITE_TRANSLATIONS_CDN_URL } = import.meta.env; const i18nInstance = initializeI18n({ @@ -13,6 +17,23 @@ const i18nInstance = initializeI18n({ const App = () => { const { isDesktop } = useDevice(); + const { data: accountList } = useAccountList(); + const { activeLoginid, isAuthorized } = useAuthData(); + + const oauthUrl = getOauthUrl(); + useEffect(() => { + const hasActiveLoginid = !!activeLoginid; + const hasAccounts = !!accountList?.length; + const shouldRedirectToLogin = !isAuthorized && !hasActiveLoginid && !hasAccounts; + console.log('isAuthorized', isAuthorized); + console.log('hasActiveLoginid', hasActiveLoginid); + console.log('hasAccounts', hasAccounts); + console.log('shouldRedirectToLogin', shouldRedirectToLogin); + console.log('===='); + // if (shouldRedirectToLogin) { + // window.open(oauthUrl, '_self'); + // } + }, [accountList, activeLoginid, isAuthorized, oauthUrl]); return ( diff --git a/src/components/AppHeader/AppHeader.tsx b/src/components/AppHeader/AppHeader.tsx index 8e643571..dc4feb5c 100644 --- a/src/components/AppHeader/AppHeader.tsx +++ b/src/components/AppHeader/AppHeader.tsx @@ -1,9 +1,8 @@ -import { useEffect } from 'react'; +import { getOauthUrl } from '@/constants'; import { StandaloneCircleUserRegularIcon } from '@deriv/quill-icons'; -import { useAccountList, useAuthData } from '@deriv-com/api-hooks'; +import { useAuthData } from '@deriv-com/api-hooks'; import { useTranslations } from '@deriv-com/translations'; import { Button, Header, Text, TooltipMenuIcon, useDevice, Wrapper } from '@deriv-com/ui'; -import { LocalStorageConstants, LocalStorageUtils, URLUtils } from '@deriv-com/utils'; import { AccountSwitcher } from './AccountSwitcher'; import { AppLogo } from './AppLogo'; import { MenuItems } from './MenuItems'; @@ -14,34 +13,10 @@ import './AppHeader.scss'; // TODO: handle local storage values not updating after changing local storage values const AppHeader = () => { - const { data: accounts } = useAccountList(); const { isDesktop } = useDevice(); const { activeLoginid, logout } = useAuthData(); const { localize } = useTranslations(); - const appId = LocalStorageUtils.getValue(LocalStorageConstants.configAppId); - const serverUrl = localStorage.getItem(LocalStorageConstants.configServerURL.toString()); - const oauthUrl = - appId && serverUrl - ? `https://${serverUrl}/oauth2/authorize?app_id=${appId}&l=EN&&brand=deriv` - : URLUtils.getOauthURL(); - - useEffect(() => { - const shouldRedirectToLogin = () => { - if (typeof accounts !== 'undefined') { - const userHasNoP2PAccount = !accounts.find( - account => account.broker === 'CR' && account.currency === 'USD' - ); - const activeAccount = accounts.find(account => account.loginid === activeLoginid); - const activeAccountCurrency = activeAccount?.currency || null; - - if (userHasNoP2PAccount || activeAccountCurrency !== 'USD') { - window.open(oauthUrl, '_self'); - } - } - }; - - shouldRedirectToLogin(); - }, [accounts, activeLoginid, oauthUrl]); + const oauthUrl = getOauthUrl(); return (
diff --git a/src/constants/url.ts b/src/constants/url.ts index e0f58557..f50ce1a2 100644 --- a/src/constants/url.ts +++ b/src/constants/url.ts @@ -1,4 +1,4 @@ -import { URLConstants } from '@deriv-com/utils'; +import { LocalStorageConstants, LocalStorageUtils, URLConstants, URLUtils } from '@deriv-com/utils'; export const BUY_SELL_URL = '/buy-sell'; export const ORDERS_URL = '/orders'; @@ -12,3 +12,14 @@ export const ACCOUNT_LIMITS = `${URLConstants.derivAppProduction}/account/accoun export const DERIV_COM = URLConstants.derivComProduction; export const HELP_CENTRE = `${URLConstants.derivComProduction}/help-centre/`; export const RESPONSIBLE = `${URLConstants.derivComProduction}/responsible/`; + +export const getOauthUrl = () => { + const appId = LocalStorageUtils.getValue(LocalStorageConstants.configAppId); + const serverUrl = localStorage.getItem(LocalStorageConstants.configServerURL.toString()); + const oauthUrl = + appId && serverUrl + ? `https://${serverUrl}/oauth2/authorize?app_id=${appId}&l=EN&&brand=deriv` + : URLUtils.getOauthURL(); + + return oauthUrl; +};