@lifi/widget 2.1.2 → 2.2.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lifi/widget",
-  "version": "2.1.2",
+  "version": "2.2.0-beta.0",
   "description": "LI.FI Widget for cross-chain bridging and swapping. It will drive your multi-chain strategy and attract new users from everywhere.",
   "main": "./cjs/index.js",
   "module": "./index.js",
@@ -43,15 +43,15 @@
     "@ethersproject/address": "^5.7.0",
     "@ethersproject/experimental": "^5.7.0",
     "@ethersproject/providers": "^5.7.2",
-    "@lifi/sdk": "^2.1.0",
-    "@lifi/wallet-management": "^2.1.2",
-    "@mui/icons-material": "^5.11.16",
-    "@mui/lab": "^5.0.0-alpha.134",
-    "@mui/material": "^5.13.6",
+    "@lifi/sdk": "^2.1.3-beta.0",
+    "@lifi/wallet-management": "^2.2.0-beta.0",
+    "@mui/icons-material": "^5.13.7",
+    "@mui/lab": "^5.0.0-alpha.135",
+    "@mui/material": "^5.13.7",
     "@tanstack/react-query": "^4.29.19",
     "@tanstack/react-virtual": "^3.0.0-beta.54",
     "big.js": "^6.2.1",
-    "i18next": "^23.2.3",
+    "i18next": "^23.2.7",
     "i18next-browser-languagedetector": "^7.1.0",
     "microdiff": "^1.3.2",
     "mitt": "^3.0.0",
@@ -60,10 +60,10 @@
     "react-hook-form": "^7.45.1",
     "react-i18next": "^13.0.1",
     "react-intersection-observer": "^9.5.2",
-    "react-router-dom": "^6.14.0",
+    "react-router-dom": "^6.14.1",
     "react-timer-hook": "^3.0.6",
     "uuid": "^9.0.0",
-    "zustand": "^4.3.8"
+    "zustand": "^4.3.9"
   },
   "peerDependencies": {
     "@types/react": "^18.0.0",

package/pages/SelectWalletPage/SelectWalletPage.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { supportedWallets } from '@lifi/wallet-management';
 import { Avatar, Button, Container, DialogActions, DialogContent, DialogContentText, List, ListItemAvatar, } from '@mui/material';
-import { useCallback, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Dialog } from '../../components/Dialog';
 import { ListItemButton } from '../../components/ListItemButton';
@@ -13,9 +13,7 @@ export const SelectWalletPage = () => {
     const { navigateBack } = useNavigateBack();
     const { connect } = useWallet();
     const [walletIdentity, setWalletIdentity] = useState({ show: false });
-    // separate into installed and not installed wallets
-    const installedWallets = supportedWallets.filter((wallet) => wallet.installed());
-    const notInstalledWallets = supportedWallets.filter((wallet) => !wallet.installed() && wallet.name !== 'Default Wallet');
+    const [wallets, setWallets] = useState();
     const closeDialog = () => {
         setWalletIdentity((state) => ({
             ...state,
@@ -23,7 +21,7 @@ export const SelectWalletPage = () => {
         }));
     };
     const handleConnect = useCallback(async (wallet) => {
-        const identityCheckPassed = wallet.installed();
+        const identityCheckPassed = await wallet.installed();
         if (!identityCheckPassed) {
             setWalletIdentity({
                 show: true,
@@ -34,10 +32,19 @@ export const SelectWalletPage = () => {
         navigateBack();
         await connect(wallet);
     }, [connect, navigateBack]);
+    useEffect(() => {
+        Promise.all(supportedWallets.map((wallet) => wallet.installed())).then((installed) => {
+            // separate into installed and not installed wallets
+            const installedWallets = supportedWallets.filter((_, index) => installed[index]);
+            // always remove Default Wallet from not installed Wallets
+            const notInstalledWallets = supportedWallets.filter((wallet, index) => !installed[index] && wallet.name !== 'Default Wallet');
+            setWallets([...installedWallets, ...notInstalledWallets]);
+        });
+    }, []);
     return (_jsxs(Container, { disableGutters: true, children: [_jsx(List, { sx: {
                     paddingLeft: 1.5,
                     paddingRight: 1.5,
-                }, children: [...installedWallets, ...notInstalledWallets].map((wallet) => (_jsxs(ListItemButton, { onClick: () => handleConnect(wallet), children: [_jsx(ListItemAvatar, { children: _jsx(Avatar, { src: wallet.icon.src || wallet.icon, alt: wallet.name, children: wallet.name[0] }) }), _jsx(ListItemText, { primary: wallet.name })] }, wallet.name))) }), _jsxs(Dialog, { open: walletIdentity.show, onClose: closeDialog, children: [_jsx(DialogContent, { children: _jsx(DialogContentText, { children: t('wallet.extensionNotFound', {
+                }, children: wallets?.map((wallet) => (_jsxs(ListItemButton, { onClick: () => handleConnect(wallet), children: [_jsx(ListItemAvatar, { children: _jsx(Avatar, { src: wallet.icon.src || wallet.icon, alt: wallet.name, children: wallet.name[0] }) }), _jsx(ListItemText, { primary: wallet.name })] }, wallet.name))) }), _jsxs(Dialog, { open: walletIdentity.show, onClose: closeDialog, children: [_jsx(DialogContent, { children: _jsx(DialogContentText, { children: t('wallet.extensionNotFound', {
                                 name: walletIdentity.wallet?.name,
                             }) }) }), _jsx(DialogActions, { children: _jsx(Button, { variant: "contained", onClick: closeDialog, autoFocus: true, children: t('button.ok') }) })] })] }));
 };

package/pages/TransactionPage/StartTransactionButton.js

@@ -1,11 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { useWidgetConfig } from '../../providers';
 import { DefaultTransactionButton } from '../../components/DefaultTransactionButton';
 import { useFundsSufficiency, useGasSufficiency, useRoutes } from '../../hooks';
 import { useRouteExecutionStore } from '../../stores';
 export const StartTransactionButton = ({ onClick, route, text, loading, }) => {
+    const { sdkConfig } = useWidgetConfig();
+    const isMultisigSigner = sdkConfig?.multisigConfig?.isMultisigSigner;
     const { insufficientGas, isInitialLoading: isGasSufficiencyLoading } = useGasSufficiency(route);
     const { insufficientFunds, isInitialLoading: isFundsSufficiencyLoading } = useFundsSufficiency(route);
-    return (_jsx(DefaultTransactionButton, { onClick: onClick, text: text, disabled: insufficientFunds || !!insufficientGas?.length, loading: isFundsSufficiencyLoading || isGasSufficiencyLoading || loading }));
+    const shouldDisableButton = !isMultisigSigner && (insufficientFunds || !!insufficientGas?.length);
+    return (_jsx(DefaultTransactionButton, { onClick: onClick, text: text, disabled: shouldDisableButton, loading: isFundsSufficiencyLoading || isGasSufficiencyLoading || loading }));
 };
 export const StartInsurableTransactionButton = ({ onClick, text, route, loading, disabled, insurableRouteId }) => {
     const routeExecution = useRouteExecutionStore((state) => state.routes[insurableRouteId]);