@interchain-kit/react 0.2.208 → 0.2.212

package/esm/store/index.js

@@ -1,221 +1,2 @@
-import { clientNotExistError, WalletState } from "@interchain-kit/core";
-import { createStore } from "zustand";
-import { immer } from "zustand/middleware/immer";
-import { persist, createJSONStorage } from 'zustand/middleware';
-const immerSyncUp = (newWalletManager) => {
-    return (draft) => {
-        draft.chains = newWalletManager.chains;
-        draft.assetLists = newWalletManager.assetLists;
-        draft.wallets = newWalletManager.wallets;
-        draft.signerOptions = newWalletManager.signerOptions;
-        draft.endpointOptions = newWalletManager.endpointOptions;
-        draft.signerOptionMap = newWalletManager.signerOptionMap;
-        draft.endpointOptionsMap = newWalletManager.endpointOptionsMap;
-        draft.preferredSignTypeMap = newWalletManager.preferredSignTypeMap;
-    };
-};
-export const createInterchainStore = (walletManager) => {
-    const { chains, assetLists, wallets, signerOptions, endpointOptions } = walletManager;
-    // const walletManager = new WalletManager(chains, assetLists, wallets, signerOptions, endpointOptions)
-    return createStore(persist(immer((set, get) => ({
-        chainWalletState: [],
-        currentWalletName: '',
-        currentChainName: '',
-        chains: [...walletManager.chains],
-        assetLists: [...walletManager.assetLists],
-        wallets: walletManager.wallets,
-        signerOptions: walletManager.signerOptions,
-        endpointOptions: walletManager.endpointOptions,
-        preferredSignTypeMap: { ...walletManager.preferredSignTypeMap },
-        signerOptionMap: { ...walletManager.signerOptionMap },
-        endpointOptionsMap: { ...walletManager.endpointOptionsMap },
-        walletConnectQRCodeUri: '',
-        updateChainWalletState: (walletName, chainName, data) => {
-            set(draft => {
-                let targetIndex = draft.chainWalletState.findIndex(cws => cws.walletName === walletName && cws.chainName === chainName);
-                draft.chainWalletState[targetIndex] = { ...draft.chainWalletState[targetIndex], ...data };
-            });
-        },
-        init: async () => {
-            const existedChainWalletStatesMap = new Map(get().chainWalletState.map(cws => [cws.walletName + cws.chainName, cws]));
-            wallets.forEach(wallet => {
-                chains.forEach(chain => {
-                    if (!existedChainWalletStatesMap.has(wallet.info.name + chain.chainName)) {
-                        set(draft => {
-                            draft.chainWalletState.push({
-                                chainName: chain.chainName,
-                                walletName: wallet.info.name,
-                                walletState: WalletState.Disconnected,
-                                rpcEndpoint: "",
-                                errorMessage: "",
-                                account: undefined
-                            });
-                        });
-                    }
-                });
-            });
-            const NotExistWallets = [];
-            await Promise.all(get().wallets.map(async (wallet) => {
-                try {
-                    await wallet.init();
-                }
-                catch (error) {
-                    if (error === clientNotExistError.message) {
-                        NotExistWallets.push(wallet.info.name);
-                    }
-                }
-            }));
-            set(draft => {
-                draft.chainWalletState = draft.chainWalletState.map(cws => {
-                    if (NotExistWallets.includes(cws.walletName)) {
-                        return { ...cws, walletState: WalletState.NotExist };
-                    }
-                    return cws;
-                });
-            });
-            // return walletManager.init()
-        },
-        setCurrentChainName: (chainName) => {
-            set(draft => { draft.currentChainName = chainName; });
-        },
-        setCurrentWalletName: (walletName) => {
-            set(draft => { draft.currentWalletName = walletName; });
-        },
-        getDraftChainWalletState: (state, walletName, chainName) => {
-            const targetIndex = state.chainWalletState.findIndex(cws => cws.walletName === walletName && cws.chainName === chainName);
-            return state.chainWalletState[targetIndex];
-        },
-        getChainWalletState: (walletName, chainName) => {
-            return get().chainWalletState.find(cws => cws.walletName === walletName && cws.chainName === chainName);
-        },
-        addChains: (chains, assetLists, signerOptions, endpointOptions) => {
-            walletManager.addChains(chains, assetLists, signerOptions, endpointOptions);
-            // console.log(walletManager.chains, walletManager.assetLists)
-            // set(immerSyncUp(walletManager))
-            // set(draft => {
-            //   draft.chains = walletManager.chains
-            // })
-            set(draft => {
-                chains.forEach(newChain => {
-                    const existChain = draft.chains.find(c => c.chainId === newChain.chainId);
-                    if (!existChain) {
-                        draft.chains.push(newChain);
-                        const assetList = assetLists.find(a => a.chainName === newChain.chainName);
-                        draft.assetLists.push(assetList);
-                        draft.wallets.forEach(w => {
-                            draft.chainWalletState.push({
-                                chainName: newChain.chainName,
-                                walletName: w.info.name,
-                                walletState: WalletState.Disconnected,
-                                rpcEndpoint: "",
-                                errorMessage: "",
-                                account: undefined
-                            });
-                        });
-                    }
-                    draft.signerOptionMap[newChain.chainName] = signerOptions?.signing?.(newChain.chainName);
-                    draft.endpointOptionsMap[newChain.chainName] = endpointOptions?.endpoints?.[newChain.chainName];
-                });
-            });
-        },
-        connect: async (walletName, chainName) => {
-            get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Connecting });
-            try {
-                await walletManager.connect(walletName, chainName, (uri) => {
-                    set(draft => {
-                        draft.walletConnectQRCodeUri = uri;
-                    });
-                });
-                set(draft => {
-                    draft.currentChainName = chainName;
-                    draft.currentWalletName = walletName;
-                });
-                get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Connected });
-            }
-            catch (error) {
-                if (error.message === 'Request rejected') {
-                    get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Rejected, errorMessage: error.message });
-                    return;
-                }
-                get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Disconnected, errorMessage: error.message });
-            }
-        },
-        disconnect: async (walletName, chainName) => {
-            try {
-                await walletManager.disconnect(walletName, chainName);
-                get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Disconnected, account: null });
-            }
-            catch (error) {
-            }
-        },
-        getAccount: async (walletName, chainName) => {
-            const account = await walletManager.getAccount(walletName, chainName);
-            get().updateChainWalletState(walletName, chainName, { account });
-            return account;
-        },
-        getRpcEndpoint: async (walletName, chainName) => {
-            const exist = get().getChainWalletState(walletName, chainName).rpcEndpoint;
-            if (exist)
-                return exist;
-            const rpcEndpoint = await walletManager.getRpcEndpoint(walletName, chainName);
-            get().updateChainWalletState(walletName, chainName, { rpcEndpoint });
-            return rpcEndpoint;
-        },
-        getChainLogoUrl(chainName) {
-            return walletManager.getChainLogoUrl(chainName);
-        },
-        getChainByName(chainName) {
-            return walletManager.getChainByName(chainName);
-        },
-        getAssetListByName(chainName) {
-            return walletManager.getAssetListByName(chainName);
-        },
-        getDownloadLink(walletName) {
-            return walletManager.getDownloadLink(walletName);
-        },
-        getOfflineSigner(walletName, chainName) {
-            return walletManager.getOfflineSigner(walletName, chainName);
-        },
-        getPreferSignType(chainName) {
-            const result = walletManager.getPreferSignType(chainName);
-            set(immerSyncUp(walletManager));
-            return result;
-        },
-        getSignerOptions(chainName) {
-            const result = walletManager.getSignerOptions(chainName);
-            set(immerSyncUp(walletManager));
-            return result;
-        },
-        getWalletByName(walletName) {
-            return walletManager.getWalletByName(walletName);
-        },
-        getSigningClient(walletName, chainName) {
-            return walletManager.getSigningClient(walletName, chainName);
-        },
-        getEnv() {
-            return walletManager.getEnv();
-        },
-    })), {
-        name: 'interchain-kit-store',
-        storage: createJSONStorage(() => localStorage),
-        partialize: state => ({
-            chainWalletState: state.chainWalletState,
-            currentWalletName: state.currentWalletName,
-            currentChainName: state.currentChainName
-        }),
-        onRehydrateStorage: (state) => {
-            // console.log('interchain-kit store hydration starts')
-            // optional
-            return (state, error) => {
-                if (error) {
-                    console.log('an error happened during hydration', error);
-                }
-                else {
-                    // console.log('interchain-kit store hydration finished')
-                }
-            };
-        },
-    }));
-};
 export * from './chain-wallet';
 export * from './store';

