@dynamic-labs/sdk-react-core 3.0.3 → 3.1.1

package/src/lib/views/MfaChooseDeviceView/MfaChooseDeviceView.js

@@ -122,7 +122,7 @@ const MfaChooseDeviceView = ({ isInitialSetup = true, }) => {
                             ? t('dyn_mfa.choose_device_view.title')
                             : t('dyn_mfa.choose_device_view.choose_another_method') }) }) }), jsxs("div", { className: 'mfa-choose-device-view__body', "data-testid": 'mfa-choose-device-view', children: [jsx(SvgSecureAccount, {}), jsx(Typography, { className: 'mfa-choose-device-view__copy', variant: 'body_normal', weight: 'regular', color: 'secondary', children: isInitialSetup
                             ? t('dyn_mfa.choose_device_view.select_options')
-                            : t('dyn_mfa.choose_device_view.choose_another_method_description') }), mfaOptions.map((option) => (jsxs(Button, { buttonClassName: 'mfa-choose-device-view__button', expanded: true, onClick: () => handleClick(option), children: [jsxs("div", { className: 'mfa-choose-device-view__button__header', children: [jsx(Typography, { copykey: option.labelKey, children: t(option.labelKey) }), jsx(SvgChevronLeft, { className: 'mfa-choose-device-view__icon--rotate' })] }), jsx(Typography, { className: 'mfa-choose-device-view__button__description', color: 'secondary', copykey: option.descriptionKey, children: t(option.descriptionKey) })] }, option.type))), jsx(TextButton, { className: 'mfa-choose-device-view__logout', onClick: handleLogOut, copykey: 'dyn_mfa.choose_device_view.logout', children: t('dyn_mfa.choose_device_view.logout') })] })] }));
+                            : t('dyn_mfa.choose_device_view.choose_another_method_description') }), mfaOptions.map((option) => (jsxs(Button, { buttonClassName: 'mfa-choose-device-view__button', expanded: true, onClick: () => handleClick(option), children: [jsxs("div", { className: 'mfa-choose-device-view__button__header', children: [jsx(Typography, { copykey: option.labelKey, color: 'primary', children: t(option.labelKey) }), jsx(SvgChevronLeft, { className: 'mfa-choose-device-view__icon--rotate' })] }), jsx(Typography, { className: 'mfa-choose-device-view__button__description', color: 'secondary', copykey: option.descriptionKey, children: t(option.descriptionKey) })] }, option.type))), jsx(TextButton, { className: 'mfa-choose-device-view__logout', onClick: handleLogOut, copykey: 'dyn_mfa.choose_device_view.logout', children: t('dyn_mfa.choose_device_view.logout') })] })] }));
 };
 
 export { MfaChooseDeviceView };

package/src/lib/views/viewToComponentMap.cjs

