@dynamic-labs/sdk-react-core 3.0.0-alpha.3 → 3.0.0-alpha.30

package/src/lib/utils/hooks/useWalletEventListeners/useWalletEventListeners.js

@@ -1,6 +1,6 @@
 'use client'
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
-import { useMemo, useCallback } from 'react';
+import { useCallback, useMemo } from 'react';
 import { isSameAddress } from '@dynamic-labs/wallet-connector-core';
 import '@dynamic-labs/sdk-api-core';
 import { logger } from '../../../shared/logger.js';
@@ -14,8 +14,78 @@ import '../../../shared/utils/classes/storage/localStorage.js';
 import '../../../shared/utils/classes/storage/sessionStorage.js';
 import '@dynamic-labs/utils';
 import '../../../shared/consts/index.js';
-import '../../../events/dynamicEvents.js';
+import { useInternalDynamicEvents } from '../events/useDynamicEvents/useDynamicEvents.js';
 import { useWalletConnectorEvent } from '../events/useWalletConnectorEvent/useWalletConnectorEvent.js';
+import '@dynamic-labs/multi-wallet';
+import 'react-international-phone';
+import '../../../config/ApiEndpoint.js';
+import '@dynamic-labs/store';
+import '../../../locale/locale.js';
+import '../../../context/DynamicContext/DynamicContext.js';
+import '../../../context/CaptchaContext/CaptchaContext.js';
+import '../../../context/ErrorContext/ErrorContext.js';
+import '../../../context/AccessDeniedContext/AccessDeniedContext.js';
+import '../../../context/AccountExistsContext/AccountExistsContext.js';
+import '../../../context/UserWalletsContext/UserWalletsContext.js';
+import { dynamicEvents } from '../../../events/dynamicEvents.js';
+import '../../../context/VerificationContext/VerificationContext.js';
+import 'react-dom';
+import '../../../context/WalletContext/WalletContext.js';
+import '../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js';
+import '../../../context/ThemeContext/ThemeContext.js';
+import '../useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
+import '@dynamic-labs/types';
+import '../../../context/LoadingContext/LoadingContext.js';
+import 'yup';
+import '../../../context/MockContext/MockContext.js';
+import '../../../views/CollectUserDataView/useFields.js';
+import '../../../context/FieldsStateContext/FieldsStateContext.js';
+import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
+import '@dynamic-labs/rpc-providers';
+import 'react-i18next';
+import '../../../components/Accordion/components/AccordionItem/AccordionItem.js';
+import '../../../components/Alert/Alert.js';
+import '../../../components/ShadowDOM/ShadowDOM.js';
+import '../../../components/IconButton/IconButton.js';
+import '../../../components/InlineWidget/InlineWidget.js';
+import '../../../components/Input/Input.js';
+import '../../../components/IsBrowser/IsBrowser.js';
+import '../../../components/MenuList/Dropdown/Dropdown.js';
+import '../../../components/Transition/ZoomTransition/ZoomTransition.js';
+import '../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
+import '../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
+import '../../../components/Popper/Popper/Popper.js';
+import '../../../components/Popper/PopperContext/PopperContext.js';
+import 'react-focus-lock';
+import 'qrcode';
+import 'formik';
+import '../../../views/WalletList/WalletList.js';
+import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
+import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '@hcaptcha/react-hcaptcha';
+import '../../../context/FooterAnimationContext/index.js';
+import '../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../../context/MfaSettingsContext/MfaSettingsContext.js';
+import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
+import '../../../context/PasskeyContext/PasskeyContext.js';
+import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
+import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
+import '../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
+import '../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import '../../../../polyfills.js';
+import '../../../context/ErrorBoundary/ErrorBoundaryBase.js';
+import '../../../context/ErrorBoundary/ErrorBoundaryContext.js';
+import '../../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.js';
+import '../../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.js';
+import '../../../context/WidgetRegistry/WidgetRegistryContextProvider.js';
+import '../../../context/FundingContext/FundingContext.js';
+import '../../../context/SendBalanceContext/SendBalanceContext.js';
+import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
+import '../../../context/ConnectWithOtpContext/constants.js';
+import '../../../context/ReinitializeContext/ReinitializeContextProvider.js';
+import { logVerboseTroubleshootingMessage } from '../../functions/logVerboseTroubleshootingMessage/logVerboseTroubleshootingMessage.js';
 
 const useWalletEventListeners = ({ disconnectWallet, handleLogOut, multiWallet, multiWalletWidgetState, primaryWallet, secondaryWallets, selectedWalletConnector, selectedWalletWithAction, setSelectedWalletConnectorKey, setSelectedWalletWithAction, setMultiWalletWidgetState, user, setPrimaryWalletId, authMode, refreshConnectedWallet, }) => {
     useWalletConnectorEvent(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, 'disconnect', () => {
@@ -29,9 +99,46 @@ const useWalletEventListeners = ({ disconnectWallet, handleLogOut, multiWallet,
         }
         refreshConnectedWallet(primaryWallet.id, primaryWallet.connector);
     });
-    useWalletConnectorEvent(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, 'accountChange', ({ accounts }) => {
-        logger.debug('primary wallet account change', {
+    const handleAccountChangeWhenAwaitingAccountSwitch = useCallback((isPrimaryWallet, newAddress) => {
+        logger.debug('handleAccountChangeWhenAwaitingAccountSwitch', {
+            isPrimaryWallet,
+            newAddress,
+        });
+        const linkedSecondaryWallet = secondaryWallets.find((wallet) => isSameAddress(wallet.address, newAddress, wallet.chain));
+        logVerboseTroubleshootingMessage('[handleAccountChangeWhenAwaitingAccountSwitch]', { linkedSecondaryWallet });
+        // this means the user is linking a new account, so we need proof of ownership...
+        if (!linkedSecondaryWallet) {
+            setMultiWalletWidgetState('awaiting_signature', undefined, 'linking_new_wallet');
+            if (isPrimaryWallet && primaryWallet) {
+                setSelectedWalletConnectorKey(primaryWallet.connector.key);
+            }
+            return;
+        }
+        const isTryingToUpdateUnkownWallet = linkedSecondaryWallet.connector.key === 'unknown';
+        if (isTryingToUpdateUnkownWallet) {
+            //prompt the user to connect and sign with the wallet
+            dynamicEvents.emit('triggerConnectAndSign');
+            return;
+        }
+        // ...otherwise, the user is switching primary accounts betweeen the same wallet
+        setSelectedWalletWithAction(null);
+        setPrimaryWalletId(linkedSecondaryWallet.id);
+        setMultiWalletWidgetState('idle');
+    }, [
+        setMultiWalletWidgetState,
+        primaryWallet,
+        secondaryWallets,
+        setSelectedWalletConnectorKey,
+        setSelectedWalletWithAction,
+        setPrimaryWalletId,
+    ]);
+    const calculatePrimaryWalletMultiWalletStateFromAccounts = useCallback(({ accounts }) => {
+        logger.debug('calculatePrimaryWalletMultiWalletStateFromAccounts', {
             accounts,
+            authMode,
+            multiWallet,
+            multiWalletWidgetState,
+            primaryWallet,
         });
         // change the api here
         if (!primaryWallet)
@@ -71,6 +178,26 @@ const useWalletEventListeners = ({ disconnectWallet, handleLogOut, multiWallet,
             logger.error(`Unexpected multiWalletWidgetState (${multiWalletWidgetState}) and onAccountChange combination. Resetting state to idle.`);
             setMultiWalletWidgetState('idle');
         }
+    }, [
+        authMode,
+        handleAccountChangeWhenAwaitingAccountSwitch,
+        multiWallet,
+        multiWalletWidgetState,
+        primaryWallet,
+        refreshConnectedWallet,
+        secondaryWallets,
+        setMultiWalletWidgetState,
+        setPrimaryWalletId,
+        setSelectedWalletConnectorKey,
+        setSelectedWalletWithAction,
+        user,
+    ]);
+    useInternalDynamicEvents('triggerComputePrimaryWalletMultiWalletStateFromAccounts', calculatePrimaryWalletMultiWalletStateFromAccounts);
+    useWalletConnectorEvent(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector, 'accountChange', ({ accounts }) => {
+        logger.debug('primary wallet account change', {
+            accounts,
+        });
+        calculatePrimaryWalletMultiWalletStateFromAccounts({ accounts });
     });
     const uniqueNonPrimaryWallets = useMemo(() => {
         const primaryConnector = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector;
@@ -114,28 +241,6 @@ const useWalletEventListeners = ({ disconnectWallet, handleLogOut, multiWallet,
             }
         }
     });
-    const handleAccountChangeWhenAwaitingAccountSwitch = useCallback((isPrimaryWallet, newAddress) => {
-        const linkedSecondaryWallet = secondaryWallets.find((wallet) => isSameAddress(wallet.address, newAddress, wallet.chain));
-        // this means the user is linking a new account, so we need proof of ownership...
-        if (!linkedSecondaryWallet) {
-            setMultiWalletWidgetState('awaiting_signature', undefined, 'linking_new_wallet');
-            if (isPrimaryWallet && primaryWallet) {
-                setSelectedWalletConnectorKey(primaryWallet.connector.key);
-            }
-            return;
-        }
-        // ...otherwise, the user is switching primary accounts betweeen the same wallet
-        setSelectedWalletWithAction(null);
-        setPrimaryWalletId(linkedSecondaryWallet.id);
-        setMultiWalletWidgetState('idle');
-    }, [
-        setMultiWalletWidgetState,
-        primaryWallet,
-        secondaryWallets,
-        setSelectedWalletConnectorKey,
-        setSelectedWalletWithAction,
-        setPrimaryWalletId,
-    ]);
 };
 
 export { useWalletEventListeners };

package/src/lib/utils/hooks/useWalletItemActions/useWalletItemActions.cjs

@@ -9,7 +9,7 @@ var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 require('react');
 require('../../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/sdk-api-core');
-require('../../../shared/logger.cjs');
+var logger = require('../../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
 require('react/jsx-runtime');
 var ViewContext = require('../../../context/ViewContext/ViewContext.cjs');
@@ -30,15 +30,15 @@ require('../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/multi-wallet');
 require('react-international-phone');
 var requiresTwoStepAuthentication = require('../../functions/requiresTwoStepAuthentication/requiresTwoStepAuthentication.cjs');
-require('viem');
-require('viem/chains');
 require('@dynamic-labs/store');
+var logVerboseTroubleshootingMessage = require('../../functions/logVerboseTroubleshootingMessage/logVerboseTroubleshootingMessage.cjs');
 require('../../../locale/locale.cjs');
 require('../../../context/CaptchaContext/CaptchaContext.cjs');
 var useConnectAndSignSplitSteps = require('../authenticationHooks/useConnectAndSignSplitSteps/useConnectAndSignSplitSteps.cjs');
 require('../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
 require('../../../context/WalletContext/WalletContext.cjs');
+require('../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.cjs');
 require('../../../context/ThemeContext/ThemeContext.cjs');
 require('../useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
 require('@dynamic-labs/types');
@@ -82,6 +82,17 @@ require('../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWi
 require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
+require('../../../../polyfills.cjs');
+require('../../../context/ErrorBoundary/ErrorBoundaryBase.cjs');
+require('../../../context/ErrorBoundary/ErrorBoundaryContext.cjs');
+require('../../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.cjs');
+require('../../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.cjs');
+require('../../../context/WidgetRegistry/WidgetRegistryContextProvider.cjs');
+require('../../../context/FundingContext/FundingContext.cjs');
+require('../../../context/SendBalanceContext/SendBalanceContext.cjs');
+require('../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
+require('../../../context/ConnectWithOtpContext/constants.cjs');
+require('../../../context/ReinitializeContext/ReinitializeContextProvider.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.cjs');
 
 const useWalletItemActions = () => {
@@ -92,7 +103,11 @@ const useWalletItemActions = () => {
     const { onlyConnectUser } = useConnectAndSignSplitSteps.useConnectAndSignSplitSteps();
     const connectAndSignWallet = useConnectAndSign.useConnectAndSign();
     const handleCustodialWalletClick = (walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        logger.logger.debug('handleCustodialWalletClick', walletConnector);
         const twoStepAuthentication = requiresTwoStepAuthentication.requiresTwoStepAuthentication(walletConnector);
+        logVerboseTroubleshootingMessage.logVerboseTroubleshootingMessage('[handleCustodialWalletClick]', {
+            twoStepAuthentication,
+        });
         if (twoStepAuthentication) {
             setSelectedWalletConnectorKey(walletConnector.key);
             yield onlyConnectUser({
@@ -107,6 +122,7 @@ const useWalletItemActions = () => {
     });
     const handleMobileWalletClick = (walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         var _a;
+        logger.logger.debug('handleMobileWalletClick', walletConnector);
         setSelectedWalletConnectorKey(walletConnector.key);
         // We need to set to LS when about to verify phantom wallet on mobile
         // because the deeplink interrupts this code execution and then redirects back on a new tab.
@@ -126,10 +142,12 @@ const useWalletItemActions = () => {
         onlyConnectUser({ walletConnector });
     });
     const handleInstalledExtensionClick = (walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        logger.logger.debug('handleInstalledExtensionClick', walletConnector);
         setSelectedWalletConnectorKey(walletConnector.key);
         setMultiWalletWidgetState('awaiting_signature', undefined, 'linking_new_wallet');
     });
     const handleUninstalledClick = (walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        logger.logger.debug('handleUninstalledClick', walletConnector);
         setSelectedWalletConnectorKey(walletConnector.key);
         if (!walletConnector.canConnectViaQrCode) {
             setView('no-qr-not-installed');
@@ -151,8 +169,14 @@ const useWalletItemActions = () => {
         setError(undefined);
     });
     const handleAlreadyConnectedWallet = (walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        logger.logger.debug('handleAlreadyConnectedWallet', walletConnector);
         const connectedAccounts = yield walletConnector.getConnectedAccounts();
         const activeAccountAlreadyLinked = linkedWallets.find((wallet) => { var _a; return wallet.address.toLowerCase() === ((_a = connectedAccounts[0]) === null || _a === void 0 ? void 0 : _a.toLowerCase()); });
+        logVerboseTroubleshootingMessage.logVerboseTroubleshootingMessage('[handleAlreadyConnectedWallet]', {
+            activeAccountAlreadyLinked,
+            connectedAccounts,
+            linkedWallets,
+        });
         if (activeAccountAlreadyLinked) {
             setMultiWalletWidgetState('awaiting_account_switch', 'linking_new_wallet');
         }
@@ -182,6 +206,11 @@ const useWalletItemActions = () => {
         const { walletConnector, isInstalledOnBrowser } = wallet;
         const shouldEndWalletConnectorSession = walletConnector.connectedChain === 'FLOW' ||
             walletConnectorCore.isPhantomRedirectConnector(walletConnector);
+        logVerboseTroubleshootingMessage.logVerboseTroubleshootingMessage('[handleWalletItemClick]', {
+            mockedSDK,
+            shouldEndWalletConnectorSession,
+            wallet,
+        });
         if (mockedSDK)
             return;
         if (shouldEndWalletConnectorSession) {

package/src/lib/utils/hooks/useWalletItemActions/useWalletItemActions.js

@@ -5,7 +5,7 @@ import { isPhantomRedirectConnector } from '@dynamic-labs/wallet-connector-core'
 import 'react';
 import '../../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/sdk-api-core';
-import '../../../shared/logger.js';
+import { logger } from '../../../shared/logger.js';
 import '@dynamic-labs/iconic';
 import 'react/jsx-runtime';
 import { useViewContext } from '../../../context/ViewContext/ViewContext.js';
@@ -26,15 +26,15 @@ import '../../../config/ApiEndpoint.js';
 import '@dynamic-labs/multi-wallet';
 import 'react-international-phone';
 import { requiresTwoStepAuthentication } from '../../functions/requiresTwoStepAuthentication/requiresTwoStepAuthentication.js';
-import 'viem';
-import 'viem/chains';
 import '@dynamic-labs/store';
+import { logVerboseTroubleshootingMessage } from '../../functions/logVerboseTroubleshootingMessage/logVerboseTroubleshootingMessage.js';
 import '../../../locale/locale.js';
 import '../../../context/CaptchaContext/CaptchaContext.js';
 import { useConnectAndSignSplitSteps } from '../authenticationHooks/useConnectAndSignSplitSteps/useConnectAndSignSplitSteps.js';
 import '../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
 import '../../../context/WalletContext/WalletContext.js';
+import '../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js';
 import '../../../context/ThemeContext/ThemeContext.js';
 import '../useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
 import '@dynamic-labs/types';
@@ -78,6 +78,17 @@ import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWid
 import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import '../../../../polyfills.js';
+import '../../../context/ErrorBoundary/ErrorBoundaryBase.js';
+import '../../../context/ErrorBoundary/ErrorBoundaryContext.js';
+import '../../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.js';
+import '../../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.js';
+import '../../../context/WidgetRegistry/WidgetRegistryContextProvider.js';
+import '../../../context/FundingContext/FundingContext.js';
+import '../../../context/SendBalanceContext/SendBalanceContext.js';
+import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
+import '../../../context/ConnectWithOtpContext/constants.js';
+import '../../../context/ReinitializeContext/ReinitializeContextProvider.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.js';
 
 const useWalletItemActions = () => {
@@ -88,7 +99,11 @@ const useWalletItemActions = () => {
     const { onlyConnectUser } = useConnectAndSignSplitSteps();
     const connectAndSignWallet = useConnectAndSign();
     const handleCustodialWalletClick = (walletConnector) => __awaiter(void 0, void 0, void 0, function* () {
+        logger.debug('handleCustodialWalletClick', walletConnector);
         const twoStepAuthentication = requiresTwoStepAuthentication(walletConnector);
+        logVerboseTroubleshootingMessage('[handleCustodialWalletClick]', {
+            twoStepAuthentication,
+        });
         if (twoStepAuthentication) {
             setSelectedWalletConnectorKey(walletConnector.key);
             yield onlyConnectUser({
@@ -103,6 +118,7 @@ const useWalletItemActions = () => {
     });
     const handleMobileWalletClick = (walletConnector) => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
+        logger.debug('handleMobileWalletClick', walletConnector);
         setSelectedWalletConnectorKey(walletConnector.key);
         // We need to set to LS when about to verify phantom wallet on mobile
         // because the deeplink interrupts this code execution and then redirects back on a new tab.
@@ -122,10 +138,12 @@ const useWalletItemActions = () => {
         onlyConnectUser({ walletConnector });
     });
     const handleInstalledExtensionClick = (walletConnector) => __awaiter(void 0, void 0, void 0, function* () {
+        logger.debug('handleInstalledExtensionClick', walletConnector);
         setSelectedWalletConnectorKey(walletConnector.key);
         setMultiWalletWidgetState('awaiting_signature', undefined, 'linking_new_wallet');
     });
     const handleUninstalledClick = (walletConnector) => __awaiter(void 0, void 0, void 0, function* () {
+        logger.debug('handleUninstalledClick', walletConnector);
         setSelectedWalletConnectorKey(walletConnector.key);
         if (!walletConnector.canConnectViaQrCode) {
             setView('no-qr-not-installed');
@@ -147,8 +165,14 @@ const useWalletItemActions = () => {
         setError(undefined);
     });
     const handleAlreadyConnectedWallet = (walletConnector) => __awaiter(void 0, void 0, void 0, function* () {
+        logger.debug('handleAlreadyConnectedWallet', walletConnector);
         const connectedAccounts = yield walletConnector.getConnectedAccounts();
         const activeAccountAlreadyLinked = linkedWallets.find((wallet) => { var _a; return wallet.address.toLowerCase() === ((_a = connectedAccounts[0]) === null || _a === void 0 ? void 0 : _a.toLowerCase()); });
+        logVerboseTroubleshootingMessage('[handleAlreadyConnectedWallet]', {
+            activeAccountAlreadyLinked,
+            connectedAccounts,
+            linkedWallets,
+        });
         if (activeAccountAlreadyLinked) {
             setMultiWalletWidgetState('awaiting_account_switch', 'linking_new_wallet');
         }
@@ -178,6 +202,11 @@ const useWalletItemActions = () => {
         const { walletConnector, isInstalledOnBrowser } = wallet;
         const shouldEndWalletConnectorSession = walletConnector.connectedChain === 'FLOW' ||
             isPhantomRedirectConnector(walletConnector);
+        logVerboseTroubleshootingMessage('[handleWalletItemClick]', {
+            mockedSDK,
+            shouldEndWalletConnectorSession,
+            wallet,
+        });
         if (mockedSDK)
             return;
         if (shouldEndWalletConnectorSession) {

package/src/lib/utils/hooks/useWalletUiUtils/useWalletUiUtils.cjs

@@ -30,14 +30,13 @@ require('react-international-phone');
 require('../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/store');
 require('../../../locale/locale.cjs');
-require('viem');
-require('viem/chains');
 require('../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../../context/AccountExistsContext/AccountExistsContext.cjs');
 require('../../../context/UserWalletsContext/UserWalletsContext.cjs');
 require('../../../context/VerificationContext/VerificationContext.cjs');
 var useConfirmationModal = require('../useConfirmationModal/useConfirmationModal.cjs');
 require('../../../context/WalletContext/WalletContext.cjs');
+require('../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.cjs');
 require('../../../context/ThemeContext/ThemeContext.cjs');
 require('../useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
 require('@dynamic-labs/types');
@@ -49,6 +48,7 @@ require('../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../context/MfaSettingsContext/MfaSettingsContext.cjs');
+require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('react-dom');
 require('../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../components/IconButton/IconButton.cjs');
@@ -71,7 +71,6 @@ require('../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../../context/FooterAnimationContext/index.cjs');
-require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../context/PasskeyContext/PasskeyContext.cjs');
 var CreatePasswordModal = require('../../../modals/CreatePasswordModal/CreatePasswordModal.cjs');
@@ -81,6 +80,7 @@ require('../../../views/TransactionConfirmationView/helpers/transactionErrorMess
 require('../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
 var EnterPasswordModal = require('../../../modals/EnterPasswordModal/EnterPasswordModal.cjs');
 var SignMessageConfirmationModal = require('../../../modals/SignMessageConfirmationModal/SignMessageConfirmationModal.cjs');
+var SyncWalletPromptModal = require('../../../modals/SyncWalletPromptModal/SyncWalletPromptModal.cjs');
 var TransactionConfirmationModal = require('../../../modals/TransactionConfirmationModal/TransactionConfirmationModal.cjs');
 
 const useWalletUiUtils = ({ appLogoUrl, appName, getAppOrigin, hideEmbeddedWalletTransactionUIs = false, }) => {
@@ -98,34 +98,50 @@ const useWalletUiUtils = ({ appLogoUrl, appName, getAppOrigin, hideEmbeddedWalle
     const { modal: createPasswordModal, open: openCreatePassword } = useConfirmationModal.useConfirmationModal({
         elementId: 'dynamic-create-password',
     });
+    const { modal: syncWalletPromptModal, open: openSyncWalletPrompt } = useConfirmationModal.useConfirmationModal({
+        elementId: 'dynamic-sync-wallet',
+    });
     const shouldConfirmAction = React.useCallback(() => {
-        if (hideEmbeddedWalletTransactionUIs) {
-            return false;
-        }
         if (confirmationStateRef.current === 'disabled') {
             confirmationStateRef.current = 'enabled';
             return false;
         }
         return true;
-    }, [confirmationStateRef]);
-    const signMessage = React.useCallback(({ message, handler }) => {
-        if (!shouldConfirmAction()) {
+    }, [confirmationStateRef, hideEmbeddedWalletTransactionUIs]);
+    const signMessage = React.useCallback((_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ message, handler }) {
+        // prevent the modal from opening itself again
+        if (!shouldConfirmAction())
             return handler();
-        }
-        return openSignMessage((resolve, reject) => (jsxRuntime.jsx(SignMessageConfirmationModal.SignMessageConfirmationModal, { appLogoUrl: appLogoUrl, appName: appName, appOrigin: getAppOrigin(), message: message, handler: handler, onSignMessage: resolve, onReject: reject })));
-    }, [appLogoUrl, appName, getAppOrigin, openSignMessage, shouldConfirmAction]);
+        return openSignMessage((resolve, reject) => (jsxRuntime.jsx(SignMessageConfirmationModal.SignMessageConfirmationModal, { appLogoUrl: appLogoUrl, appName: appName, appOrigin: getAppOrigin(), message: message, handler: handler, onSignMessage: resolve, onReject: reject, hideModal: hideEmbeddedWalletTransactionUIs }))).then((signedMessage) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+            if (signedMessage === 'callHandlerOutsideModal')
+                return handler();
+            else
+                return signedMessage;
+        }));
+    }), [appLogoUrl, appName, getAppOrigin, openSignMessage, shouldConfirmAction]);
     const sendTransaction = React.useCallback((walletConnector, transaction) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        if (!shouldConfirmAction()) {
+        // prevent the modal from opening itself again
+        if (!shouldConfirmAction())
             return transaction.submit();
-        }
-        return openSendTransaction((resolve, reject) => (jsxRuntime.jsx(TransactionConfirmationModal.TransactionConfirmationModal, { copykey: 'dyn_send_transaction.confirmation.title', title: t('dyn_send_transaction.confirmation.title'), transaction: transaction, onTransactionResponseSuccess: resolve, onReject: reject, walletConnector: walletConnector })));
+        return openSendTransaction((resolve, reject) => (jsxRuntime.jsx(TransactionConfirmationModal.TransactionConfirmationModal, { copykey: 'dyn_send_transaction.confirmation.title', title: t('dyn_send_transaction.confirmation.title'), transaction: transaction, onTransactionResponseSuccess: resolve, onReject: reject, walletConnector: walletConnector, hideModal: hideEmbeddedWalletTransactionUIs }))).then((signedTransaction) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+            if (signedTransaction === 'callHandlerOutsideModal')
+                return transaction.submit();
+            else
+                return signedTransaction;
+        }));
     }), [openSendTransaction, shouldConfirmAction, t]);
-    const enterPassword = React.useCallback((_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ handler, closeView = true }) {
+    const enterPassword = React.useCallback((_b) => _tslib.__awaiter(void 0, [_b], void 0, function* ({ handler, closeView = true }) {
         return openEnterPassword((resolve, reject) => (jsxRuntime.jsx(EnterPasswordModal.EnterPasswordModal, { handler: handler, onResolve: resolve, onReject: reject, closeView: closeView })));
     }), [openEnterPassword]);
-    const createPassword = React.useCallback((_b) => _tslib.__awaiter(void 0, [_b], void 0, function* ({ closeView = true }) {
+    const createPassword = React.useCallback((_c) => _tslib.__awaiter(void 0, [_c], void 0, function* ({ closeView = true }) {
         return openCreatePassword((resolve, reject) => (jsxRuntime.jsx(CreatePasswordModal.CreatePasswordModal, { onResolve: resolve, onReject: reject, closeView: closeView })));
     }), [openCreatePassword]);
+    const syncWallet = React.useCallback((_d) => _tslib.__awaiter(void 0, [_d], void 0, function* ({ walletConnector, activeAddress, expectedAddress }) {
+        if (!activeAddress) {
+            return;
+        }
+        yield openSyncWalletPrompt((resolve) => (jsxRuntime.jsx(SyncWalletPromptModal.SyncWalletPromptModal, { onResolve: resolve, connector: walletConnector, expectedAddress: expectedAddress })));
+    }), [openSyncWalletPrompt]);
     const disabledConfirmationOnce = React.useCallback(() => {
         confirmationStateRef.current = 'disabled';
     }, []);
@@ -135,24 +151,28 @@ const useWalletUiUtils = ({ appLogoUrl, appName, getAppOrigin, hideEmbeddedWalle
         enterPassword,
         sendTransaction,
         signMessage,
+        syncWallet,
     }), [
         signMessage,
         disabledConfirmationOnce,
         sendTransaction,
         enterPassword,
         createPassword,
+        syncWallet,
     ]);
     return React.useMemo(() => [
         signMessageModal ||
             sendTransactionModal ||
             enterPasswordModal ||
-            createPasswordModal,
+            createPasswordModal ||
+            syncWalletPromptModal,
         walletUiUtils,
     ], [
         signMessageModal,
         sendTransactionModal,
         enterPasswordModal,
         createPasswordModal,
+        syncWalletPromptModal,
         walletUiUtils,
     ]);
 };