Merge remote-tracking branch 'origin/main' into ezeth

Author: github-actions[bot]

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hyperlane-xyz/warp-ui-template",
   "description": "A web app template for building Hyperlane Warp Route UIs",
-  "version": "8.5.0",
+  "version": "12.1.0",
   "author": "J M Rossy",
   "dependencies": {
     "@chakra-ui/next-js": "^2.4.2",
@@ -17,10 +17,10 @@
     "@emotion/react": "^11.13.3",
     "@emotion/styled": "^11.13.0",
     "@headlessui/react": "^2.2.0",
-    "@hyperlane-xyz/registry": "12.1.0",
-    "@hyperlane-xyz/sdk": "9.2.1",
-    "@hyperlane-xyz/utils": "9.2.1",
-    "@hyperlane-xyz/widgets": "9.2.1",
+    "@hyperlane-xyz/registry": "13.9.0",
+    "@hyperlane-xyz/sdk": "12.1.0",
+    "@hyperlane-xyz/utils": "12.1.0",
+    "@hyperlane-xyz/widgets": "12.1.0",
     "@interchain-ui/react": "^1.23.28",
     "@metamask/post-message-stream": "6.1.2",
     "@metamask/providers": "10.2.1",

src/components/icons/TokenIcon.tsx

@@ -1,9 +1,8 @@
-import { IRegistry } from '@hyperlane-xyz/registry';
 import { IToken } from '@hyperlane-xyz/sdk';
 import { isHttpsUrl, isRelativeUrl } from '@hyperlane-xyz/utils';
 import { Circle } from '@hyperlane-xyz/widgets';
 import { useState } from 'react';
-import { useStore } from '../../features/store';
+import { links } from '../../consts/links';
 
 interface Props {
   token?: IToken | null;
@@ -16,8 +15,7 @@ export function TokenIcon({ token, size = 32 }: Props) {
   const fontSize = Math.floor(size / 2);
 
   const [fallbackToText, setFallbackToText] = useState(false);
-  const registry = useStore((s) => s.registry);
-  const imageSrc = getImageSrc(registry, token);
+  const imageSrc = getImageSrc(token);
   const bgColorSeed =
     token && (!imageSrc || fallbackToText)
       ? (Buffer.from(token.addressOrDenom).at(0) || 0) % 5
@@ -40,11 +38,11 @@ export function TokenIcon({ token, size = 32 }: Props) {
   );
 }
 
-function getImageSrc(registry: IRegistry, token?: IToken | null) {
+function getImageSrc(token?: IToken | null) {
   if (!token?.logoURI) return null;
   // If it's a valid, direct URL, return it
   if (isHttpsUrl(token.logoURI)) return token.logoURI;
   // Otherwise assume it's a relative URL to the registry base
-  if (isRelativeUrl(token.logoURI)) return registry.getUri(token.logoURI);
+  if (isRelativeUrl(token.logoURI)) return `${links.imgPath}${token.logoURI}`;
   return null;
 }

src/consts/chains.ts

@@ -3,6 +3,10 @@ import {
   eclipsemainnetAddresses,
   solanamainnet,
   solanamainnetAddresses,
+  sonicsvm,
+  sonicsvmAddresses,
+  soon,
+  soonAddresses,
 } from '@hyperlane-xyz/registry';
 import { ChainMap, ChainMetadata } from '@hyperlane-xyz/sdk';
 
@@ -15,12 +19,19 @@ export const chains: ChainMap<ChainMetadata & { mailbox?: Address }> = {
     ...solanamainnet,
     // SVM chains require mailbox addresses for the token adapters
     mailbox: solanamainnetAddresses.mailbox,
-    // Including a convenient rpc override because the Solana public RPC does not allow browser requests from localhost
   },
   eclipsemainnet: {
     ...eclipsemainnet,
     mailbox: eclipsemainnetAddresses.mailbox,
   },
+  soon: {
+    ...soon,
+    mailbox: soonAddresses.mailbox,
+  },
+  sonicsvm: {
+    ...sonicsvm,
+    mailbox: sonicsvmAddresses.mailbox,
+  },
   // mycustomchain: {
   //   protocol: ProtocolType.Ethereum,
   //   chainId: 123123,

src/consts/links.ts

@@ -13,4 +13,5 @@ export const links = {
   privacyPolicy: 'https://hyperlane.xyz/privacy-policy',
   bounty:
     'https://github.com/search?q=org:hyperlane-xyz+label:bounty+is:open+is:issue&type=issues&s=&o=desc',
+  imgPath: 'https://raw.githubusercontent.com/hyperlane-xyz/hyperlane-registry/main',
 };

src/features/chains/ChainConnectionWarning.test.ts

@@ -0,0 +1,64 @@
+import { ChainMetadata, isRpcHealthy } from '@hyperlane-xyz/sdk';
+import { ProtocolType } from '@hyperlane-xyz/utils';
+import { beforeEach, describe, expect, test, vi } from 'vitest';
+import { checkRpcHealth } from './ChainConnectionWarning';
+
+vi.mock('@hyperlane-xyz/sdk', async (importOriginal) => {
+  const actual = (await importOriginal()) as { MultiProtocolProvider: any };
+  return {
+    ...actual,
+    MultiProtocolProvider: vi.fn().mockImplementation(() => ({
+      getProvider: vi.fn(),
+    })),
+    isRpcHealthy: vi.fn(),
+  };
+});
+
+const mockRpcUrl = 'http://mock.test.rpc.com';
+
+const mockEvmChainMetadata: ChainMetadata = {
+  name: 'TestChain',
+  protocol: ProtocolType.Ethereum,
+  rpcUrls: [{ http: mockRpcUrl }, { http: mockRpcUrl }],
+  chainId: 10000000,
+  domainId: 10000000,
+};
+const mockSvmChainMetadata = {
+  name: 'TestChain',
+  protocol: ProtocolType.Sealevel,
+  rpcUrls: [{ http: mockRpcUrl }, { http: mockRpcUrl }],
+  chainId: 10000000,
+  domainId: 10000000,
+};
+
+describe('checkRpcHealth', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  test('should call isRpcHealthy as many times as rpcUrls length when chain protocol is Ethereum', async () => {
+    (isRpcHealthy as ReturnType<typeof vi.fn>).mockImplementation(() => Promise.resolve(true));
+    await checkRpcHealth(mockEvmChainMetadata);
+    expect(isRpcHealthy).toHaveBeenCalledTimes(mockEvmChainMetadata.rpcUrls.length);
+  });
+
+  test('should call isRpcHealthy only once for non Ethereum chains', async () => {
+    (isRpcHealthy as ReturnType<typeof vi.fn>).mockImplementation(() => Promise.resolve(true));
+    await checkRpcHealth(mockSvmChainMetadata);
+    expect(isRpcHealthy).toHaveBeenCalledTimes(1);
+  });
+
+  test('should return true if at least one Ethereum RPC is healthy', async () => {
+    (isRpcHealthy as ReturnType<typeof vi.fn>).mockImplementation((_, i) =>
+      i === 1 ? Promise.resolve(true) : Promise.reject(),
+    );
+    const result = await checkRpcHealth(mockEvmChainMetadata);
+    expect(result).toBe(true);
+  });
+
+  test('should return false if no RPCs are healthy', async () => {
+    (isRpcHealthy as ReturnType<typeof vi.fn>).mockImplementation(() => Promise.resolve(false));
+    const result = await checkRpcHealth(mockEvmChainMetadata as any);
+    expect(result).toBe(false);
+  });
+});

src/features/chains/ChainConnectionWarning.tsx

@@ -1,4 +1,5 @@
 import { ChainMetadata, isRpcHealthy } from '@hyperlane-xyz/sdk';
+import { ProtocolType } from '@hyperlane-xyz/utils';
 import { useQuery } from '@tanstack/react-query';
 import { useState } from 'react';
 import { FormWarningBanner } from '../../components/banner/FormWarningBanner';
@@ -25,7 +26,7 @@ export function ChainConnectionWarning({
       const isDestinationHealthy = await checkRpcHealth(destinationMetadata);
       return { isOriginHealthy, isDestinationHealthy };
     },
-    refetchInterval: 5000,
+    refetchInterval: 300000, // 5 minutes
   });
 
   const unhealthyChain =
@@ -62,14 +63,21 @@ export function ChainConnectionWarning({
   );
 }
 
-async function checkRpcHealth(chainMetadata: ChainMetadata) {
+export async function checkRpcHealth(chainMetadata: ChainMetadata) {
   try {
-    // Note: this currently checks the health of only the first RPC,
-    // which is what wallets and wallet libs (e.g. wagmi) will use
-    const isHealthy = await isRpcHealthy(chainMetadata, 0);
-    return isHealthy;
+    // Note: this currently checks the health of only the first RPC for non EVM chains,
+    // which is what wallets and wallet libs will use
+    // for EVM chains it will use a fallback RPC, that is why we need to check if any RPC are healthy instead
+    if (chainMetadata.protocol === ProtocolType.Ethereum) {
+      const healthChecks = chainMetadata.rpcUrls.map((_, i) =>
+        isRpcHealthy(chainMetadata, i).then((result) => (result ? true : Promise.reject())),
+      );
+      return await Promise.any(healthChecks);
+    } else return await isRpcHealthy(chainMetadata, 0);
   } catch (error) {
-    logger.warn('Error checking RPC health', error);
+    if (error instanceof AggregateError)
+      logger.warn(`No healthy RPCs found for ${chainMetadata.name}`);
+    else logger.warn('Error checking RPC health', error);
     return false;
   }
 }

src/features/chains/metadata.ts

@@ -6,11 +6,18 @@ import {
   mergeChainMetadataMap,
   RpcUrlSchema,
 } from '@hyperlane-xyz/sdk';
-import { objFilter, objMap, promiseObjAll, tryParseJsonOrYaml } from '@hyperlane-xyz/utils';
+import {
+  objFilter,
+  objMap,
+  promiseObjAll,
+  ProtocolType,
+  tryParseJsonOrYaml,
+} from '@hyperlane-xyz/utils';
 import { z } from 'zod';
 import { chains as ChainsTS } from '../../consts/chains.ts';
 import ChainsYaml from '../../consts/chains.yaml';
 import { config } from '../../consts/config.ts';
+import { links } from '../../consts/links.ts';
 import { logger } from '../../utils/logger.ts';
 
 export async function assembleChainMetadata(
@@ -49,7 +56,7 @@ export async function assembleChainMetadata(
       registryChainMetadata,
       async (chainName, metadata): Promise<ChainMetadata> => ({
         ...metadata,
-        logoURI: (await registry.getChainLogoUri(chainName)) || undefined,
+        logoURI: `${links.imgPath}/chains/${chainName}/logo.svg`,
       }),
     ),
   );
@@ -63,13 +70,23 @@ export async function assembleChainMetadata(
     logger.warn('Invalid RPC overrides config', rpcOverrides.error);
   }
 
-  const chainMetadata = objMap(mergedChainMetadata, (chainName, metadata) => ({
-    ...metadata,
-    rpcUrls:
+  const chainMetadata = objMap(mergedChainMetadata, (chainName, metadata) => {
+    const overridesUrl =
       rpcOverrides.success && rpcOverrides.data[chainName]
-        ? [rpcOverrides.data[chainName], ...metadata.rpcUrls]
-        : metadata.rpcUrls,
-  }));
+        ? rpcOverrides.data[chainName]
+        : undefined;
+
+    if (!overridesUrl) return metadata;
+
+    // Only EVM supports fallback transport, so we are putting the override at the end
+    const rpcUrls =
+      metadata.protocol === ProtocolType.Ethereum
+        ? [...metadata.rpcUrls, overridesUrl]
+        : [overridesUrl, ...metadata.rpcUrls];
+
+    return { ...metadata, rpcUrls };
+  });
+
   const chainMetadataWithOverrides = mergeChainMetadataMap(chainMetadata, storeMetadataOverrides);
   return { chainMetadata, chainMetadataWithOverrides };
 }

src/features/store.ts

@@ -1,4 +1,4 @@
-import { GithubRegistry, IRegistry } from '@hyperlane-xyz/registry';
+import { chainAddresses, chainMetadata, IRegistry, PartialRegistry } from '@hyperlane-xyz/registry';
 import {
   ChainMap,
   ChainMetadata,
@@ -10,7 +10,6 @@ import { objFilter } from '@hyperlane-xyz/utils';
 import { toast } from 'react-toastify';
 import { create } from 'zustand';
 import { persist } from 'zustand/middleware';
-import { config } from '../consts/config';
 import { logger } from '../utils/logger';
 import { assembleChainMetadata } from './chains/metadata';
 import { FinalTransferStatuses, TransferContext, TransferStatus } from './transfer/types';
@@ -88,10 +87,9 @@ export const useStore = create<AppState>()(
         set({ warpCoreConfigOverrides: overrides, multiProvider, warpCore });
       },
       multiProvider: new MultiProtocolProvider({}),
-      registry: new GithubRegistry({
-        uri: config.registryUrl,
-        branch: config.registryBranch,
-        proxyUrl: config.registryProxyUrl,
+      registry: new PartialRegistry({
+        chainAddresses: chainAddresses,
+        chainMetadata: chainMetadata,
       }),
       warpCore: new WarpCore(new MultiProtocolProvider({}), []),
       setWarpContext: ({ registry, chainMetadata, multiProvider, warpCore }) => {

src/features/wallet/context/EvmWalletContext.tsx

@@ -14,7 +14,7 @@ import {
   walletConnectWallet,
 } from '@rainbow-me/rainbowkit/wallets';
 import { PropsWithChildren, useMemo } from 'react';
-import { createClient, http } from 'viem';
+import { createClient, fallback, http } from 'viem';
 import { WagmiProvider, createConfig } from 'wagmi';
 import { APP_NAME } from '../../../consts/app';
 import { config } from '../../../consts/config';
@@ -44,7 +44,7 @@ function initWagmi(multiProvider: MultiProtocolProvider) {
     chains: [chains[0], ...chains.splice(1)],
     connectors,
     client({ chain }) {
-      const transport = http(chain.rpcUrls.default.http[0]);
+      const transport = fallback(chain.rpcUrls.default.http.map((chainHttp) => http(chainHttp)));
       return createClient({ chain, transport });
     },
   });

vitest.config.mts

@@ -3,5 +3,6 @@ import { defineConfig } from 'vitest/config';
 
 export default defineConfig({
   plugins: [tsconfigPaths()],
+  assetsInclude: ['**/*.yaml'],
   test: {},
 });