fix: show wallet info in useWalletInfo hook for ethers and ethers5

reown-com · Feb 6, 2025 · 52484c4 · 52484c4
1 parent 51555a9
commit 52484c4
Show file tree

Hide file tree

Showing 3 changed files with 84 additions and 0 deletions.
diff --git a/.changeset/light-geese-stare.md b/.changeset/light-geese-stare.md
@@ -0,0 +1,18 @@
+---
+'@reown/appkit-ethers5-react-native': patch
+'@reown/appkit-ethers-react-native': patch
+'@reown/appkit-auth-ethers-react-native': patch
+'@reown/appkit-auth-wagmi-react-native': patch
+'@reown/appkit-coinbase-ethers-react-native': patch
+'@reown/appkit-coinbase-wagmi-react-native': patch
+'@reown/appkit-common-react-native': patch
+'@reown/appkit-core-react-native': patch
+'@reown/appkit-scaffold-react-native': patch
+'@reown/appkit-scaffold-utils-react-native': patch
+'@reown/appkit-siwe-react-native': patch
+'@reown/appkit-ui-react-native': patch
+'@reown/appkit-wagmi-react-native': patch
+'@reown/appkit-wallet-react-native': patch
+---
+
+fix: show wallet info in ethers hook
diff --git a/packages/ethers/src/client.ts b/packages/ethers/src/client.ts
@@ -450,6 +450,10 @@ export class AppKit extends AppKitScaffold {
       this.syncNetwork(chainImages);
     });
 
+    EthersStoreUtil.subscribeKey('provider', provider => {
+      this.syncConnectedWalletInfo(provider);
+    });
+
     this.syncRequestedNetworks(chains, chainImages);
     this.syncConnectors(config);
     this.syncAuthConnector(config);
@@ -1002,6 +1006,35 @@ export class AppKit extends AppKitScaffold {
     this.addAuthListeners(this.authProvider);
   }
 
+  private async syncConnectedWalletInfo(provider?: Provider) {
+    if (!provider) {
+      this.setConnectedWalletInfo(undefined);
+
+      return;
+    }
+
+    if ((provider as any)?.session?.peer?.metadata) {
+      const metadata = (provider as unknown as EthereumProvider)?.session?.peer.metadata;
+      if (metadata) {
+        this.setConnectedWalletInfo({
+          ...metadata,
+          name: metadata.name,
+          icon: metadata.icons?.[0]
+        });
+      }
+    } else if (provider?.id === ConstantsUtil.COINBASE_CONNECTOR_ID) {
+      this.setConnectedWalletInfo({
+        name: 'Coinbase Wallet'
+      });
+    } else if (provider?.id === ConstantsUtil.AUTH_CONNECTOR_ID) {
+      this.setConnectedWalletInfo({
+        name: 'AppKit Universal Wallet'
+      });
+    } else {
+      this.setConnectedWalletInfo(undefined);
+    }
+  }
+
   private async addAuthListeners(authProvider: AppKitFrameProvider) {
     authProvider.onSetPreferredAccount(async ({ address, type }) => {
       if (address) {

diff --git a/packages/ethers5/src/client.ts b/packages/ethers5/src/client.ts
@@ -432,6 +432,10 @@ export class AppKit extends AppKitScaffold {
       this.syncNetwork(chainImages);
     });
 
+    EthersStoreUtil.subscribeKey('provider', provider => {
+      this.syncConnectedWalletInfo(provider);
+    });
+
     this.syncRequestedNetworks(chains, chainImages);
     this.syncConnectors(config);
     this.syncAuthConnector(config);
@@ -979,6 +983,35 @@ export class AppKit extends AppKitScaffold {
     this.addAuthListeners(this.authProvider);
   }
 
+  private async syncConnectedWalletInfo(provider?: Provider) {
+    if (!provider) {
+      this.setConnectedWalletInfo(undefined);
+
+      return;
+    }
+
+    if ((provider as any)?.session?.peer?.metadata) {
+      const metadata = (provider as unknown as EthereumProvider)?.session?.peer.metadata;
+      if (metadata) {
+        this.setConnectedWalletInfo({
+          ...metadata,
+          name: metadata.name,
+          icon: metadata.icons?.[0]
+        });
+      }
+    } else if (provider?.id === ConstantsUtil.COINBASE_CONNECTOR_ID) {
+      this.setConnectedWalletInfo({
+        name: 'Coinbase Wallet'
+      });
+    } else if (provider?.id === ConstantsUtil.AUTH_CONNECTOR_ID) {
+      this.setConnectedWalletInfo({
+        name: 'AppKit Universal Wallet'
+      });
+    } else {
+      this.setConnectedWalletInfo(undefined);
+    }
+  }
+
   private async addAuthListeners(authProvider: AppKitFrameProvider) {
     authProvider.onSetPreferredAccount(async ({ address, type }) => {
       if (address) {