@interchain-kit/react 0.0.1-beta.59 → 0.0.1-beta.61
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.
- package/esm/hooks/useChainWallet.js +1 -1
- package/esm/modal/modal.js +81 -63
- package/esm/modal/provider.js +2 -2
- package/esm/modal/views/Connected.js +2 -2
- package/esm/modal/views/Reject.js +3 -6
- package/esm/store/index.js +5 -0
- package/esm/utils/wallet.js +3 -3
- package/hooks/useChainWallet.js +1 -1
- package/modal/modal.d.ts +1 -2
- package/modal/modal.js +81 -61
- package/modal/provider.js +2 -35
- package/modal/views/Connected.d.ts +3 -1
- package/modal/views/Connected.js +2 -2
- package/modal/views/Reject.d.ts +2 -1
- package/modal/views/Reject.js +3 -6
- package/package.json +3 -3
- package/store/index.js +5 -0
- package/utils/wallet.js +3 -3
|
@@ -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(
|
|
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
|
};
|
package/esm/modal/modal.js
CHANGED
|
@@ -2,75 +2,93 @@ 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
|
-
const WalletModal = () => {
|
|
8
|
+
export const WalletModal = () => {
|
|
9
|
+
const { currentWalletName, currentChainName, wallets, connect, getAccount, setCurrentWalletName, } = useWalletManager();
|
|
9
10
|
const { modalIsOpen, open, close } = useWalletModal();
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
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
|
-
|
|
53
|
-
|
|
54
|
-
|
|
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
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
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
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
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
|
+
};
|
|
72
91
|
}
|
|
73
|
-
}, [
|
|
74
|
-
return (_jsx(ConnectModal, { isOpen: modalIsOpen, header:
|
|
92
|
+
}, [modalType]);
|
|
93
|
+
return (_jsx(ConnectModal, { isOpen: modalIsOpen, header: header, onOpen: open, onClose: close, children: content }));
|
|
75
94
|
};
|
|
76
|
-
export default WalletModal;
|
package/esm/modal/provider.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { createContext,
|
|
3
|
-
|
|
2
|
+
import { createContext, useContext, useState } from "react";
|
|
3
|
+
import { WalletModal } from "./modal";
|
|
4
4
|
const WalletModalContext = createContext(null);
|
|
5
5
|
export const WalletModalProvider = ({ children, }) => {
|
|
6
6
|
const [modalIsOpen, setModalIsOpen] = useState(false);
|
|
@@ -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
|
-
|
|
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
|
|
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
|
-
|
|
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
|
};
|
package/esm/store/index.js
CHANGED
|
@@ -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) => {
|
package/esm/utils/wallet.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
export const getWalletInfo = (wallet) => {
|
|
2
2
|
return {
|
|
3
|
-
name: wallet
|
|
4
|
-
prettyName: wallet
|
|
5
|
-
logo: wallet
|
|
3
|
+
name: wallet?.info?.name,
|
|
4
|
+
prettyName: wallet?.info?.prettyName,
|
|
5
|
+
logo: wallet?.info?.logo,
|
|
6
6
|
mobileDisabled: true,
|
|
7
7
|
};
|
|
8
8
|
};
|
package/hooks/useChainWallet.js
CHANGED
|
@@ -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(
|
|
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,2 +1 @@
|
|
|
1
|
-
declare const WalletModal: () => import("react/jsx-runtime").JSX.Element;
|
|
2
|
-
export default WalletModal;
|
|
1
|
+
export declare const WalletModal: () => import("react/jsx-runtime").JSX.Element;
|
package/modal/modal.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.WalletModal = void 0;
|
|
3
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
5
|
const views_1 = require("./views");
|
|
5
6
|
const provider_1 = require("./provider");
|
|
@@ -8,71 +9,90 @@ const react_1 = require("react");
|
|
|
8
9
|
const core_1 = require("@interchain-kit/core");
|
|
9
10
|
const react_2 = require("@interchain-ui/react");
|
|
10
11
|
const WalletModal = () => {
|
|
12
|
+
const { currentWalletName, currentChainName, wallets, connect, getAccount, setCurrentWalletName, } = (0, hooks_1.useWalletManager)();
|
|
11
13
|
const { modalIsOpen, open, close } = (0, provider_1.useWalletModal)();
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
if (walletToView?.info.mode === "extension" &&
|
|
21
|
-
!walletToView.isExtensionInstalled) {
|
|
22
|
-
setModalView({
|
|
23
|
-
header: ((0, jsx_runtime_1.jsx)(views_1.NotExistHeader, { wallet: walletToView, onBack: gotoWalletList })),
|
|
24
|
-
content: (0, jsx_runtime_1.jsx)(views_1.NotExistContent, { wallet: walletToView }),
|
|
25
|
-
});
|
|
26
|
-
return;
|
|
27
|
-
}
|
|
28
|
-
try {
|
|
29
|
-
if (walletToView?.info.mode === "wallet-connect") {
|
|
30
|
-
walletToView.setOnPairingUriCreatedCallback(() => {
|
|
31
|
-
setModalView({
|
|
32
|
-
header: (0, jsx_runtime_1.jsx)(views_1.QRCodeHeader, { onBack: gotoWalletList }),
|
|
33
|
-
content: (0, jsx_runtime_1.jsx)(views_1.QRCodeContent, {}),
|
|
34
|
-
});
|
|
35
|
-
});
|
|
36
|
-
walletToView.setPairingToConnect(wallet.pairing);
|
|
37
|
-
}
|
|
38
|
-
console.log({ currentChainName });
|
|
39
|
-
await connect(selectedWallet.info.name, currentChainName);
|
|
40
|
-
await getAccount(selectedWallet.info.name, currentChainName);
|
|
41
|
-
setModalView({
|
|
42
|
-
header: ((0, jsx_runtime_1.jsx)(views_1.ConnectedHeader, { wallet: walletToView, onBack: gotoWalletList })),
|
|
43
|
-
content: (0, jsx_runtime_1.jsx)(views_1.ConnectedContent, {}),
|
|
44
|
-
});
|
|
45
|
-
}
|
|
46
|
-
catch (error) {
|
|
47
|
-
console.log(error);
|
|
48
|
-
setModalView({
|
|
49
|
-
header: (0, jsx_runtime_1.jsx)(views_1.RejectHeader, { wallet: walletToView, onBack: gotoWalletList }),
|
|
50
|
-
content: (0, jsx_runtime_1.jsx)(views_1.RejectContent, { wallet: walletToView }),
|
|
51
|
-
});
|
|
52
|
-
}
|
|
14
|
+
const [modalType, setModalType] = (0, react_1.useState)("wallet-list");
|
|
15
|
+
const [selectedWallet, setSelectedWallet] = (0, react_1.useState)(null);
|
|
16
|
+
const { chain, status, wallet } = (0, hooks_1.useChainWallet)(currentChainName, currentWalletName);
|
|
17
|
+
const handleConnect = async () => {
|
|
18
|
+
return connect(selectedWallet?.info?.name, chain.chainName)
|
|
19
|
+
.then(() => getAccount(selectedWallet?.info?.name, chain.chainName))
|
|
20
|
+
.then(() => setSelectedWallet(null))
|
|
21
|
+
.catch(() => { });
|
|
53
22
|
};
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
23
|
+
(0, react_1.useEffect)(() => {
|
|
24
|
+
if (selectedWallet && currentWalletName && currentChainName) {
|
|
25
|
+
handleConnect();
|
|
26
|
+
}
|
|
27
|
+
}, [selectedWallet]);
|
|
28
|
+
const handleSelectWallet = async (selectedWallet) => {
|
|
29
|
+
setSelectedWallet(selectedWallet);
|
|
30
|
+
setCurrentWalletName(selectedWallet?.info?.name);
|
|
57
31
|
};
|
|
58
|
-
const [modalView, setModalView] = (0, react_1.useState)(defaultModalView);
|
|
59
|
-
const gotoWalletList = () => setModalView(defaultModalView);
|
|
60
|
-
const { status } = (0, hooks_1.useChainWallet)(currentChainName, currentWalletName);
|
|
61
32
|
(0, react_1.useEffect)(() => {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
33
|
+
if (!selectedWallet) {
|
|
34
|
+
setModalType("wallet-list");
|
|
35
|
+
}
|
|
36
|
+
if (currentWalletName && currentChainName) {
|
|
37
|
+
if (status === core_1.WalletState.Connecting) {
|
|
38
|
+
setModalType("connecting");
|
|
39
|
+
}
|
|
40
|
+
if (status === core_1.WalletState.Connected) {
|
|
41
|
+
setModalType("connected");
|
|
42
|
+
}
|
|
43
|
+
if (status === core_1.WalletState.Rejected) {
|
|
44
|
+
setModalType("reject");
|
|
45
|
+
}
|
|
46
|
+
if (status === core_1.WalletState.Disconnected) {
|
|
47
|
+
setModalType("wallet-list");
|
|
48
|
+
}
|
|
68
49
|
}
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
50
|
+
}, [
|
|
51
|
+
currentWalletName,
|
|
52
|
+
currentChainName,
|
|
53
|
+
status,
|
|
54
|
+
modalIsOpen,
|
|
55
|
+
selectedWallet,
|
|
56
|
+
]);
|
|
57
|
+
const goBackList = () => setModalType("wallet-list");
|
|
58
|
+
const { header, content } = (0, react_1.useMemo)(() => {
|
|
59
|
+
switch (modalType) {
|
|
60
|
+
case "wallet-list":
|
|
61
|
+
return {
|
|
62
|
+
header: (0, jsx_runtime_1.jsx)(views_1.WalletListHeader, {}),
|
|
63
|
+
content: (0, jsx_runtime_1.jsx)(views_1.WalletListContent, { onSelectWallet: handleSelectWallet }),
|
|
64
|
+
};
|
|
65
|
+
case "connecting":
|
|
66
|
+
return {
|
|
67
|
+
header: (0, jsx_runtime_1.jsx)(views_1.ConnectingHeader, { wallet: wallet, onBack: goBackList }),
|
|
68
|
+
content: (0, jsx_runtime_1.jsx)(views_1.ConnectingContent, { wallet: wallet }),
|
|
69
|
+
};
|
|
70
|
+
case "connected":
|
|
71
|
+
return {
|
|
72
|
+
header: (0, jsx_runtime_1.jsx)(views_1.ConnectedHeader, { wallet: wallet, onBack: goBackList }),
|
|
73
|
+
content: (0, jsx_runtime_1.jsx)(views_1.ConnectedContent, { afterDisconnect: goBackList }),
|
|
74
|
+
};
|
|
75
|
+
case "reject":
|
|
76
|
+
return {
|
|
77
|
+
header: (0, jsx_runtime_1.jsx)(views_1.RejectHeader, { wallet: wallet, onBack: goBackList }),
|
|
78
|
+
content: ((0, jsx_runtime_1.jsx)(views_1.RejectContent, { wallet: wallet, onReconnect: () => {
|
|
79
|
+
setModalType("connecting");
|
|
80
|
+
wallet.connect(chain.chainId);
|
|
81
|
+
wallet.getAccount(chain.chainId);
|
|
82
|
+
} })),
|
|
83
|
+
};
|
|
84
|
+
case "not-exist":
|
|
85
|
+
return {
|
|
86
|
+
header: (0, jsx_runtime_1.jsx)(views_1.NotExistHeader, { wallet: wallet, onBack: goBackList }),
|
|
87
|
+
content: (0, jsx_runtime_1.jsx)(views_1.NotExistContent, { wallet: wallet }),
|
|
88
|
+
};
|
|
89
|
+
case "qr-code":
|
|
90
|
+
return {
|
|
91
|
+
header: (0, jsx_runtime_1.jsx)(views_1.QRCodeHeader, { onBack: goBackList }),
|
|
92
|
+
content: (0, jsx_runtime_1.jsx)(views_1.QRCodeContent, {}),
|
|
93
|
+
};
|
|
74
94
|
}
|
|
75
|
-
}, [
|
|
76
|
-
return ((0, jsx_runtime_1.jsx)(react_2.ConnectModal, { isOpen: modalIsOpen, header:
|
|
95
|
+
}, [modalType]);
|
|
96
|
+
return ((0, jsx_runtime_1.jsx)(react_2.ConnectModal, { isOpen: modalIsOpen, header: header, onOpen: open, onClose: close, children: content }));
|
|
77
97
|
};
|
|
78
|
-
exports.
|
|
98
|
+
exports.WalletModal = WalletModal;
|
package/modal/provider.js
CHANGED
|
@@ -1,48 +1,15 @@
|
|
|
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
|
-
})();
|
|
35
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
3
|
exports.useWalletModal = exports.WalletModalProvider = void 0;
|
|
37
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
38
5
|
const react_1 = require("react");
|
|
39
|
-
const
|
|
6
|
+
const modal_1 = require("./modal");
|
|
40
7
|
const WalletModalContext = (0, react_1.createContext)(null);
|
|
41
8
|
const WalletModalProvider = ({ children, }) => {
|
|
42
9
|
const [modalIsOpen, setModalIsOpen] = (0, react_1.useState)(false);
|
|
43
10
|
const open = () => setModalIsOpen(true);
|
|
44
11
|
const close = () => setModalIsOpen(false);
|
|
45
|
-
return ((0, jsx_runtime_1.jsxs)(WalletModalContext.Provider, { value: { modalIsOpen, open, close }, children: [children, (0, jsx_runtime_1.jsx)(WalletModal, {})] }));
|
|
12
|
+
return ((0, jsx_runtime_1.jsxs)(WalletModalContext.Provider, { value: { modalIsOpen, open, close }, children: [children, (0, jsx_runtime_1.jsx)(modal_1.WalletModal, {})] }));
|
|
46
13
|
};
|
|
47
14
|
exports.WalletModalProvider = WalletModalProvider;
|
|
48
15
|
const useWalletModal = () => {
|
|
@@ -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: (
|
|
6
|
+
export declare const ConnectedContent: ({ afterDisconnect, }: {
|
|
7
|
+
afterDisconnect: () => void;
|
|
8
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
package/modal/views/Connected.js
CHANGED
|
@@ -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
|
-
|
|
33
|
+
afterDisconnect();
|
|
34
34
|
} }));
|
|
35
35
|
};
|
|
36
36
|
exports.ConnectedContent = ConnectedContent;
|
package/modal/views/Reject.d.ts
CHANGED
|
@@ -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;
|
package/modal/views/Reject.js
CHANGED
|
@@ -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
|
|
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
|
-
|
|
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.
|
|
3
|
+
"version": "0.0.1-beta.61",
|
|
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.
|
|
36
|
+
"@interchain-kit/core": "0.0.1-beta.61",
|
|
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": "
|
|
49
|
+
"gitHead": "c4c07b37826a5222545a4303eed2d60c19f31346"
|
|
50
50
|
}
|
package/store/index.js
CHANGED
|
@@ -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) => {
|
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
|
|
7
|
-
prettyName: wallet
|
|
8
|
-
logo: wallet
|
|
6
|
+
name: wallet?.info?.name,
|
|
7
|
+
prettyName: wallet?.info?.prettyName,
|
|
8
|
+
logo: wallet?.info?.logo,
|
|
9
9
|
mobileDisabled: true,
|
|
10
10
|
};
|
|
11
11
|
};
|