menu highlight

lib/hooks/useNavItems.tsx

@@ -20,7 +20,7 @@ export default function useNavItems() {
 
   return React.useMemo(() => {
     const mainNavItems = [
-      { text: 'Blocks', url: link('blocks'), icon: blocksIcon, isActive: currentRoute === 'blocks' },
+      { text: 'Blocks', url: link('blocks'), icon: blocksIcon, isActive: currentRoute.startsWith('block') },
       { text: 'Transactions', url: link('txs_validated'), icon: transactionsIcon, isActive: currentRoute.startsWith('tx') },
       { text: 'Tokens', url: link('tokens'), icon: tokensIcon, isActive: currentRoute === 'tokens' },
       { text: 'Apps', url: link('apps'), icon: appsIcon, isActive: currentRoute === 'apps' },

lib/link/routes.ts

@@ -74,11 +74,11 @@ export const ROUTES = {
     pattern: `${ BASE_PATH }/blocks`,
     crossNetworkNavigation: true,
   },
-  uncles: {
+  blocks_uncles: {
     pattern: `${ BASE_PATH }/uncles`,
     crossNetworkNavigation: true,
   },
-  reorgs: {
+  blocks_reorgs: {
     pattern: `${ BASE_PATH }/reorgs`,
     crossNetworkNavigation: true,
   },

ui/pages/Blocks.tsx

@@ -9,8 +9,8 @@ import RoutedTabs from 'ui/shared/RoutedTabs/RoutedTabs';
 
 const TABS: Array<RoutedTab> = [
   { routeName: 'blocks', title: 'All', component: <BlocksContent/> },
-  { routeName: 'reorgs', title: 'Forked', component: <BlocksContent/> },
-  { routeName: 'uncles', title: 'Uncles', component: <BlocksContent/> },
+  { routeName: 'blocks_reorgs', title: 'Forked', component: <BlocksContent/> },
+  { routeName: 'blocks_uncles', title: 'Uncles', component: <BlocksContent/> },
 ];
 
 export interface Props {