@dynamic-labs/sdk-react-core 4.23.1 → 4.25.0

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

@@ -0,0 +1,173 @@
+'use client'
+import { __awaiter } from '../../../../../_virtual/_tslib.js';
+import { useMemo, useCallback, useEffect } from 'react';
+import '@dynamic-labs-sdk/client/core';
+import '@dynamic-labs/sdk-api-core';
+import '@dynamic-labs-sdk/client';
+import '../../../client/client.js';
+import '@dynamic-labs/utils';
+import '../../constants/values.js';
+import { USER_NOT_LOGGED_IN } from '../../constants/errors.js';
+import '@dynamic-labs/multi-wallet';
+import { logger } from '../../../shared/logger.js';
+import '../../constants/colors.js';
+import 'react-international-phone';
+import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
+import 'react/jsx-runtime';
+import '../../../context/ViewContext/ViewContext.js';
+import '@dynamic-labs/wallet-book';
+import '../../../shared/consts/index.js';
+import '../../../store/state/nonce/nonce.js';
+import '../../../config/ApiEndpoint.js';
+import { getProjectSettings } from '../../../store/state/projectSettings/projectSettings.js';
+import { logResponseError } from '../../../data/api/utils.js';
+import '../../../locale/locale.js';
+import '../../../store/state/dynamicContextProps/dynamicContextProps.js';
+import '../../../store/state/primaryWalletId/primaryWalletId.js';
+import '../../../store/state/connectedWalletsInfo/connectedWalletsInfo.js';
+import '../../../events/dynamicEvents.js';
+import { getUserProfile } from '../../../client/extension/user/getUserProfile/getUserProfile.js';
+import { getAuthMode } from '../../../store/state/authMode/authMode.js';
+import { useMultichainTokenBalancesState, setMultichainTokenBalanceVariable } from '../../../store/state/multichainBalances.js';
+import { useInternalDynamicEvents } from '../events/useDynamicEvents/useDynamicEvents.js';
+import { useGetMultichainTokenBalances } from '../useGetMultichainTokenBalances/useGetMultichainTokenBalances.js';
+
+// Hook to fetch multichain token balances with caching to reduce re-querying
+const useMultichainTokenBalances = (props) => {
+    const { requests, forceRefresh = false } = props;
+    const multichainTokenBalancesState = useMultichainTokenBalancesState();
+    const getMultichainTokenBalances = useGetMultichainTokenBalances();
+    const { multichainTokenBalances, isLoading, error, requestsKey } = multichainTokenBalancesState;
+    // Create a stable key for the current request to avoid unnecessary re-fetching
+    const currentRequestsKey = useMemo(() => {
+        if (!requests || requests.length === 0)
+            return '';
+        return JSON.stringify(requests
+            .map(({ chain, address, networkIds }) => ({
+            address,
+            chain,
+            networkIds: [...networkIds].sort((a, b) => a - b),
+        }))
+            .sort((a, b) => a.address.localeCompare(b.address)));
+    }, [requests]);
+    // Helper function to check if user is authorized to fetch balances
+    const checkAuthorization = useCallback(() => {
+        var _a;
+        const user = getUserProfile();
+        const authMode = getAuthMode();
+        if (authMode !== 'connect-only' && !user) {
+            setMultichainTokenBalanceVariable('error', USER_NOT_LOGGED_IN);
+            return false;
+        }
+        const projectSettings = getProjectSettings();
+        if (authMode === 'connect-only' &&
+            !((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.featureFlags) === null || _a === void 0 ? void 0 : _a.connectOnlyMultiAsset)) {
+            return false;
+        }
+        return true;
+    }, []);
+    // Helper function to check if we can use cached data
+    const canUseCachedData = useCallback((shouldForceRefresh) => !shouldForceRefresh &&
+        !forceRefresh &&
+        requestsKey === currentRequestsKey &&
+        Boolean(multichainTokenBalances) &&
+        !isLoading, [
+        forceRefresh,
+        requestsKey,
+        currentRequestsKey,
+        multichainTokenBalances,
+        isLoading,
+    ]);
+    // Helper function to validate requests
+    const validateRequests = useCallback(() => {
+        if (!requests || requests.length === 0) {
+            setMultichainTokenBalanceVariable('multichainTokenBalances', undefined);
+            setMultichainTokenBalanceVariable('requestsKey', undefined);
+            return false;
+        }
+        const isValidRequest = requests.every((request) => request.address &&
+            request.chain &&
+            request.networkIds &&
+            request.networkIds.length > 0);
+        if (isLoading || !isValidRequest) {
+            setMultichainTokenBalanceVariable('multichainTokenBalances', undefined);
+            setMultichainTokenBalanceVariable('requestsKey', undefined);
+            return false;
+        }
+        return true;
+    }, [requests, isLoading]);
+    // Helper function to get error message from exception
+    const getErrorMessage = useCallback((error) => {
+        if ((error === null || error === void 0 ? void 0 : error.code) === 429) {
+            return 'Too many requests fetching multichain balances';
+        }
+        if (error === null || error === void 0 ? void 0 : error.message) {
+            return error.message;
+        }
+        return 'error fetching multichain token balances';
+    }, []);
+    const fetchMultichainBalances = useCallback((...args_1) => __awaiter(void 0, [...args_1], void 0, function* (shouldForceRefresh = false) {
+        // Check authorization
+        if (!checkAuthorization()) {
+            return;
+        }
+        // Check if we can use cached data
+        if (canUseCachedData(shouldForceRefresh)) {
+            logger.logVerboseTroubleshootingMessage('[useMultichainTokenBalances] using cached data', { currentRequestsKey, requestsKey });
+            return;
+        }
+        // Validate requests
+        if (!validateRequests()) {
+            return;
+        }
+        logger.logVerboseTroubleshootingMessage('[useMultichainTokenBalances] will try to fetch multichain token balances', { isLoading, requests });
+        setMultichainTokenBalanceVariable('isLoading', true);
+        try {
+            const response = yield getMultichainTokenBalances(requests);
+            if (!response) {
+                setMultichainTokenBalanceVariable('error', 'No multichain token balances found');
+                return;
+            }
+            setMultichainTokenBalanceVariable('error', undefined);
+            setMultichainTokenBalanceVariable('multichainTokenBalances', response);
+            setMultichainTokenBalanceVariable('requestsKey', currentRequestsKey);
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        }
+        catch (e) {
+            const logLevel = (e === null || e === void 0 ? void 0 : e.code) >= 500 || (e === null || e === void 0 ? void 0 : e.code) < 400 ? 'error' : 'warn';
+            yield logResponseError(e, 'Error getting multichain token balances', logLevel);
+            const errorMessage = getErrorMessage(e);
+            setMultichainTokenBalanceVariable('error', errorMessage);
+        }
+        finally {
+            setMultichainTokenBalanceVariable('isLoading', false);
+        }
+    }), [
+        checkAuthorization,
+        canUseCachedData,
+        validateRequests,
+        getErrorMessage,
+        getMultichainTokenBalances,
+        requests,
+        currentRequestsKey,
+        requestsKey,
+        isLoading,
+    ]);
+    useInternalDynamicEvents('tokenBalancesChanged', () => fetchMultichainBalances(true));
+    // Only fetch when the requests key changes to prevent unnecessary re-fetching
+    useEffect(() => {
+        if (currentRequestsKey && requestsKey !== currentRequestsKey) {
+            fetchMultichainBalances();
+        }
+    }, [currentRequestsKey, fetchMultichainBalances, requestsKey]);
+    return {
+        error,
+        fetchMultichainBalances,
+        isError: Boolean(error),
+        isLoading,
+        multichainTokenBalances,
+    };
+};
+
+export { useMultichainTokenBalances };

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

