diff --git a/apps/trading/lib/hooks/use-get-current-route-id.ts b/apps/trading/lib/hooks/use-get-current-route-id.ts
index d99c757c7..5adb812bd 100644
--- a/apps/trading/lib/hooks/use-get-current-route-id.ts
+++ b/apps/trading/lib/hooks/use-get-current-route-id.ts
@@ -3,12 +3,10 @@ import { matchRoutes, useLocation } from 'react-router-dom';
export const useGetCurrentRouteId = () => {
const location = useLocation();
- const currentRoute = matchRoutes(routerConfig, location);
- const lastRoute = currentRoute?.pop();
+ const matches = matchRoutes(routerConfig, location);
+ const lastRoute = matches ? matches[matches.length - 1] : undefined;
if (lastRoute) {
- const {
- route: { id },
- } = lastRoute;
+ const id = lastRoute.route.id;
return id || '';
}
return '';
diff --git a/apps/trading/pages/client-router.tsx b/apps/trading/pages/client-router.tsx
index 028689d91..880ef8732 100644
--- a/apps/trading/pages/client-router.tsx
+++ b/apps/trading/pages/client-router.tsx
@@ -13,6 +13,7 @@ import { Assets } from '../client-pages/assets';
import { Deposit } from '../client-pages/deposit';
import { Withdraw } from '../client-pages/withdraw';
import { Transfer } from '../client-pages/transfer';
+import { Routes } from '../lib/links';
// These must remain dynamically imported as pennant cannot be compiled by nextjs due to ESM
// Using dynamic imports is a workaround for this until pennant is published as ESM
@@ -31,6 +32,7 @@ export const routerConfig: RouteObject[] = [
{
path: 'disclaimer',
element: ,
+ id: Routes.DISCLAIMER,
children: [{ index: true, element: }],
},
@@ -42,6 +44,7 @@ export const routerConfig: RouteObject[] = [
{
index: true,
element: ,
+ id: Routes.HOME,
},
{
path: 'markets',
@@ -54,10 +57,12 @@ export const routerConfig: RouteObject[] = [
{
path: 'all',
element: ,
+ id: Routes.MARKETS,
},
{
path: ':marketId',
element: ,
+ id: Routes.MARKET,
},
],
},
@@ -68,15 +73,17 @@ export const routerConfig: RouteObject[] = [
{
index: true,
element: ,
+ id: Routes.PORTFOLIO,
},
{
path: 'assets',
element: ,
+ id: Routes.ASSETS,
children: [
{ index: true, element: },
- { path: 'deposit', element: },
- { path: 'withdraw', element: },
- { path: 'transfer', element: },
+ { path: 'deposit', element: , id: Routes.DEPOSIT },
+ { path: 'withdraw', element: , id: Routes.WITHDRAW },
+ { path: 'transfer', element: , id: Routes.TRANSFER },
],
},
],
@@ -84,6 +91,7 @@ export const routerConfig: RouteObject[] = [
{
path: 'liquidity/:marketId',
element: ,
+ id: Routes.LIQUIDITY,
},
// NotFound page is here so its caught within parent '/*' route