@interchain-kit/react 0.0.1-beta.58 → 0.0.1-beta.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -24,7 +24,7 @@ export const useChainWallet = (chainName, walletName) => {
24
24
  chain,
25
25
  assetList,
26
26
  address: chainWalletStateToShow?.account?.address,
27
- wallet: new ChainWallet(wallet, () => connect(walletName, chainName), () => disconnect(walletName, chainName), () => getAccount(currentWalletName, chainName)),
27
+ wallet: new ChainWallet(wallet, () => connect(walletName, chainName), () => disconnect(walletName, chainName), () => getAccount(walletName, chainName)),
28
28
  rpcEndpoint: chainWalletStateToShow?.rpcEndpoint,
29
29
  getSigningClient: () => getSigningClient(walletName, chainName),
30
30
  };
@@ -2,71 +2,94 @@ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { ConnectedContent, ConnectedHeader, ConnectingContent, ConnectingHeader, NotExistContent, NotExistHeader, QRCodeContent, QRCodeHeader, RejectContent, RejectHeader, WalletListContent, WalletListHeader, } from "./views";
3
3
  import { useWalletModal } from "./provider";
4
4
  import { useChainWallet, useWalletManager } from "../hooks";
5
- import { useEffect, useState } from "react";
5
+ import { useEffect, useMemo, useState } from "react";
6
6
  import { WalletState } from "@interchain-kit/core";
7
7
  import { ConnectModal } from "@interchain-ui/react";
