@dynamic-labs/sdk-react-core 4.12.0 → 4.12.2-preview.0

package/src/lib/widgets/DynamicWidget/components/ActiveWalletInformation/ActiveWalletInformation.cjs

@@ -188,7 +188,7 @@ const ActiveWalletInformation = ({ isLoading = false, }) => {
         }
     };
     if (isLoading) {
-        return jsxRuntime.jsx(Skeleton.Skeleton, {});
+        return (jsxRuntime.jsxs("div", { className: 'active-wallet-information-container active-wallet-information-container--loading', "data-testid": 'active-wallet-information', children: [jsxRuntime.jsx("div", { className: 'active-wallet-information active-wallet-information--loading', children: jsxRuntime.jsxs("div", { className: 'active-wallet-information__header', children: [jsxRuntime.jsx("div", { className: 'active-wallet-information__avatar', children: jsxRuntime.jsx("div", { className: 'active-wallet-information__wallet-img', children: jsxRuntime.jsx(Skeleton.Skeleton, { className: 'active-wallet-information__skeleton-avatar' }) }) }), jsxRuntime.jsxs("div", { className: 'active-wallet-information__details', children: [jsxRuntime.jsxs("div", { className: 'active-wallet-information__addresses-container active-wallet-information__addresses-container--loading', children: [jsxRuntime.jsx("div", { className: 'active-wallet-information__handle-row', children: jsxRuntime.jsx(Skeleton.Skeleton, { className: 'active-wallet-information__skeleton-handle' }) }), jsxRuntime.jsx("div", { className: 'active-wallet-information__handle-row', children: jsxRuntime.jsx(Skeleton.Skeleton, { className: 'active-wallet-information__skeleton-address' }) })] }), !shouldHideNetwork && (jsxRuntime.jsx("div", { className: 'active-wallet-information__network-picker', children: jsxRuntime.jsx(Skeleton.Skeleton, { className: 'active-wallet-information__skeleton-network' }) }))] })] }) }), jsxRuntime.jsx(ActiveWalletBalance.ActiveWalletBalance, { isLoading: isLoading })] }));
     }
     return (jsxRuntime.jsxs("div", { className: 'active-wallet-information-container', "data-testid": 'active-wallet-information', children: [jsxRuntime.jsxs("div", { className: 'active-wallet-information', children: [jsxRuntime.jsxs("div", { className: 'active-wallet-information__header', children: [jsxRuntime.jsx("div", { className: 'active-wallet-information__avatar', children: (nameService === null || nameService === void 0 ? void 0 : nameService.avatar) ? (jsxRuntime.jsx("div", { className: 'active-wallet-information__avatar__name-service', children: jsxRuntime.jsx("img", { src: nameService === null || nameService === void 0 ? void 0 : nameService.avatar, alt: '' }) })) : (jsxRuntime.jsx("div", { className: 'active-wallet-information__wallet-img', children: jsxRuntime.jsx(AuthProviderIcon.AuthProviderIcon, { iconSize: ICON_SIZE }) })) }), jsxRuntime.jsxs("div", { className: 'active-wallet-information__details', children: [jsxRuntime.jsx("div", { className: classNames.classNames('active-wallet-information__addresses-container', {
                                             'active-wallet-information__addresses-container--centered': !(nameService === null || nameService === void 0 ? void 0 : nameService.name),

package/src/lib/widgets/DynamicWidget/components/ActiveWalletInformation/ActiveWalletInformation.js

@@ -184,7 +184,7 @@ const ActiveWalletInformation = ({ isLoading = false, }) => {
         }
     };
     if (isLoading) {
-        return jsx(Skeleton, {});
+        return (jsxs("div", { className: 'active-wallet-information-container active-wallet-information-container--loading', "data-testid": 'active-wallet-information', children: [jsx("div", { className: 'active-wallet-information active-wallet-information--loading', children: jsxs("div", { className: 'active-wallet-information__header', children: [jsx("div", { className: 'active-wallet-information__avatar', children: jsx("div", { className: 'active-wallet-information__wallet-img', children: jsx(Skeleton, { className: 'active-wallet-information__skeleton-avatar' }) }) }), jsxs("div", { className: 'active-wallet-information__details', children: [jsxs("div", { className: 'active-wallet-information__addresses-container active-wallet-information__addresses-container--loading', children: [jsx("div", { className: 'active-wallet-information__handle-row', children: jsx(Skeleton, { className: 'active-wallet-information__skeleton-handle' }) }), jsx("div", { className: 'active-wallet-information__handle-row', children: jsx(Skeleton, { className: 'active-wallet-information__skeleton-address' }) })] }), !shouldHideNetwork && (jsx("div", { className: 'active-wallet-information__network-picker', children: jsx(Skeleton, { className: 'active-wallet-information__skeleton-network' }) }))] })] }) }), jsx(ActiveWalletBalance, { isLoading: isLoading })] }));
     }
     return (jsxs("div", { className: 'active-wallet-information-container', "data-testid": 'active-wallet-information', children: [jsxs("div", { className: 'active-wallet-information', children: [jsxs("div", { className: 'active-wallet-information__header', children: [jsx("div", { className: 'active-wallet-information__avatar', children: (nameService === null || nameService === void 0 ? void 0 : nameService.avatar) ? (jsx("div", { className: 'active-wallet-information__avatar__name-service', children: jsx("img", { src: nameService === null || nameService === void 0 ? void 0 : nameService.avatar, alt: '' }) })) : (jsx("div", { className: 'active-wallet-information__wallet-img', children: jsx(AuthProviderIcon, { iconSize: ICON_SIZE }) })) }), jsxs("div", { className: 'active-wallet-information__details', children: [jsx("div", { className: classNames('active-wallet-information__addresses-container', {
                                             'active-wallet-information__addresses-container--centered': !(nameService === null || nameService === void 0 ? void 0 : nameService.name),

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetWalletHeader/DynamicWidgetWalletHeader.cjs

@@ -9,7 +9,7 @@ var reactI18next = require('react-i18next');
 var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 require('@dynamic-labs/utils');
 require('../../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
-var Alert = require('../../../../../components/Alert/Alert.cjs');
+require('../../../../../components/Alert/Alert.cjs');
 require('../../../../../events/dynamicEvents.cjs');
 require('../../../../../../../_virtual/_tslib.cjs');
 require('../../../../../context/DynamicContext/DynamicContext.cjs');
@@ -51,7 +51,7 @@ require('bs58');
 require('@dynamic-labs/types');
 require('../../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../../context/LoadingContext/LoadingContext.cjs');
-var WalletContext = require('../../../../../context/WalletContext/WalletContext.cjs');
+require('../../../../../context/WalletContext/WalletContext.cjs');
 require('../../../../../utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.cjs');
 require('yup');
 require('../../../../../context/MockContext/MockContext.cjs');
@@ -80,7 +80,6 @@ require('../../../../../utils/hooks/useSubdomainCheck/useSubdomainCheck.cjs');
 require('../../../../../store/state/sendBalances.cjs');
 require('../../../../../components/Input/Input.cjs');
 require('../../../../../components/OverlayCard/OverlayCard.cjs');
-var spinner = require('../../../../../components/Spinner/spinner.cjs');
 require('../../../../../views/TransactionConfirmationView/TransactionConfirmationView.cjs');
 require('../../../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
@@ -106,6 +105,7 @@ require('../../../../../components/Popper/PopperContext/PopperContext.cjs');
 var SecureEmbeddedWalletCard = require('../../../../../components/SecureEmbeddedWalletCard/SecureEmbeddedWalletCard.cjs');
 var SendBalanceContext = require('../../../../../context/SendBalanceContext/SendBalanceContext.cjs');
 var ActiveWalletInformation = require('../../ActiveWalletInformation/ActiveWalletInformation.cjs');
+var useIsLoadingEmbeddedWallet = require('../../../../../utils/hooks/useIsLoadingEmbeddedWallet/useIsLoadingEmbeddedWallet.cjs');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -125,7 +125,7 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
     const { primaryWallet, user } = useInternalDynamicContext.useInternalDynamicContext();
     const { open: openSendBalanceModal } = SendBalanceContext.useSendBalance();
     const { setDynamicWidgetView, setIsOpen } = DynamicWidgetContext.useWidgetContext();
-    const { isLoadingEmbeddedWallet } = WalletContext.useWalletContext();
+    const { isLoadingEmbeddedWallet } = useIsLoadingEmbeddedWallet.useIsLoadingEmbeddedWallet();
     const { t } = reactI18next.useTranslation();
     const isSendBalanceEnabled = React.useMemo(() => {
         const connector = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector;
@@ -150,7 +150,7 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
             return (jsxRuntime.jsx("div", { className: 'dynamic-widget-wallet-header__icon-container', children: jsxRuntime.jsx(UserAvatar.UserAvatar, { user: user }) }));
         }
     };
-    return (jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallet-header', "data-testid": 'dynamic-widget-wallet-header', children: [renderWalletHeader(), isLoadingEmbeddedWallet && (jsxRuntime.jsx("div", { className: 'dynamic-widget-wallet-header__wallet-info', children: jsxRuntime.jsx("div", { className: 'dynamic-widget-wallet-header__wallet-loading', children: jsxRuntime.jsx(Alert.Alert, { variant: 'info', icon: jsxRuntime.jsx(spinner.Spinner, { className: 'button__spinner' }), children: t('dyn_creating_wallet.loading_message') }) }) })), primaryWallet ? (jsxRuntime.jsxs("div", { "data-testid": 'primaryWalletStatus', className: 'dynamic-widget-wallet-header__wallet-info', children: [jsxRuntime.jsx(SecureEmbeddedWalletCard.SecureEmbeddedWalletCard, { className: 'dynamic-widget-wallet-header__wallet-info__secure-wallet' }), jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallet-header__wallet-actions', children: [jsxRuntime.jsx(TypographyButton.TypographyButton, { expanded: true, dataTestId: 'buy-crypto-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: () => setDynamicWidgetView('choose-wallet-funding-method'), startSlot: jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-secondary', children: jsxRuntime.jsx(add.ReactComponent, {}) }), children: t('dyn_widget_header.buttons.deposit_funds') }), isSendBalanceEnabled && (jsxRuntime.jsx(TypographyButton.TypographyButton, { expanded: true, dataTestId: 'send-balance-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: handleOnClickSend, startSlot: jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-secondary', children: jsxRuntime.jsx(send.ReactComponent, {}) }), children: t('dyn_widget_header.buttons.send_funds') })), jsxRuntime.jsx(LinkButton, { connector: primaryWallet.connector })] })] })) : (jsxRuntime.jsx(Typography.Typography, { className: 'dynamic-widget-wallet-header__email', variant: 'body_normal', weight: 'regular', children: !isLoadingEmbeddedWallet && getUserIdentifier.getUserIdentifier(user) }))] }));
+    return (jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallet-header', "data-testid": 'dynamic-widget-wallet-header', children: [renderWalletHeader(), primaryWallet ? (jsxRuntime.jsxs("div", { "data-testid": 'primaryWalletStatus', className: 'dynamic-widget-wallet-header__wallet-info', children: [jsxRuntime.jsx(SecureEmbeddedWalletCard.SecureEmbeddedWalletCard, { className: 'dynamic-widget-wallet-header__wallet-info__secure-wallet' }), jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallet-header__wallet-actions', children: [jsxRuntime.jsx(TypographyButton.TypographyButton, { expanded: true, dataTestId: 'buy-crypto-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: () => setDynamicWidgetView('choose-wallet-funding-method'), startSlot: jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-secondary', children: jsxRuntime.jsx(add.ReactComponent, {}) }), children: t('dyn_widget_header.buttons.deposit_funds') }), isSendBalanceEnabled && (jsxRuntime.jsx(TypographyButton.TypographyButton, { expanded: true, dataTestId: 'send-balance-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: handleOnClickSend, startSlot: jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-secondary', children: jsxRuntime.jsx(send.ReactComponent, {}) }), children: t('dyn_widget_header.buttons.send_funds') })), jsxRuntime.jsx(LinkButton, { connector: primaryWallet.connector })] })] })) : (jsxRuntime.jsx(Typography.Typography, { className: 'dynamic-widget-wallet-header__email', variant: 'body_normal', weight: 'regular', children: !isLoadingEmbeddedWallet && getUserIdentifier.getUserIdentifier(user) }))] }));
 };
 React__default["default"].memo(DynamicWidgetWalletHeader);
 

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetWalletHeader/DynamicWidgetWalletHeader.js

@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 import { isSendBalanceWalletConnector } from '@dynamic-labs/wallet-connector-core';
 import '@dynamic-labs/utils';
 import '../../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
-import { Alert } from '../../../../../components/Alert/Alert.js';
+import '../../../../../components/Alert/Alert.js';
 import '../../../../../events/dynamicEvents.js';
 import '../../../../../../../_virtual/_tslib.js';
 import '../../../../../context/DynamicContext/DynamicContext.js';
@@ -47,7 +47,7 @@ import 'bs58';
 import '@dynamic-labs/types';
 import '../../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../../context/LoadingContext/LoadingContext.js';
-import { useWalletContext } from '../../../../../context/WalletContext/WalletContext.js';
+import '../../../../../context/WalletContext/WalletContext.js';
 import '../../../../../utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js';
 import 'yup';
 import '../../../../../context/MockContext/MockContext.js';
@@ -76,7 +76,6 @@ import '../../../../../utils/hooks/useSubdomainCheck/useSubdomainCheck.js';
 import '../../../../../store/state/sendBalances.js';
 import '../../../../../components/Input/Input.js';
 import '../../../../../components/OverlayCard/OverlayCard.js';
-import { Spinner } from '../../../../../components/Spinner/spinner.js';
 import '../../../../../views/TransactionConfirmationView/TransactionConfirmationView.js';
 import '../../../../../context/PasskeyContext/PasskeyContext.js';
 import '../../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
@@ -102,6 +101,7 @@ import '../../../../../components/Popper/PopperContext/PopperContext.js';
 import { SecureEmbeddedWalletCard } from '../../../../../components/SecureEmbeddedWalletCard/SecureEmbeddedWalletCard.js';
 import { useSendBalance } from '../../../../../context/SendBalanceContext/SendBalanceContext.js';
 import { ActiveWalletInformation } from '../../ActiveWalletInformation/ActiveWalletInformation.js';
+import { useIsLoadingEmbeddedWallet } from '../../../../../utils/hooks/useIsLoadingEmbeddedWallet/useIsLoadingEmbeddedWallet.js';
 
 const LinkButton = React__default.memo(({ connector }) => {
     const { setDynamicWidgetView } = useWidgetContext();
@@ -117,7 +117,7 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
     const { primaryWallet, user } = useInternalDynamicContext();
     const { open: openSendBalanceModal } = useSendBalance();
     const { setDynamicWidgetView, setIsOpen } = useWidgetContext();
-    const { isLoadingEmbeddedWallet } = useWalletContext();
+    const { isLoadingEmbeddedWallet } = useIsLoadingEmbeddedWallet();
     const { t } = useTranslation();
     const isSendBalanceEnabled = useMemo(() => {
         const connector = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector;
@@ -142,7 +142,7 @@ const DynamicWidgetWalletHeader = ({ variant, }) => {
             return (jsx("div", { className: 'dynamic-widget-wallet-header__icon-container', children: jsx(UserAvatar, { user: user }) }));
         }
     };
-    return (jsxs("div", { className: 'dynamic-widget-wallet-header', "data-testid": 'dynamic-widget-wallet-header', children: [renderWalletHeader(), isLoadingEmbeddedWallet && (jsx("div", { className: 'dynamic-widget-wallet-header__wallet-info', children: jsx("div", { className: 'dynamic-widget-wallet-header__wallet-loading', children: jsx(Alert, { variant: 'info', icon: jsx(Spinner, { className: 'button__spinner' }), children: t('dyn_creating_wallet.loading_message') }) }) })), primaryWallet ? (jsxs("div", { "data-testid": 'primaryWalletStatus', className: 'dynamic-widget-wallet-header__wallet-info', children: [jsx(SecureEmbeddedWalletCard, { className: 'dynamic-widget-wallet-header__wallet-info__secure-wallet' }), jsxs("div", { className: 'dynamic-widget-wallet-header__wallet-actions', children: [jsx(TypographyButton, { expanded: true, dataTestId: 'buy-crypto-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: () => setDynamicWidgetView('choose-wallet-funding-method'), startSlot: jsx(Icon, { size: 'small', color: 'text-secondary', children: jsx(SvgAdd, {}) }), children: t('dyn_widget_header.buttons.deposit_funds') }), isSendBalanceEnabled && (jsx(TypographyButton, { expanded: true, dataTestId: 'send-balance-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: handleOnClickSend, startSlot: jsx(Icon, { size: 'small', color: 'text-secondary', children: jsx(SvgSend, {}) }), children: t('dyn_widget_header.buttons.send_funds') })), jsx(LinkButton, { connector: primaryWallet.connector })] })] })) : (jsx(Typography, { className: 'dynamic-widget-wallet-header__email', variant: 'body_normal', weight: 'regular', children: !isLoadingEmbeddedWallet && getUserIdentifier(user) }))] }));
+    return (jsxs("div", { className: 'dynamic-widget-wallet-header', "data-testid": 'dynamic-widget-wallet-header', children: [renderWalletHeader(), primaryWallet ? (jsxs("div", { "data-testid": 'primaryWalletStatus', className: 'dynamic-widget-wallet-header__wallet-info', children: [jsx(SecureEmbeddedWalletCard, { className: 'dynamic-widget-wallet-header__wallet-info__secure-wallet' }), jsxs("div", { className: 'dynamic-widget-wallet-header__wallet-actions', children: [jsx(TypographyButton, { expanded: true, dataTestId: 'buy-crypto-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: () => setDynamicWidgetView('choose-wallet-funding-method'), startSlot: jsx(Icon, { size: 'small', color: 'text-secondary', children: jsx(SvgAdd, {}) }), children: t('dyn_widget_header.buttons.deposit_funds') }), isSendBalanceEnabled && (jsx(TypographyButton, { expanded: true, dataTestId: 'send-balance-button', buttonPadding: 'small', buttonVariant: 'primary', onClick: handleOnClickSend, startSlot: jsx(Icon, { size: 'small', color: 'text-secondary', children: jsx(SvgSend, {}) }), children: t('dyn_widget_header.buttons.send_funds') })), jsx(LinkButton, { connector: primaryWallet.connector })] })] })) : (jsx(Typography, { className: 'dynamic-widget-wallet-header__email', variant: 'body_normal', weight: 'regular', children: !isLoadingEmbeddedWallet && getUserIdentifier(user) }))] }));
 };
 React__default.memo(DynamicWidgetWalletHeader);