@interchain-kit/react 0.0.1-beta.27 → 0.0.1-beta.29

package/esm/hooks/useAccount.js

@@ -1,11 +1,15 @@
-import { useEffect, useState } from "react";
-import { WalletState } from "@interchain-kit/core";
+import { useEffect, useMemo, useState } from "react";
+import { WalletManagerState, WalletState } from "@interchain-kit/core";
 import { useWalletManager } from './useWalletManager';
 export const useAccount = (chainName, walletName) => {
     const walletManager = useWalletManager();
-    const wallet = walletManager.wallets.find(w => w.option.name === walletName);
+    const wallet = useMemo(() => {
+        return walletManager.wallets.find(w => w.option.name === walletName);
+    }, [walletManager, walletName]);
     const [account, setAccount] = useState(null);
-    const chain = walletManager.chains.find(c => c.chainName === chainName);
+    const chain = useMemo(() => {
+        return walletManager.chains.find(c => c.chainName === chainName);
+    }, [walletManager, chainName]);
     const getAccount = async () => {
         if (wallet && chain) {
             if (wallet.walletState === WalletState.Connected) {
@@ -16,12 +20,15 @@ export const useAccount = (chainName, walletName) => {
                 setAccount(null);
             }
         }
+        if (!wallet) {
+            setAccount(null);
+        }
     };
     useEffect(() => {
-        if (wallet) {
+        if (wallet && walletManager.state === WalletManagerState.Initialized) {
             wallet.events.on('keystoreChange', getAccount);
         }
-    }, [wallet]);
+    }, [wallet, walletManager.state]);
     useEffect(() => {
         getAccount();
     }, [wallet, chainName, wallet?.walletState]);

package/esm/hooks/useChain.js

@@ -4,6 +4,7 @@ import { useCurrentWallet } from './useCurrentWallet';
 import { useInterchainClient } from './useInterchainClient';
 import { useWalletModal } from "../modal";
 import { ChainNameNotExist } from "@interchain-kit/core";
+import { useCallback } from "react";
 export const useChain = (chainName) => {
     const walletManager = useWalletManager();
     const chainToShow = walletManager.chains.find((c) => c.chainName === chainName);
@@ -15,6 +16,12 @@ export const useChain = (chainName) => {
         throw new ChainNameNotExist(chainName);
     }
     const { open, close } = useWalletModal();
+    const getRpcEndpoint = useCallback(async () => {
+        return await walletManager.getRpcEndpoint(currentWallet, chainName);
+    }, [walletManager, currentWallet, chainName]);
+    const disconnect = useCallback(() => {
+        walletManager.disconnect(currentWallet?.option?.name);
+    }, [walletManager, currentWallet]);
     const cosmosKitUserChainReturnType = {
         connect: () => {
             if (currentWallet) {
@@ -22,9 +29,10 @@ export const useChain = (chainName) => {
             }
             open();
         },
+        disconnect,
         openView: open,
         closeView: close,
-        getRpcEndpoint: () => walletManager.getRpcEndpoint(currentWallet, chainName),
+        getRpcEndpoint,
         status: currentWallet?.walletState,
         username: account?.username,
         message: currentWallet?.errorMessage,

package/hooks/useAccount.js

@@ -6,9 +6,13 @@ const core_1 = require("@interchain-kit/core");
 const useWalletManager_1 = require("./useWalletManager");
 const useAccount = (chainName, walletName) => {
     const walletManager = (0, useWalletManager_1.useWalletManager)();
-    const wallet = walletManager.wallets.find(w => w.option.name === walletName);
+    const wallet = (0, react_1.useMemo)(() => {
+        return walletManager.wallets.find(w => w.option.name === walletName);
+    }, [walletManager, walletName]);
     const [account, setAccount] = (0, react_1.useState)(null);
-    const chain = walletManager.chains.find(c => c.chainName === chainName);
+    const chain = (0, react_1.useMemo)(() => {
+        return walletManager.chains.find(c => c.chainName === chainName);
+    }, [walletManager, chainName]);
     const getAccount = async () => {
         if (wallet && chain) {
             if (wallet.walletState === core_1.WalletState.Connected) {
@@ -19,12 +23,15 @@ const useAccount = (chainName, walletName) => {
                 setAccount(null);
             }
         }
+        if (!wallet) {
+            setAccount(null);
+        }
     };
     (0, react_1.useEffect)(() => {
-        if (wallet) {
+        if (wallet && walletManager.state === core_1.WalletManagerState.Initialized) {
             wallet.events.on('keystoreChange', getAccount);
         }
-    }, [wallet]);
+    }, [wallet, walletManager.state]);
     (0, react_1.useEffect)(() => {
         getAccount();
     }, [wallet, chainName, wallet?.walletState]);

package/hooks/useChain.js

@@ -7,6 +7,7 @@ const useCurrentWallet_1 = require("./useCurrentWallet");
 const useInterchainClient_1 = require("./useInterchainClient");
 const modal_1 = require("../modal");
 const core_1 = require("@interchain-kit/core");
+const react_1 = require("react");
 const useChain = (chainName) => {
     const walletManager = (0, useWalletManager_1.useWalletManager)();
     const chainToShow = walletManager.chains.find((c) => c.chainName === chainName);
@@ -18,6 +19,12 @@ const useChain = (chainName) => {
         throw new core_1.ChainNameNotExist(chainName);
     }
     const { open, close } = (0, modal_1.useWalletModal)();
+    const getRpcEndpoint = (0, react_1.useCallback)(async () => {
+        return await walletManager.getRpcEndpoint(currentWallet, chainName);
+    }, [walletManager, currentWallet, chainName]);
+    const disconnect = (0, react_1.useCallback)(() => {
+        walletManager.disconnect(currentWallet?.option?.name);
+    }, [walletManager, currentWallet]);
     const cosmosKitUserChainReturnType = {
         connect: () => {
             if (currentWallet) {
@@ -25,9 +32,10 @@ const useChain = (chainName) => {
             }
             open();
         },
+        disconnect,
         openView: open,
         closeView: close,
-        getRpcEndpoint: () => walletManager.getRpcEndpoint(currentWallet, chainName),
+        getRpcEndpoint,
         status: currentWallet?.walletState,
         username: account?.username,
         message: currentWallet?.errorMessage,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@interchain-kit/react",
-  "version": "0.0.1-beta.27",
+  "version": "0.0.1-beta.29",
   "author": "cosmology-tech <developers@cosmology.zone>",
   "description": "interchain-kit wallet connector react package",
   "main": "index.js",
@@ -33,7 +33,7 @@
   "keywords": [],
   "dependencies": {
     "@chain-registry/v2-types": "^0.53.0",
-    "@interchain-kit/core": "0.0.1-beta.27",
+    "@interchain-kit/core": "0.0.1-beta.29",
     "@interchain-ui/react": "1.24.0",
     "@interchainjs/cosmos-types": "0.0.1-beta.9",
     "@interchainjs/injective": "0.0.1-beta.13",
@@ -43,5 +43,5 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   },
-  "gitHead": "af71854ddd46303972013955e68509a441d47421"
+  "gitHead": "df9c668389f1e71958793839ade9b9c4b68000de"
 }

package/types/chain.d.ts

@@ -7,6 +7,7 @@ import { Chain, AssetList } from '@chain-registry/v2-types';
 import { BaseWallet, WalletState } from '@interchain-kit/core';
 export type CosmosKitUseChainReturnType = {
     connect: () => void;
+    disconnect: () => void;
     openView: () => void;
     closeView: () => void;
     getRpcEndpoint: () => Promise<string | HttpEndpoint>;