rewrite pages seo

configs/app/config.ts

@@ -4,9 +4,14 @@ const isDev = env === 'development';
 const config = Object.freeze({
   env,
   isDev,
-  networkType: process.env.NEXT_PUBLIC_NETWORK_TYPE,
-  networkSubtype: process.env.NEXT_PUBLIC_NETWORK_SUBTYPE,
-  basePath: '/' + [ process.env.NEXT_PUBLIC_NETWORK_TYPE, process.env.NEXT_PUBLIC_NETWORK_SUBTYPE ].filter(Boolean).join('/'),
+  network: {
+    type: process.env.NEXT_PUBLIC_NETWORK_TYPE,
+    subtype: process.env.NEXT_PUBLIC_NETWORK_SUBTYPE,
+    logo: process.env.NEXT_PUBLIC_NETWORK_LOGO,
+    name: process.env.NEXT_PUBLIC_NETWORK_NAME,
+    shortName: process.env.NEXT_PUBLIC_NETWORK_SHORT_NAME,
+    basePath: '/' + [ process.env.NEXT_PUBLIC_NETWORK_TYPE, process.env.NEXT_PUBLIC_NETWORK_SUBTYPE ].filter(Boolean).join('/'),
+  },
   // TODO domain should be passed in CI during runtime
   domain: isDev ? 'http://localhost:3000' : 'https://blockscout.com',
 });

lib/csp/getCspPolicy.ts

