Replace OP Superchain feature with generic Multichain explorer

.github/workflows/deploy-review-l2.yml

@@ -23,11 +23,12 @@ on:
             - filecoin
             - immutable
             - mega_eth
+            - multichain_dev
+            - multichain_prod
             - neon_devnet
             - numine
             - optimism
             - optimism_sepolia
-            - optimism_superchain
             - polygon
             - rootstock
             - scroll_sepolia

.github/workflows/deploy-review.yml

@@ -25,11 +25,12 @@ on:
             - main
             - mega_eth
             - mekong
+            - multichain_dev
+            - multichain_prod
             - neon_devnet
             - numine
             - optimism
             - optimism_sepolia
-            - optimism_superchain
             - polygon
             - rari_testnet
             - rootstock

.vscode/tasks.json

@@ -354,11 +354,12 @@
               "filecoin",
               "mega_eth",
               "mekong",
+              "multichain_dev",
+              "multichain_prod",
               "neon_devnet",
               "numine",
               "optimism",
               "optimism_sepolia",
-              "optimism_superchain",
               "polygon",
               "rari_testnet",
               "rootstock_testnet",

configs/app/features/blockchainInteraction.ts

@@ -4,7 +4,7 @@ import app from '../app';
 import chain from '../chain';
 import { getEnvValue, parseEnvJson } from '../utils';
 import accountFeature from './account';
-import opSuperchain from './opSuperchain';
+import multichain from './multichain';
 
 const walletConnectProjectId = getEnvValue('NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID');
 