@@ -99,6 +99,7 @@ require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFu
 require('../../../../index.cjs');
 var useWalletConnectorNetwork = require('../useWalletConnectorNetwork/useWalletConnectorNetwork.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 

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

@@ -95,6 +95,7 @@ import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFun
 import '../../../../index.js';
 import { useWalletConnectorNetwork } from '../useWalletConnectorNetwork/useWalletConnectorNetwork.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 

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

@@ -96,6 +96,7 @@ require('../../../context/OnrampContext/OnrampContext.cjs');
 require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 

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

@@ -92,6 +92,7 @@ import '../../../context/OnrampContext/OnrampContext.js';
 import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 

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

@@ -108,6 +108,7 @@ require('../../../context/OnrampContext/OnrampContext.cjs');
 require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 

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

@@ -104,6 +104,7 @@ import '../../../context/OnrampContext/OnrampContext.js';
 import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 

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

@@ -96,6 +96,7 @@ require('../../../context/OnrampContext/OnrampContext.cjs');
 require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useExchangeAccounts = require('../useExchangeAccounts/useExchangeAccounts.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');

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

@@ -92,6 +92,7 @@ import '../../../context/OnrampContext/OnrampContext.js';
 import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useExchangeAccounts } from '../useExchangeAccounts/useExchangeAccounts.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';

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