@@ -132,6 +132,7 @@ var MfaSecureDeviceHelpView = require('./MfaSecureDeviceHelpView/MfaSecureDevice
 var SandboxMaximumThresholdReached = require('./SandboxMaximumThresholdReached/SandboxMaximumThresholdReached.cjs');
 var GlobalWalletConfirmView = require('./GlobalWalletConfirmView/GlobalWalletConfirmView.cjs');
 var GlobalWalletInfoView = require('./GlobalWalletInfoView/GlobalWalletInfoView.cjs');
+var GlobalWalletMaliciousView = require('./GlobalWalletMaliciousView/GlobalWalletMaliciousView.cjs');
 require('../context/SendBalanceContext/SendBalanceContext.cjs');
 require('../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
 require('../context/ConnectWithOtpContext/constants.cjs');
@@ -161,6 +162,7 @@ const viewToComponentMap = {
     'gate-blocked-wallet': NoAccess.NoAccess,
     'global-wallet-confirm': GlobalWalletConfirmView.GlobalWalletConfirmView,
     'global-wallet-info': GlobalWalletInfoView.GlobalWalletInfoView,
+    'global-wallet-malicious': GlobalWalletMaliciousView.GlobalWalletMaliciousView,
     'login-with-email-or-wallet': LoginView.LoginView,
     'login-with-email-or-wallet-full-wallet-list': WalletList.WalletList,
     'login-with-email-verification': EmailVerification.EmailVerification,

package/src/lib/views/viewToComponentMap.d.ts

@@ -21,6 +21,7 @@ export declare const viewToComponentMap: {
     'gate-blocked-wallet': () => JSX.Element;
     'global-wallet-confirm': import("react").FC<import("./GlobalWalletConfirmView").GlobalWalletConfirmViewProps>;
     'global-wallet-info': () => JSX.Element;
+    'global-wallet-malicious': import("react").FC<import("./GlobalWalletMaliciousView/GlobalWalletMaliciousView").GlobalWalletMaliciousViewProps>;
     'login-with-email-or-wallet': () => JSX.Element;
     'login-with-email-or-wallet-full-wallet-list': ({ isWalletConnectList, }: import("./WalletList").WalletListProps) => JSX.Element;
     'login-with-email-verification': import("react").FC<import("./EmailVerification/EmailVerification").EmailVerificationProps>;

package/src/lib/views/viewToComponentMap.js

@@ -128,6 +128,7 @@ import { MfaSecureDeviceHelper } from './MfaSecureDeviceHelpView/MfaSecureDevice
 import { SandboxMaximumThresholdReached } from './SandboxMaximumThresholdReached/SandboxMaximumThresholdReached.js';
 import { GlobalWalletConfirmView } from './GlobalWalletConfirmView/GlobalWalletConfirmView.js';
 import { GlobalWalletInfoView } from './GlobalWalletInfoView/GlobalWalletInfoView.js';
+import { GlobalWalletMaliciousView } from './GlobalWalletMaliciousView/GlobalWalletMaliciousView.js';
 import '../context/SendBalanceContext/SendBalanceContext.js';
 import '../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
 import '../context/ConnectWithOtpContext/constants.js';
@@ -157,6 +158,7 @@ const viewToComponentMap = {
     'gate-blocked-wallet': NoAccess,
     'global-wallet-confirm': GlobalWalletConfirmView,
     'global-wallet-info': GlobalWalletInfoView,
+    'global-wallet-malicious': GlobalWalletMaliciousView,
     'login-with-email-or-wallet': LoginView,
     'login-with-email-or-wallet-full-wallet-list': WalletList,
     'login-with-email-verification': EmailVerification,

package/src/lib/widgets/DynamicBridgeWidget/DynamicBridgeWidget.cjs

@@ -6,6 +6,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var reactI18next = require('react-i18next');
+var walletBook = require('@dynamic-labs/wallet-book');
 require('../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../components/Alert/Alert.cjs');
 require('../../events/dynamicEvents.cjs');
@@ -16,7 +17,6 @@ require('@dynamic-labs/sdk-api-core');
 require('../../shared/logger.cjs');
 var getChainIcon = require('../../shared/utils/functions/chain/getChainIcon.cjs');
 require('@dynamic-labs/wallet-connector-core');
-require('@dynamic-labs/wallet-book');
 var shortenWalletAddress = require('../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.cjs');
 require('../../utils/constants/colors.cjs');
 require('../../utils/constants/values.cjs');
@@ -96,7 +96,7 @@ var InlineWidgetButton = require('../../components/InlineWidget/components/Inlin
 var InlineWidget = require('../../components/InlineWidget/InlineWidget.cjs');
 require('qrcode');
 
-const DynamicBridgeWidget = ({ className, variant = 'modal', }) => {
+const DynamicBridgeWidget = ({ className, variant = 'modal', iconVariant = 'chain', }) => {
     const { showAuthFlow, setShowBridgeWidget, bridgeChains, setShowAuthFlow, connectedWallets, } = useInternalDynamicContext.useInternalDynamicContext();
     const { widgetRef, inlineControlsRef } = DynamicBridgeWidgetContext.useDynamicBridgeWidgetContext();
     const { t } = reactI18next.useTranslation();
@@ -114,7 +114,7 @@ const DynamicBridgeWidget = ({ className, variant = 'modal', }) => {
                     const ChainIcon = getChainIcon.getChainIcon(chain);
                     const connectedChainWallets = connectedWallets.filter(({ chain: connectedChain }) => connectedChain === chain);
                     if (connectedChainWallets.length > 0) {
-                        return connectedChainWallets.map((wallet) => (jsxRuntime.jsx(InlineWidgetButton.InlineWidgetButton, { icon: jsxRuntime.jsx(ChainIcon, {}), onClick: () => setShowBridgeWidget(true), children: shortenWalletAddress.shortenWalletAddress(wallet.address, 3, 3) }, wallet.id)));
+                        return connectedChainWallets.map((wallet) => (jsxRuntime.jsx(InlineWidgetButton.InlineWidgetButton, { icon: iconVariant === 'wallet' ? (jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: wallet.connector.key })) : (jsxRuntime.jsx(ChainIcon, {})), onClick: () => setShowBridgeWidget(true), children: shortenWalletAddress.shortenWalletAddress(wallet.address) }, wallet.id)));
                     }
                     return (jsxRuntime.jsx(InlineWidgetButton.InlineWidgetButton, { icon: jsxRuntime.jsx(ChainIcon, {}), onClick: () => setShowAuthFlow(true), copykey: 'dyn_bridge.widget.connect', children: t('dyn_bridge.widget.connect') }, chain));
                 }) }), jsxRuntime.jsx(DynamicBridgeUserProfile.DynamicBridgeUserProfile, { variant: variant })] }));

