@dynamic-labs/sdk-react-core 3.4.4 → 3.4.5

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

@@ -66,3 +66,4 @@ export { useSyncMfaFlow } from './useSyncMfaFlow';
 export * from './useSmartWallets';
 export { useEmbeddedWalletSessionKeys } from './useEmbeddedWalletSessionKeys';
 export { useTelegramLogin } from './useTelegramLogin';
+export { useDebounce } from './useDebounce';

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

@@ -31,6 +31,7 @@ require('../../../locale/locale.cjs');
 var getWalletProvider = require('../../functions/getWalletProvider/getWalletProvider.cjs');
 var isConnectOnly = require('../authenticationHooks/helpers/isConnectOnly.cjs');
 var getWalletConnectorForWallet = require('../../functions/getWalletConnectorForWallet/getWalletConnectorForWallet.cjs');
+var useDebounce = require('../useDebounce/useDebounce.cjs');
 var updateUserWalletsFromConnectedWallets = require('./updateUserWalletsFromConnectedWallets/updateUserWalletsFromConnectedWallets.cjs');
 
 const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingOnConnectOnly, environmentId, primaryWalletId, setPrimaryWalletId, walletConnectorOptions, handleConnectedWallet, setShowAuthFlow, isBridgeFlow, user, }) => {
@@ -69,11 +70,10 @@ const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingO
         setPrimaryWalletId,
     ]);
     // The function to update and define the connectedWallets list.
-    // It uses walletConnector to get the current wallet address and network
-    // The address and network in the runtime are updated by the event listeners
-    // The event listeners are updating `connectedWallets` list.
-    // It should be called on the first render and when connectedWalletsInfo updates
-    const updateConnectedWalletsList = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    // It should be called on the first render, when connectedWalletsInfo updates and when walletConnectorOptions updates.
+    // To avoid unnecessary updates that are causing issues with connectors added asynchronously,
+    // we're debouncing this function
+    const updateConnectedWalletsList = useDebounce.useDebounce(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         const walletConnectors = walletConnectorOptions.map((wallet) => wallet.walletConnector);
         if (!walletConnectors.length) {
             return;
@@ -110,12 +110,7 @@ const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingO
             return walletObject;
         })))).filter((wallet) => Boolean(wallet));
         setConnectedWallets(updatedConnectedWallets);
-    }), [
-        connectedWalletsInfo,
-        disconnectWallet,
-        setConnectedWallets,
-        walletConnectorOptions,
-    ]);
+    }), 300);
     // Generate the connectedWallets list when connectedWalletsInfo (localStorage) or memoized wallet connector updates
     React.useEffect(() => {
         updateConnectedWalletsList();

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

@@ -27,6 +27,7 @@ import '../../../locale/locale.js';
 import { getWalletProvider } from '../../functions/getWalletProvider/getWalletProvider.js';
 import { isConnectOnly } from '../authenticationHooks/helpers/isConnectOnly.js';
 import { getWalletConnectorForWallet } from '../../functions/getWalletConnectorForWallet/getWalletConnectorForWallet.js';
+import { useDebounce } from '../useDebounce/useDebounce.js';
 import { updateUserWalletsFromConnectedWallets } from './updateUserWalletsFromConnectedWallets/updateUserWalletsFromConnectedWallets.js';
 
 const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingOnConnectOnly, environmentId, primaryWalletId, setPrimaryWalletId, walletConnectorOptions, handleConnectedWallet, setShowAuthFlow, isBridgeFlow, user, }) => {
@@ -65,11 +66,10 @@ const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingO
         setPrimaryWalletId,
     ]);
     // The function to update and define the connectedWallets list.
-    // It uses walletConnector to get the current wallet address and network
-    // The address and network in the runtime are updated by the event listeners
-    // The event listeners are updating `connectedWallets` list.
-    // It should be called on the first render and when connectedWalletsInfo updates
-    const updateConnectedWalletsList = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
+    // It should be called on the first render, when connectedWalletsInfo updates and when walletConnectorOptions updates.
+    // To avoid unnecessary updates that are causing issues with connectors added asynchronously,
+    // we're debouncing this function
+    const updateConnectedWalletsList = useDebounce(() => __awaiter(void 0, void 0, void 0, function* () {
         const walletConnectors = walletConnectorOptions.map((wallet) => wallet.walletConnector);
         if (!walletConnectors.length) {
             return;
@@ -106,12 +106,7 @@ const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingO
             return walletObject;
         })))).filter((wallet) => Boolean(wallet));
         setConnectedWallets(updatedConnectedWallets);
