remove NEXT_PUBLIC_NETWORK_TYPE env

.env.template

@@ -14,7 +14,6 @@ NEXT_PUBLIC_NETWORK_LOGO_DARK=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_LOGO_DARK__
 NEXT_PUBLIC_NETWORK_ICON=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_ICON__
 NEXT_PUBLIC_NETWORK_ICON_DARK=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_ICON_DARK__
 NEXT_PUBLIC_NETWORK_ASSETS_PATHNAME=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_ASSETS_PATHNAME__
-NEXT_PUBLIC_NETWORK_TYPE=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_TYPE__
 NEXT_PUBLIC_NETWORK_ID=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_ID__
 NEXT_PUBLIC_NETWORK_CURRENCY_NAME=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_CURRENCY_NAME__
 NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL__

configs/app/config.ts

 /* eslint-disable no-restricted-properties */
-import type { FeaturedNetwork, NetworkExplorer, PreDefinedNetwork } from 'types/networks';
+import type { FeaturedNetwork, NetworkExplorer } from 'types/networks';
 import type { ChainIndicatorId } from 'ui/home/indicators/types';
 
 const getEnvValue = (env: string | undefined) => env?.replaceAll('\'', '"');
@@ -59,7 +59,6 @@ const config = Object.freeze({
   env,
   isDev,
   network: {
-    type: getEnvValue(process.env.NEXT_PUBLIC_NETWORK_TYPE) as PreDefinedNetwork | undefined,
     logo: {
       'default': getEnvValue(process.env.NEXT_PUBLIC_NETWORK_LOGO),
       dark: getEnvValue(process.env.NEXT_PUBLIC_NETWORK_LOGO_DARK),

configs/envs/.env.goerli

@@ -9,7 +9,6 @@ NEXT_PUBLIC_NETWORK_SHORT_NAME=Goerli
 NEXT_PUBLIC_NETWORK_ASSETS_PATHNAME=ethereum
 NEXT_PUBLIC_NETWORK_LOGO=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/goerli.svg
 NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/goerli.svg
-NEXT_PUBLIC_NETWORK_TYPE=goerli
 NEXT_PUBLIC_NETWORK_ID=5
 NEXT_PUBLIC_NETWORK_CURRENCY_NAME=Ether
 NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=ETH

configs/envs/.env.goerli.optimism

@@ -10,7 +10,6 @@ NEXT_PUBLIC_NETWORK_SHORT_NAME=Base
 NEXT_PUBLIC_NETWORK_ASSETS_PATHNAME=optimism
 NEXT_PUBLIC_NETWORK_LOGO=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/base.svg
 NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/base.svg
-NEXT_PUBLIC_NETWORK_TYPE=base_goerli
 NEXT_PUBLIC_NETWORK_ID=420
 NEXT_PUBLIC_NETWORK_CURRENCY_NAME=Ether
 NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=ETH

configs/envs/.env.localhost

@@ -20,7 +20,6 @@ NEXT_PUBLIC_API_SPEC_URL=https://raw.githubusercontent.com/blockscout/blockscout
 NEXT_PUBLIC_NETWORK_NAME=POA
 NEXT_PUBLIC_NETWORK_SHORT_NAME=POA
 NEXT_PUBLIC_NETWORK_ASSETS_PATHNAME=poa
-NEXT_PUBLIC_NETWORK_TYPE=poa_core
 NEXT_PUBLIC_NETWORK_ID=99
 NEXT_PUBLIC_NETWORK_CURRENCY_NAME=POA
 NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=POA

configs/envs/.env.poa_core

@@ -13,7 +13,6 @@ NEXT_PUBLIC_NETWORK_ICON=https://raw.githubusercontent.com/blockscout/frontend-c
 NEXT_PUBLIC_NETWORK_NAME=ZetaChain
 NEXT_PUBLIC_NETWORK_SHORT_NAME=ZetaChain
 NEXT_PUBLIC_NETWORK_ASSETS_PATHNAME=poa
-NEXT_PUBLIC_NETWORK_TYPE=shibuya
 NEXT_PUBLIC_NETWORK_ID=99
 NEXT_PUBLIC_NETWORK_CURRENCY_NAME=POA
 NEXT_PUBLIC_NETWORK_CURRENCY_SYMBOL=POA

deploy/values/l2-optimism-goerli/values.yaml

@@ -349,8 +349,6 @@ frontend:
       _default: Base
     NEXT_PUBLIC_NETWORK_ASSETS_PATHNAME:
       _default: optimism
-    NEXT_PUBLIC_NETWORK_TYPE:
-      _default: base_goerli
     NEXT_PUBLIC_NETWORK_ID:
       _default: 420
     NEXT_PUBLIC_NETWORK_CURRENCY_NAME:

deploy/values/main/values.yaml

@@ -320,8 +320,6 @@ frontend:
       _default: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/goerli.svg
     NEXT_PUBLIC_NETWORK_ICON:
       _default: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/goerli.svg
-    NEXT_PUBLIC_NETWORK_TYPE:
-      _default: goerli
     NEXT_PUBLIC_NETWORK_ID:
       _default: 5
     NEXT_PUBLIC_NETWORK_CURRENCY_NAME:

deploy/values/review-l2/values.yaml

@@ -73,8 +73,6 @@ frontend:
       _default: Base
     NEXT_PUBLIC_NETWORK_ASSETS_PATHNAME:
       _default: optimism
-    NEXT_PUBLIC_NETWORK_TYPE:
-      _default: base_goerli
     NEXT_PUBLIC_NETWORK_ID:
       _default: 420
     NEXT_PUBLIC_NETWORK_CURRENCY_NAME:

deploy/values/review/values.yaml

@@ -76,8 +76,6 @@ frontend:
       _default: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-logos/goerli.svg
     NEXT_PUBLIC_NETWORK_ICON:
       _default: https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/network-icons/goerli.svg
-    NEXT_PUBLIC_NETWORK_TYPE:
-      _default: goerli
     NEXT_PUBLIC_NETWORK_ID:
       _default: 5
     NEXT_PUBLIC_NETWORK_CURRENCY_NAME:

docs/ENVS.md

@@ -10,7 +10,6 @@ The app instance could be customized by passing following variables to NodeJS en
 | --- | --- | --- | --- | --- | --- |
 | NEXT_PUBLIC_NETWORK_NAME | `string` | Displayed name of the network | yes | - | `Gnosis Chain` |
 | NEXT_PUBLIC_NETWORK_SHORT_NAME | `string` | Used for SEO attributes (page title and description) | - | -  | `OoG` |
-| NEXT_PUBLIC_NETWORK_TYPE | `string` | Network type (used for matching pre-defined assets, e.g network logo and icon, which are stored in the project). See all possible values here | - | -  | `xdai_mainnet` |
 | NEXT_PUBLIC_NETWORK_ID | `number` | Chain id, see [https://chainlist.org](https://chainlist.org) for the reference | yes | -  | `99` |
 | NEXT_PUBLIC_NETWORK_RPC_URL | `string` | Chain server RPC url, see [https://chainlist.org](https://chainlist.org) for the reference. If not provided, some functionality of the explorer, related to smart contracts interaction and third-party apps integration, will be unavailable | - | - | `https://core.poa.network` |
 | NEXT_PUBLIC_NETWORK_CURRENCY_NAME | `string` | Network currency name | - | - | `Ether` |

lib/networks/useNetworkNavigationItems.ts

-import React from 'react';
-
-import appConfig from 'configs/app/config';
-import featuredNetworks from 'lib/networks/featuredNetworks';
-
-export default function useNetworkNavigationItems() {
-
-  return React.useMemo(() => {
-    return featuredNetworks.map((network) => {
-      return {
-        ...network,
-        isActive: network.type ? appConfig.network.type === network.type : false,
-      };
-    });
-  }, []);
-}

types/networks.ts

@@ -31,6 +31,7 @@ export interface FeaturedNetwork {
   group: NetworkGroup;
   icon?: FunctionComponent<SVGAttributes<SVGElement>> | string;
   type?: PreDefinedNetwork;
+  isActive?: boolean;
 }
 
 export interface NetworkExplorer {

ui/snippets/networkMenu/NetworkLogo.pw.tsx

@@ -17,14 +17,7 @@ test('fallback logo +@desktop-xl +@dark-mode +@dark-mode-xl', async({ mount }) =
 });
 
 test.describe('placeholder logo', () => {
-  const extendedTest = test.extend({
-    context: contextWithEnvs([
-      { name: 'NEXT_PUBLIC_NETWORK_TYPE', value: 'unknown' },
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    ]) as any,
-  });
-
-  extendedTest('+@desktop-xl +@dark-mode +@dark-mode-xl', async({ mount }) => {
+  test('+@desktop-xl +@dark-mode +@dark-mode-xl', async({ mount }) => {
     const component = await mount(
       <TestApp>
         <NetworkLogo/>

ui/snippets/networkMenu/NetworkMenuContentDesktop.tsx

@@ -4,7 +4,6 @@ import React from 'react';
 import type { NetworkGroup } from 'types/networks';
 
 import featuredNetworks from 'lib/networks/featuredNetworks';
-import useNetworkNavigationItems from 'lib/networks/useNetworkNavigationItems';
 
 import NetworkMenuLink from './NetworkMenuLink';
 
@@ -12,8 +11,7 @@ const TABS: Array<NetworkGroup> = [ 'mainnets', 'testnets', 'other' ];
 const availableTabs = TABS.filter((tab) => featuredNetworks.some(({ group }) => group === tab));
 
 const NetworkMenuPopup = () => {
-  const items = useNetworkNavigationItems();
-  const selectedNetwork = items.find(({ isActive }) => isActive);
+  const selectedNetwork = featuredNetworks.find(({ isActive }) => isActive);
   const selectedTab = availableTabs.findIndex((tab) => selectedNetwork?.group === tab);
 
   return (
@@ -30,7 +28,7 @@ const NetworkMenuPopup = () => {
             { availableTabs.map((tab) => (
               <TabPanel key={ tab } p={ 0 }>
                 <VStack as="ul" spacing={ 2 } alignItems="stretch" mt={ 4 }>
-                  { items
+                  { featuredNetworks
                     .filter((network) => network.group === tab)
                     .map((network) => (
                       <NetworkMenuLink

ui/snippets/networkMenu/NetworkMenuContentMobile.tsx

@@ -4,16 +4,16 @@ import React from 'react';
 
 import type { NetworkGroup } from 'types/networks';
 
-import useNetworkNavigationItems from 'lib/networks/useNetworkNavigationItems';
+import featuredNetworks from 'lib/networks/featuredNetworks';
 
 import NetworkMenuLink from './NetworkMenuLink';
 
 const TABS: Array<NetworkGroup> = [ 'mainnets', 'testnets', 'other' ];
+const availableTabs = TABS.filter((tab) => featuredNetworks.some(({ group }) => group === tab));
 
 const NetworkMenuContentMobile = () => {
-  const items = useNetworkNavigationItems();
-  const selectedNetwork = items.find(({ isActive }) => isActive);
-  const [ selectedTab, setSelectedTab ] = React.useState<NetworkGroup>(TABS.find((tab) => selectedNetwork?.group === tab) || 'mainnets');
+  const selectedNetwork = featuredNetworks.find(({ isActive }) => isActive);
+  const [ selectedTab, setSelectedTab ] = React.useState<NetworkGroup>(availableTabs.find((tab) => selectedNetwork?.group === tab) || 'mainnets');
 
   const handleSelectChange = React.useCallback((event: React.ChangeEvent<HTMLSelectElement>) => {
     setSelectedTab(event.target.value as NetworkGroup);
@@ -22,10 +22,10 @@ const NetworkMenuContentMobile = () => {
   return (
     <Box mt={ 6 }>
       <Select size="xs" borderRadius="base" value={ selectedTab } onChange={ handleSelectChange } focusBorderColor="none">
-        { TABS.map((tab) => <option key={ tab } value={ tab }>{ capitalize(tab) }</option>) }
+        { availableTabs.map((tab) => <option key={ tab } value={ tab }>{ capitalize(tab) }</option>) }
       </Select>
       <VStack as="ul" spacing={ 2 } alignItems="stretch" mt={ 6 }>
-        { items
+        { featuredNetworks
           .filter(({ group }) => group === selectedTab)
           .map((network) => (
             <NetworkMenuLink

ui/snippets/networkMenu/NetworkMenuLink.tsx

@@ -9,7 +9,7 @@ import placeholderIcon from 'icons/networks/icon-placeholder.svg';
 import useColors from './useColors';
 
 interface Props extends FeaturedNetwork {
-  isActive: boolean;
+  isActive?: boolean;
   isMobile?: boolean;
 }