@@ -96,6 +96,7 @@ require('../../../context/OnrampContext/OnrampContext.cjs');
 require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 

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

@@ -92,6 +92,7 @@ import '../../../context/OnrampContext/OnrampContext.js';
 import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 

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

@@ -96,6 +96,7 @@ require('../../../context/OnrampContext/OnrampContext.cjs');
 require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 

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

@@ -92,6 +92,7 @@ import '../../../context/OnrampContext/OnrampContext.js';
 import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 

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

@@ -100,6 +100,7 @@ require('../../../../index.cjs');
 var useDynamicWaas = require('../useDynamicWaas/useDynamicWaas.cjs');
 var apiUrl = require('../../constants/waas/apiUrl.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useClientSessionKeys = require('../useClientSessionKeys/useClientSessionKeys.cjs');
 

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

@@ -96,6 +96,7 @@ import '../../../../index.js';
 import { configWaasWalletConnector } from '../useDynamicWaas/useDynamicWaas.js';
 import { DEFAULT_WAAS_API_URL } from '../../constants/waas/apiUrl.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useClientSessionKeys } from '../useClientSessionKeys/useClientSessionKeys.js';
 

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

@@ -97,6 +97,7 @@ require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFu
 require('../../../../index.cjs');
 require('../../functions/compareChains/compareChains.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 

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

@@ -93,6 +93,7 @@ import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFun
 import '../../../../index.js';
 import '../../functions/compareChains/compareChains.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 

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

@@ -101,6 +101,7 @@ require('../../../context/OnrampContext/OnrampContext.cjs');
 require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 

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

@@ -97,6 +97,7 @@ import '../../../context/OnrampContext/OnrampContext.js';
 import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 

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

@@ -8,6 +8,7 @@ var React = require('react');
 var sdkApiCore = require('@dynamic-labs/sdk-api-core');
 var types = require('@dynamic-labs/types');
 var utils = require('@dynamic-labs/utils');
+var CaptchaContext = require('../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../context/DynamicContext/DynamicContext.cjs');
 require('../../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
 var logger = require('../../../shared/logger.cjs');
@@ -20,7 +21,6 @@ require('../../constants/colors.cjs');
 require('../../constants/values.cjs');
 require('../../../shared/consts/index.cjs');
 var dynamicEvents = require('../../../events/dynamicEvents.cjs');
-require('../../../context/CaptchaContext/CaptchaContext.cjs');
 var ErrorContext = require('../../../context/ErrorContext/ErrorContext.cjs');
 var digestSHA256 = require('../../functions/digestSHA256/digestSHA256.cjs');
 var encodeBase64URL = require('../../functions/encodeBase64URL/encodeBase64URL.cjs');
@@ -106,6 +106,7 @@ require('../../../context/OnrampContext/OnrampContext.cjs');
 require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../index.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 
@@ -132,6 +133,7 @@ const socialProviders = [
 const providersRequiringPkce = ['twitter', 'github'];
 // Hook to handle common social auth logic (for social linking and social sign in)
 const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
+    var _a;
     const { environmentId, setShowAuthFlow, socialSettings, projectSettings, redirectUrl: defaultRedirectUrl, } = useInternalDynamicContext.useInternalDynamicContext();
     /**
      * Represents if the SDK will use a popup or redirect for social auth
@@ -147,6 +149,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
     });
     const [isProcessing, setIsProcessing] = React.useState(false);
     const [error, setError] = React.useState();
+    const { engageCaptcha } = CaptchaContext.useCaptchaContext();
     const clearError = React.useCallback(() => {
         setError(undefined);
         setContextError(undefined);
@@ -203,7 +206,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
             verifyFunction: () => apiCall(),
         });
     }), [handleError, initAuth, onSettled]);
-    const completeConnection = React.useCallback((_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ authMode, provider, state, authCode, captchaToken, verifier, telegramAuthToken, forceCreateUser = false, }) {
+    const completeConnection = React.useCallback((_b) => _tslib.__awaiter(void 0, [_b], void 0, function* ({ authMode, provider, state, authCode, captchaToken, verifier, telegramAuthToken, forceCreateUser = false, }) {
         try {
             let sessionPublicKey = undefined;
             utils.tracing.logEvent('oauth', 'completeConnection', utils.tracing.formatObject({
@@ -276,7 +279,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         shouldRegisterSessionKeysOnSignin,
         signInAccount,
     ]);
-    const connectWithFarcaster = React.useCallback((authMode_1, _b) => _tslib.__awaiter(void 0, [authMode_1, _b], void 0, function* (authMode, { captchaToken, redirectUrl }) {
+    const connectWithFarcaster = React.useCallback((authMode_1, _c) => _tslib.__awaiter(void 0, [authMode_1, _c], void 0, function* (authMode, { captchaToken, redirectUrl }) {
         let dynamicNonce;
         try {
             dynamicNonce = nonce.consumeNonce();
@@ -367,8 +370,8 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         shouldRegisterSessionKeysOnSignin,
         signInAccount,
     ]);
-    const connectSocialAccount = React.useCallback((_c) => _tslib.__awaiter(void 0, [_c], void 0, function* ({ authMode, provider, validator, captchaToken, triggerFundFromExchangeOnSuccess, redirectUrl, telegramAuthToken, showWidgetAfterConnection, }) {
-        var _d, _e;
+    const connectSocialAccount = React.useCallback((_d) => _tslib.__awaiter(void 0, [_d], void 0, function* ({ authMode, provider, validator, captchaToken, triggerFundFromExchangeOnSuccess, redirectUrl, telegramAuthToken, showWidgetAfterConnection, }) {
+        var _e, _f;
         clearError();
         setIsProcessing(true);
         if (!authMode) {
@@ -405,7 +408,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
             state,
             triggerFundFromExchangeOnSuccess,
         });
-        const loginUrlString = getOauthLoginUrl.getOauthLoginUrl((_d = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _d !== void 0 ? _d : [], provider);
+        const loginUrlString = getOauthLoginUrl.getOauthLoginUrl((_e = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _e !== void 0 ? _e : [], provider);
         if (!loginUrlString) {
             handleError(provider, types.SocialOAuthErrorCode.NO_OAUTH_URL, `Failed to get login url to connect social account: ${provider}`, { raiseAuthFailure: authMode === 'signin' });
             return;
@@ -421,7 +424,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         const isMobile = utils.isMobile();
         try {
             const authCode = yield utils.Oauth2Service.getOauthCode({
-                apiProvider: getProviderByType.getProviderByType((_e = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _e !== void 0 ? _e : [], provider),
+                apiProvider: getProviderByType.getProviderByType((_f = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _f !== void 0 ? _f : [], provider),
                 getOAuthResultFromApi: () => oauth.getOAuthResult(environmentId, provider, {
                     state,
                 }),
@@ -475,10 +478,32 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers,
         strategy,
     ]);
+    const checkCaptchaAndConnect = React.useCallback((props) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        var _g;
+        if (!((_g = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.hCaptcha) === null || _g === void 0 ? void 0 : _g.enabled)) {
+            connectSocialAccount(props);
+            return;
+        }
+        // Make sure the auth flow is visible
+        // it would still be hidden in headless scenarios
+        setShowAuthFlow(true, {
+            initializeWalletConnect: false,
+            performMultiWalletChecks: false,
+        });
+        engageCaptcha({
+            authMethod: 'social',
+            onCaptchaSuccess: (captchaToken) => _tslib.__awaiter(void 0, void 0, void 0, function* () { return connectSocialAccount(Object.assign(Object.assign({}, props), { captchaToken })); }),
+        });
+    }), [
+        setShowAuthFlow,
+        connectSocialAccount,
+        engageCaptcha,
+        (_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.hCaptcha) === null || _a === void 0 ? void 0 : _a.enabled,
+    ]);
     return React.useMemo(() => ({
         checkValidProvider,
         completeConnection,
-        connectSocialAccount,
+        connectSocialAccount: checkCaptchaAndConnect,
         error,
         handleError,
         isProcessing,
@@ -487,7 +512,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
     }), [
         checkValidProvider,
         completeConnection,
-        connectSocialAccount,
+        checkCaptchaAndConnect,
         error,
         handleError,
         isProcessing,

package/src/lib/utils/hooks/useSocialAuth/useSocialAuth.d.ts

@@ -29,7 +29,7 @@ export declare const useSocialAuth: ({ onSettled, onError, onFarcasterUrl, }: Us
         telegramAuthToken?: string | undefined;
         forceCreateUser?: boolean | undefined;
     }) => Promise<void>;
-    readonly connectSocialAccount: ({ authMode, provider, validator, captchaToken, triggerFundFromExchangeOnSuccess, redirectUrl, telegramAuthToken, showWidgetAfterConnection, }: ConnectSocialAccountProps) => Promise<void>;
+    readonly connectSocialAccount: (props: ConnectSocialAccountProps) => Promise<void>;
     readonly error: SocialOAuthError | undefined;
     readonly handleError: (provider: ProviderEnum | undefined, code: SocialOAuthErrorCode, message: string, options?: {
         raiseAuthFailure?: boolean | undefined;

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

@@ -4,6 +4,7 @@ import { useMemo, useState, useCallback } from 'react';
 import { ProviderEnum } from '@dynamic-labs/sdk-api-core';
 import { SocialOAuthErrorCode } from '@dynamic-labs/types';
 import { SocialAccountAlreadyExistsError, tracing, PlatformService, isMobile, Oauth2Service } from '@dynamic-labs/utils';
+import { useCaptchaContext } from '../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../context/DynamicContext/DynamicContext.js';
 import '../../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
 import { logger } from '../../../shared/logger.js';
@@ -16,7 +17,6 @@ import '../../constants/colors.js';
 import '../../constants/values.js';
 import '../../../shared/consts/index.js';
 import { dynamicEvents } from '../../../events/dynamicEvents.js';
-import '../../../context/CaptchaContext/CaptchaContext.js';
 import { useErrorContext } from '../../../context/ErrorContext/ErrorContext.js';
 import { digestSHA256 } from '../../functions/digestSHA256/digestSHA256.js';
 import { encodeBase64URL } from '../../functions/encodeBase64URL/encodeBase64URL.js';
@@ -102,6 +102,7 @@ import '../../../context/OnrampContext/OnrampContext.js';
 import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../index.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 
@@ -128,6 +129,7 @@ const socialProviders = [
 const providersRequiringPkce = ['twitter', 'github'];
 // Hook to handle common social auth logic (for social linking and social sign in)
 const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
+    var _a;
     const { environmentId, setShowAuthFlow, socialSettings, projectSettings, redirectUrl: defaultRedirectUrl, } = useInternalDynamicContext();
     /**
      * Represents if the SDK will use a popup or redirect for social auth
@@ -143,6 +145,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
     });
     const [isProcessing, setIsProcessing] = useState(false);
     const [error, setError] = useState();
+    const { engageCaptcha } = useCaptchaContext();
     const clearError = useCallback(() => {
         setError(undefined);
         setContextError(undefined);
@@ -199,7 +202,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
             verifyFunction: () => apiCall(),
         });
     }), [handleError, initAuth$1, onSettled]);
-    const completeConnection = useCallback((_a) => __awaiter(void 0, [_a], void 0, function* ({ authMode, provider, state, authCode, captchaToken, verifier, telegramAuthToken, forceCreateUser = false, }) {
+    const completeConnection = useCallback((_b) => __awaiter(void 0, [_b], void 0, function* ({ authMode, provider, state, authCode, captchaToken, verifier, telegramAuthToken, forceCreateUser = false, }) {
         try {
             let sessionPublicKey = undefined;
             tracing.logEvent('oauth', 'completeConnection', tracing.formatObject({
@@ -272,7 +275,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         shouldRegisterSessionKeysOnSignin,
         signInAccount,
     ]);
-    const connectWithFarcaster = useCallback((authMode_1, _b) => __awaiter(void 0, [authMode_1, _b], void 0, function* (authMode, { captchaToken, redirectUrl }) {
+    const connectWithFarcaster = useCallback((authMode_1, _c) => __awaiter(void 0, [authMode_1, _c], void 0, function* (authMode, { captchaToken, redirectUrl }) {
         let dynamicNonce;
         try {
             dynamicNonce = consumeNonce();
@@ -363,8 +366,8 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         shouldRegisterSessionKeysOnSignin,
         signInAccount,
     ]);
-    const connectSocialAccount = useCallback((_c) => __awaiter(void 0, [_c], void 0, function* ({ authMode, provider, validator, captchaToken, triggerFundFromExchangeOnSuccess, redirectUrl, telegramAuthToken, showWidgetAfterConnection, }) {
-        var _d, _e;
+    const connectSocialAccount = useCallback((_d) => __awaiter(void 0, [_d], void 0, function* ({ authMode, provider, validator, captchaToken, triggerFundFromExchangeOnSuccess, redirectUrl, telegramAuthToken, showWidgetAfterConnection, }) {
+        var _e, _f;
         clearError();
         setIsProcessing(true);
         if (!authMode) {
@@ -401,7 +404,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
             state,
             triggerFundFromExchangeOnSuccess,
         });
-        const loginUrlString = getOauthLoginUrl((_d = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _d !== void 0 ? _d : [], provider);
+        const loginUrlString = getOauthLoginUrl((_e = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _e !== void 0 ? _e : [], provider);
         if (!loginUrlString) {
             handleError(provider, SocialOAuthErrorCode.NO_OAUTH_URL, `Failed to get login url to connect social account: ${provider}`, { raiseAuthFailure: authMode === 'signin' });
             return;
@@ -417,7 +420,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         const isMobile$1 = isMobile();
         try {
             const authCode = yield Oauth2Service.getOauthCode({
-                apiProvider: getProviderByType((_e = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _e !== void 0 ? _e : [], provider),
+                apiProvider: getProviderByType((_f = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) !== null && _f !== void 0 ? _f : [], provider),
                 getOAuthResultFromApi: () => getOAuthResult(environmentId, provider, {
                     state,
                 }),
@@ -471,10 +474,32 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
         projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers,
         strategy,
     ]);
+    const checkCaptchaAndConnect = useCallback((props) => __awaiter(void 0, void 0, void 0, function* () {
+        var _g;
+        if (!((_g = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.hCaptcha) === null || _g === void 0 ? void 0 : _g.enabled)) {
+            connectSocialAccount(props);
+            return;
+        }
+        // Make sure the auth flow is visible
+        // it would still be hidden in headless scenarios
+        setShowAuthFlow(true, {
+            initializeWalletConnect: false,
+            performMultiWalletChecks: false,
+        });
+        engageCaptcha({
+            authMethod: 'social',
+            onCaptchaSuccess: (captchaToken) => __awaiter(void 0, void 0, void 0, function* () { return connectSocialAccount(Object.assign(Object.assign({}, props), { captchaToken })); }),
+        });
+    }), [
+        setShowAuthFlow,
+        connectSocialAccount,
+        engageCaptcha,
+        (_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.hCaptcha) === null || _a === void 0 ? void 0 : _a.enabled,
+    ]);
     return useMemo(() => ({
         checkValidProvider,
         completeConnection,
-        connectSocialAccount,
+        connectSocialAccount: checkCaptchaAndConnect,
         error,
         handleError,
         isProcessing,
@@ -483,7 +508,7 @@ const useSocialAuth = ({ onSettled, onError, onFarcasterUrl, }) => {
     }), [
         checkValidProvider,
         completeConnection,
-        connectSocialAccount,
+        checkCaptchaAndConnect,
         error,
         handleError,
         isProcessing,

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

@@ -94,6 +94,7 @@ require('../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../../store/state/connectorsInitializing/connectorsInitializing.cjs');
 require('../../../store/state/tokenBalances.cjs');
+require('../../../store/state/multichainBalances.cjs');
 require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useExchangeAccounts = require('../useExchangeAccounts/useExchangeAccounts.cjs');
 require('../../../components/InlineWidget/InlineWidget.cjs');

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

@@ -90,6 +90,7 @@ import '../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../../store/state/connectorsInitializing/connectorsInitializing.js';
 import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
 import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useExchangeAccounts } from '../useExchangeAccounts/useExchangeAccounts.js';
 import '../../../components/InlineWidget/InlineWidget.js';