package/esm/store/store.js

@@ -1,4 +1,4 @@
-import { WalletState } from "@interchain-kit/core";
+import { clientNotExistError, WalletState } from "@interchain-kit/core";
 import { createStore } from "zustand";
 import { immer } from "zustand/middleware/immer";
 import { persist, createJSONStorage } from 'zustand/middleware';
@@ -17,22 +17,8 @@ const immerSyncUp = (newWalletManager) => {
 export const createInterchainStore = (walletManager) => {
     const { chains, assetLists, wallets, signerOptions, endpointOptions } = walletManager;
     // const walletManager = new WalletManager(chains, assetLists, wallets, signerOptions, endpointOptions)
-    const chainWalletState = [];
-    wallets.forEach(wallet => {
-        chains.forEach(chain => {
-            chainWalletState.push({
-                chainName: chain.chainName,
-                walletName: wallet.info.name,
-                walletState: WalletState.Disconnected,
-                rpcEndpoint: "",
-                errorMessage: "",
-                signerOption: undefined,
-                account: undefined
-            });
-        });
-    });
     return createStore(persist(immer((set, get) => ({
-        chainWalletState,
+        chainWalletState: [],
         currentWalletName: '',
         currentChainName: '',
         chains: [...walletManager.chains],
@@ -43,13 +29,59 @@ export const createInterchainStore = (walletManager) => {
         preferredSignTypeMap: { ...walletManager.preferredSignTypeMap },
         signerOptionMap: { ...walletManager.signerOptionMap },
         endpointOptionsMap: { ...walletManager.endpointOptionsMap },
+        walletConnectQRCodeUri: '',
         updateChainWalletState: (walletName, chainName, data) => {
             set(draft => {
                 let targetIndex = draft.chainWalletState.findIndex(cws => cws.walletName === walletName && cws.chainName === chainName);
                 draft.chainWalletState[targetIndex] = { ...draft.chainWalletState[targetIndex], ...data };
             });
         },
-        init: () => walletManager.init(),
+        init: async () => {
+            const existedChainWalletStatesMap = new Map(get().chainWalletState.map(cws => [cws.walletName + cws.chainName, cws]));
+            wallets.forEach(wallet => {
+                chains.forEach(chain => {
+                    if (!existedChainWalletStatesMap.has(wallet.info.name + chain.chainName)) {
+                        set(draft => {
+                            draft.chainWalletState.push({
+                                chainName: chain.chainName,
+                                walletName: wallet.info.name,
+                                walletState: WalletState.Disconnected,
+                                rpcEndpoint: "",
+                                errorMessage: "",
+                                account: undefined
+                            });
+                        });
+                    }
+                });
+            });
+            const NotExistWallets = [];
+            const ExistWallets = [];
+            await Promise.all(get().wallets.map(async (wallet) => {
+                try {
+                    await wallet.init();
+                    ExistWallets.push(wallet.info.name);
+                }
+                catch (error) {
+                    if (error === clientNotExistError) {
+                        NotExistWallets.push(wallet.info.name);
+                    }
+                }
+            }));
+            set(draft => {
+                draft.chainWalletState = draft.chainWalletState.map(cws => {
+                    if (NotExistWallets.includes(cws.walletName)) {
+                        return { ...cws, walletState: WalletState.NotExist };
+                    }
+                    return cws;
+                });
+                draft.chainWalletState = draft.chainWalletState.map(cws => {
+                    if (ExistWallets.includes(cws.walletName)) {
+                        return { ...cws, walletState: cws.walletState === WalletState.NotExist ? WalletState.Disconnected : cws.walletState };
+                    }
+                    return cws;
+                });
+            });
+        },
         setCurrentChainName: (chainName) => {
             set(draft => { draft.currentChainName = chainName; });
         },
@@ -82,25 +114,41 @@ export const createInterchainStore = (walletManager) => {
                                 chainName: newChain.chainName,
                                 walletName: w.info.name,
                                 walletState: WalletState.Disconnected,
-                                rpcEndpoint: endpointOptions?.endpoints?.[newChain.chainName]?.rpc?.[0],
+                                rpcEndpoint: endpointOptions?.endpoints[newChain.chainName]?.rpc?.[0] || '',
                                 errorMessage: "",
-                                signerOption: signerOptions?.signing?.(newChain.chainName),
                                 account: undefined
                             });
                         });
                     }
+                    else {
+                        draft.updateChainWalletState(newChain.chainName, newChain.chainName, {
+                            rpcEndpoint: endpointOptions?.endpoints[newChain.chainName]?.rpc?.[0] || '',
+                        });
+                    }
                     draft.signerOptionMap[newChain.chainName] = signerOptions?.signing?.(newChain.chainName);
                     draft.endpointOptionsMap[newChain.chainName] = endpointOptions?.endpoints?.[newChain.chainName];
                 });
             });
         },
         connect: async (walletName, chainName) => {
-            get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Connecting });
+            const state = get().getChainWalletState(walletName, chainName)?.walletState;
+            if (state === WalletState.NotExist) {
+                return;
+            }
+            if (walletName === 'WalletConnect' && state === WalletState.Connected) {
+                return;
+            }
+            set(draft => {
+                draft.currentChainName = chainName;
+                draft.currentWalletName = walletName;
+                draft.walletConnectQRCodeUri = '';
+            });
+            get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Connecting, errorMessage: '' });
             try {
-                await walletManager.connect(walletName, chainName);
-                set(draft => {
-                    draft.currentChainName = chainName;
-                    draft.currentWalletName = walletName;
+                await walletManager.connect(walletName, chainName, (uri) => {
+                    set(draft => {
+                        draft.walletConnectQRCodeUri = uri;
+                    });
                 });
                 get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Connected });
             }