package/src/lib/widgets/DynamicBridgeWidget/DynamicBridgeWidget.d.ts

@@ -3,5 +3,6 @@ export type DynamicBridgeWidgetVariant = 'modal' | 'dropdown';
 export type DynamicBridgeWidgetProps = {
     className?: string;
     variant?: DynamicBridgeWidgetVariant;
+    iconVariant?: 'wallet' | 'chain';
 };
 export declare const DynamicBridgeWidget: FC<DynamicBridgeWidgetProps>;

package/src/lib/widgets/DynamicBridgeWidget/DynamicBridgeWidget.js

@@ -2,6 +2,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
+import { WalletIcon } from '@dynamic-labs/wallet-book';
 import '../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../components/Alert/Alert.js';
 import '../../events/dynamicEvents.js';
@@ -12,7 +13,6 @@ import '@dynamic-labs/sdk-api-core';
 import '../../shared/logger.js';
 import { getChainIcon } from '../../shared/utils/functions/chain/getChainIcon.js';
 import '@dynamic-labs/wallet-connector-core';
-import '@dynamic-labs/wallet-book';
 import { shortenWalletAddress } from '../../shared/utils/functions/shortenWalletAddress/shortenWalletAddress.js';
 import '../../utils/constants/colors.js';
 import '../../utils/constants/values.js';
@@ -92,7 +92,7 @@ import { InlineWidgetButton } from '../../components/InlineWidget/components/Inl
 import { InlineWidget } from '../../components/InlineWidget/InlineWidget.js';
 import 'qrcode';
 
-const DynamicBridgeWidget = ({ className, variant = 'modal', }) => {
+const DynamicBridgeWidget = ({ className, variant = 'modal', iconVariant = 'chain', }) => {
     const { showAuthFlow, setShowBridgeWidget, bridgeChains, setShowAuthFlow, connectedWallets, } = useInternalDynamicContext();
     const { widgetRef, inlineControlsRef } = useDynamicBridgeWidgetContext();
     const { t } = useTranslation();
@@ -110,7 +110,7 @@ const DynamicBridgeWidget = ({ className, variant = 'modal', }) => {
                     const ChainIcon = getChainIcon(chain);
                     const connectedChainWallets = connectedWallets.filter(({ chain: connectedChain }) => connectedChain === chain);
                     if (connectedChainWallets.length > 0) {
-                        return connectedChainWallets.map((wallet) => (jsx(InlineWidgetButton, { icon: jsx(ChainIcon, {}), onClick: () => setShowBridgeWidget(true), children: shortenWalletAddress(wallet.address, 3, 3) }, wallet.id)));
+                        return connectedChainWallets.map((wallet) => (jsx(InlineWidgetButton, { icon: iconVariant === 'wallet' ? (jsx(WalletIcon, { walletKey: wallet.connector.key })) : (jsx(ChainIcon, {})), onClick: () => setShowBridgeWidget(true), children: shortenWalletAddress(wallet.address) }, wallet.id)));
                     }
                     return (jsx(InlineWidgetButton, { icon: jsx(ChainIcon, {}), onClick: () => setShowAuthFlow(true), copykey: 'dyn_bridge.widget.connect', children: t('dyn_bridge.widget.connect') }, chain));
                 }) }), jsx(DynamicBridgeUserProfile, { variant: variant })] }));

