diff --git a/src/App.tsx b/src/App.tsx
index 1190db9..1869616 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -10,10 +10,10 @@ import { AppRoute, DEFAULT_TRADE_ROUTE } from '@/constants/routes';
import { useBreakpoints, useInitializePage, useShouldShowFooter, useAnalytics } from '@/hooks';
import { DydxProvider } from '@/hooks/useDydxClient';
import { AccountsProvider } from '@/hooks/useAccounts';
-import { SubaccountProvider } from './hooks/useSubaccount';
import { DialogAreaProvider, useDialogArea } from './hooks/useDialogArea';
+import { LocaleProvider } from './hooks/useLocaleSeparators';
import { NotificationsProvider } from './hooks/useNotifications';
-
+import { SubaccountProvider } from './hooks/useSubaccount';
import { GuardedMobileRoute } from '@/components/GuardedMobileRoute';
import MarketsPage from '@/pages/markets/Markets';
@@ -100,17 +100,19 @@ const App = () => (
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/constants/routes.ts b/src/constants/routes.ts
index bd8642a..2017a83 100644
--- a/src/constants/routes.ts
+++ b/src/constants/routes.ts
@@ -1,3 +1,5 @@
+import { DEFAULT_MARKETID } from './markets';
+
export enum AppRoute {
Markets = '/markets',
Portfolio = '/portfolio',
@@ -31,7 +33,7 @@ export enum MobileSettingsRoute {
export const TRADE_ROUTE = `${AppRoute.Trade}/:market`;
export const PORTFOLIO_ROUTE = `${AppRoute.Portfolio}/:subroute`;
export const HISTORY_ROUTE = `${AppRoute.Portfolio}/${PortfolioRoute.History}/:subroute`;
-export const DEFAULT_TRADE_ROUTE = `${AppRoute.Trade}/ETH-USD`;
+export const DEFAULT_TRADE_ROUTE = `${AppRoute.Trade}/${DEFAULT_MARKETID}`;
export const SETTINGS_ROUTE = `${AppRoute.Settings}/*`;
export const DEFAULT_DOCUMENT_TITLE = 'dYdX';
diff --git a/src/hooks/useCurrentMarketId.ts b/src/hooks/useCurrentMarketId.ts
index 837a860..528364b 100644
--- a/src/hooks/useCurrentMarketId.ts
+++ b/src/hooks/useCurrentMarketId.ts
@@ -1,5 +1,5 @@
-import { useEffect } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
+import { useEffect, useMemo } from 'react';
+import { shallowEqual, useDispatch, useSelector } from 'react-redux';
import { useMatch, useNavigate } from 'react-router-dom';
import { LocalStorageKey } from '@/constants/localStorage';
@@ -13,6 +13,7 @@ import { setCurrentMarketId } from '@/state/perpetuals';
import abacusStateManager from '@/lib/abacus';
import { useLocalStorage } from './useLocalStorage';
+import { getMarketIds } from '@/state/perpetualsSelectors';
export const useCurrentMarketId = () => {
const navigate = useNavigate();
@@ -20,26 +21,27 @@ export const useCurrentMarketId = () => {
const { marketId } = match?.params ?? {};
const dispatch = useDispatch();
const selectedNetwork = useSelector(getSelectedNetwork);
+ const marketIds = useSelector(getMarketIds, shallowEqual);
const [lastViewedMarket, setLastViewedMarket] = useLocalStorage({
key: LocalStorageKey.LastViewedMarket,
defaultValue: DEFAULT_MARKETID,
});
+ const validId = useMemo(() => {
+ if (marketIds.length === 0) return marketId ?? lastViewedMarket;
+ if (!marketIds.includes(marketId)) return DEFAULT_MARKETID;
+ return marketId ?? lastViewedMarket;
+ }, [marketIds, marketId]);
+
useEffect(() => {
- setLastViewedMarket(marketId ?? DEFAULT_MARKETID);
- dispatch(setCurrentMarketId(marketId ?? DEFAULT_MARKETID));
+ setLastViewedMarket(validId);
+ dispatch(setCurrentMarketId(validId));
dispatch(closeDialogInTradeBox());
- if (!marketId) {
- navigate(lastViewedMarket ? `${AppRoute.Trade}/${lastViewedMarket}` : DEFAULT_TRADE_ROUTE, {
- replace: true,
- });
- } else {
- navigate(`${AppRoute.Trade}/${marketId}`, {
- replace: true,
- });
- }
- }, [marketId]);
+ navigate(`${AppRoute.Trade}/${validId}`, {
+ replace: true,
+ });
+ }, [validId]);
useEffect(() => {
abacusStateManager.setMarket(marketId ?? DEFAULT_MARKETID);
diff --git a/src/main.tsx b/src/main.tsx
index 2a29686..e8a6619 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,5 +1,5 @@
import './polyfills';
-import { Fragment, StrictMode } from 'react';
+import { StrictMode } from 'react';
import ReactDOM from 'react-dom/client';
import { HashRouter } from 'react-router-dom';
import { Provider } from 'react-redux';
@@ -11,15 +11,12 @@ import { ErrorBoundary } from './components/ErrorBoundary';
import './index.css';
import App from './App';
-import { LocaleProvider } from './hooks/useLocaleSeparators';
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
-
- } />
-
+ } />
diff --git a/src/views/forms/TradeForm/AdvancedTradeOptions.tsx b/src/views/forms/TradeForm/AdvancedTradeOptions.tsx
index 477f947..5fa2ef3 100644
--- a/src/views/forms/TradeForm/AdvancedTradeOptions.tsx
+++ b/src/views/forms/TradeForm/AdvancedTradeOptions.tsx
@@ -109,6 +109,7 @@ export const AdvancedTradeOptions = () => {
{executionOptions && (
abacusStateManager.setTradeValue({
value: selectedTimeInForceOption,