@@ -183,7 +231,7 @@ export const createInterchainStore = (walletManager) => {
                     console.log('an error happened during hydration', error);
                 }
                 else {
-                    console.log('interchain-kit store hydration finished');
+                    // console.log('interchain-kit store hydration finished')
                 }
             };
         },

package/esm/utils/wallet.js

@@ -6,3 +6,27 @@ export const getWalletInfo = (wallet) => {
         mobileDisabled: true,
     };
 };
+export const transferToWalletUISchema = (w) => {
+    if (w.info.mode === "wallet-connect") {
+        const wc = w;
+        if (wc.session) {
+            return {
+                name: wc.session?.peer.metadata?.name,
+                prettyName: `${wc.session?.peer.metadata?.name} - Mobile`,
+                logo: wc.session?.peer.metadata?.icons?.[0],
+                mobileDisabled: true,
+                shape: "list",
+                originalWallet: { ...w, session: wc.session },
+                subLogo: w.info.logo,
+            };
+        }
+    }
+    return {
+        name: w.info.name,
+        prettyName: w.info.prettyName,
+        logo: w.info.logo,
+        mobileDisabled: true,
+        shape: "list",
+        originalWallet: w,
+    };
+};

package/hooks/useChainWallet.js

@@ -12,9 +12,9 @@ const useChainWallet = (chainName, walletName) => {
     return {
         //for migration cosmos kit
         connect: async () => {
-            await connect(walletName, chainName);
             setCurrentWalletName(walletName);
             setCurrentChainName(chainName);
+            await connect(walletName, chainName);
             await getAccount(walletName, chainName);
         },
         disconnect: () => disconnect(walletName, chainName),
@@ -27,7 +27,7 @@ const useChainWallet = (chainName, walletName) => {
         chain,
         assetList,
         address: chainWalletStateToShow?.account?.address,
-        wallet: new chain_wallet_1.ChainWallet(wallet, () => connect(walletName, chainName), () => disconnect(walletName, chainName), () => getAccount(walletName, chainName)),
+        wallet: wallet ? new chain_wallet_1.ChainWallet(wallet, () => connect(walletName, chainName), () => disconnect(walletName, chainName), () => getAccount(walletName, chainName)) : null,
         rpcEndpoint: chainWalletStateToShow?.rpcEndpoint,
         getSigningClient: () => getSigningClient(walletName, chainName),
     };

package/modal/modal.d.ts

@@ -1 +1,30 @@
-export declare const WalletModal: () => import("react/jsx-runtime").JSX.Element;
+import { BaseWallet, DownloadInfo } from "@interchain-kit/core";
+import { Wallet as InterchainUIWalletType } from "@interchain-ui/react";
+export type WalletModalProps = {
+    shouldShowList: boolean;
+    isOpen: boolean;
+    walletConnectQRCodeUri: string | null;
+    wallets: InterchainUIWalletType[];
+    username: string;
+    address: string;
+    currentWallet?: BaseWallet;
+    isConnecting: boolean;
+    isConnected: boolean;
+    isRejected: boolean;
+    isDisconnected: boolean;
+    isNotExist: boolean;
+    errorMessage: string;
+    open: () => void;
+    close: () => void;
+    disconnect: () => void;
+    onSelectWallet: (wallet: BaseWallet) => void;
+    onBack: () => void;
+    onReconnect: () => void;
+    getDownloadLink: (walletName: string) => DownloadInfo;
+    getEnv: () => {
+        browser?: string;
+        device?: string;
+        os?: string;
+    };
+};
+export declare const WalletModal: ({ shouldShowList, isOpen, walletConnectQRCodeUri, wallets, username, address, currentWallet, isConnecting, isConnected, isRejected, isDisconnected, isNotExist, errorMessage, open, close, disconnect, onSelectWallet, onBack, onReconnect, getDownloadLink, getEnv, }: WalletModalProps) => import("react/jsx-runtime").JSX.Element;

package/modal/modal.js

@@ -3,104 +3,56 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.WalletModal = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const views_1 = require("./views");
-const provider_1 = require("./provider");
-const hooks_1 = require("../hooks");
 const react_1 = require("react");
-const core_1 = require("@interchain-kit/core");
 const react_2 = require("@interchain-ui/react");
-const WalletModal = () => {
-    const { currentWalletName, currentChainName, wallets, connect, getAccount, setCurrentWalletName, walletConnectQRCodeUri, } = (0, hooks_1.useWalletManager)();
-    const { modalIsOpen, open, close } = (0, provider_1.useWalletModal)();
-    const [modalType, setModalType] = (0, react_1.useState)("wallet-list");
-    const [selectedWallet, setSelectedWallet] = (0, react_1.useState)(null);
-    const { chain, status, wallet } = (0, hooks_1.useChainWallet)(currentChainName, currentWalletName);
-    const handleConnect = async () => {
-        try {
-            await connect(selectedWallet?.info?.name, chain.chainName);
-            await getAccount(selectedWallet?.info?.name, chain.chainName);
-            setSelectedWallet(null);
+const WalletModal = ({ shouldShowList, isOpen, walletConnectQRCodeUri, wallets, username, address, currentWallet, isConnecting, isConnected, isRejected, isDisconnected, isNotExist, errorMessage, open, close, disconnect, onSelectWallet, onBack, onReconnect, getDownloadLink, getEnv, }) => {
+    const { header, content } = (0, react_1.useMemo)(() => {
+        if (shouldShowList || isDisconnected) {
+            return {
+                header: (0, jsx_runtime_1.jsx)(views_1.WalletListHeader, { close: close }),
+                content: ((0, jsx_runtime_1.jsx)(views_1.WalletListContent, { onSelectWallet: onSelectWallet, wallets: wallets })),
+            };
+        }
+        if (currentWallet &&
+            walletConnectQRCodeUri &&
+            currentWallet.info.name === "WalletConnect") {
+            return {
+                header: ((0, jsx_runtime_1.jsx)(views_1.QRCodeHeader, { wallet: currentWallet, close: close, onBack: onBack })),
+                content: ((0, jsx_runtime_1.jsx)(views_1.QRCodeContent, { walletConnectQRCodeUri: walletConnectQRCodeUri, errorMessage: errorMessage, onReconnect: onReconnect })),
+            };
         }
-        catch (error) {
-            console.error("Failed to connect wallet:", error);
+        if (currentWallet && isNotExist) {
+            return {
+                header: ((0, jsx_runtime_1.jsx)(views_1.NotExistHeader, { wallet: currentWallet, close: close, onBack: onBack })),
+                content: ((0, jsx_runtime_1.jsx)(views_1.NotExistContent, { wallet: currentWallet, getDownloadLink: getDownloadLink, getEnv: getEnv })),
+            };
         }
-    };
-    (0, react_1.useEffect)(() => {
-        if (selectedWallet && currentWalletName && currentChainName) {
-            handleConnect();
+        if (currentWallet && isRejected) {
+            return {
+                header: ((0, jsx_runtime_1.jsx)(views_1.RejectHeader, { wallet: currentWallet, close: close, onBack: onBack })),
+                content: ((0, jsx_runtime_1.jsx)(views_1.RejectContent, { wallet: currentWallet, onReconnect: onReconnect })),
+            };
         }
-    }, [selectedWallet]);
-    const handleSelectWallet = async (selectedWallet) => {
-        setSelectedWallet(selectedWallet);
-        setCurrentWalletName(selectedWallet?.info?.name);
-    };
-    (0, react_1.useEffect)(() => {
-        if (!selectedWallet) {
-            setModalType("wallet-list");
+        if (currentWallet && isConnected) {
+            return {
+                header: ((0, jsx_runtime_1.jsx)(views_1.ConnectedHeader, { wallet: currentWallet, onBack: onBack, close: close })),
+                content: ((0, jsx_runtime_1.jsx)(views_1.ConnectedContent, { wallet: currentWallet, username: username, address: address, disconnect: disconnect })),
+            };
         }
-        if (currentWalletName && currentChainName) {
-            if (status === core_1.WalletState.Connecting) {
-                setModalType("connecting");
-            }
-            if (status === core_1.WalletState.Connected) {
-                setModalType("connected");
-            }
-            if (status === core_1.WalletState.Rejected) {
-                setModalType("reject");
-            }
-            if (status === core_1.WalletState.Disconnected) {
-                setModalType("wallet-list");
-            }
-            if (walletConnectQRCodeUri) {
-                setModalType("qr-code");
-            }
+        if (currentWallet && isConnecting) {
+            return {
+                header: ((0, jsx_runtime_1.jsx)(views_1.ConnectingHeader, { wallet: currentWallet, close: close, onBack: onBack })),
+                content: (0, jsx_runtime_1.jsx)(views_1.ConnectingContent, { wallet: currentWallet }),
+            };
         }
     }, [
-        currentWalletName,
-        currentChainName,
-        status,
-        modalIsOpen,
-        selectedWallet,
+        currentWallet,
+        isConnected,
+        isConnecting,
+        address,
+        shouldShowList,
         walletConnectQRCodeUri,
     ]);
-    const goBackList = () => setModalType("wallet-list");
-    const { header, content } = (0, react_1.useMemo)(() => {
-        switch (modalType) {
-            case "wallet-list":
-                return {
-                    header: (0, jsx_runtime_1.jsx)(views_1.WalletListHeader, {}),
-                    content: (0, jsx_runtime_1.jsx)(views_1.WalletListContent, { onSelectWallet: handleSelectWallet }),
-                };
-            case "connecting":
-                return {
-                    header: (0, jsx_runtime_1.jsx)(views_1.ConnectingHeader, { wallet: wallet, onBack: goBackList }),
-                    content: (0, jsx_runtime_1.jsx)(views_1.ConnectingContent, { wallet: wallet }),
-                };
-            case "connected":
-                return {
-                    header: (0, jsx_runtime_1.jsx)(views_1.ConnectedHeader, { wallet: wallet, onBack: goBackList }),
-                    content: (0, jsx_runtime_1.jsx)(views_1.ConnectedContent, { afterDisconnect: goBackList }),
-                };
-            case "reject":
-                return {
-                    header: (0, jsx_runtime_1.jsx)(views_1.RejectHeader, { wallet: wallet, onBack: goBackList }),
-                    content: ((0, jsx_runtime_1.jsx)(views_1.RejectContent, { wallet: wallet, onReconnect: () => {
-                            setModalType("connecting");
-                            wallet.connect(chain.chainId);
-                            wallet.getAccount(chain.chainId);
-                        } })),
-                };
-            case "not-exist":
-                return {
-                    header: (0, jsx_runtime_1.jsx)(views_1.NotExistHeader, { wallet: wallet, onBack: goBackList }),
-                    content: (0, jsx_runtime_1.jsx)(views_1.NotExistContent, { wallet: wallet }),
-                };
-            case "qr-code":
-                return {
-                    header: (0, jsx_runtime_1.jsx)(views_1.QRCodeHeader, { onBack: goBackList }),
-                    content: (0, jsx_runtime_1.jsx)(views_1.QRCodeContent, {}),
-                };
-        }
-    }, [modalType]);
-    return ((0, jsx_runtime_1.jsx)(react_2.ConnectModal, { isOpen: modalIsOpen, header: header, onOpen: open, onClose: close, children: content }));
+    return ((0, jsx_runtime_1.jsx)(react_2.ConnectModal, { isOpen: isOpen, header: header, onOpen: open, onClose: close, children: content }));
 };
 exports.WalletModal = WalletModal;

package/modal/provider.js

@@ -4,12 +4,40 @@ exports.useWalletModal = exports.WalletModalProvider = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const modal_1 = require("./modal");
+const core_1 = require("@interchain-kit/core");
+const hooks_1 = require("../hooks");
+const utils_1 = require("../utils");
 const WalletModalContext = (0, react_1.createContext)(null);
 const WalletModalProvider = ({ children, }) => {
     const [modalIsOpen, setModalIsOpen] = (0, react_1.useState)(false);
     const open = () => setModalIsOpen(true);
     const close = () => setModalIsOpen(false);
-    return ((0, jsx_runtime_1.jsxs)(WalletModalContext.Provider, { value: { modalIsOpen, open, close }, children: [children, (0, jsx_runtime_1.jsx)(modal_1.WalletModal, {})] }));
+    const [walletNameToConnect, setWalletNameToConnect] = (0, react_1.useState)(null);
+    const { chains, wallets, setCurrentWalletName, currentChainName, currentWalletName, walletConnectQRCodeUri, getDownloadLink, getEnv, } = (0, hooks_1.useWalletManager)();
+    const { wallet, status, connect, disconnect, username, address, message } = (0, hooks_1.useChainWallet)(currentChainName || chains[0].chainName, currentWalletName);
+    const [shouldShowList, setShouldShowList] = (0, react_1.useState)(!(currentChainName && currentWalletName));
+    const walletsForUI = wallets.map(utils_1.transferToWalletUISchema);
+    (0, react_1.useEffect)(() => {
+        if (walletNameToConnect) {
+            try {
+                connect();
+                setWalletNameToConnect(null);
+                setShouldShowList(false);
+            }
+            catch (error) {
+                console.error("Error connecting to wallet:", error);
+                throw error;
+            }
+        }
+    }, [walletNameToConnect]);
+    const handleCloseModal = () => {
+        close();
+        setShouldShowList(false);
+    };
+    return ((0, jsx_runtime_1.jsxs)(WalletModalContext.Provider, { value: { modalIsOpen, open, close }, children: [children, (0, jsx_runtime_1.jsx)(modal_1.WalletModal, { shouldShowList: shouldShowList, username: username, address: address, disconnect: disconnect, isOpen: modalIsOpen, open: open, close: handleCloseModal, wallets: walletsForUI, walletConnectQRCodeUri: walletConnectQRCodeUri, currentWallet: wallet?.originalWallet, isConnecting: status === core_1.WalletState.Connecting, isConnected: status === core_1.WalletState.Connected, isRejected: status === core_1.WalletState.Rejected, isDisconnected: status === core_1.WalletState.Disconnected, isNotExist: status === core_1.WalletState.NotExist, errorMessage: message, onSelectWallet: (w) => {
+                    setWalletNameToConnect(w.info.name);
+                    setCurrentWalletName(w.info.name);
+                }, onBack: () => setShouldShowList(true), onReconnect: connect, getDownloadLink: () => getDownloadLink(wallet?.info.name), getEnv: getEnv })] }));
 };
 exports.WalletModalProvider = WalletModalProvider;
 const useWalletModal = () => {

package/modal/views/Connected.d.ts

@@ -1,8 +1,12 @@
 import { BaseWallet } from "@interchain-kit/core";
-export declare const ConnectedHeader: ({ wallet, onBack, }: {
+export declare const ConnectedHeader: ({ wallet, close, onBack, }: {
     wallet: BaseWallet;
+    close: () => void;
     onBack: () => void;
 }) => import("react/jsx-runtime").JSX.Element;
-export declare const ConnectedContent: ({ afterDisconnect, }: {
-    afterDisconnect: () => void;
+export declare const ConnectedContent: ({ address, username, wallet, disconnect, }: {
+    address: string;
+    username: string | null;
+    wallet: BaseWallet;
+    disconnect: () => void;
 }) => import("react/jsx-runtime").JSX.Element;