package/src/lib/widgets/DynamicWidget/views/GlobalWalletView/GlobalWalletView.cjs

@@ -75,6 +75,7 @@ var Input = require('../../../../components/Input/Input.cjs');
 require('../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
+var blockaid = require('../../../../data/api/transactions/blockaid.cjs');
 var GlobalWalletScanner = require('./scanner/GlobalWalletScanner.cjs');
 require('../../../../../polyfills.cjs');
 require('../../../../context/DynamicContext/DynamicContext.cjs');
@@ -107,6 +108,7 @@ const GlobalWalletView = () => {
     const { setShowAuthFlow } = useInternalDynamicContext.useInternalDynamicContext();
     const { primaryWallet } = useDynamicContext.useDynamicContext();
     const [walletConnectUri, setWalletConnectUri] = React.useState('');
+    const { environmentId } = useInternalDynamicContext.useInternalDynamicContext();
     const [bannerMessage, setBannerMessage] = React.useState(null);
     const [isScanned, setIsScanned] = React.useState(false);
     const { globalWallet } = 
@@ -123,11 +125,7 @@ const GlobalWalletView = () => {
                 goToInitialDynamicWidgetView();
         }, timeout);
     }, [goToInitialDynamicWidgetView]);
-    const popupConfirmView = () => {
-        const pendingPairing = globalWallet.getPendingPairing();
-        if (!pendingPairing)
-            throw new Error('No pending pairing');
-        const { name, url, icons } = pendingPairing.params.proposer.metadata;
+    const handleConfirmView = (pairingInfo) => {
         setView('global-wallet-confirm', {
             onCancel: () => {
                 setDynamicWidgetView('global-wallet');
@@ -138,6 +136,7 @@ const GlobalWalletView = () => {
                 setWalletConnectUri('');
             },
             onConfirm: () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+                var _a, _b;
                 try {
                     yield globalWallet.confirmPairing(true);
                     setDynamicWidgetView('global-wallet');
@@ -146,22 +145,46 @@ const GlobalWalletView = () => {
                         performMultiWalletChecks: false,
                     });
                     showBanner(t('global_wallet.banner.success', {
-                        name: name !== null && name !== void 0 ? name : t('global_wallet.the_dapp'),
+                        name: (_a = pairingInfo.name) !== null && _a !== void 0 ? _a : t('global_wallet.the_dapp'),
                     }), 'success');
                 }
                 catch (error) {
                     showBanner(t('global_wallet.banner.warning', {
-                        name: name !== null && name !== void 0 ? name : t('global_wallet.the_dapp'),
+                        name: (_b = pairingInfo.name) !== null && _b !== void 0 ? _b : t('global_wallet.the_dapp'),
                     }), 'error');
                 }
             }),
-            pairingInfo: { icons, name, url },
+            pairingInfo,
         });
         setShowAuthFlow(true, {
             ignoreIfIsEmbeddedWidget: false,
             performMultiWalletChecks: false,
         });
     };
