chore: getChainId is now async

FuelLabs · Jan 16, 2025 · ebb766d · ebb766d
1 parent b548421
commit ebb766d
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 10 deletions.
diff --git a/packages/react/src/ui/Connect/components/Bridge/BridgeDialog.tsx b/packages/react/src/ui/Connect/components/Bridge/BridgeDialog.tsx
@@ -1,5 +1,5 @@
 import * as Dialog from '@radix-ui/react-dialog';
-import { useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import {
   useAccount,
   useBalance,
@@ -35,13 +35,27 @@ type BridgeProps = {
 export function BridgeDialog({ theme }: BridgeProps) {
   const { networks } = useNetworkConfigs();
   const { provider } = useProvider();
-  const bridgeHref = useMemo(() => {
-    const network = networks.find((n) => n.chainId === provider?.getChainId());
-    if (!network) return null;
-    if (!network.bridgeURL) return null;
-    const url = new URL(network.bridgeURL);
-    url.searchParams.set('', 'true');
-    return url.toString();
+  const [bridgeHref, setBridgeHref] = useState<string | null>(null);
+
+  useEffect(() => {
+    let abort = false;
+    const fetchBridgeHref = async () => {
+      if (abort) return;
+      const chainId = await provider?.getChainId();
+      const network = networks.find((n) => n.chainId === chainId);
+      if (abort) return;
+      if (network?.bridgeURL) {
+        const url = new URL(network.bridgeURL);
+        url.searchParams.set('', 'true');
+        setBridgeHref(url.toString());
+      } else {
+        setBridgeHref(null);
+      }
+    };
+    fetchBridgeHref();
+    return () => {
+      abort = true;
+    };
   }, [networks, provider]);
   const {
     isConnected,

diff --git a/packages/walletconnect-connector/src/test/walletConnector.test.ts b/packages/walletconnect-connector/src/test/walletConnector.test.ts
@@ -220,11 +220,12 @@ describe('WalletConnect Connector', () => {
   describe('currentNetwork()', () => {
     test('returns fuel network', async () => {
       const network = await connector.currentNetwork();
+      // @ts-expect-error fuelProvider is private
+      const chainId = await connector.fuelProvider.getChainId();
 
       // @ts-expect-error fuelProvider is private
       expect(network.url).to.equal(connector.fuelProvider?.url);
-      // @ts-expect-error fuelProvider is private
-      expect(network.chainId).to.equal(connector.fuelProvider?.getChainId());
+      expect(network.chainId).to.equal(chainId);
     });
   });
 });