@@ -31,11 +31,11 @@ const config: Feature<FeaturePayload> = (() => {
     chain.rpcUrls.length > 0,
   );
 
-  const isOpSuperchain = opSuperchain.isEnabled;
+  const isMultichain = multichain.isEnabled;
 
   if (
     !app.isPrivateMode &&
-    (isSingleChain || isOpSuperchain)
+    (isSingleChain || isMultichain)
   ) {
     if (accountFeature.isEnabled && accountFeature.authProvider === 'dynamic' && accountFeature.dynamic?.environmentId) {
       return Object.freeze({

configs/app/features/index.ts

@@ -29,9 +29,9 @@ export { default as megaEth } from './megaEth';
 export { default as metasuites } from './metasuites';
 export { default as mixpanel } from './mixpanel';
 export { default as mudFramework } from './mudFramework';
+export { default as multichain } from './multichain';
 export { default as multichainButton } from './multichainButton';
 export { default as nameServices } from './nameServices';
-export { default as opSuperchain } from './opSuperchain';
 export { default as pools } from './pools';
 export { default as publicTagsSubmission } from './publicTagsSubmission';
 export { default as rewards } from './rewards';

configs/app/features/opSuperchain.ts → configs/app/features/multichain.ts

@@ -6,12 +6,7 @@ import { getEnvValue } from '../utils';
 const isEnabled = getEnvValue('NEXT_PUBLIC_MULTICHAIN_ENABLED') === 'true';
 const cluster = getEnvValue('NEXT_PUBLIC_MULTICHAIN_CLUSTER');
 
-// The feature was initially implemented for OP Superchain interop cluster
-// but later the project was abandoned by Optimism team.
-// Now it serves mainly for demo purposes of multichain explorer possible functionalities.
-// So for now I have kept all naming in the code as it was initially done
-// and later it could be changed when specific multichain cluster will be implemented.
-const title = 'OP Superchain interop explorer';
+const title = 'Multichain explorer';
 
 const config: Feature<{ cluster: string }> = (() => {
   if (apis.multichainAggregator && apis.multichainStats && isEnabled && cluster) {

configs/app/features/stats.ts

@@ -1,12 +1,12 @@
 import type { Feature } from './types';
 
 import apis from '../apis';
-import opSuperchain from './opSuperchain';
+import multichain from './multichain';
 
 const title = 'Blockchain statistics';
 
 const config: Feature<{}> = (() => {
-  if (apis.stats || opSuperchain.isEnabled) {
+  if (apis.stats || multichain.isEnabled) {
     return Object.freeze({
       title,
       isEnabled: true,

configs/envs/.env.multichain_dev

@@ -0,0 +1,30 @@
+# Set of ENVs for OP Mainnet network explorer
+# https://xxx.blockscout.com
+# This is an auto-generated file. To update all values, run "yarn dev:preset:sync --name=multichain_dev"
+
+# Local ENVs
+NEXT_PUBLIC_APP_PROTOCOL=http
+NEXT_PUBLIC_APP_HOST=localhost
+NEXT_PUBLIC_APP_PORT=3000
+NEXT_PUBLIC_APP_ENV=development
+
+NEXT_PUBLIC_MULTICHAIN_ENABLED=true
+NEXT_PUBLIC_MULTICHAIN_AGGREGATOR_API_HOST=https://multichain-aggregator.k8s-dev.blockscout.com
+NEXT_PUBLIC_MULTICHAIN_CLUSTER=interop
+NEXT_PUBLIC_MULTICHAIN_STATS_API_HOST=http://multichain-search-stats.k8s-dev.blockscout.com
+
+SKIP_ENVS_VALIDATION=true
+NEXT_PUBLIC_MULTICHAIN_BALANCE_PROVIDER_CONFIG=[{'name': 'zerion', 'url_template': 'https://app.zerion.io/{address}/overview?utm_source=blockscout&utm_medium=address', 'logo': 'https://raw.githubusercontent.com/blockscout/frontend-configs/main/configs/marketplace-logos/zerion.svg'}]
+
+NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs','coin_price','market_cap']
+NEXT_PUBLIC_HOMEPAGE_STATS=['total_txs','wallet_addresses']
+NEXT_PUBLIC_API_DOCS_TABS=[]
+NEXT_PUBLIC_NETWORK_NAME=Blockscout
+NEXT_PUBLIC_GAS_TRACKER_ENABLED=false
+NEXT_PUBLIC_HIDE_INDEXING_ALERT_BLOCKS=true
+NEXT_PUBLIC_HIDE_INDEXING_ALERT_INT_TXS=true
+NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED=false
+NEXT_PUBLIC_IS_TESTNET=false
+NEXT_PUBLIC_USE_NEXT_JS_PROXY=true
+NEXT_PUBLIC_HAS_USER_OPS=true
+NEXT_PUBLIC_ADVANCED_FILTER_ENABLED=false

configs/envs/.env.optimism_superchain → configs/envs/.env.multichain_prod

@@ -1,6 +1,6 @@
 # Set of ENVs for OP Mainnet network explorer
 # https://xxx.blockscout.com
-# This is an auto-generated file. To update all values, run "yarn dev:preset:sync --name=optimism_superchain"
+# This is an auto-generated file. To update all values, run "yarn dev:preset:sync --name=multichain_prod"
 
 # Local ENVs
 NEXT_PUBLIC_APP_PROTOCOL=http
@@ -9,9 +9,6 @@ NEXT_PUBLIC_APP_PORT=3000
 NEXT_PUBLIC_APP_ENV=development
 
 NEXT_PUBLIC_MULTICHAIN_ENABLED=true
-# NEXT_PUBLIC_MULTICHAIN_AGGREGATOR_API_HOST=https://multichain-aggregator.k8s-dev.blockscout.com
-# NEXT_PUBLIC_MULTICHAIN_CLUSTER=interop
-# NEXT_PUBLIC_MULTICHAIN_STATS_API_HOST=http://multichain-search-stats.k8s-dev.blockscout.com
 NEXT_PUBLIC_MULTICHAIN_AGGREGATOR_API_HOST=https://multichain-aggregator.services.blockscout.com
 NEXT_PUBLIC_MULTICHAIN_CLUSTER=multichain
 NEXT_PUBLIC_MULTICHAIN_STATS_API_HOST=https://multichain-stats.k8s-prod-3.blockscout.com

configs/multichain/index.ts

@@ -5,7 +5,7 @@ import * as multichainConfigNodejs from 'configs/multichain/config.nodejs';
 import { isBrowser } from 'toolkit/utils/isBrowser';
 
 const multichainConfig: () => MultichainConfig | undefined = () => {
-  if (!config.features.opSuperchain.isEnabled) {
+  if (!config.features.multichain.isEnabled) {
     return;
   }
 

deploy/tools/envs-validator/test/.env.multichain

@@ -15,8 +15,8 @@ NEXT_PUBLIC_NETWORK_ICON=http://example.com
 NEXT_PUBLIC_NETWORK_ICON_DARK=http://example.com
 NEXT_PUBLIC_NETWORK_LOGO=http://example.com
 NEXT_PUBLIC_NETWORK_LOGO_DARK=http://example.com
-NEXT_PUBLIC_NETWORK_NAME=OP Superchain
-NEXT_PUBLIC_NETWORK_SHORT_NAME=OP Superchain
+NEXT_PUBLIC_NETWORK_NAME=Multichain
+NEXT_PUBLIC_NETWORK_SHORT_NAME=Multichain
 NEXT_PUBLIC_OG_IMAGE_URL=http://example.com
 NEXT_PUBLIC_GAS_TRACKER_ENABLED=false
 NEXT_PUBLIC_HIDE_INDEXING_ALERT_BLOCKS=true

deploy/tools/llms-txt-generator/index.ts

@@ -12,7 +12,7 @@ const outputFile = resolvePath(outputDir, 'llms.txt');
 
 function run() {
     try {
-        if(config.features.opSuperchain.isEnabled){
+        if(config.features.multichain.isEnabled){
             console.log('⏭️ Skipping llms.txt generation for multichain explorer');
             return;
         }

lib/api/services/multichainAggregator.ts

@@ -1,6 +1,6 @@
 import type { ApiResource } from '../types';
 import type * as multichain from '@blockscout/multichain-aggregator-types';
-import type { AddressTokensFilter, AddressTokensResponse, TokensResponse } from 'types/client/multichain-aggregator';
+import type { AddressTokensFilter, AddressTokensResponse, TokensResponse } from 'types/client/multichainAggregator';
 
 export const MULTICHAIN_AGGREGATOR_API_RESOURCES = {
   address: {

lib/hooks/useNavItems.tsx

@@ -272,7 +272,7 @@ export default function useNavItems(): ReturnType {
           icon: 'navigation/chain_stats',
           isActive: pathname.startsWith('/stats'),
         },
-        config.features.opSuperchain.isEnabled && {
+        config.features.multichain.isEnabled && {
           text: 'Ecosystems',
           nextRoute: { pathname: '/ecosystems' as const },
           icon: 'navigation/ecosystems',
@@ -319,7 +319,7 @@ export default function useNavItems(): ReturnType {
     } : null;
 
     const otherNavItems: Array<NavItem> | Array<Array<NavItem>> = [
-      config.features.opSuperchain.isEnabled ? {
+      config.features.multichain.isEnabled ? {
         text: 'Verify contract',
         url: 'https://vera.blockscout.com',
       } : {

lib/mixpanel/useInit.tsx

@@ -12,7 +12,7 @@ import getQueryParamString from 'lib/router/getQueryParamString';
 
 import * as userProfile from './userProfile';
 
-const opSuperchainFeature = config.features.opSuperchain;
+const multichainFeature = config.features.multichain;
 
 export default function useMixpanelInit() {
   const [ isInitialized, setIsInitialized ] = React.useState(false);
@@ -46,7 +46,7 @@ export default function useMixpanelInit() {
       Language: window.navigator.language,
       'Device type': capitalize(deviceType),
       'User id': uuid,
-      ...(opSuperchainFeature.isEnabled ? { 'Cluster name': opSuperchainFeature.cluster } : {}),
+      ...(multichainFeature.isEnabled ? { 'Cluster name': multichainFeature.cluster } : {}),
     });
     mixpanel.identify(uuid);
     userProfile.set({

lib/web3/chains.ts

@@ -40,7 +40,7 @@ const getChainInfo = (
   };
 };
 
-export const currentChain: Chain | undefined = !appConfig.features.opSuperchain.isEnabled ? getChainInfo() : undefined;
+export const currentChain: Chain | undefined = !appConfig.features.multichain.isEnabled ? getChainInfo() : undefined;
 
 export const parentChain: Chain | undefined = (() => {
   const rollupFeature = appConfig.features.rollup;

mocks/multichain/tokens.ts

@@ -1,4 +1,4 @@
-import type { AddressTokenItem } from 'types/client/multichain-aggregator';
+import type { AddressTokenItem } from 'types/client/multichainAggregator';
 
 import { chainA, chainB, chainC } from './chains';
 

nextjs/csp/index.ts

@@ -13,7 +13,7 @@ let cspPolicies: { 'private': string; 'default': string } | undefined = undefine
 
 async function initializeCspPolicies() {
   if (!cspPolicies) {
-    appConfig.features.opSuperchain.isEnabled && await multichainConfig.load();
+    appConfig.features.multichain.isEnabled && await multichainConfig.load();
     marketplaceFeature.isEnabled && marketplaceFeature.essentialDapps && await essentialDappsChainsConfig.load();
 
     // Generate and cache both policies upfront

nextjs/getServerSideProps/guards.ts

@@ -336,16 +336,16 @@ export const crossChainTxs: Guard = (chainConfig: typeof config) => async() => {
   }
 };
 
-export const opSuperchain: Guard = () => async() => {
-  if (!config.features.opSuperchain.isEnabled) {
+export const multichain: Guard = () => async() => {
+  if (!config.features.multichain.isEnabled) {
     return {
       notFound: true,
     };
   }
 };
 
-export const notOpSuperchain: Guard = () => async() => {
-  if (config.features.opSuperchain.isEnabled) {
+export const notMultichain: Guard = () => async() => {
+  if (config.features.multichain.isEnabled) {
     return {
       notFound: true,
     };

nextjs/getServerSideProps/main.ts

@@ -2,9 +2,9 @@ import * as guards from './guards';
 import { factory } from './utils';
 
 export const base = factory([ ]);
-export const block = factory([ guards.notOpSuperchain ]);
-export const tx = factory([ guards.notOpSuperchain ]);
-export const token = factory([ guards.notOpSuperchain ]);
+export const block = factory([ guards.notMultichain ]);
+export const tx = factory([ guards.notMultichain ]);
+export const token = factory([ guards.notMultichain ]);
 export const account = factory([ guards.account ]);
 export const accountAuth0 = factory([ guards.accountAuth0 ]);
 export const verifiedAddresses = factory([ guards.account, guards.verifiedAddresses ]);
@@ -32,7 +32,7 @@ export const publicTagsSubmit = factory([ guards.publicTagsSubmit ]);
 export const pools = factory([ guards.pools ]);
 export const megaEth = factory([ guards.megaEth ]);
 export const zetaChainCCTX = factory([ guards.zetaChainCCTX ]);
-export const crossChainTxs = factory([ guards.notOpSuperchain, guards.crossChainTxs ]);
+export const crossChainTxs = factory([ guards.notMultichain, guards.crossChainTxs ]);
 
 // ROLLUPS
 export const rollup = factory([ guards.rollup ]);
@@ -47,4 +47,4 @@ export const mud = factory([ guards.mud ]);
 export const tac = factory([ guards.tac ]);
 export const celo = factory([ guards.celo ]);
 export const interopMessages = factory([ guards.interopMessages ]);
-export const opSuperchain = factory([ guards.opSuperchain ]);
+export const multichain = factory([ guards.multichain ]);

nextjs/getServerSideProps/multichain.ts

@@ -1,8 +1,8 @@
 import * as guards from './guards';
 import { factoryMultichain } from './utils';
 
-export const base = factoryMultichain([ guards.opSuperchain ]);
-export const userOps = factoryMultichain([ guards.opSuperchain, guards.userOps ]);
-export const accountsLabelSearch = factoryMultichain([ guards.opSuperchain, guards.accountsLabelSearch ]);
-export const advancedFilter = factoryMultichain([ guards.opSuperchain, guards.advancedFilter ]);
-export const csvExport = factoryMultichain([ guards.opSuperchain, guards.csvExport ]);
+export const base = factoryMultichain([ guards.multichain ]);
+export const userOps = factoryMultichain([ guards.multichain, guards.userOps ]);
+export const accountsLabelSearch = factoryMultichain([ guards.multichain, guards.accountsLabelSearch ]);
+export const advancedFilter = factoryMultichain([ guards.multichain, guards.advancedFilter ]);
+export const csvExport = factoryMultichain([ guards.multichain, guards.csvExport ]);

nextjs/middlewares/poorReputationTokens.ts

@@ -4,7 +4,7 @@ import config from 'configs/app';
 import * as cookiesLib from 'lib/cookies';
 
 export default function poorReputationTokensMiddleware(req: NextRequest, res: NextResponse) {
-  if (config.features.opSuperchain.isEnabled) {
+  if (config.features.multichain.isEnabled) {
     const showPoorReputationTokensCookie = req.cookies.get(cookiesLib.NAMES.SHOW_POOR_REPUTATION_TOKENS);
 
     if (!showPoorReputationTokensCookie) {

pages/_app.tsx

@@ -93,7 +93,7 @@ function MyApp({ Component, pageProps }: AppPropsWithLayout) {
 
   const RewardsProvider = config.features.rewards.isEnabled ? RewardsContextProvider : FallbackProvider;
 
-  const socketUrl = !config.features.opSuperchain.isEnabled ? getSocketUrl() : undefined;
+  const socketUrl = !config.features.multichain.isEnabled ? getSocketUrl() : undefined;
 
   return (
     <ChakraProvider>

pages/_document.tsx

@@ -46,7 +46,7 @@ class MyDocument extends Document {
 
           { /* eslint-disable-next-line @next/next/no-sync-scripts */ }
           <script src="/assets/envs.js"/>
-          { config.features.opSuperchain.isEnabled && (
+          { config.features.multichain.isEnabled && (
             <>
               { /* eslint-disable-next-line @next/next/no-sync-scripts */ }
               <script src="/assets/multichain/config.js"/>

pages/accounts/index.tsx

@@ -7,8 +7,8 @@ import PageNextJs from 'nextjs/PageNextJs';
 import config from 'configs/app';
 
 const Accounts = dynamic(() => {
-  if (config.features.opSuperchain.isEnabled) {
-    return import('ui/optimismSuperchain/accounts/OpSuperchainAccounts');
+  if (config.features.multichain.isEnabled) {
+    return import('ui/multichain/accounts/MultichainAccounts');
   }
 
   return import('ui/pages/Accounts');

pages/address/[hash]/index.tsx

@@ -10,15 +10,15 @@ import fetchApi from 'nextjs/utils/fetchApi';
 
 import config from 'configs/app';
 import getQueryParamString from 'lib/router/getQueryParamString';
-import OpSuperchainAddress from 'ui/optimismSuperchain/address/OpSuperchainAddress';
+import MultichainAddress from 'ui/multichain/address/MultichainAddress';
 import Address from 'ui/pages/Address';
 
 const pathname: Route['pathname'] = '/address/[hash]';
 
 const Page: NextPage<Props<typeof pathname>> = (props: Props<typeof pathname>) => {
   return (
     <PageNextJs pathname={ pathname } query={ props.query } apiData={ props.apiData }>
-      { config.features.opSuperchain.isEnabled ? <OpSuperchainAddress/> : <Address/> }
+      { config.features.multichain.isEnabled ? <MultichainAddress/> : <Address/> }
     </PageNextJs>
   );
 };
@@ -28,7 +28,7 @@ export default Page;
 export const getServerSideProps: GetServerSideProps<Props<typeof pathname>> = async(ctx) => {
   const baseResponse = await gSSP.base<typeof pathname>(ctx);
 
-  if (config.meta.og.enhancedDataEnabled && 'props' in baseResponse && !config.features.opSuperchain.isEnabled) {
+  if (config.meta.og.enhancedDataEnabled && 'props' in baseResponse && !config.features.multichain.isEnabled) {
     const botInfo = detectBotRequest(ctx.req);
 
     if (botInfo?.type === 'social_preview') {

pages/blocks.tsx

@@ -7,8 +7,8 @@ import PageNextJs from 'nextjs/PageNextJs';
 import config from 'configs/app';
 
 const Blocks = dynamic(() => {
-  if (config.features.opSuperchain.isEnabled) {
-    return import('ui/optimismSuperchain/blocks/OpSuperchainBlocks');
+  if (config.features.multichain.isEnabled) {
+    return import('ui/multichain/blocks/MultichainBlocks');
   }
 
   return import('ui/pages/Blocks');