+    const popupConfirmView = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        const pendingPairing = globalWallet.getPendingPairing();
+        if (!pendingPairing)
+            throw new Error('No pending pairing');
+        const { name, url, icons } = pendingPairing.params.proposer.metadata;
+        const pairingInfo = { icons, name, url };
+        const isDefinitelyMalicious = yield blockaid.isMaliciousUrl({ environmentId, url });
+        if (isDefinitelyMalicious || isDefinitelyMalicious === undefined) {
+            setView('global-wallet-malicious', {
+                maliciousSiteInfo: {
+                    isDefinitelyMalicious: isDefinitelyMalicious !== null && isDefinitelyMalicious !== void 0 ? isDefinitelyMalicious : false,
+                    proceedFlow: () => handleConfirmView(pairingInfo),
+                    url,
+                },
+            });
+            setShowAuthFlow(true, {
+                ignoreIfIsEmbeddedWidget: false,
+                performMultiWalletChecks: false,
+            });
+        }
+        else {
+            handleConfirmView(pairingInfo);
+        }
+    });
     const handlePairing = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         if (!walletConnectUri.startsWith('wc:')) {
             showBanner(t('global_wallet.banner.bad_input'), 'error');

package/src/lib/widgets/DynamicWidget/views/GlobalWalletView/GlobalWalletView.js

@@ -71,6 +71,7 @@ import { Input } from '../../../../components/Input/Input.js';
 import '../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../../context/PasskeyContext/PasskeyContext.js';
 import '../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import { isMaliciousUrl } from '../../../../data/api/transactions/blockaid.js';
 import { GlobalWalletScanner } from './scanner/GlobalWalletScanner.js';
 import '../../../../../polyfills.js';
 import '../../../../context/DynamicContext/DynamicContext.js';
@@ -103,6 +104,7 @@ const GlobalWalletView = () => {
     const { setShowAuthFlow } = useInternalDynamicContext();
     const { primaryWallet } = useDynamicContext();
     const [walletConnectUri, setWalletConnectUri] = useState('');
+    const { environmentId } = useInternalDynamicContext();
     const [bannerMessage, setBannerMessage] = useState(null);
     const [isScanned, setIsScanned] = useState(false);
     const { globalWallet } = 
@@ -119,11 +121,7 @@ const GlobalWalletView = () => {
                 goToInitialDynamicWidgetView();
         }, timeout);
     }, [goToInitialDynamicWidgetView]);
-    const popupConfirmView = () => {
-        const pendingPairing = globalWallet.getPendingPairing();
-        if (!pendingPairing)
-            throw new Error('No pending pairing');
-        const { name, url, icons } = pendingPairing.params.proposer.metadata;
+    const handleConfirmView = (pairingInfo) => {
         setView('global-wallet-confirm', {
             onCancel: () => {
                 setDynamicWidgetView('global-wallet');
@@ -134,6 +132,7 @@ const GlobalWalletView = () => {
                 setWalletConnectUri('');
             },
             onConfirm: () => __awaiter(void 0, void 0, void 0, function* () {
+                var _a, _b;
                 try {
                     yield globalWallet.confirmPairing(true);
                     setDynamicWidgetView('global-wallet');
@@ -142,22 +141,46 @@ const GlobalWalletView = () => {
                         performMultiWalletChecks: false,
                     });
                     showBanner(t('global_wallet.banner.success', {
-                        name: name !== null && name !== void 0 ? name : t('global_wallet.the_dapp'),
+                        name: (_a = pairingInfo.name) !== null && _a !== void 0 ? _a : t('global_wallet.the_dapp'),
                     }), 'success');
                 }
                 catch (error) {
                     showBanner(t('global_wallet.banner.warning', {
-                        name: name !== null && name !== void 0 ? name : t('global_wallet.the_dapp'),
+                        name: (_b = pairingInfo.name) !== null && _b !== void 0 ? _b : t('global_wallet.the_dapp'),
                     }), 'error');
                 }
             }),
-            pairingInfo: { icons, name, url },
+            pairingInfo,
         });
         setShowAuthFlow(true, {
             ignoreIfIsEmbeddedWidget: false,
             performMultiWalletChecks: false,
         });
     };
+    const popupConfirmView = () => __awaiter(void 0, void 0, void 0, function* () {
+        const pendingPairing = globalWallet.getPendingPairing();
+        if (!pendingPairing)
+            throw new Error('No pending pairing');
+        const { name, url, icons } = pendingPairing.params.proposer.metadata;
+        const pairingInfo = { icons, name, url };
+        const isDefinitelyMalicious = yield isMaliciousUrl({ environmentId, url });
+        if (isDefinitelyMalicious || isDefinitelyMalicious === undefined) {
+            setView('global-wallet-malicious', {
+                maliciousSiteInfo: {
+                    isDefinitelyMalicious: isDefinitelyMalicious !== null && isDefinitelyMalicious !== void 0 ? isDefinitelyMalicious : false,
+                    proceedFlow: () => handleConfirmView(pairingInfo),
+                    url,
+                },
+            });
+            setShowAuthFlow(true, {
+                ignoreIfIsEmbeddedWidget: false,
+                performMultiWalletChecks: false,
+            });
+        }
+        else {
+            handleConfirmView(pairingInfo);
+        }
+    });
     const handlePairing = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
         if (!walletConnectUri.startsWith('wc:')) {
             showBanner(t('global_wallet.banner.bad_input'), 'error');