@suilend/sui-fe-next 2.0.29 → 2.0.31

package/contexts/WalletContext.d.ts

@@ -1,14 +1,14 @@
 import { Dispatch, PropsWithChildren, SetStateAction } from "react";
-import { type UiWallet } from "@mysten/dapp-kit-core";
+import { SignatureWithBytes } from "@mysten/sui/cryptography";
 import { DevInspectResults, SuiTransactionBlockResponse } from "@mysten/sui/jsonRpc";
 import { Transaction } from "@mysten/sui/transactions";
-import { type SignedTransaction, type WalletIcon, type WalletAccount as WalletStandardWalletAccount } from "@mysten/wallet-standard";
+import { ReadonlyUint8Array, WalletIcon, WalletAccount as WalletStandardWalletAccount, WalletWithRequiredFeatures } from "@mysten/wallet-standard";
 export declare enum WalletType {
     EXTENSION = "extension",
     WEB = "web"
 }
 export type WalletAccount = Omit<WalletStandardWalletAccount, "publicKey"> & {
-    publicKey?: WalletStandardWalletAccount["publicKey"];
+    publicKey?: ReadonlyUint8Array;
 };
 type WalletPlatform = "iOS" | "android" | "extension";
 export type Wallet = {
@@ -17,7 +17,7 @@ export type Wallet = {
     iconUrl?: WalletIcon;
     type: WalletType;
     downloadUrls?: Record<WalletPlatform, string | undefined>;
-    raw?: UiWallet;
+    raw?: WalletWithRequiredFeatures;
     walletConnect?: boolean;
 };
 declare enum WalletName {
@@ -51,7 +51,7 @@ export interface WalletContext {
     switchAccount: (account: WalletAccount, addressNameServiceName?: string) => void;
     address?: string;
     dryRunTransaction: (transaction: Transaction, setGasBudget?: boolean) => Promise<DevInspectResults>;
-    signExecuteAndWaitForTransaction: (transaction: Transaction, onSetGasBudget?: (transaction: Transaction) => void, onSign?: (signedTransaction: SignedTransaction) => void, onExecute?: (res: SuiTransactionBlockResponse) => void) => Promise<SuiTransactionBlockResponse>;
+    signExecuteAndWaitForTransaction: (transaction: Transaction, onSetGasBudget?: (transaction: Transaction) => void, onSign?: (signedTransaction: SignatureWithBytes) => void, onExecute?: (res: SuiTransactionBlockResponse) => void) => Promise<SuiTransactionBlockResponse>;
     isUsingLedger: boolean;
     setIsUsingLedger: (isUsingLedger: boolean) => void;
     signPersonalMessage: (message: Uint8Array) => Promise<{

package/contexts/WalletContext.jsx

@@ -57,11 +57,11 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 var _a, _b;
 import { useRouter } from "next/router";
 import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState, } from "react";
-import { createDAppKit, getWalletUniqueIdentifier, } from "@mysten/dapp-kit-core";
-import { DAppKitProvider, useCurrentAccount, useCurrentWallet, useDAppKit, useWalletConnection, useWallets, } from "@mysten/dapp-kit-react";
-import { SuiJsonRpcClient, } from "@mysten/sui/jsonRpc";
+import { WalletProvider as MystenWalletProvider, SuiClientProvider, createNetworkConfig, useSignPersonalMessage, } from "@mysten/dapp-kit";
+import { useAccounts, useConnectWallet, useCurrentAccount, useCurrentWallet, useDisconnectWallet, useSignTransaction, useSwitchAccount, useWallets, } from "@mysten/dapp-kit";
 import { Transaction } from "@mysten/sui/transactions";
 import { SUI_DECIMALS, toBase64 } from "@mysten/sui/utils";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import BigNumber from "bignumber.js";
 import { useLDClient } from "launchdarkly-react-client-sdk";
 import { useLocalStorage } from "usehooks-ts";
@@ -211,16 +211,16 @@ export var useWalletContext = function () { return useContext(WalletContext); };
 function Inner(_a) {
     var _b;
     var _this = this;
-    var _c, _d, _e, _f, _g;
+    var _c, _d, _e, _f;
     var appName = _a.appName, children = _a.children;
     var router = useRouter();
     var queryParams = (_b = {},
         _b[WalletContextQueryParams.WALLET] = router.query[WalletContextQueryParams.WALLET],
         _b);
-    var _h = useSettingsContext(), rpc = _h.rpc, suiClient = _h.suiClient;
+    var _g = useSettingsContext(), rpc = _g.rpc, suiClient = _g.suiClient;
     // Only used for wallet connect
-    var _j = useState(), universalConnector = _j[0], setUniversalConnector = _j[1];
-    var _k = useState(), session = _k[0], setSession = _k[1];
+    var _h = useState(), universalConnector = _h[0], setUniversalConnector = _h[1];
+    var _j = useState(), session = _j[0], setSession = _j[1];
     var sessionAddressWithout0x = (_e = (_d = (_c = session === null || session === void 0 ? void 0 : session.namespaces) === null || _c === void 0 ? void 0 : _c.sui) === null || _d === void 0 ? void 0 : _d.accounts) === null || _e === void 0 ? void 0 : _e[0];
     var sessionAddress = sessionAddressWithout0x
         ? sessionAddressWithout0x.split(":").pop()
@@ -242,7 +242,6 @@ function Inner(_a) {
     // Impersonated address
     var impersonatedAddress = queryParams[WalletContextQueryParams.WALLET];
     // Wallets
-    var dAppKit = useDAppKit();
     var wallets__installed = useWallets();
     var getInstalledWallet = useCallback(function (name) { return wallets__installed.find(function (w) { return w.name === name; }); }, [wallets__installed]);
     var wallets__extension_default = useMemo(function () {
@@ -352,8 +351,8 @@ function Inner(_a) {
         wallets__web,
     ]);
     // Wallet
-    var _l = useState(false), isConnectWalletDropdownOpen = _l[0], setIsConnectWalletDropdownOpen = _l[1];
-    var rawWallet = useCurrentWallet();
+    var _k = useState(false), isConnectWalletDropdownOpen = _k[0], setIsConnectWalletDropdownOpen = _k[1];
+    var rawWallet = useCurrentWallet().currentWallet;
     var wallet = useMemo(function () {
         if (sessionAddress) {
             return WALLET_CONNECT_WALLET;
@@ -362,9 +361,9 @@ function Inner(_a) {
             ? wallets.find(function (w) { return w.name === rawWallet.name; })
             : undefined;
     }, [rawWallet, wallets, sessionAddress]);
-    var connectWallet = dAppKit.connectWallet;
-    var disconnectWallet = dAppKit.disconnectWallet;
-    var signPersonalMessageRaw = dAppKit.signPersonalMessage;
+    var connectWallet = useConnectWallet().mutate;
+    var disconnectWallet = useDisconnectWallet().mutate;
+    var signPersonalMessageRaw = useSignPersonalMessage().mutateAsync;
     var walletConnectSignPersonalMessage = useCallback(function (message) { return __awaiter(_this, void 0, void 0, function () {
         var res;
         return __generator(this, function (_a) {
@@ -396,11 +395,18 @@ function Inner(_a) {
             }
             if (!_wallet.raw)
                 throw new Error("Missing wallet");
-            connectWallet({ wallet: _wallet.raw });
-            universalConnector.disconnect();
-            setSession(null);
-            showInfoToast("Connected ".concat(_wallet.name));
-            setIsConnectWalletDropdownOpen(false);
+            connectWallet({ wallet: _wallet.raw }, {
+                onSuccess: function () {
+                    universalConnector.disconnect();
+                    setSession(null);
+                    showInfoToast("Connected ".concat(_wallet.name));
+                    setIsConnectWalletDropdownOpen(false);
+                },
+                onError: function (err) {
+                    showErrorToast("Failed to connect ".concat(_wallet.name), err);
+                    console.error(err);
+                },
+            });
         }
         catch (err) {
             showErrorToast("Failed to connect ".concat(_wallet.name), err);
@@ -414,8 +420,15 @@ function Inner(_a) {
                 setSession(null);
             }
             else {
-                disconnectWallet();
-                showInfoToast("Disconnected wallet");
+                disconnectWallet(undefined, {
+                    onSuccess: function () {
+                        showInfoToast("Disconnected wallet");
+                    },
+                    onError: function (err) {
+                        showErrorToast("Failed to disconnect wallet", err);
+                        console.error(err);
+                    },
+                });
             }
         }
         catch (err) {
@@ -424,10 +437,10 @@ function Inner(_a) {
         }
     }, [sessionAddress, universalConnector, disconnectWallet]);
     // Accounts
-    var walletConnection = useWalletConnection();
-    var accountsRes = useMemo(function () { var _a, _b; return (_b = (_a = walletConnection.wallet) === null || _a === void 0 ? void 0 : _a.accounts) !== null && _b !== void 0 ? _b : []; }, [(_f = walletConnection.wallet) === null || _f === void 0 ? void 0 : _f.accounts]);
-    var accountRes = (_g = useCurrentAccount()) !== null && _g !== void 0 ? _g : undefined;
-    var walletConnectAccount = useMemo(function () {
+    var accountsRes = useAccounts();
+    var accountRes = (_f = useCurrentAccount()) !== null && _f !== void 0 ? _f : undefined;
+    var switchAccount = useSwitchAccount().mutate;
+    var account = useMemo(function () {
         return sessionAddress
             ? {
                 address: sessionAddress,
@@ -435,44 +448,63 @@ function Inner(_a) {
                 chains: ["sui:mainnet"],
                 features: [],
             }
-            : undefined;
-    }, [sessionAddress]);
-    var account = useMemo(function () { return walletConnectAccount !== null && walletConnectAccount !== void 0 ? walletConnectAccount : accountRes; }, [walletConnectAccount, accountRes]);
-    var accounts = useMemo(function () { return (walletConnectAccount ? [walletConnectAccount] : accountsRes); }, [walletConnectAccount, accountsRes]);
+            : accountRes;
+    }, [sessionAddress, accountRes]);
+    var accounts = useMemo(function () {
+        return sessionAddress
+            ? [
+                {
+                    address: sessionAddress,
+                    publicKey: new Uint8Array(),
+                    chains: ["sui:mainnet"],
+                    features: [],
+                },
+            ]
+            : accountsRes;
+    }, [sessionAddress, accountsRes]);
     var signPersonalMessage = useMemo(function () {
         return sessionAddress
             ? walletConnectSignPersonalMessage
-            : function (message) { return signPersonalMessageRaw({ message: message }); };
-    }, [sessionAddress, walletConnectSignPersonalMessage, signPersonalMessageRaw]);
-    var DAPP_KIT_STORAGE_KEY = "mysten-dapp-kit:selected-wallet-and-address";
+            : function (message) { return signPersonalMessageRaw({ message: message, account: account }); };
+    }, [
+        sessionAddress,
+        walletConnectSignPersonalMessage,
+        signPersonalMessageRaw,
+        account,
+    ]);
     var switchAccountWrapper = useCallback(function (_account, addressNameServiceName) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c;
         var accountLabel = (_b = (_a = _account === null || _account === void 0 ? void 0 : _account.label) !== null && _a !== void 0 ? _a : addressNameServiceName) !== null && _b !== void 0 ? _b : formatAddress(_account.address);
         try {
-            var matchingAccount = (_c = walletConnection.wallet) === null || _c === void 0 ? void 0 : _c.accounts.find(function (a) { return a.address === _account.address; });
-            if (!matchingAccount)
-                throw new Error("Account not found");
-            dAppKit.switchAccount({ account: matchingAccount });
-            // Persist to dapp-kit's own storage key so autoconnect restores
-            // the correct account on page reload.
-            try {
-                var walletId = getWalletUniqueIdentifier(matchingAccount);
-                var intents = (_d = walletConnection.supportedIntents) !== null && _d !== void 0 ? _d : [];
-                var storageValue = "".concat(walletId.replace(":", "_"), ":").concat(matchingAccount.address, ":").concat(intents.join(","), ":");
-                localStorage.setItem(DAPP_KIT_STORAGE_KEY, storageValue);
-            }
-            catch (_e) { }
-            showInfoToast("Switched to ".concat(accountLabel), {
-                description: (_account === null || _account === void 0 ? void 0 : _account.label)
-                    ? (addressNameServiceName !== null && addressNameServiceName !== void 0 ? addressNameServiceName : formatAddress(_account.address))
-                    : undefined,
+            switchAccount(
+            // only address needed here. rest for type compatibility
+            {
+                account: {
+                    address: _account.address,
+                    chains: _account.chains,
+                    features: _account.features,
+                    icon: _account.icon,
+                    label: _account.label,
+                    publicKey: (_c = _account.publicKey) !== null && _c !== void 0 ? _c : new Uint8Array(),
+                },
+            }, {
+                onSuccess: function () {
+                    showInfoToast("Switched to ".concat(accountLabel), {
+                        description: (_account === null || _account === void 0 ? void 0 : _account.label)
+                            ? (addressNameServiceName !== null && addressNameServiceName !== void 0 ? addressNameServiceName : formatAddress(_account.address))
+                            : undefined,
+                    });
+                },
+                onError: function (err) {
+                    showErrorToast("Failed to switch to ".concat(accountLabel), err);
+                },
             });
         }
         catch (err) {
             showErrorToast("Failed to switch to ".concat(accountLabel), err);
             console.error(err);
         }
-    }, [dAppKit, walletConnection]);
+    }, [switchAccount]);
     // LaunchDarkly
     var ldClient = useLDClient();
     var ldKeyRef = useRef(undefined);
@@ -531,6 +563,7 @@ function Inner(_a) {
     }, [impersonatedAddress, account === null || account === void 0 ? void 0 : account.address, wallet === null || wallet === void 0 ? void 0 : wallet.name, appName]);
     // Tx
     var gasBudget = useSettingsContext().gasBudget;
+    var signTransaction = useSignTransaction().mutateAsync;
     var dryRunTransaction = useCallback(function (transaction_1) {
         var args_1 = [];
         for (var _i = 1; _i < arguments.length; _i++) {
@@ -616,10 +649,12 @@ function Inner(_a) {
                         signature: res.signature,
                     };
                     return [3 /*break*/, 6];
-                case 4: return [4 /*yield*/, dAppKit.signTransaction({
+                case 4: return [4 /*yield*/, signTransaction({
                         transaction: transaction,
+                        chain: "sui:mainnet",
                     })];
                 case 5:
+                    // Sign
                     signedTransaction = _c.sent();
                     _c.label = 6;
                 case 6:
@@ -661,10 +696,10 @@ function Inner(_a) {
         account === null || account === void 0 ? void 0 : account.address,
         dryRunTransaction,
         suiClient,
-        dAppKit,
+        signTransaction,
     ]);
     // Using Ledger
-    var _m = useLocalStorage("isUsingLedger-".concat(impersonatedAddress !== null && impersonatedAddress !== void 0 ? impersonatedAddress : account === null || account === void 0 ? void 0 : account.address), false), isUsingLedger = _m[0], setIsUsingLedger = _m[1];
+    var _l = useLocalStorage("isUsingLedger-".concat(impersonatedAddress !== null && impersonatedAddress !== void 0 ? impersonatedAddress : account === null || account === void 0 ? void 0 : account.address), false), isUsingLedger = _l[0], setIsUsingLedger = _l[1];
     // Context
     var contextValue = useMemo(function () {
         return {
@@ -708,18 +743,15 @@ function Inner(_a) {
 export function WalletContextProvider(_a) {
     var appName = _a.appName, children = _a.children;
     var rpc = useSettingsContext().rpc;
-    var dAppKitInstance = useMemo(function () {
-        return createDAppKit({
-            networks: ["mainnet"],
-            createClient: function () {
-                return new SuiJsonRpcClient({ url: rpc.url, network: "mainnet" });
-            },
-            defaultNetwork: "mainnet",
-            autoConnect: true,
-            slushWalletConfig: { appName: appName },
-        });
-    }, [rpc.url, appName]);
-    return (<DAppKitProvider dAppKit={dAppKitInstance}>
-      <Inner appName={appName}>{children}</Inner>
-    </DAppKitProvider>);
+    var networkConfig = createNetworkConfig({
+        mainnet: { url: rpc.url },
+    }).networkConfig;
+    var queryClient = new QueryClient();
+    return (<QueryClientProvider client={queryClient}>
+      <SuiClientProvider networks={networkConfig} defaultNetwork="mainnet">
+        <MystenWalletProvider preferredWallets={DEFAULT_EXTENSION_WALLET_NAMES} autoConnect slushWallet={{ name: appName }}>
+          <Inner appName={appName}>{children}</Inner>
+        </MystenWalletProvider>
+      </SuiClientProvider>
+    </QueryClientProvider>);
 }

package/package.json

@@ -1 +1 @@
-{"name":"@suilend/sui-fe-next","version":"2.0.29","private":false,"description":"A collection of TypeScript frontend components and hooks","author":"Suilend","license":"MIT","main":"./index.js","exports":{".":"./index.js","./contexts/WalletContext":"./contexts/WalletContext.jsx","./contexts/SettingsContext":"./contexts/SettingsContext.jsx","./contexts":"./contexts/index.js","./fetchers":"./fetchers/index.js","./fetchers/useFetchBalances":"./fetchers/useFetchBalances.js","./hooks/useRefreshOnBalancesChange":"./hooks/useRefreshOnBalancesChange.js","./hooks/useLedgerHashDialog":"./hooks/useLedgerHashDialog.js","./hooks/useIsAndroid":"./hooks/useIsAndroid.jsx","./hooks/useCoinMetadataMap":"./hooks/useCoinMetadataMap.js","./hooks":"./hooks/index.js","./hooks/useIsTouchscreen":"./hooks/useIsTouchscreen.jsx","./hooks/useIsiOS":"./hooks/useIsiOS.jsx","./hooks/keypair":"./hooks/keypair.js","./lib/track":"./lib/track.js","./lib":"./lib/index.js","./lib/router":"./lib/router.js","./lib/toasts":"./lib/toasts.jsx","./lib/connector":"./lib/connector.js"},"types":"./index.js","scripts":{"build":"rm -rf ./dist && bun tsc","eslint":"eslint --fix src/","prettier":"prettier --write src/","lint":"bun eslint && bun prettier && bun tsc --noEmit","release":"bun run build && bun ./release.js && cd ./dist && npm publish --access public"},"repository":{"type":"git","url":"git+https://github.com/suilend/sui-fe.git"},"bugs":{"url":"https://github.com/suilend/sui-fe/issues"},"dependencies":{"@reown/appkit":"^1.8.10","@reown/appkit-common":"^1.8.10","@reown/appkit-universal-connector":"^1.8.10","@tanstack/react-query":"^5.60.2","@wallet-standard/app":"^1.1.0","@walletconnect/universal-provider":"2.21.1","bignumber.js":"^9.1.2","launchdarkly-react-client-sdk":"^3.6.0","lodash":"^4.17.21","mixpanel-browser":"^2.72.0","next":"^15.0.3","react":"18.3.1","react-dom":"18.3.1","react-responsive":"^10.0.0","sonner":"1.4.41","swr":"^2.2.5","tailwind-merge":"^2.5.4","usehooks-ts":"^3.1.1"},"devDependencies":{"@tsconfig/next":"^2.0.3","@types/lodash":"^4.17.13","@types/node":"^22.9.0","@types/react":"^18.3.12","@types/react-dom":"^18.3.1","@typescript-eslint/eslint-plugin":"^8.14.0","@typescript-eslint/parser":"^8.14.0","eslint":"^9.14.0","eslint-config-next":"^15.0.3","eslint-config-prettier":"^9.1.0","eslint-plugin-import":"^2.31.0","eslint-plugin-prettier":"^5.2.1","prettier":"^3.3.3","ts-node":"^10.9.2","typescript":"^5.6.3"},"peerDependencies":{"@mysten/dapp-kit-core":"1.0.3","@mysten/dapp-kit-react":"1.0.1","@mysten/sui":"2.3.1","@mysten/wallet-standard":"0.20.0","@suilend/sui-fe":"^2.0.10"}}
+{"name":"@suilend/sui-fe-next","version":"2.0.31","private":false,"description":"A collection of TypeScript frontend components and hooks","author":"Suilend","license":"MIT","main":"./index.js","exports":{".":"./index.js","./contexts/WalletContext":"./contexts/WalletContext.jsx","./contexts/SettingsContext":"./contexts/SettingsContext.jsx","./contexts":"./contexts/index.js","./fetchers":"./fetchers/index.js","./fetchers/useFetchBalances":"./fetchers/useFetchBalances.js","./hooks/useRefreshOnBalancesChange":"./hooks/useRefreshOnBalancesChange.js","./hooks/useLedgerHashDialog":"./hooks/useLedgerHashDialog.js","./hooks/useIsAndroid":"./hooks/useIsAndroid.jsx","./hooks/useCoinMetadataMap":"./hooks/useCoinMetadataMap.js","./hooks":"./hooks/index.js","./hooks/useIsTouchscreen":"./hooks/useIsTouchscreen.jsx","./hooks/useIsiOS":"./hooks/useIsiOS.jsx","./hooks/keypair":"./hooks/keypair.js","./lib/track":"./lib/track.js","./lib":"./lib/index.js","./lib/router":"./lib/router.js","./lib/toasts":"./lib/toasts.jsx","./lib/connector":"./lib/connector.js"},"types":"./index.js","scripts":{"build":"rm -rf ./dist && bun tsc","eslint":"eslint --fix src/","prettier":"prettier --write src/","lint":"bun eslint && bun prettier && bun tsc --noEmit","release":"bun run build && bun ./release.js && cd ./dist && npm publish --access public"},"repository":{"type":"git","url":"git+https://github.com/suilend/sui-fe.git"},"bugs":{"url":"https://github.com/suilend/sui-fe/issues"},"dependencies":{"@reown/appkit":"^1.8.10","@reown/appkit-common":"^1.8.10","@reown/appkit-universal-connector":"^1.8.10","@tanstack/react-query":"^5.60.2","@wallet-standard/app":"^1.1.0","@walletconnect/universal-provider":"2.21.1","bignumber.js":"^9.1.2","launchdarkly-react-client-sdk":"^3.6.0","lodash":"^4.17.21","mixpanel-browser":"^2.72.0","next":"^15.0.3","react":"18.3.1","react-dom":"18.3.1","react-responsive":"^10.0.0","sonner":"1.4.41","swr":"^2.2.5","tailwind-merge":"^2.5.4","usehooks-ts":"^3.1.1"},"devDependencies":{"@tsconfig/next":"^2.0.3","@types/lodash":"^4.17.13","@types/node":"^22.9.0","@types/react":"^18.3.12","@types/react-dom":"^18.3.1","@typescript-eslint/eslint-plugin":"^8.14.0","@typescript-eslint/parser":"^8.14.0","eslint":"^9.14.0","eslint-config-next":"^15.0.3","eslint-config-prettier":"^9.1.0","eslint-plugin-import":"^2.31.0","eslint-plugin-prettier":"^5.2.1","prettier":"^3.3.3","ts-node":"^10.9.2","typescript":"^5.6.3"},"peerDependencies":{"@mysten/dapp-kit":"0.19.4","@mysten/sui":"2.3.1","@mysten/wallet-standard":"0.19.2","@suilend/sui-fe":"^2.0.10"}}