8
- export const WalletModal = () => {
8
+ const WalletModal = () => {
9
+ const { currentWalletName, currentChainName, wallets, connect, getAccount, setCurrentWalletName, } = useWalletManager();
9
10
  const { modalIsOpen, open, close } = useWalletModal();
10
- const { currentWalletName, currentChainName, wallets, setCurrentWalletName, connect, getAccount, getWalletByName, } = useWalletManager();
11
- const handleSelectWallet = async (selectedWallet) => {
12
- const walletToView = wallets.find((w) => w.info.name === selectedWallet.info.name);
13
- setCurrentWalletName(selectedWallet.info.name);
14
- setModalView({
15
- header: (_jsx(ConnectingHeader, { wallet: walletToView, onBack: gotoWalletList })),
16
- content: _jsx(ConnectingContent, { wallet: walletToView }),
17
- });
18
- if (walletToView?.info.mode === "extension" &&
19
- !walletToView.isExtensionInstalled) {
20
- setModalView({
21
- header: (_jsx(NotExistHeader, { wallet: walletToView, onBack: gotoWalletList })),
22
- content: _jsx(NotExistContent, { wallet: walletToView }),
23
- });
24
- return;
25
- }
26
- try {
27
- if (walletToView?.info.mode === "wallet-connect") {
28
- walletToView.setOnPairingUriCreatedCallback(() => {
29
- setModalView({
30
- header: _jsx(QRCodeHeader, { onBack: gotoWalletList }),
31
- content: _jsx(QRCodeContent, {}),
32
- });
33
- });
34
- walletToView.setPairingToConnect(wallet.pairing);
35
- }
36
- console.log({ currentChainName });
37
- await connect(selectedWallet.info.name, currentChainName);
38
- await getAccount(selectedWallet.info.name, currentChainName);
39
- setModalView({
40
- header: (_jsx(ConnectedHeader, { wallet: walletToView, onBack: gotoWalletList })),
41
- content: _jsx(ConnectedContent, {}),
42
- });
43
- }
44
- catch (error) {
45
- console.log(error);
46
- setModalView({
47
- header: _jsx(RejectHeader, { wallet: walletToView, onBack: gotoWalletList }),
48
- content: _jsx(RejectContent, { wallet: walletToView }),
49
- });
50
- }
11
+ const [modalType, setModalType] = useState("wallet-list");
12
+ const [selectedWallet, setSelectedWallet] = useState(null);
13
+ const { chain, status, wallet } = useChainWallet(currentChainName, currentWalletName);
14
+ const handleConnect = async () => {
15
+ return connect(selectedWallet?.info?.name, chain.chainName)
16
+ .then(() => getAccount(selectedWallet?.info?.name, chain.chainName))
17
+ .then(() => setSelectedWallet(null))
18
+ .catch(() => { });
51
19
  };
52
- const defaultModalView = {
53
- header: _jsx(WalletListHeader, {}),
54
- content: _jsx(WalletListContent, { onSelectWallet: handleSelectWallet }),
20
+ useEffect(() => {
21
+ if (selectedWallet && currentWalletName && currentChainName) {
22
+ handleConnect();
23
+ }
24
+ }, [selectedWallet]);
25
+ const handleSelectWallet = async (selectedWallet) => {
26
+ setSelectedWallet(selectedWallet);
27
+ setCurrentWalletName(selectedWallet?.info?.name);
55
28
  };
56
- const [modalView, setModalView] = useState(defaultModalView);
57
- const gotoWalletList = () => setModalView(defaultModalView);
58
- const { status } = useChainWallet(currentChainName, currentWalletName);
59
29
  useEffect(() => {
60
- const currentWallet = getWalletByName(currentWalletName);
61
- if (modalIsOpen && status === WalletState.Connected) {
62
- setModalView({
63
- header: (_jsx(ConnectedHeader, { wallet: currentWallet, onBack: gotoWalletList })),
64
- content: _jsx(ConnectedContent, {}),
65
- });
30
+ if (!selectedWallet) {
31
+ setModalType("wallet-list");
32
+ }
33
+ if (currentWalletName && currentChainName) {
34
+ if (status === WalletState.Connecting) {
35
+ setModalType("connecting");
36
+ }
37
+ if (status === WalletState.Connected) {
38
+ setModalType("connected");
39
+ }
40
+ if (status === WalletState.Rejected) {
41
+ setModalType("reject");
42
+ }
43
+ if (status === WalletState.Disconnected) {
44
+ setModalType("wallet-list");
45
+ }
66
46
  }
67
- else {
68
- setModalView(defaultModalView);
47
+ }, [
48
+ currentWalletName,
49
+ currentChainName,
50
+ status,
51
+ modalIsOpen,
52
+ selectedWallet,
53
+ ]);
54
+ const goBackList = () => setModalType("wallet-list");
55
+ const { header, content } = useMemo(() => {
56
+ switch (modalType) {
57
+ case "wallet-list":
58
+ return {
59
+ header: _jsx(WalletListHeader, {}),
60
+ content: _jsx(WalletListContent, { onSelectWallet: handleSelectWallet }),
61
+ };
62
+ case "connecting":
63
+ return {
64
+ header: _jsx(ConnectingHeader, { wallet: wallet, onBack: goBackList }),
65
+ content: _jsx(ConnectingContent, { wallet: wallet }),
66
+ };
67
+ case "connected":
68
+ return {
69
+ header: _jsx(ConnectedHeader, { wallet: wallet, onBack: goBackList }),
70
+ content: _jsx(ConnectedContent, { afterDisconnect: goBackList }),
71
+ };
72
+ case "reject":
73
+ return {
74
+ header: _jsx(RejectHeader, { wallet: wallet, onBack: goBackList }),
75
+ content: (_jsx(RejectContent, { wallet: wallet, onReconnect: () => {
76
+ setModalType("connecting");
77
+ wallet.connect(chain.chainId);
78
+ wallet.getAccount(chain.chainId);
79
+ } })),
80
+ };
81
+ case "not-exist":
82
+ return {
83
+ header: _jsx(NotExistHeader, { wallet: wallet, onBack: goBackList }),
84
+ content: _jsx(NotExistContent, { wallet: wallet }),
85
+ };
86
+ case "qr-code":
87
+ return {
88
+ header: _jsx(QRCodeHeader, { onBack: goBackList }),
89
+ content: _jsx(QRCodeContent, {}),
90
+ };
69
91
  }
70
- }, [modalIsOpen, status]);
71
- return (_jsx(ConnectModal, { isOpen: modalIsOpen, header: modalView.header, onOpen: open, onClose: close, children: modalView.content }));
92
+ }, [modalType]);
93
+ return (_jsx(ConnectModal, { isOpen: modalIsOpen, header: header, onOpen: open, onClose: close, children: content }));
72
94
  };
95
+ export default WalletModal;
@@ -1,8 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { createContext, useContext, useState } from "react";
3
- import { WalletModal } from "./modal";
2
+ import { createContext, lazy, useContext, useState } from "react";
3
+ const WalletModal = lazy(() => import(/*webpackChunkName: "interchain-kit-modal" */ "./modal"));
4
4
  const WalletModalContext = createContext(null);
5
- export const WalletModalProvider = ({ children }) => {
5
+ export const WalletModalProvider = ({ children, }) => {
6
6
  const [modalIsOpen, setModalIsOpen] = useState(false);
7
7
  const open = () => setModalIsOpen(true);
8
8
  const close = () => setModalIsOpen(false);
@@ -11,7 +11,7 @@ export const WalletModalProvider = ({ children }) => {
11
11
  export const useWalletModal = () => {
12
12
  const context = useContext(WalletModalContext);
13
13
  if (!context) {
14
- throw new Error('useWalletModal must be used within a WalletModalProvider');
14
+ throw new Error("useWalletModal must be used within a WalletModalProvider");
15
15
  }
16
16
  return context;
17
17
  };
@@ -8,7 +8,7 @@ export const ConnectedHeader = ({ wallet, onBack, }) => {
8
8
  const { close } = useWalletModal();
9
9
  return (_jsx(ConnectModalHead, { title: wallet?.info?.prettyName || "", hasBackButton: true, onClose: close, onBack: onBack, closeButtonProps: { onClick: close } }));
10
10
  };
11
- export const ConnectedContent = () => {
11
+ export const ConnectedContent = ({ afterDisconnect, }) => {
12
12
  const { currentChainName, currentWalletName } = useWalletManager();
13
13
  console.log({ currentChainName, currentWalletName });
14
14
  const { address, username, wallet } = useChainWallet(currentChainName, currentWalletName);
@@ -26,6 +26,6 @@ export const ConnectedContent = () => {
26
26
  address: address,
27
27
  }, onDisconnect: async () => {
28
28
  await wallet.disconnect(currentChainName);
29
- close();
29
+ afterDisconnect();
30
30
  } }));
31
31
  };
@@ -1,14 +1,11 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { ConnectModalHead, ConnectModalStatus } from "@interchain-ui/react";
3
3
  import { useWalletModal } from "../provider";
4
- import { useWalletManager } from "../../hooks";
5
4
  import { getWalletInfo } from "../../utils";
6
5
  export const RejectHeader = ({ wallet, onBack, }) => {
7
6
  const { close } = useWalletModal();
8
- return (_jsx(ConnectModalHead, { title: wallet.info.prettyName, hasBackButton: true, onClose: close, onBack: onBack, closeButtonProps: { onClick: close } }));
7
+ return (_jsx(ConnectModalHead, { title: wallet?.info?.prettyName, hasBackButton: true, onClose: close, onBack: onBack, closeButtonProps: { onClick: close } }));
9
8
  };
10
- export const RejectContent = ({ wallet }) => {
11
- const walletManager = useWalletManager();
12
- const { close } = useWalletModal();
13
- return (_jsx(ConnectModalStatus, { status: "Rejected", wallet: getWalletInfo(wallet), contentHeader: "Request Rejected", contentDesc: wallet.errorMessage || "Connection permission is denied.", onConnect: () => walletManager.connect(wallet.info.name, walletManager.currentChainName) }));
9
+ export const RejectContent = ({ wallet, onReconnect, }) => {
10
+ return (_jsx(ConnectModalStatus, { status: "Rejected", wallet: getWalletInfo(wallet), contentHeader: "Request Rejected", contentDesc: wallet.errorMessage || "Connection permission is denied.", onConnect: onReconnect }));
14
11
  };
@@ -5,7 +5,7 @@ export class ChainWallet extends BaseWallet {
5
5
  disconnectWithState;
6
6
  getAccountWithState;
7
7
  constructor(originalWallet, connectWithState, disconnectWithState, getAccountWithState) {
8
- super(originalWallet.info);
8
+ super(originalWallet?.info);
9
9
  this.originalWallet = originalWallet;
10
10
  this.connectWithState = connectWithState;
11
11
  this.disconnectWithState = disconnectWithState;
@@ -23,7 +23,7 @@ export const createInterchainStore = (walletManager) => {
23
23
  chainWalletState.push({
24
24
  chainName: chain.chainName,
25
25
  walletName: wallet.info.name,
26
- walletState: null,
26
+ walletState: WalletState.Disconnected,
27
27
  rpcEndpoint: "",
28
28
  errorMessage: "",
29
29
  signerOption: undefined,
@@ -77,18 +77,18 @@ export const createInterchainStore = (walletManager) => {
77
77
  draft.chains.push(newChain);
78
78
  const assetList = assetLists.find(a => a.chainName === newChain.chainName);
79
79
  draft.assetLists.push(assetList);
80
- }
81
- draft.wallets.forEach(w => {
82
- draft.chainWalletState.push({
83
- chainName: newChain.chainName,
84
- walletName: w.info.name,
85
- walletState: WalletState.Disconnected,
86
- rpcEndpoint: "",
87
- errorMessage: "",
88
- signerOption: undefined,
89
- account: undefined
80
+ draft.wallets.forEach(w => {
81
+ draft.chainWalletState.push({
82
+ chainName: newChain.chainName,
83
+ walletName: w.info.name,
84
+ walletState: WalletState.Disconnected,
85
+ rpcEndpoint: "",
86
+ errorMessage: "",
87
+ signerOption: signerOptions?.signing?.(newChain.chainName),
88
+ account: undefined
89
+ });
90
90
  });
91
- });
91
+ }
92
92
  draft.signerOptionMap[newChain.chainName] = signerOptions?.signing?.(newChain.chainName);
93
93
  draft.endpointOptionsMap[newChain.chainName] = endpointOptions?.endpoints?.[newChain.chainName];
94
94
  });
@@ -105,7 +105,12 @@ export const createInterchainStore = (walletManager) => {
105
105
  get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Connected });
106
106
  }
107
107
  catch (error) {
108
+ if (error.message === 'Request rejected') {
109
+ get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Rejected, errorMessage: error.message });
110
+ return;
111
+ }
108
112
  get().updateChainWalletState(walletName, chainName, { walletState: WalletState.Disconnected, errorMessage: error.message });
113
+ throw error;
109
114
  }
110
115
  },
111
116
  disconnect: async (walletName, chainName) => {
@@ -122,6 +127,9 @@ export const createInterchainStore = (walletManager) => {
122
127
  return account;
123
128
  },
124
129
  getRpcEndpoint: async (walletName, chainName) => {
130
+ const exist = get().getChainWalletState(walletName, chainName).rpcEndpoint;
131
+ if (exist)
132
+ return exist;
125
133
  const rpcEndpoint = await walletManager.getRpcEndpoint(walletName, chainName);
126
134
  get().updateChainWalletState(walletName, chainName, { rpcEndpoint });
127
135
  return rpcEndpoint;
@@ -1,8 +1,8 @@
1
1
  export const getWalletInfo = (wallet) => {
2
2
  return {
3
- name: wallet.info.name,
4
- prettyName: wallet.info.prettyName,
5
- logo: wallet.info.logo,
3
+ name: wallet?.info?.name,
4
+ prettyName: wallet?.info?.prettyName,
5
+ logo: wallet?.info?.logo,
6
6
  mobileDisabled: true,
7
7
  };
8
8
  };
@@ -27,7 +27,7 @@ const useChainWallet = (chainName, walletName) => {
27
27
  chain,
28
28
  assetList,
29
29
  address: chainWalletStateToShow?.account?.address,
30
- wallet: new chain_wallet_1.ChainWallet(wallet, () => connect(walletName, chainName), () => disconnect(walletName, chainName), () => getAccount(currentWalletName, chainName)),
30
+ wallet: new chain_wallet_1.ChainWallet(wallet, () => connect(walletName, chainName), () => disconnect(walletName, chainName), () => getAccount(walletName, chainName)),
31
31
  rpcEndpoint: chainWalletStateToShow?.rpcEndpoint,
32
32
  getSigningClient: () => getSigningClient(walletName, chainName),
33
33
  };
package/modal/modal.d.ts CHANGED
@@ -1 +1,2 @@
1
- export declare const WalletModal: () => import("react/jsx-runtime").JSX.Element;
1
+ declare const WalletModal: () => import("react/jsx-runtime").JSX.Element;
2
+ export default WalletModal;
package/modal/modal.js CHANGED
@@ -1,6 +1,5 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.WalletModal = void 0;
4
3
  const jsx_runtime_1 = require("react/jsx-runtime");
5
4
  const views_1 = require("./views");
6
5
  const provider_1 = require("./provider");
@@ -9,68 +8,90 @@ const react_1 = require("react");
9
8
  const core_1 = require("@interchain-kit/core");
10
9
  const react_2 = require("@interchain-ui/react");
11
10
  const WalletModal = () => {
11
+ const { currentWalletName, currentChainName, wallets, connect, getAccount, setCurrentWalletName, } = (0, hooks_1.useWalletManager)();
12
12
  const { modalIsOpen, open, close } = (0, provider_1.useWalletModal)();
13
- const { currentWalletName, currentChainName, wallets, setCurrentWalletName, connect, getAccount, getWalletByName, } = (0, hooks_1.useWalletManager)();
14
- const handleSelectWallet = async (selectedWallet) => {
15
- const walletToView = wallets.find((w) => w.info.name === selectedWallet.info.name);
16
- setCurrentWalletName(selectedWallet.info.name);
17
- setModalView({
18
- header: ((0, jsx_runtime_1.jsx)(views_1.ConnectingHeader, { wallet: walletToView, onBack: gotoWalletList })),
19
- content: (0, jsx_runtime_1.jsx)(views_1.ConnectingContent, { wallet: walletToView }),
20
- });
21
- if (walletToView?.info.mode === "extension" &&
22
- !walletToView.isExtensionInstalled) {
23
- setModalView({
24
- header: ((0, jsx_runtime_1.jsx)(views_1.NotExistHeader, { wallet: walletToView, onBack: gotoWalletList })),
25
- content: (0, jsx_runtime_1.jsx)(views_1.NotExistContent, { wallet: walletToView }),
26
- });
27
- return;
28
- }
29
- try {
30
- if (walletToView?.info.mode === "wallet-connect") {
31
- walletToView.setOnPairingUriCreatedCallback(() => {
32
- setModalView({
33
- header: (0, jsx_runtime_1.jsx)(views_1.QRCodeHeader, { onBack: gotoWalletList }),
34
- content: (0, jsx_runtime_1.jsx)(views_1.QRCodeContent, {}),
35
- });
36
- });
37
- walletToView.setPairingToConnect(wallet.pairing);
38
- }
39
- console.log({ currentChainName });
40
- await connect(selectedWallet.info.name, currentChainName);
41
- await getAccount(selectedWallet.info.name, currentChainName);
42
- setModalView({
43
- header: ((0, jsx_runtime_1.jsx)(views_1.ConnectedHeader, { wallet: walletToView, onBack: gotoWalletList })),
44
- content: (0, jsx_runtime_1.jsx)(views_1.ConnectedContent, {}),
45
- });
46
- }
47
- catch (error) {
48
- console.log(error);
49
- setModalView({
50
- header: (0, jsx_runtime_1.jsx)(views_1.RejectHeader, { wallet: walletToView, onBack: gotoWalletList }),
51
- content: (0, jsx_runtime_1.jsx)(views_1.RejectContent, { wallet: walletToView }),
52
- });
53
- }
13
+ const [modalType, setModalType] = (0, react_1.useState)("wallet-list");
14
+ const [selectedWallet, setSelectedWallet] = (0, react_1.useState)(null);
15
+ const { chain, status, wallet } = (0, hooks_1.useChainWallet)(currentChainName, currentWalletName);
16
+ const handleConnect = async () => {
17
+ return connect(selectedWallet?.info?.name, chain.chainName)
18
+ .then(() => getAccount(selectedWallet?.info?.name, chain.chainName))
19
+ .then(() => setSelectedWallet(null))
20
+ .catch(() => { });
54
21
  };
55
- const defaultModalView = {
56
- header: (0, jsx_runtime_1.jsx)(views_1.WalletListHeader, {}),
57
- content: (0, jsx_runtime_1.jsx)(views_1.WalletListContent, { onSelectWallet: handleSelectWallet }),
22
+ (0, react_1.useEffect)(() => {
23
+ if (selectedWallet && currentWalletName && currentChainName) {
24
+ handleConnect();
25
+ }
26
+ }, [selectedWallet]);
27
+ const handleSelectWallet = async (selectedWallet) => {
28
+ setSelectedWallet(selectedWallet);
29
+ setCurrentWalletName(selectedWallet?.info?.name);
58
30
  };
59
- const [modalView, setModalView] = (0, react_1.useState)(defaultModalView);
60
- const gotoWalletList = () => setModalView(defaultModalView);
61
- const { status } = (0, hooks_1.useChainWallet)(currentChainName, currentWalletName);
62
31
  (0, react_1.useEffect)(() => {
63
- const currentWallet = getWalletByName(currentWalletName);
64
- if (modalIsOpen && status === core_1.WalletState.Connected) {
65
- setModalView({
66
- header: ((0, jsx_runtime_1.jsx)(views_1.ConnectedHeader, { wallet: currentWallet, onBack: gotoWalletList })),
67
- content: (0, jsx_runtime_1.jsx)(views_1.ConnectedContent, {}),
68
- });
32
+ if (!selectedWallet) {
33
+ setModalType("wallet-list");
34
+ }
35
+ if (currentWalletName && currentChainName) {
36
+ if (status === core_1.WalletState.Connecting) {
37
+ setModalType("connecting");
38
+ }
39
+ if (status === core_1.WalletState.Connected) {
40
+ setModalType("connected");
41
+ }
42
+ if (status === core_1.WalletState.Rejected) {
43
+ setModalType("reject");
44
+ }
45
+ if (status === core_1.WalletState.Disconnected) {
46
+ setModalType("wallet-list");
47
+ }
69
48
  }
70
- else {
71
- setModalView(defaultModalView);
49
+ }, [
50
+ currentWalletName,
51
+ currentChainName,
52
+ status,
53
+ modalIsOpen,
54
+ selectedWallet,
55
+ ]);
56
+ const goBackList = () => setModalType("wallet-list");
57
+ const { header, content } = (0, react_1.useMemo)(() => {
58
+ switch (modalType) {
59
+ case "wallet-list":
60
+ return {
61
+ header: (0, jsx_runtime_1.jsx)(views_1.WalletListHeader, {}),
62
+ content: (0, jsx_runtime_1.jsx)(views_1.WalletListContent, { onSelectWallet: handleSelectWallet }),
63
+ };
64
+ case "connecting":
65
+ return {
66
+ header: (0, jsx_runtime_1.jsx)(views_1.ConnectingHeader, { wallet: wallet, onBack: goBackList }),
67
+ content: (0, jsx_runtime_1.jsx)(views_1.ConnectingContent, { wallet: wallet }),
68
+ };
69
+ case "connected":
70
+ return {
71
+ header: (0, jsx_runtime_1.jsx)(views_1.ConnectedHeader, { wallet: wallet, onBack: goBackList }),
72
+ content: (0, jsx_runtime_1.jsx)(views_1.ConnectedContent, { afterDisconnect: goBackList }),
73
+ };
74
+ case "reject":
75
+ return {
76
+ header: (0, jsx_runtime_1.jsx)(views_1.RejectHeader, { wallet: wallet, onBack: goBackList }),
77
+ content: ((0, jsx_runtime_1.jsx)(views_1.RejectContent, { wallet: wallet, onReconnect: () => {
78
+ setModalType("connecting");
79
+ wallet.connect(chain.chainId);
80
+ wallet.getAccount(chain.chainId);
81
+ } })),
82
+ };
83
+ case "not-exist":
84
+ return {
85
+ header: (0, jsx_runtime_1.jsx)(views_1.NotExistHeader, { wallet: wallet, onBack: goBackList }),
86
+ content: (0, jsx_runtime_1.jsx)(views_1.NotExistContent, { wallet: wallet }),
87
+ };
88
+ case "qr-code":
89
+ return {
90
+ header: (0, jsx_runtime_1.jsx)(views_1.QRCodeHeader, { onBack: goBackList }),
91
+ content: (0, jsx_runtime_1.jsx)(views_1.QRCodeContent, {}),
92
+ };
72
93
  }
73
- }, [modalIsOpen, status]);
74
- return ((0, jsx_runtime_1.jsx)(react_2.ConnectModal, { isOpen: modalIsOpen, header: modalView.header, onOpen: open, onClose: close, children: modalView.content }));
94
+ }, [modalType]);
95
+ return ((0, jsx_runtime_1.jsx)(react_2.ConnectModal, { isOpen: modalIsOpen, header: header, onOpen: open, onClose: close, children: content }));
75
96
  };
76
- exports.WalletModal = WalletModal;
97
+ exports.default = WalletModal;
@@ -3,7 +3,7 @@ type WalletModalContextType = {
3
3
  open: () => void;
4
4
  close: () => void;
5
5
  };
6
- export declare const WalletModalProvider: ({ children }: {
6
+ export declare const WalletModalProvider: ({ children, }: {
7
7
  children: React.ReactNode;
8
8
  }) => import("react/jsx-runtime").JSX.Element;
9
9
  export declare const useWalletModal: () => WalletModalContextType;
package/modal/provider.js CHANGED
@@ -1,21 +1,54 @@
1
1
  "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || (function () {
19
+ var ownKeys = function(o) {
20
+ ownKeys = Object.getOwnPropertyNames || function (o) {
21
+ var ar = [];
22
+ for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
23
+ return ar;
24
+ };
25
+ return ownKeys(o);
26
+ };
27
+ return function (mod) {
28
+ if (mod && mod.__esModule) return mod;
29
+ var result = {};
30
+ if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
31
+ __setModuleDefault(result, mod);
32
+ return result;
33
+ };
34
+ })();
2
35
  Object.defineProperty(exports, "__esModule", { value: true });
3
36
  exports.useWalletModal = exports.WalletModalProvider = void 0;
4
37
  const jsx_runtime_1 = require("react/jsx-runtime");
5
38
  const react_1 = require("react");
6
- const modal_1 = require("./modal");
39
+ const WalletModal = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require(/*webpackChunkName: "interchain-kit-modal" */ "./modal"))));
7
40
  const WalletModalContext = (0, react_1.createContext)(null);
8
- const WalletModalProvider = ({ children }) => {
41
+ const WalletModalProvider = ({ children, }) => {
9
42
  const [modalIsOpen, setModalIsOpen] = (0, react_1.useState)(false);
10
43
  const open = () => setModalIsOpen(true);
11
44
  const close = () => setModalIsOpen(false);
12
- return ((0, jsx_runtime_1.jsxs)(WalletModalContext.Provider, { value: { modalIsOpen, open, close }, children: [children, (0, jsx_runtime_1.jsx)(modal_1.WalletModal, {})] }));
45
+ return ((0, jsx_runtime_1.jsxs)(WalletModalContext.Provider, { value: { modalIsOpen, open, close }, children: [children, (0, jsx_runtime_1.jsx)(WalletModal, {})] }));
13
46
  };
14
47
  exports.WalletModalProvider = WalletModalProvider;
15
48
  const useWalletModal = () => {
16
49
  const context = (0, react_1.useContext)(WalletModalContext);
17
50
  if (!context) {
18
- throw new Error('useWalletModal must be used within a WalletModalProvider');
51
+ throw new Error("useWalletModal must be used within a WalletModalProvider");
19
52
  }
20
53
  return context;
21
54
  };
@@ -3,4 +3,6 @@ export declare const ConnectedHeader: ({ wallet, onBack, }: {
3
3
  wallet: BaseWallet;
4
4
  onBack: () => void;
5
5
  }) => import("react/jsx-runtime").JSX.Element;
6
- export declare const ConnectedContent: () => import("react/jsx-runtime").JSX.Element;
6
+ export declare const ConnectedContent: ({ afterDisconnect, }: {
7
+ afterDisconnect: () => void;
8
+ }) => import("react/jsx-runtime").JSX.Element;
@@ -12,7 +12,7 @@ const ConnectedHeader = ({ wallet, onBack, }) => {
12
12
  return ((0, jsx_runtime_1.jsx)(react_1.ConnectModalHead, { title: wallet?.info?.prettyName || "", hasBackButton: true, onClose: close, onBack: onBack, closeButtonProps: { onClick: close } }));
13
13
  };
14
14
  exports.ConnectedHeader = ConnectedHeader;
15
- const ConnectedContent = () => {
15
+ const ConnectedContent = ({ afterDisconnect, }) => {
16
16
  const { currentChainName, currentWalletName } = (0, hooks_1.useWalletManager)();
17
17
  console.log({ currentChainName, currentWalletName });
18
18
  const { address, username, wallet } = (0, hooks_1.useChainWallet)(currentChainName, currentWalletName);
@@ -30,7 +30,7 @@ const ConnectedContent = () => {
30
30
  address: address,
31
31
  }, onDisconnect: async () => {
32
32
  await wallet.disconnect(currentChainName);
33
- close();
33
+ afterDisconnect();
34
34
  } }));
35
35
  };
36
36
  exports.ConnectedContent = ConnectedContent;
@@ -3,6 +3,7 @@ export declare const RejectHeader: ({ wallet, onBack, }: {
3
3
  wallet: BaseWallet;
4
4
  onBack: () => void;
5
5
  }) => import("react/jsx-runtime").JSX.Element;
6
- export declare const RejectContent: ({ wallet }: {
6
+ export declare const RejectContent: ({ wallet, onReconnect, }: {
7
7
  wallet: BaseWallet;
8
+ onReconnect: () => void;
8
9
  }) => import("react/jsx-runtime").JSX.Element;
@@ -4,16 +4,13 @@ exports.RejectContent = exports.RejectHeader = void 0;
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  const react_1 = require("@interchain-ui/react");
6
6
  const provider_1 = require("../provider");
7
- const hooks_1 = require("../../hooks");
8
7
  const utils_1 = require("../../utils");
9
8
  const RejectHeader = ({ wallet, onBack, }) => {
10
9
  const { close } = (0, provider_1.useWalletModal)();
11
- return ((0, jsx_runtime_1.jsx)(react_1.ConnectModalHead, { title: wallet.info.prettyName, hasBackButton: true, onClose: close, onBack: onBack, closeButtonProps: { onClick: close } }));
10
+ return ((0, jsx_runtime_1.jsx)(react_1.ConnectModalHead, { title: wallet?.info?.prettyName, hasBackButton: true, onClose: close, onBack: onBack, closeButtonProps: { onClick: close } }));
12
11
  };
13
12
  exports.RejectHeader = RejectHeader;
14
- const RejectContent = ({ wallet }) => {
15
- const walletManager = (0, hooks_1.useWalletManager)();
16
- const { close } = (0, provider_1.useWalletModal)();
17
- return ((0, jsx_runtime_1.jsx)(react_1.ConnectModalStatus, { status: "Rejected", wallet: (0, utils_1.getWalletInfo)(wallet), contentHeader: "Request Rejected", contentDesc: wallet.errorMessage || "Connection permission is denied.", onConnect: () => walletManager.connect(wallet.info.name, walletManager.currentChainName) }));
13
+ const RejectContent = ({ wallet, onReconnect, }) => {
14
+ return ((0, jsx_runtime_1.jsx)(react_1.ConnectModalStatus, { status: "Rejected", wallet: (0, utils_1.getWalletInfo)(wallet), contentHeader: "Request Rejected", contentDesc: wallet.errorMessage || "Connection permission is denied.", onConnect: onReconnect }));
18
15
  };
19
16
  exports.RejectContent = RejectContent;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@interchain-kit/react",
3
- "version": "0.0.1-beta.58",
3
+ "version": "0.0.1-beta.60",
4
4
  "author": "cosmology-tech <developers@cosmology.zone>",
5
5
  "description": "interchain-kit wallet connector react package",
6
6
  "main": "index.js",
@@ -33,7 +33,7 @@
33
33
  "keywords": [],
34
34
  "dependencies": {
35
35
  "@chain-registry/v2-types": "^0.53.40",
36
- "@interchain-kit/core": "0.0.1-beta.58",
36
+ "@interchain-kit/core": "0.0.1-beta.60",
37
37
  "@interchain-ui/react": "1.26.1",
38
38
  "@interchainjs/cosmos": "1.6.3",
39
39
  "@interchainjs/cosmos-types": "1.6.3",
@@ -46,5 +46,5 @@
46
46
  "react-dom": "^18.3.1",
47
47
  "zustand": "^5.0.3"
48
48
  },
49
- "gitHead": "3e181eabfedf82ee9321d10cf0d46d63a348da31"
49
+ "gitHead": "33f4215216b28d8aab9453421c7c89436b11c8df"
50
50
  }
@@ -8,7 +8,7 @@ class ChainWallet extends core_1.BaseWallet {
8
8
  disconnectWithState;
9
9
  getAccountWithState;
10
10
  constructor(originalWallet, connectWithState, disconnectWithState, getAccountWithState) {
11
- super(originalWallet.info);
11
+ super(originalWallet?.info);
12
12
  this.originalWallet = originalWallet;
13
13
  this.connectWithState = connectWithState;
14
14
  this.disconnectWithState = disconnectWithState;
package/store/index.js CHANGED
@@ -26,7 +26,7 @@ const createInterchainStore = (walletManager) => {
26
26
  chainWalletState.push({
27
27
  chainName: chain.chainName,
28
28
  walletName: wallet.info.name,
29
- walletState: null,
29
+ walletState: core_1.WalletState.Disconnected,
30
30
  rpcEndpoint: "",
31
31
  errorMessage: "",
32
32
  signerOption: undefined,
@@ -80,18 +80,18 @@ const createInterchainStore = (walletManager) => {
80
80
  draft.chains.push(newChain);
81
81
  const assetList = assetLists.find(a => a.chainName === newChain.chainName);
82
82
  draft.assetLists.push(assetList);
83
- }
84
- draft.wallets.forEach(w => {
85
- draft.chainWalletState.push({
86
- chainName: newChain.chainName,
87
- walletName: w.info.name,
88
- walletState: core_1.WalletState.Disconnected,
89
- rpcEndpoint: "",
90
- errorMessage: "",
91
- signerOption: undefined,
92
- account: undefined
83
+ draft.wallets.forEach(w => {
84
+ draft.chainWalletState.push({
85
+ chainName: newChain.chainName,
86
+ walletName: w.info.name,
87
+ walletState: core_1.WalletState.Disconnected,
88
+ rpcEndpoint: "",
89
+ errorMessage: "",
90
+ signerOption: signerOptions?.signing?.(newChain.chainName),
91
+ account: undefined
92
+ });
93
93
  });
94
- });
94
+ }
95
95
  draft.signerOptionMap[newChain.chainName] = signerOptions?.signing?.(newChain.chainName);
96
96
  draft.endpointOptionsMap[newChain.chainName] = endpointOptions?.endpoints?.[newChain.chainName];
97
97
  });
@@ -108,7 +108,12 @@ const createInterchainStore = (walletManager) => {
108
108
  get().updateChainWalletState(walletName, chainName, { walletState: core_1.WalletState.Connected });
109
109
  }
110
110
  catch (error) {
111
+ if (error.message === 'Request rejected') {
112
+ get().updateChainWalletState(walletName, chainName, { walletState: core_1.WalletState.Rejected, errorMessage: error.message });
113
+ return;
114
+ }
111
115
  get().updateChainWalletState(walletName, chainName, { walletState: core_1.WalletState.Disconnected, errorMessage: error.message });
116
+ throw error;
112
117
  }
113
118
  },
114
119
  disconnect: async (walletName, chainName) => {
@@ -125,6 +130,9 @@ const createInterchainStore = (walletManager) => {
125
130
  return account;
126
131
  },
127
132
  getRpcEndpoint: async (walletName, chainName) => {
133
+ const exist = get().getChainWalletState(walletName, chainName).rpcEndpoint;
134
+ if (exist)
135
+ return exist;
128
136
  const rpcEndpoint = await walletManager.getRpcEndpoint(walletName, chainName);
129
137
  get().updateChainWalletState(walletName, chainName, { rpcEndpoint });
130
138
  return rpcEndpoint;
package/utils/wallet.js CHANGED
@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.getWalletInfo = void 0;
4
4
  const getWalletInfo = (wallet) => {
5
5
  return {
6
- name: wallet.info.name,
7
- prettyName: wallet.info.prettyName,
8
- logo: wallet.info.logo,
6
+ name: wallet?.info?.name,
7
+ prettyName: wallet?.info?.prettyName,
8
+ logo: wallet?.info?.logo,
9
9
  mobileDisabled: true,
10
10
  };
11
11
  };