-import availableNetworks from 'lib/networks/availableNetworks';
+import appConfig from 'configs/app/config';
+
+import featuredNetworks from 'lib/networks/featuredNetworks';
 
 const KEY_WORDS = {
   BLOB: 'blob:',
@@ -16,15 +18,13 @@ const MAIN_DOMAINS = [ '*.blockscout.com', 'blockscout.com' ];
 const isDev = process.env.NODE_ENV === 'development';
 
 function getNetworksExternalAssets() {
-  const icons = availableNetworks
+  const icons = featuredNetworks
     .filter(({ icon }) => typeof icon === 'string')
     .map(({ icon }) => new URL(icon as string));
 
-  const logos = availableNetworks
-    .filter(({ logo }) => typeof logo === 'string')
-    .map(({ logo }) => new URL(logo as string));
+  const logo = appConfig.network.logo ? new URL(appConfig.network.logo) : undefined;
 
-  return icons.concat(logos);
+  return logo ? icons.concat(logo) : icons;
 }
 
 function makePolicyMap() {

lib/link/link.ts

@@ -13,7 +13,7 @@ export function link(routeName: RouteName, urlParams?: Record<string, Array<stri
 
   // if we pass network type, we have to get subtype from params too
   // otherwise getting it from config since it is not cross-chain link
-  const networkSubType = typeof urlParams?.network_type === 'string' ? urlParams?.network_sub_type : appConfig.networkSubtype;
+  const networkSubType = typeof urlParams?.network_type === 'string' ? urlParams?.network_sub_type : appConfig.network.subtype;
 
   const path = route.pattern.replace(PATH_PARAM_REGEXP, (_, paramName: string) => {
     if (paramName === 'network_sub_type' && !networkSubType) {

lib/networks/availableNetworks.ts

+// todo_tom delete this
 import type { Network } from 'types/networks';
 
 import arbitrumIcon from 'icons/networks/icons/arbitrum.svg';
@@ -53,112 +54,66 @@ const NETWORKS: Array<Network> = (() => {
 export default NETWORKS;
 
 // for easy .env.example update
-// const FOR_CONFIG = JSON.stringify([
+// const FEATURED_CHAINS = JSON.stringify([
 //   {
-//     name: 'Gnosis Chain',
-//     type: 'xdai',
-//     subType: 'mainnet',
+//     title: 'Gnosis Chain',
+//     basePath: '/xdai/mainnet',
 //     group: 'mainnets',
-//     isAccountSupported: true,
-//     chainId: 100,
-//     currency: 'xDAI',
 //   },
 //   {
 //     name: 'Optimism on Gnosis Chain',
-//     shortName: 'OoG',
-//     type: 'xdai',
-//     subType: 'optimism',
+//     basePath: '/xdai/optimism',
 //     group: 'mainnets',
 //     icon: 'https://www.fillmurray.com/60/60',
-//     logo: 'https://www.fillmurray.com/240/60',
-//     chainId: 300,
-//     currency: 'xDAI',
 //   },
 //   {
 //     name: 'Arbitrum on xDai',
-//     type: 'xdai',
-//     subType: 'aox',
+//     basePath: '/xdai/aox',
 //     group: 'mainnets',
-//     chainId: 200,
-//     currency: 'xDAI',
 //   },
 //   {
 //     name: 'Ethereum',
-//     shortName: 'ETH',
-//     type: 'eth',
-//     subType: 'mainnet',
+//     basePath: '/eth/mainnet',
 //     group: 'mainnets',
-//     chainId: 1,
-//     currency: 'ETH',
 //   },
 //   {
 //     name: 'Ethereum Classic',
-//     shortName: 'ETC',
-//     type: 'etc',
-//     subType: 'mainnet',
+//     basePath: '/etx/mainnet',
 //     group: 'mainnets',
-//     chainId: 61,
-//     currency: 'ETC',
 //   },
 //   {
 //     name: 'POA',
-//     shortName: 'POA',
-//     type: 'poa',
-//     subType: 'core',
+//     basePath: '/poa/core',
 //     group: 'mainnets',
-//     chainId: 99,
-//     currency: 'POA',
-//     isAccountSupported: true,
-//     nativeTokenAddress: '0x029a799563238d0e75e20be2f4bda0ea68d00172',
 //   },
 //   {
 //     name: 'RSK',
-//     shortName: 'RBTC',
-//     type: 'rsk',
-//     subType: 'mainnet',
+//     basePath: '/rsk/mainnet',
 //     group: 'mainnets',
-//     chainId: 30,
-//     currency: 'RBTC',
 //   },
 //   {
 //     name: 'Gnosis Chain Testnet',
-//     type: 'xdai',
-//     subType: 'testnet',
+//     basePath: '/xdai/testnet',
 //     group: 'testnets',
-//     isAccountSupported: true,
-//     currency: 'xDAI',
 //   },
 //   {
 //     name: 'POA Sokol',
-//     shortName: 'POA',
-//     type: 'poa',
-//     subType: 'sokol',
+//     basePath: '/poa/sokol',
 //     group: 'testnets',
-//     chainId: 77,
-//     currency: 'SPOA',
 //   },
 //   {
 //     name: 'ARTIS Σ1',
-//     type: 'artis',
-//     subType: 'sigma1',
+//     basePath: '/artis/sigma1',
 //     group: 'other',
-//     chainId: 246529,
-//     currency: 'ATS',
 //   },
 //   {
 //     name: 'LUKSO L14',
-//     shortName: 'POA',
-//     type: 'lukso',
-//     subType: 'l14',
+//     basePath: '/lukso/l14',
 //     group: 'other',
-//     chainId: 22,
-//     currency: 'LYX',
 //   },
 //   {
 //     name: 'Astar',
-//     type: 'astar',
+//     basePath: '/astar',
 //     group: 'other',
-//     chainId: 22,
-//     currency: 'ASTR',
 //   },
 // ]);

lib/networks/findNetwork.ts

+// todo_tom delete this
 import availableNetworks from 'lib/networks/availableNetworks';
 
 interface Params {

lib/networks/getAvailablePaths.ts

-import NETWORKS from './availableNetworks';
-
-export default function getAvailablePaths() {
-  return NETWORKS.map(({ type, subType }) => ({ params: { network_type: type, network_sub_type: subType || 'mainnet' } }));
-}

lib/networks/getNetworkTitle.ts

-import findNetwork from './findNetwork';
+import appConfig from 'configs/app/config';
 
-export default function getNetworkTitle({ network_type: type, network_sub_type: subType }: {network_type?: string; network_sub_type?: string}) {
-  const currentNetwork = findNetwork({ network_type: type || '', network_sub_type: subType });
-  if (currentNetwork) {
-    return currentNetwork.name + (currentNetwork.shortName ? ` (${ currentNetwork.shortName })` : '') + ' Explorer';
-  }
-  return '';
+export default function getNetworkTitle() {
+  return appConfig.network.name + (appConfig.network.shortName ? ` (${ appConfig.network.shortName })` : '') + ' Explorer';
 }

lib/networks/useNetworkNavigationItems.ts

@@ -21,7 +21,7 @@ export default function useNetworkNavigationItems() {
       return {
         ...network,
         url: url,
-        isActive: appConfig.basePath === network.basePath,
+        isActive: appConfig.network.basePath === network.basePath,
       };
     });
   }, [ currentRoute, currentRouteName, router.query ]);

lib/next/block/getSeo.ts

@@ -3,7 +3,7 @@ import type { PageParams } from './types';
 import getNetworkTitle from 'lib/networks/getNetworkTitle';
 
 export default function getSeo(params?: PageParams) {
-  const networkTitle = getNetworkTitle(params || {});
+  const networkTitle = getNetworkTitle();
 
   return {
     title: params ? `Block ${ params.id } - ${ networkTitle }` : '',

lib/next/blocks/BlocksNextPage.tsx

@@ -14,8 +14,8 @@ type Props = {
   tab: BlocksProps['tab'];
 }
 
-const BlocksNextPage: NextPage<Props> = ({ pageParams, tab }: Props) => {
-  const { title } = getSeo(pageParams);
+const BlocksNextPage: NextPage<Props> = ({ tab }: Props) => {
+  const { title } = getSeo();
   return (
     <>
       <Head>

lib/next/blocks/getSeo.ts

-import type { PageParams } from './types';
-
 import getNetworkTitle from 'lib/networks/getNetworkTitle';
 
-export default function getSeo(params?: PageParams) {
-  const networkTitle = getNetworkTitle(params || {});
-
+export default function getSeo() {
   return {
-    title: params ? `${ networkTitle } - BlockScout` : '',
+    title: getNetworkTitle(),
   };
 }

lib/next/tx/getSeo.ts

@@ -3,7 +3,7 @@ import type { PageParams } from './types';
 import getNetworkTitle from 'lib/networks/getNetworkTitle';
 
 export default function getSeo(params?: PageParams) {
-  const networkTitle = getNetworkTitle(params || {});
+  const networkTitle = getNetworkTitle();
 
   return {
     title: params ? `Transaction ${ params.id } - ${ networkTitle }` : '',

middleware.ts

@@ -21,7 +21,7 @@ export function middleware(req: NextRequest) {
     network_sub_type: networkSubtype,
   };
 
-  if (appConfig.networkType !== networkType && appConfig.networkSubtype !== networkSubtype) {
+  if (appConfig.network.type !== networkType && appConfig.network.subtype !== networkSubtype) {
     const url = req.nextUrl.clone();
     url.pathname = `/404`;
     return NextResponse.rewrite(url);

pages/[network_type]/[network_sub_type]/account/api_key.tsx

@@ -14,8 +14,8 @@ type Props = {
   pageParams: PageParams;
 }
 
-const ApiKeysPage: NextPage<Props> = ({ pageParams }: Props) => {
-  const title = getNetworkTitle(pageParams || {});
+const ApiKeysPage: NextPage<Props> = () => {
+  const title = getNetworkTitle();
   return (
     <>
       <Head><title>{ title }</title></Head>

pages/[network_type]/[network_sub_type]/account/custom_abi.tsx

@@ -14,8 +14,8 @@ type Props = {
   pageParams: PageParams;
 }
 
-const CustomAbiPage: NextPage<Props> = ({ pageParams }: Props) => {
-  const title = getNetworkTitle(pageParams || {});
+const CustomAbiPage: NextPage<Props> = () => {
+  const title = getNetworkTitle();
   return (
     <>
       <Head><title>{ title }</title></Head>

pages/[network_type]/[network_sub_type]/account/public_tags_request.tsx

@@ -14,8 +14,8 @@ type Props = {
   pageParams: PageParams;
 }
 
-const PublicTagsPage: NextPage<Props> = ({ pageParams }: Props) => {
-  const title = getNetworkTitle(pageParams || {});
+const PublicTagsPage: NextPage<Props> = () => {
+  const title = getNetworkTitle();
   return (
     <>
       <Head><title>{ title }</title></Head>

pages/[network_type]/[network_sub_type]/account/tag_address.tsx

@@ -14,8 +14,8 @@ type Props = {
   pageParams: PageParams;
 }
 
-const AddressTagsPage: NextPage<Props> = ({ pageParams }: Props) => {
-  const title = getNetworkTitle(pageParams || {});
+const AddressTagsPage: NextPage<Props> = () => {
+  const title = getNetworkTitle();
   return (
     <>
       <Head><title>{ title }</title></Head>

pages/[network_type]/[network_sub_type]/account/tag_transaction.tsx

@@ -14,8 +14,8 @@ type Props = {
   pageParams: PageParams;
 }
 
-const TransactionTagsPage: NextPage<Props> = ({ pageParams }: Props) => {
-  const title = getNetworkTitle(pageParams || {});
+const TransactionTagsPage: NextPage<Props> = () => {
+  const title = getNetworkTitle();
   return (
     <>
       <Head><title>{ title }</title></Head>

pages/[network_type]/[network_sub_type]/account/watchlist.tsx

@@ -14,8 +14,8 @@ type Props = {
   pageParams: PageParams;
 }
 
-const WatchListPage: NextPage<Props> = ({ pageParams }: Props) => {
-  const title = getNetworkTitle(pageParams || {});
+const WatchListPage: NextPage<Props> = () => {
+  const title = getNetworkTitle();
   return (
     <>
       <Head>

pages/[network_type]/[network_sub_type]/pending-transactions.tsx

@@ -14,8 +14,8 @@ type Props = {
   pageParams: PageParams;
 }
 
-const AddressTagsPage: NextPage<Props> = ({ pageParams }: Props) => {
-  const title = getNetworkTitle(pageParams || {});
+const AddressTagsPage: NextPage<Props> = () => {
+  const title = getNetworkTitle();
   return (
     <>
       <Head><title>{ title }</title></Head>

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

@@ -14,8 +14,8 @@ type Props = {
   pageParams: PageParams;
 }
 
-const AddressTagsPage: NextPage<Props> = ({ pageParams }: Props) => {
-  const title = getNetworkTitle(pageParams || {});
+const AddressTagsPage: NextPage<Props> = () => {
+  const title = getNetworkTitle();
   return (
     <>
       <Head><title>{ title }</title></Head>

ui/snippets/networkMenu/NetworkMenuContentDesktop.tsx

@@ -4,13 +4,13 @@ import React from 'react';
 import type { NetworkGroup } from 'types/networks';
 
 import useNetwork from 'lib/hooks/useNetwork';
-import NETWORKS from 'lib/networks/availableNetworks';
+import featuredNetworks from 'lib/networks/featuredNetworks';
 import useNetworkNavigationItems from 'lib/networks/useNetworkNavigationItems';
 
 import NetworkMenuLink from './NetworkMenuLink';
 
 const TABS: Array<NetworkGroup> = [ 'mainnets', 'testnets', 'other' ];
-const availableTabs = TABS.filter((tab) => NETWORKS.some(({ group }) => group === tab));
+const availableTabs = TABS.filter((tab) => featuredNetworks.some(({ group }) => group === tab));
 
 const NetworkMenuPopup = () => {
   const selectedNetwork = useNetwork();