Move config management to build-time (#120)

- Refactor chain, token, and route config management into build-time script
- Combine chain, token, and route state into single `WarpContext` var
- Fix outdated `publicRpcUrls` field in example chain config

.gitignore

@@ -15,8 +15,7 @@ coverage.json
 /out/
 
 # production
-/src/types/
-/src/deploy/output
+/src/context/*.json
 /artifacts
 /build
 /dist

package.json

@@ -78,12 +78,13 @@
   },
   "scripts": {
     "clean": "rm -rf dist cache .next",
-    "dev": "next dev",
-    "build": "next build",
+    "dev": "yarn build:configs && next dev",
+    "build": "yarn build:configs && next build",
+    "build:configs": "./src/scripts/buildConfigs/build.sh",
     "typecheck": "tsc",
     "lint": "next lint",
     "start": "next start",
-    "test": "jest",
+    "test": "yarn build:configs && jest",
     "prettier": "prettier --write ./src"
   },
   "types": "dist/src/index.d.ts",

src/consts/chains.ts

@@ -7,12 +7,12 @@ import { ChainMap, ChainMetadata } from '@hyperlane-xyz/sdk';
 export const chains: ChainMap<ChainMetadata & { mailbox?: Address }> = {
   // mycustomchain: {
   //   protocol: ProtocolType.Ethereum,
-  //   chainId: 1234,
-  //   domainId: 1234,
+  //   chainId: 123123,
+  //   domainId: 123123,
   //   name: 'mycustomchain',
   //   displayName: 'My Chain',
   //   nativeToken: { name: 'Ether', symbol: 'ETH', decimals: 18 },
-  //   publicRpcUrls: [{ http: 'https://mycustomchain-rpc.com' }],
+  //   rpcUrls: [{ http: 'https://mycustomchain-rpc.com' }],
   //   blockExplorers: [
   //     {
   //       name: 'MyCustomScan',

src/consts/ibcRoutes.ts

@@ -1,4 +1,4 @@
-import { IbcRoute, IbcToWarpRoute } from '../features/tokens/routes/types';
+import { IbcRoute, IbcToWarpRoute } from '../features/routes/types';
 
 // Configs for manually-defined IBC-only routes
 export const ibcRoutes: Array<IbcRoute | IbcToWarpRoute> = [];

src/context/README.md

@@ -0,0 +1,4 @@
+### About
+
+This folder contains pre-validated and processed configs for the the chains, tokens, and routes.
+The contents are auto-generated by the `yarn build:configs` command. Changes will be overridden on new builds.

src/context/context.ts

@@ -0,0 +1,33 @@
+import { ChainMap, ChainMetadata, MultiProtocolProvider } from '@hyperlane-xyz/sdk';
+
+import type { RoutesMap } from '../features/routes/types';
+import type { TokenMetadata } from '../features/tokens/types';
+
+import Chains from './_chains.json';
+import Routes from './_routes.json';
+import Tokens from './_tokens.json';
+
+export interface WarpContext {
+  chains: ChainMap<ChainMetadata & { mailbox?: Address }>;
+  tokens: TokenMetadata[];
+  routes: RoutesMap;
+  multiProvider: MultiProtocolProvider<{ mailbox?: Address }>;
+}
+
+let warpContext: WarpContext;
+
+export function getWarpContext() {
+  if (!warpContext) {
+    warpContext = {
+      chains: Chains as any,
+      tokens: Tokens as any,
+      routes: Routes as any,
+      multiProvider: new MultiProtocolProvider<{ mailbox?: Address }>(Chains as any),
+    };
+  }
+  return warpContext;
+}
+
+export function setWarpContext(context: WarpContext) {
+  warpContext = context;
+}

src/features/chains/metadata.ts

@@ -1,59 +1,21 @@
 import type { AssetList, Chain as CosmosChain } from '@chain-registry/types';
 import type { Chain as WagmiChain } from '@wagmi/core';
-import { z } from 'zod';
 
-import {
-  ChainMap,
-  ChainMetadata,
-  ChainMetadataSchema,
-  ChainName,
-  chainMetadata,
-  chainMetadataToWagmiChain,
-} from '@hyperlane-xyz/sdk';
+import { ChainName, chainMetadataToWagmiChain } from '@hyperlane-xyz/sdk';
 import { ProtocolType } from '@hyperlane-xyz/utils';
 
-import { chains as ChainsTS } from '../../consts/chains';
-import ChainsJson from '../../consts/chains.json';
-import ChainsYaml from '../../consts/chains.yaml';
-import { logger } from '../../utils/logger';
-
-import { cosmosDefaultChain } from './cosmosDefault';
-
-let chainConfigs: ChainMap<ChainMetadata & { mailbox?: Address }>;
-
-export const ChainConfigSchema = z.record(
-  ChainMetadataSchema.and(z.object({ mailbox: z.string().optional() })),
-);
-
-export function getChainConfigs() {
-  if (!chainConfigs) {
-    // Chains must include a cosmos chain or CosmosKit throws errors
-    const result = ChainConfigSchema.safeParse({
-      cosmoshub: cosmosDefaultChain,
-      ...ChainsJson,
-      ...ChainsYaml,
-      ...ChainsTS,
-    });
-    if (!result.success) {
-      logger.error('Invalid chain config', result.error);
-      throw new Error(`Invalid chain config: ${result.error.toString()}`);
-    }
-    const customChainConfigs = result.data as ChainMap<ChainMetadata & { mailbox?: Address }>;
-    chainConfigs = { ...chainMetadata, ...customChainConfigs };
-  }
-  return chainConfigs;
-}
+import { getWarpContext } from '../../context/context';
 
 // Metadata formatted for use in Wagmi config
 export function getWagmiChainConfig(): WagmiChain[] {
-  const evmChains = Object.values(getChainConfigs()).filter(
+  const evmChains = Object.values(getWarpContext().chains).filter(
     (c) => !c.protocol || c.protocol === ProtocolType.Ethereum,
   );
   return evmChains.map(chainMetadataToWagmiChain);
 }
 
 export function getCosmosKitConfig(): { chains: CosmosChain[]; assets: AssetList[] } {
-  const cosmosChains = Object.values(getChainConfigs()).filter(
+  const cosmosChains = Object.values(getWarpContext().chains).filter(
     (c) => c.protocol === ProtocolType.Cosmos,
   );
   const chains = cosmosChains.map((c) => ({
@@ -143,7 +105,7 @@ export function getCosmosKitConfig(): { chains: CosmosChain[]; assets: AssetList
 }
 
 export function getCosmosChainNames(): ChainName[] {
-  return Object.values(getChainConfigs())
+  return Object.values(getWarpContext().chains)
     .filter((c) => c.protocol === ProtocolType.Cosmos)
     .map((c) => c.name);
 }

src/features/multiProvider.ts

@@ -1,16 +1,11 @@
-import { MultiProtocolProvider } from '@hyperlane-xyz/sdk';
 import { ProtocolType } from '@hyperlane-xyz/utils';
 
-import { parseCaip2Id } from './caip/chains';
-import { getChainConfigs } from './chains/metadata';
+import { getWarpContext } from '../context/context';
 
-let multiProvider: MultiProtocolProvider<{ mailbox?: Address }>;
+import { parseCaip2Id } from './caip/chains';
 
 export function getMultiProvider() {
-  if (!multiProvider) {
-    multiProvider = new MultiProtocolProvider<{ mailbox?: Address }>(getChainConfigs());
-  }
-  return multiProvider;
+  return getWarpContext().multiProvider;
 }
 
 export function getEvmProvider(id: ChainCaip2Id) {

src/features/routes/hooks.ts

@@ -0,0 +1,19 @@
+import { useMemo } from 'react';
+
+import { getChainIdFromToken } from '../caip/tokens';
+import { getTokens } from '../tokens/metadata';
+
+import { RoutesMap } from './types';
+
+export function useRouteChains(tokenRoutes: RoutesMap): ChainCaip2Id[] {
+  return useMemo(() => {
+    const allCaip2Ids = Object.keys(tokenRoutes) as ChainCaip2Id[];
+    const collateralCaip2Ids = getTokens().map((t) => getChainIdFromToken(t.tokenCaip19Id));
+    return allCaip2Ids.sort((c1, c2) => {
+      // Surface collateral chains first
+      if (collateralCaip2Ids.includes(c1) && !collateralCaip2Ids.includes(c2)) return -1;
+      else if (!collateralCaip2Ids.includes(c1) && collateralCaip2Ids.includes(c2)) return 1;
+      else return c1 > c2 ? 1 : -1;
+    });
+  }, [tokenRoutes]);
+}

src/features/tokens/routes/utils.ts → src/features/routes/utils.ts

@@ -1,6 +1,4 @@
-import { deepCopy } from '@hyperlane-xyz/utils';
-
-import { isNativeToken } from '../../caip/tokens';
+import { isNativeToken } from '../caip/tokens';
 
 import { IbcRoute, IbcToWarpRoute, Route, RouteType, RoutesMap, WarpRoute } from './types';
 
@@ -83,13 +81,3 @@ export function isIbcOnlyRoute(route: Route): route is IbcRoute {
 export function isIbcToWarpRoute(route: Route): route is IbcToWarpRoute {
   return route.type === RouteType.IbcNativeToHypSynthetic;
 }
-
-export function mergeRoutes(routes: RoutesMap, newRoutes: Route[]) {
-  const mergedRoutes = deepCopy(routes);
-  for (const route of newRoutes) {
-    mergedRoutes[route.originCaip2Id] ||= {};
-    mergedRoutes[route.originCaip2Id][route.destCaip2Id] ||= [];
-    mergedRoutes[route.originCaip2Id][route.destCaip2Id].push(route);
-  }
-  return mergedRoutes;
-}

src/features/tokens/AdapterFactory.ts

@@ -24,9 +24,7 @@ import { Address, ProtocolType, convertToProtocolAddress } from '@hyperlane-xyz/
 import { parseCaip2Id } from '../caip/chains';
 import { AssetNamespace, getChainIdFromToken, isNativeToken, parseCaip19Id } from '../caip/tokens';
 import { getMultiProvider } from '../multiProvider';
-
-import { getToken } from './metadata';
-import { Route } from './routes/types';
+import { Route } from '../routes/types';
 import {
   isIbcRoute,
   isIbcToWarpRoute,
@@ -35,7 +33,9 @@ import {
   isRouteToCollateral,
   isRouteToSynthetic,
   isWarpRoute,
-} from './routes/utils';
+} from '../routes/utils';
+
+import { getToken } from './metadata';
 
 export class AdapterFactory {
   static NativeAdapterFromChain(

src/features/tokens/SelectOrInputTokenIds.tsx

@@ -2,13 +2,13 @@ import { useFormikContext } from 'formik';
 
 import { TextField } from '../../components/input/TextField';
 import { AssetNamespace, getCaip19Id } from '../caip/tokens';
+import { RouteType, RoutesMap } from '../routes/types';
+import { getTokenRoute, isWarpRoute } from '../routes/utils';
 import { TransferFormValues } from '../transfer/types';
 import { useAccountAddressForChain } from '../wallet/hooks/multiProtocol';
 
 import { SelectTokenIdField } from './SelectTokenIdField';
 import { useContractSupportsTokenByOwner, useIsSenderNftOwner } from './balances';
-import { RouteType, RoutesMap } from './routes/types';
-import { getTokenRoute, isWarpRoute } from './routes/utils';
 
 export function SelectOrInputTokenIds({
   disabled,

src/features/tokens/TokenListModal.tsx

@@ -8,10 +8,10 @@ import { config } from '../../consts/config';
 import InfoIcon from '../../images/icons/info-circle.svg';
 import { getAssetNamespace, getTokenAddress, isNativeToken } from '../caip/tokens';
 import { getChainDisplayName } from '../chains/utils';
+import { RoutesMap } from '../routes/types';
+import { hasTokenRoute } from '../routes/utils';
 
 import { getTokens } from './metadata';
-import { RoutesMap } from './routes/types';
-import { hasTokenRoute } from './routes/utils';
 import { TokenMetadata } from './types';
 
 export function TokenListModal({

src/features/tokens/TokenSelectField.tsx

@@ -5,12 +5,12 @@ import { useEffect, useState } from 'react';
 import { TokenIcon } from '../../components/icons/TokenIcon';
 import ChevronIcon from '../../images/icons/chevron-down.svg';
 import { isNonFungibleToken } from '../caip/tokens';
+import { RoutesMap } from '../routes/types';
+import { getTokenRoutes } from '../routes/utils';
 import { TransferFormValues } from '../transfer/types';
 
 import { TokenListModal } from './TokenListModal';
 import { getToken } from './metadata';
-import { RoutesMap } from './routes/types';
-import { getTokenRoutes } from './routes/utils';
 import { TokenMetadata } from './types';
 
 type Props = {

src/features/tokens/approval.ts

@@ -7,11 +7,11 @@ import { logger } from '../../utils/logger';
 import { getProtocolType } from '../caip/chains';
 import { getTokenAddress, isNativeToken, isNonFungibleToken } from '../caip/tokens';
 import { getEvmProvider } from '../multiProvider';
+import { Route } from '../routes/types';
+import { isRouteFromCollateral, isWarpRoute } from '../routes/utils';
 import { useAccountAddressForChain } from '../wallet/hooks/multiProtocol';
 
 import { getErc20Contract, getErc721Contract } from './contracts/evmContracts';
-import { Route } from './routes/types';
-import { isRouteFromCollateral, isWarpRoute } from './routes/utils';
 
 export function useIsApproveRequired(
   tokenCaip19Id: TokenCaip19Id,

src/features/tokens/balances.ts

@@ -8,14 +8,14 @@ import { logger } from '../../utils/logger';
 import { getProtocolType } from '../caip/chains';
 import { parseCaip19Id, tryGetChainIdFromToken } from '../caip/tokens';
 import { getEvmProvider } from '../multiProvider';
+import { RoutesMap } from '../routes/types';
+import { getTokenRoute, isIbcOnlyRoute, isIbcRoute, isRouteFromNative } from '../routes/utils';
 import { useStore } from '../store';
 import { TransferFormValues } from '../transfer/types';
 import { useAccountAddressForChain } from '../wallet/hooks/multiProtocol';
 
 import { AdapterFactory } from './AdapterFactory';
 import { getHypErc721Contract } from './contracts/evmContracts';
-import { RoutesMap } from './routes/types';
-import { getTokenRoute, isIbcOnlyRoute, isIbcRoute, isRouteFromNative } from './routes/utils';
 
 export function useOriginBalance(
   { originCaip2Id, destinationCaip2Id, tokenCaip19Id }: TransferFormValues,