-    }), [
-        connectedWalletsInfo,
-        disconnectWallet,
-        setConnectedWallets,
-        walletConnectorOptions,
-    ]);
+    }), 300);
     // Generate the connectedWallets list when connectedWalletsInfo (localStorage) or memoized wallet connector updates
     useEffect(() => {
         updateConnectedWalletsList();

package/src/lib/utils/hooks/useDebounce/index.d.ts

@@ -0,0 +1 @@
+export { useDebounce } from './useDebounce';

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

@@ -0,0 +1,22 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+const useDebounce = (callback, timeout) => {
+    const timeoutId = React.useRef(null);
+    const callbackRef = React.useRef(callback);
+    callbackRef.current = callback;
+    return React.useCallback(((...params) => {
+        if (timeoutId.current) {
+            clearTimeout(timeoutId.current);
+        }
+        timeoutId.current = window.setTimeout(() => {
+            callbackRef.current(...params);
+        }, timeout);
+    }), [timeout]);
+};
+
+exports.useDebounce = useDebounce;

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

@@ -0,0 +1 @@
+export declare const useDebounce: <C extends (...params: any[]) => void>(callback: C, timeout: number) => C;

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

@@ -0,0 +1,18 @@
+'use client'
+import { useRef, useCallback } from 'react';
+
+const useDebounce = (callback, timeout) => {
+    const timeoutId = useRef(null);
+    const callbackRef = useRef(callback);
+    callbackRef.current = callback;
+    return useCallback(((...params) => {
+        if (timeoutId.current) {
+            clearTimeout(timeoutId.current);
+        }
+        timeoutId.current = window.setTimeout(() => {
+            callbackRef.current(...params);
+        }, timeout);
+    }), [timeout]);
+};
+
+export { useDebounce };

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

@@ -46,7 +46,7 @@ options) => {
         const callTimestamp = new Date().getTime();
         const diffFromLastCall = callTimestamp - lastCallTimestamp.current;
         if (diffFromLastCall < 5) {
-            logger.logger.warn('usePromise: Fetcher function was called in very quick succession. Please make sure the fetcher function is not synchronous and that you are not calling it inside a loop.', deps);
+            logger.logger.logVerboseTroubleshootingMessage('usePromise: Fetcher function was called in very quick succession. Please make sure the fetcher function is not synchronous and that you are not calling it inside a loop.', deps);
         }
         lastCallTimestamp.current = callTimestamp;
         setIsLoading(true);

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

@@ -42,7 +42,7 @@ options) => {
         const callTimestamp = new Date().getTime();
         const diffFromLastCall = callTimestamp - lastCallTimestamp.current;
         if (diffFromLastCall < 5) {
-            logger.warn('usePromise: Fetcher function was called in very quick succession. Please make sure the fetcher function is not synchronous and that you are not calling it inside a loop.', deps);
+            logger.logVerboseTroubleshootingMessage('usePromise: Fetcher function was called in very quick succession. Please make sure the fetcher function is not synchronous and that you are not calling it inside a loop.', deps);
         }
         lastCallTimestamp.current = callTimestamp;
         setIsLoading(true);

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

@@ -95,11 +95,13 @@ const socialProviders = [
     'apple',
     'coinbasesocial',
     'discord',
+    'epicgames',
     'facebook',
     'farcaster',
     'github',
     'google',
     'instagram',
+    'spotify',
     'telegram',
     'twitch',
     'twitter',

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

@@ -91,11 +91,13 @@ const socialProviders = [
     'apple',
     'coinbasesocial',
     'discord',
+    'epicgames',
     'facebook',
     'farcaster',
     'github',
     'google',
     'instagram',
+    'spotify',
     'telegram',
     'twitch',
     'twitter',

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

@@ -218,9 +218,13 @@ const useWalletItemActions = () => {
             yield walletConnector.endSession();
         }
         setLegacyIsVerifying(false);
+        const isMetamask = walletConnector.key === 'metamask';
         // in connect only we only allow one account to be connected in the same wallet
-        if (authMode !== 'connect-only') {
+        // also this is only a feature in MM
+        if (authMode !== 'connect-only' && isMetamask) {
             try {
+                setSelectedWalletConnectorKey(walletConnector.key);
+                setView('pending-connect');
                 yield walletConnector.chooseAccountsToConnect();
             }
             catch (error) {

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

@@ -214,9 +214,13 @@ const useWalletItemActions = () => {
             yield walletConnector.endSession();
         }
         setLegacyIsVerifying(false);
+        const isMetamask = walletConnector.key === 'metamask';
         // in connect only we only allow one account to be connected in the same wallet
-        if (authMode !== 'connect-only') {
+        // also this is only a feature in MM
+        if (authMode !== 'connect-only' && isMetamask) {
             try {
+                setSelectedWalletConnectorKey(walletConnector.key);
+                setView('pending-connect');
                 yield walletConnector.chooseAccountsToConnect();
             }
             catch (error) {

package/src/lib/views/MobileWalletRedirectView/MobileWalletRedirectView.cjs

@@ -6,9 +6,12 @@ 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');
 var utils = require('@dynamic-labs/utils');
+var walletBook = require('@dynamic-labs/wallet-book');
+var Icon = require('../../components/Icon/Icon.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
+var Typography = require('../../components/Typography/Typography.cjs');
+var TypographyButton = require('../../components/TypographyButton/TypographyButton.cjs');
 require('../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/sdk-api-core');
 require('../../shared/logger.cjs');
@@ -16,7 +19,6 @@ require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
 require('../../context/ViewContext/ViewContext.cjs');
 var externalLink = require('../../shared/assets/externalLink.cjs');
-var footerInfoIcon = require('../../shared/assets/footer-info-icon.cjs');
 require('../../utils/constants/colors.cjs');
 require('../../utils/constants/values.cjs');
 require('../../store/state/loadingAndLifecycle.cjs');
@@ -52,10 +54,7 @@ require('@dynamic-labs/rpc-providers');
 require('../../store/state/environmentId.cjs');
 require('../../store/state/walletConnectorOptions.cjs');
 require('../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
-var Alert = require('../../components/Alert/Alert.cjs');
-var Typography = require('../../components/Typography/Typography.cjs');
-var Icon = require('../../components/Icon/Icon.cjs');
-var TypographyButton = require('../../components/TypographyButton/TypographyButton.cjs');
+require('../../components/Alert/Alert.cjs');
 require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/InlineWidget/InlineWidget.cjs');
@@ -115,7 +114,7 @@ const MobileWalletRedirectView = ({ onRetry, }) => {
             height: pixelToRem.pixelToRem(size),
             width: pixelToRem.pixelToRem(size),
         } }));
-    return (jsxRuntime.jsxs("div", { className: 'mobile-wallet-redirect', children: [jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: makeIcon(94 * IconWithSpinner.iconRatio), iconSize: 94, isSpinning: true, className: 'mobile-wallet-redirect__icon-with-spinner' }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', className: 'mobile-wallet-redirect__copy-text', copykey: 'dyn_login.mobile_wallet_redirect.prompt', children: t('dyn_login.mobile_wallet_redirect.prompt') }), jsxRuntime.jsxs(TypographyButton.TypographyButton, { buttonVariant: 'brand-primary', typographyProps: { color: 'white', variant: 'button_secondary' }, onClick: onRetry, buttonPadding: 'small', children: [t('dyn_login.mobile_wallet_redirect.open_prompt'), ' ', selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name] }), jsxRuntime.jsx(Alert.Alert, { variant: 'info', className: 'mobile-wallet-redirect__alert', icon: jsxRuntime.jsx(footerInfoIcon.ReactComponent, {}), children: t('dyn_login.mobile_wallet_redirect.redirect_fail_message', {
+    return (jsxRuntime.jsxs("div", { className: 'mobile-wallet-redirect', children: [jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: makeIcon(94 * IconWithSpinner.iconRatio), iconSize: 94, isSpinning: true, className: 'mobile-wallet-redirect__icon-with-spinner' }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', className: 'mobile-wallet-redirect__copy-text', copykey: 'dyn_login.mobile_wallet_redirect.prompt', children: t('dyn_login.mobile_wallet_redirect.prompt') }), jsxRuntime.jsxs(TypographyButton.TypographyButton, { buttonVariant: 'brand-primary', typographyProps: { color: 'white', variant: 'button_secondary' }, onClick: onRetry, buttonPadding: 'small', children: [t('dyn_login.mobile_wallet_redirect.open_prompt'), ' ', selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name] }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', className: 'mobile-wallet-redirect__alert', children: t('dyn_login.mobile_wallet_redirect.redirect_fail_message', {
                     walletName: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name,
                 }) }), storeName && (jsxRuntime.jsxs("div", { className: 'mobile-wallet-redirect__wallet-app', onClick: openWalletApp, children: [jsxRuntime.jsxs("div", { className: 'mobile-wallet-redirect__wallet-app__group', children: [makeIcon(26), jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', weight: 'bold', children: [t('dyn_login.mobile_wallet_redirect.get_app_prompt'), ' ', selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name] })] }), jsxRuntime.jsxs("div", { className: 'mobile-wallet-redirect__wallet-app__group', children: [jsxRuntime.jsx(Typography.Typography, { className: 'mobile-wallet-redirect__wallet-app__group__app-store', variant: 'body_small', weight: 'bold', color: 'secondary', children: storeName }), jsxRuntime.jsx(Icon.Icon, { color: 'text-secondary', size: 'small', children: jsxRuntime.jsx(externalLink.ReactComponent, {}) })] })] }))] }));
 };

package/src/lib/views/MobileWalletRedirectView/MobileWalletRedirectView.js

@@ -2,9 +2,12 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useWalletBookContext, getWalletLinks, WalletIcon } from '@dynamic-labs/wallet-book';
 import { isIOS, isAndroid, isSamsungBrowser } from '@dynamic-labs/utils';
+import { useWalletBookContext, getWalletLinks, WalletIcon } from '@dynamic-labs/wallet-book';
+import { Icon } from '../../components/Icon/Icon.js';
 import { IconWithSpinner, iconRatio } from '../../components/IconWithSpinner/IconWithSpinner.js';
+import { Typography } from '../../components/Typography/Typography.js';
+import { TypographyButton } from '../../components/TypographyButton/TypographyButton.js';
 import '../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/sdk-api-core';
 import '../../shared/logger.js';
@@ -12,7 +15,6 @@ import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
 import '../../context/ViewContext/ViewContext.js';
 import { ReactComponent as SvgExternalLink } from '../../shared/assets/externalLink.js';
-import { ReactComponent as SvgFooterInfoIcon } from '../../shared/assets/footer-info-icon.js';
 import '../../utils/constants/colors.js';
 import '../../utils/constants/values.js';
 import '../../store/state/loadingAndLifecycle.js';
@@ -48,10 +50,7 @@ import '@dynamic-labs/rpc-providers';
 import '../../store/state/environmentId.js';
 import '../../store/state/walletConnectorOptions.js';
 import '../../components/Accordion/components/AccordionItem/AccordionItem.js';
-import { Alert } from '../../components/Alert/Alert.js';
-import { Typography } from '../../components/Typography/Typography.js';
-import { Icon } from '../../components/Icon/Icon.js';
-import { TypographyButton } from '../../components/TypographyButton/TypographyButton.js';
+import '../../components/Alert/Alert.js';
 import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/InlineWidget/InlineWidget.js';
@@ -111,7 +110,7 @@ const MobileWalletRedirectView = ({ onRetry, }) => {
             height: pixelToRem(size),
             width: pixelToRem(size),
         } }));
-    return (jsxs("div", { className: 'mobile-wallet-redirect', children: [jsx(IconWithSpinner, { Icon: makeIcon(94 * iconRatio), iconSize: 94, isSpinning: true, className: 'mobile-wallet-redirect__icon-with-spinner' }), jsx(Typography, { variant: 'body_normal', weight: 'regular', className: 'mobile-wallet-redirect__copy-text', copykey: 'dyn_login.mobile_wallet_redirect.prompt', children: t('dyn_login.mobile_wallet_redirect.prompt') }), jsxs(TypographyButton, { buttonVariant: 'brand-primary', typographyProps: { color: 'white', variant: 'button_secondary' }, onClick: onRetry, buttonPadding: 'small', children: [t('dyn_login.mobile_wallet_redirect.open_prompt'), ' ', selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name] }), jsx(Alert, { variant: 'info', className: 'mobile-wallet-redirect__alert', icon: jsx(SvgFooterInfoIcon, {}), children: t('dyn_login.mobile_wallet_redirect.redirect_fail_message', {
+    return (jsxs("div", { className: 'mobile-wallet-redirect', children: [jsx(IconWithSpinner, { Icon: makeIcon(94 * iconRatio), iconSize: 94, isSpinning: true, className: 'mobile-wallet-redirect__icon-with-spinner' }), jsx(Typography, { variant: 'body_normal', weight: 'regular', className: 'mobile-wallet-redirect__copy-text', copykey: 'dyn_login.mobile_wallet_redirect.prompt', children: t('dyn_login.mobile_wallet_redirect.prompt') }), jsxs(TypographyButton, { buttonVariant: 'brand-primary', typographyProps: { color: 'white', variant: 'button_secondary' }, onClick: onRetry, buttonPadding: 'small', children: [t('dyn_login.mobile_wallet_redirect.open_prompt'), ' ', selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name] }), jsx(Typography, { variant: 'body_small', color: 'secondary', className: 'mobile-wallet-redirect__alert', children: t('dyn_login.mobile_wallet_redirect.redirect_fail_message', {
                     walletName: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name,
                 }) }), storeName && (jsxs("div", { className: 'mobile-wallet-redirect__wallet-app', onClick: openWalletApp, children: [jsxs("div", { className: 'mobile-wallet-redirect__wallet-app__group', children: [makeIcon(26), jsxs(Typography, { variant: 'body_small', weight: 'bold', children: [t('dyn_login.mobile_wallet_redirect.get_app_prompt'), ' ', selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name] })] }), jsxs("div", { className: 'mobile-wallet-redirect__wallet-app__group', children: [jsx(Typography, { className: 'mobile-wallet-redirect__wallet-app__group__app-store', variant: 'body_small', weight: 'bold', color: 'secondary', children: storeName }), jsx(Icon, { color: 'text-secondary', size: 'small', children: jsx(SvgExternalLink, {}) })] })] }))] }));
 };

package/src/lib/widgets/DynamicEmbeddedWidget/DynamicEmbeddedAuthFlow/DynamicEmbeddedAuthFlow.cjs

@@ -84,17 +84,7 @@ var SandboxIndicatorWrapper = require('../../../components/SandboxIndicatorWrapp
 
 const DynamicEmbeddedAuthFlow = ({ background = 'none', className, style, }) => {
     const hide = useIsLoggedIn.useIsLoggedIn();
-    const { projectSettings, isRenderingEmbeddedAuthFlow, walletConnectorOptions, } = useInternalDynamicContext.useInternalDynamicContext();
-    // This is needed to make sure WalletConnect is initialized for users who are using
-    // universal links on mobile. This also happens in useShowAuthFlow, but since this
-    // is the embedded auth flow, that hook does not get called.
-    // Without initializing WalletConnect here, users end up hitting the iOS app store bug
-    // and are redirected to the app store, instead of the wallet
-    React.useEffect(() => {
-        var _a;
-        (_a = walletConnectorOptions
-            .find((wallet) => wallet.walletConnector.key === 'walletconnect')) === null || _a === void 0 ? void 0 : _a.walletConnector.init();
-    }, [walletConnectorOptions]);
+    const { projectSettings, isRenderingEmbeddedAuthFlow } = useInternalDynamicContext.useInternalDynamicContext();
     const { goToInitialView: resetAuthView } = ViewContext.useViewContext();
     // Reset view when user logs out
     React.useEffect(() => {

package/src/lib/widgets/DynamicEmbeddedWidget/DynamicEmbeddedAuthFlow/DynamicEmbeddedAuthFlow.js

@@ -80,17 +80,7 @@ import { SandboxIndicatorWrapper } from '../../../components/SandboxIndicatorWra
 
 const DynamicEmbeddedAuthFlow = ({ background = 'none', className, style, }) => {
     const hide = useIsLoggedIn();
-    const { projectSettings, isRenderingEmbeddedAuthFlow, walletConnectorOptions, } = useInternalDynamicContext();
-    // This is needed to make sure WalletConnect is initialized for users who are using
-    // universal links on mobile. This also happens in useShowAuthFlow, but since this
-    // is the embedded auth flow, that hook does not get called.
-    // Without initializing WalletConnect here, users end up hitting the iOS app store bug
-    // and are redirected to the app store, instead of the wallet
-    useEffect(() => {
-        var _a;
-        (_a = walletConnectorOptions
-            .find((wallet) => wallet.walletConnector.key === 'walletconnect')) === null || _a === void 0 ? void 0 : _a.walletConnector.init();
-    }, [walletConnectorOptions]);
+    const { projectSettings, isRenderingEmbeddedAuthFlow } = useInternalDynamicContext();
     const { goToInitialView: resetAuthView } = useViewContext();
     // Reset view when user logs out
     useEffect(() => {