hide account menu for networks without account

pages/[network_type]/[network_sub_type]/index.tsx

 import { VStack, Textarea, Button, Alert, AlertTitle, AlertDescription, Link, Code } from '@chakra-ui/react';
-import capitalize from 'lodash/capitalize';
 import type { NextPage, GetStaticPaths } from 'next';
 import { useRouter } from 'next/router';
 import type { ChangeEvent } from 'react';
@@ -22,9 +21,7 @@ const Home: NextPage = () => {
 
   React.useEffect(() => {
     const token = cookies.get(cookies.NAMES.API_TOKEN);
-    if (!token && selectedNetwork?.isAccountSupported) {
-      setFormVisibility(true);
-    }
+    setFormVisibility(Boolean(!token && selectedNetwork?.isAccountSupported));
   }, [ selectedNetwork?.isAccountSupported ]);
 
   const handleTokenChange = React.useCallback((event: ChangeEvent<HTMLTextAreaElement>) => {
@@ -53,7 +50,7 @@ const Home: NextPage = () => {
     <Page>
       <VStack gap={ 4 } alignItems="flex-start" maxW="800px">
         <PageHeader text={
-          `Home Page for ${ capitalize(router.query.network_type as string) } ${ capitalize(router.query.network_sub_type as string) } network`
+          `Home Page for ${ selectedNetwork?.name } network`
         }/>
         { /* will be deleted when we move to new CI */ }
         { isFormVisible && (

ui/blocks/navigation/NavFooter.tsx

@@ -20,10 +20,10 @@ const VERSION_URL = `https://github.com/blockscout/blockscout/tree/${ BLOCKSCOUT
 
 interface Props {
   isCollapsed?: boolean;
-  isAuth?: boolean;
+  hasAccount?: boolean;
 }
 
-const NavFooter = ({ isCollapsed, isAuth }: Props) => {
+const NavFooter = ({ isCollapsed, hasAccount }: Props) => {
   const isMobile = useIsMobile();
 
   const width = (() => {
@@ -35,7 +35,7 @@ const NavFooter = ({ isCollapsed, isAuth }: Props) => {
   })();
 
   const marginTop = (() => {
-    if (!isAuth) {
+    if (!hasAccount) {
       return 'auto';
     }
 

ui/blocks/navigation/NavigationDesktop.tsx

@@ -4,6 +4,7 @@ import React from 'react';
 
 import * as cookies from 'lib/cookies';
 import useNavItems from 'lib/hooks/useNavItems';
+import useNetwork from 'lib/hooks/useNetwork';
 import getDefaultTransitionProps from 'theme/utils/getDefaultTransitionProps';
 import NetworkLogo from 'ui/blocks/networkMenu/NetworkLogo';
 import NetworkMenu from 'ui/blocks/networkMenu/NetworkMenu';
@@ -13,9 +14,11 @@ import NavLink from './NavLink';
 
 const NavigationDesktop = () => {
   const { mainNavItems, accountNavItems } = useNavItems();
+  const selectedNetwork = useNetwork();
   const isLargeScreen = useBreakpointValue({ base: false, xl: true });
   const navBarCollapsedCookie = cookies.get(cookies.NAMES.NAV_BAR_COLLAPSED);
   const isAuth = Boolean(cookies.get(cookies.NAMES.API_TOKEN));
+  const hasAccount = selectedNetwork?.isAccountSupported && isAuth;
 
   const [ isCollapsed, setCollapsedState ] = React.useState(navBarCollapsedCookie === 'true');
 
@@ -67,14 +70,14 @@ const NavigationDesktop = () => {
           { mainNavItems.map((item) => <NavLink key={ item.text } { ...item } isCollapsed={ isCollapsed }/>) }
         </VStack>
       </Box>
-      { isAuth && (
+      { hasAccount && (
         <Box as="nav" mt={ 12 }>
           <VStack as="ul" spacing="2" alignItems="flex-start" overflow="hidden">
             { accountNavItems.map((item) => <NavLink key={ item.text } { ...item } isCollapsed={ isCollapsed }/>) }
           </VStack>
         </Box>
       ) }
-      <NavFooter isCollapsed={ isCollapsed } isAuth={ isAuth }/>
+      <NavFooter isCollapsed={ isCollapsed } hasAccount={ hasAccount }/>
       <ChevronLeftIcon
         width={ 6 }
         height={ 6 }

ui/blocks/navigation/NavigationMobile.tsx

@@ -3,12 +3,16 @@ import React from 'react';
 
 import * as cookies from 'lib/cookies';
 import useNavItems from 'lib/hooks/useNavItems';
+import useNetwork from 'lib/hooks/useNetwork';
 import NavFooter from 'ui/blocks/navigation/NavFooter';
 import NavLink from 'ui/blocks/navigation/NavLink';
 
 const NavigationMobile = () => {
   const { mainNavItems, accountNavItems } = useNavItems();
+  const selectedNetwork = useNetwork();
+
   const isAuth = Boolean(cookies.get(cookies.NAMES.API_TOKEN));
+  const hasAccount = selectedNetwork?.isAccountSupported && isAuth;
 
   return (
     <>
@@ -24,7 +28,7 @@ const NavigationMobile = () => {
           </VStack>
         </Box>
       ) }
-      <NavFooter isAuth={ isAuth }/>
+      <NavFooter hasAccount={ hasAccount }/>
     </>
   );
 };