@dynamic-labs/sdk-react-core 4.7.2 → 4.8.1

package/src/lib/widgets/DynamicWidget/prompts/QrCodeModalView/QrCodeModalView.cjs

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var walletBook = require('@dynamic-labs/wallet-book');
-require('@dynamic-labs/utils');
+var utils = require('@dynamic-labs/utils');
 require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../components/Alert/Alert.cjs');
 require('react');
@@ -124,7 +124,7 @@ const QrCodeModalView = ({ walletId }) => {
                     // this div exists to give the parent a child, so that the parent
                     // takes on its given width and height. the result is stable
                     // rendering of this component, without this there is a brief flash
-                    jsxRuntime.jsx("div", { "data-testid": 'no-qrcode' })) }) }), jsxRuntime.jsxs("div", { className: 'button__container', children: [(newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector.isWalletConnect) && qrcodeUri && (jsxRuntime.jsxs(CopyButton.CopyButton, { textToCopy: qrcodeUri, children: [jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-tertiary', children: jsxRuntime.jsx(link.ReactComponent, {}) }), "Copy QR URI"] })), desktopUri && (jsxRuntime.jsxs(TextButton.TextButton, { className: 'button--open-app', onClick: () => window.open(desktopUri), children: [jsxRuntime.jsx(Icon.Icon, { size: 'xsmall', color: 'text-tertiary', children: jsxRuntime.jsx(externalLink.ReactComponent, {}) }), "Open ", walletName, " App"] }))] })] }));
+                    jsxRuntime.jsx("div", { "data-testid": 'no-qrcode' })) }) }), jsxRuntime.jsxs("div", { className: 'button__container', children: [(newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector.isWalletConnect) && qrcodeUri && (jsxRuntime.jsxs(CopyButton.CopyButton, { textToCopy: qrcodeUri, children: [jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-tertiary', children: jsxRuntime.jsx(link.ReactComponent, {}) }), "Copy QR URI"] })), desktopUri && (jsxRuntime.jsxs(TextButton.TextButton, { className: 'button--open-app', onClick: () => utils.PlatformService.openURL(desktopUri, 'blank'), children: [jsxRuntime.jsx(Icon.Icon, { size: 'xsmall', color: 'text-tertiary', children: jsxRuntime.jsx(externalLink.ReactComponent, {}) }), "Open ", walletName, " App"] }))] })] }));
 };
 
 exports.QrCodeModalView = QrCodeModalView;

package/src/lib/widgets/DynamicWidget/prompts/QrCodeModalView/QrCodeModalView.js

@@ -1,7 +1,7 @@
 'use client'
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { WalletIcon } from '@dynamic-labs/wallet-book';
-import '@dynamic-labs/utils';
+import { PlatformService } from '@dynamic-labs/utils';
 import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../components/Alert/Alert.js';
 import 'react';
@@ -120,7 +120,7 @@ const QrCodeModalView = ({ walletId }) => {
                     // this div exists to give the parent a child, so that the parent
                     // takes on its given width and height. the result is stable
                     // rendering of this component, without this there is a brief flash
-                    jsx("div", { "data-testid": 'no-qrcode' })) }) }), jsxs("div", { className: 'button__container', children: [(newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector.isWalletConnect) && qrcodeUri && (jsxs(CopyButton, { textToCopy: qrcodeUri, children: [jsx(Icon, { size: 'small', color: 'text-tertiary', children: jsx(SvgLink, {}) }), "Copy QR URI"] })), desktopUri && (jsxs(TextButton, { className: 'button--open-app', onClick: () => window.open(desktopUri), children: [jsx(Icon, { size: 'xsmall', color: 'text-tertiary', children: jsx(SvgExternalLink, {}) }), "Open ", walletName, " App"] }))] })] }));
+                    jsx("div", { "data-testid": 'no-qrcode' })) }) }), jsxs("div", { className: 'button__container', children: [(newPrimaryWallet === null || newPrimaryWallet === void 0 ? void 0 : newPrimaryWallet.connector.isWalletConnect) && qrcodeUri && (jsxs(CopyButton, { textToCopy: qrcodeUri, children: [jsx(Icon, { size: 'small', color: 'text-tertiary', children: jsx(SvgLink, {}) }), "Copy QR URI"] })), desktopUri && (jsxs(TextButton, { className: 'button--open-app', onClick: () => PlatformService.openURL(desktopUri, 'blank'), children: [jsx(Icon, { size: 'xsmall', color: 'text-tertiary', children: jsx(SvgExternalLink, {}) }), "Open ", walletName, " App"] }))] })] }));
 };
 
 export { QrCodeModalView };

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

@@ -7,27 +7,27 @@ var _tslib = require('../../../../../../_virtual/_tslib.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var reactI18next = require('react-i18next');
+var utils = require('@dynamic-labs/utils');
+require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
+require('../../../../components/Alert/Alert.cjs');
+require('../../../../events/dynamicEvents.cjs');
+var useDynamicContext = require('../../../../context/DynamicContext/useDynamicContext/useDynamicContext.cjs');
+require('../../../../context/DynamicContext/DynamicContext.cjs');
+require('@dynamic-labs/wallet-connector-core');
+require('../../../../context/CaptchaContext/CaptchaContext.cjs');
+require('../../../../context/ErrorContext/ErrorContext.cjs');
+require('../../../../context/ViewContext/ViewContext.cjs');
 require('@dynamic-labs/sdk-api-core');
 var logger = require('../../../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
-require('@dynamic-labs/wallet-connector-core');
 var arrowLeft = require('../../../../shared/assets/arrow-left.cjs');
 var check = require('../../../../shared/assets/check.cjs');
 var externalLink = require('../../../../shared/assets/externalLink.cjs');
 var unlink = require('../../../../shared/assets/unlink.cjs');
-require('../../../../context/ViewContext/ViewContext.cjs');
 require('@dynamic-labs/wallet-book');
-require('@dynamic-labs/utils');
 require('../../../../utils/constants/colors.cjs');
 require('../../../../utils/constants/values.cjs');
 require('../../../../shared/consts/index.cjs');
-require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
-require('../../../../components/Alert/Alert.cjs');
-require('../../../../events/dynamicEvents.cjs');
-var useDynamicContext = require('../../../../context/DynamicContext/useDynamicContext/useDynamicContext.cjs');
-require('../../../../context/DynamicContext/DynamicContext.cjs');
-require('../../../../context/CaptchaContext/CaptchaContext.cjs');
-require('../../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
 require('react-international-phone');
 require('../../../../store/state/nonce/nonce.cjs');
@@ -169,10 +169,10 @@ const ConnectedAppsView = ({ name }) => {
             logger.logger.warn('Error disconnecting app', error);
         }
     });
-    return (jsxRuntime.jsxs("div", { className: 'connected-apps-view', children: [jsxRuntime.jsxs("div", { className: 'header', children: [jsxRuntime.jsx(IconButton.IconButton, { onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', className: 'back-button', type: 'button', children: jsxRuntime.jsx(arrowLeft.ReactComponent, { className: 'arrow-left-icon' }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'title', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.title') })] }), jsxRuntime.jsx("div", { className: 'subheader', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.subtitle') }) }), connectedApps.length > 0 && (jsxRuntime.jsx("ul", { className: 'connected-apps-list', children: connectedApps.map((app) => (jsxRuntime.jsxs("li", { className: 'connected-app-item', children: [jsxRuntime.jsx("img", { src: app.icon, alt: app.name, className: 'app-icon' }), jsxRuntime.jsx("div", { className: 'app-info', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: app.url }) }), jsxRuntime.jsxs("div", { className: 'app-actions', children: [jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => window.open(app.url, '_blank'), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsxRuntime.jsx(externalLink.ReactComponent, {}), typographyProps: {
+    return (jsxRuntime.jsxs("div", { className: 'connected-apps-view', children: [jsxRuntime.jsxs("div", { className: 'header', children: [jsxRuntime.jsx(IconButton.IconButton, { onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', className: 'back-button', type: 'button', children: jsxRuntime.jsx(arrowLeft.ReactComponent, { className: 'arrow-left-icon' }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'title', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.title') })] }), jsxRuntime.jsx("div", { className: 'subheader', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.subtitle') }) }), connectedApps.length > 0 && (jsxRuntime.jsx("ul", { className: 'connected-apps-list', children: connectedApps.map((app) => (jsxRuntime.jsxs("li", { className: 'connected-app-item', children: [jsxRuntime.jsx("img", { src: app.icon, alt: app.name, className: 'app-icon' }), jsxRuntime.jsx("div", { className: 'app-info', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: app.url }) }), jsxRuntime.jsxs("div", { className: 'app-actions', children: [jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => utils.PlatformService.openURL(app.url, 'blank'), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsxRuntime.jsx(externalLink.ReactComponent, {}), typographyProps: {
                                         color: 'secondary',
                                         variant: 'button_secondary',
-                                    } }), jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => handleDisconnect(app.topic), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsxRuntime.jsx(unlink.ReactComponent, {}), typographyProps: {
+                                    }, dataTestId: 'open-app-button' }), jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => handleDisconnect(app.topic), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsxRuntime.jsx(unlink.ReactComponent, {}), typographyProps: {
                                         color: 'secondary',
                                         variant: 'button_secondary',
                                     } })] })] }, app.url))) })), showSuccessMessage && (jsxRuntime.jsxs("div", { className: 'success-message', children: [jsxRuntime.jsx(check.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'primary', children: t('global_wallet.connected_apps.success', { name }) })] }))] }));

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

@@ -3,27 +3,27 @@ import { __awaiter } from '../../../../../../_virtual/_tslib.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
+import { PlatformService } from '@dynamic-labs/utils';
+import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
+import '../../../../components/Alert/Alert.js';
+import '../../../../events/dynamicEvents.js';
+import { useDynamicContext } from '../../../../context/DynamicContext/useDynamicContext/useDynamicContext.js';
+import '../../../../context/DynamicContext/DynamicContext.js';
+import '@dynamic-labs/wallet-connector-core';
+import '../../../../context/CaptchaContext/CaptchaContext.js';
+import '../../../../context/ErrorContext/ErrorContext.js';
+import '../../../../context/ViewContext/ViewContext.js';
 import '@dynamic-labs/sdk-api-core';
 import { logger } from '../../../../shared/logger.js';
 import '@dynamic-labs/iconic';
-import '@dynamic-labs/wallet-connector-core';
 import { ReactComponent as SvgArrowLeft } from '../../../../shared/assets/arrow-left.js';
 import { ReactComponent as SvgCheck } from '../../../../shared/assets/check.js';
 import { ReactComponent as SvgExternalLink } from '../../../../shared/assets/externalLink.js';
 import { ReactComponent as SvgUnlink } from '../../../../shared/assets/unlink.js';
-import '../../../../context/ViewContext/ViewContext.js';
 import '@dynamic-labs/wallet-book';
-import '@dynamic-labs/utils';
 import '../../../../utils/constants/colors.js';
 import '../../../../utils/constants/values.js';
 import '../../../../shared/consts/index.js';
-import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
-import '../../../../components/Alert/Alert.js';
-import '../../../../events/dynamicEvents.js';
-import { useDynamicContext } from '../../../../context/DynamicContext/useDynamicContext/useDynamicContext.js';
-import '../../../../context/DynamicContext/DynamicContext.js';
-import '../../../../context/CaptchaContext/CaptchaContext.js';
-import '../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
 import 'react-international-phone';
 import '../../../../store/state/nonce/nonce.js';
@@ -165,10 +165,10 @@ const ConnectedAppsView = ({ name }) => {
             logger.warn('Error disconnecting app', error);
         }
     });
-    return (jsxs("div", { className: 'connected-apps-view', children: [jsxs("div", { className: 'header', children: [jsx(IconButton, { onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', className: 'back-button', type: 'button', children: jsx(SvgArrowLeft, { className: 'arrow-left-icon' }) }), jsx(Typography, { variant: 'title', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.title') })] }), jsx("div", { className: 'subheader', children: jsx(Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.subtitle') }) }), connectedApps.length > 0 && (jsx("ul", { className: 'connected-apps-list', children: connectedApps.map((app) => (jsxs("li", { className: 'connected-app-item', children: [jsx("img", { src: app.icon, alt: app.name, className: 'app-icon' }), jsx("div", { className: 'app-info', children: jsx(Typography, { variant: 'body_normal', color: 'primary', children: app.url }) }), jsxs("div", { className: 'app-actions', children: [jsx(TypographyButton, { onClick: () => window.open(app.url, '_blank'), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsx(SvgExternalLink, {}), typographyProps: {
+    return (jsxs("div", { className: 'connected-apps-view', children: [jsxs("div", { className: 'header', children: [jsx(IconButton, { onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', className: 'back-button', type: 'button', children: jsx(SvgArrowLeft, { className: 'arrow-left-icon' }) }), jsx(Typography, { variant: 'title', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.title') })] }), jsx("div", { className: 'subheader', children: jsx(Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.subtitle') }) }), connectedApps.length > 0 && (jsx("ul", { className: 'connected-apps-list', children: connectedApps.map((app) => (jsxs("li", { className: 'connected-app-item', children: [jsx("img", { src: app.icon, alt: app.name, className: 'app-icon' }), jsx("div", { className: 'app-info', children: jsx(Typography, { variant: 'body_normal', color: 'primary', children: app.url }) }), jsxs("div", { className: 'app-actions', children: [jsx(TypographyButton, { onClick: () => PlatformService.openURL(app.url, 'blank'), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsx(SvgExternalLink, {}), typographyProps: {
                                         color: 'secondary',
                                         variant: 'button_secondary',
-                                    } }), jsx(TypographyButton, { onClick: () => handleDisconnect(app.topic), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsx(SvgUnlink, {}), typographyProps: {
+                                    }, dataTestId: 'open-app-button' }), jsx(TypographyButton, { onClick: () => handleDisconnect(app.topic), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsx(SvgUnlink, {}), typographyProps: {
                                         color: 'secondary',
                                         variant: 'button_secondary',
                                     } })] })] }, app.url))) })), showSuccessMessage && (jsxs("div", { className: 'success-message', children: [jsx(SvgCheck, {}), jsx(Typography, { variant: 'body_small', color: 'primary', children: t('global_wallet.connected_apps.success', { name }) })] }))] }));

package/src/lib/widgets/DynamicWidget/views/ReceiveWalletFunds/utils/useSubmitWalletFunding/useSubmitWalletFunding.cjs

@@ -12,6 +12,7 @@ var logger = require('../../../../../../shared/logger.cjs');
 var pixelToRem = require('../../../../../../utils/functions/pixelToRem/pixelToRem.cjs');
 var useFundWithWallet = require('../../../../../../utils/hooks/useFundWithWallet/useFundWithWallet.cjs');
 var DynamicWidgetContext = require('../../../../context/DynamicWidgetContext.cjs');
+var getTransactionLink = require('../../../../../../utils/functions/getTransactionLink/getTransactionLink.cjs');
 
 const useSubmitWalletFunding = () => {
     const { fund } = useFundWithWallet.useInternalFundWithWallet();
@@ -34,8 +35,14 @@ const useSubmitWalletFunding = () => {
                 token: token === 'native' ? undefined : token,
             });
             logger.logger.info(`Funding with wallet succeeded with transaction id: ${txId}`);
-            const blockExplorerUrl = (yield wallet.connector.getBlockExplorerUrlsForCurrentNetwork())[0];
-            const TxnSuccessAlert = (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: 'current-color', children: [t('dyn_wallet_funding.success'), blockExplorerUrl && (jsxRuntime.jsx(Typography.Typography, { as: 'a', href: `${blockExplorerUrl}/tx/${txId}`, target: '_blank', rel: 'noreferrer', style: {
+            let txLink;
+            if (txId) {
+                txLink = yield getTransactionLink.getTransactionLink({
+                    transactionHash: txId,
+                    walletConnector: wallet.connector,
+                });
+            }
+            const TxnSuccessAlert = (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: 'current-color', children: [t('dyn_wallet_funding.success'), txLink && (jsxRuntime.jsx(Typography.Typography, { as: 'a', href: txLink, target: '_blank', rel: 'noreferrer', style: {
                             marginLeft: pixelToRem.pixelToRem(4),
                             textDecoration: 'underline',
                             textDecorationThickness: pixelToRem.pixelToRem(1),

package/src/lib/widgets/DynamicWidget/views/ReceiveWalletFunds/utils/useSubmitWalletFunding/useSubmitWalletFunding.js

@@ -8,6 +8,7 @@ import { logger } from '../../../../../../shared/logger.js';
 import { pixelToRem } from '../../../../../../utils/functions/pixelToRem/pixelToRem.js';
 import { useInternalFundWithWallet } from '../../../../../../utils/hooks/useFundWithWallet/useFundWithWallet.js';
 import { useWidgetContext } from '../../../../context/DynamicWidgetContext.js';
+import { getTransactionLink } from '../../../../../../utils/functions/getTransactionLink/getTransactionLink.js';
 
 const useSubmitWalletFunding = () => {
     const { fund } = useInternalFundWithWallet();
@@ -30,8 +31,14 @@ const useSubmitWalletFunding = () => {
                 token: token === 'native' ? undefined : token,
             });
             logger.info(`Funding with wallet succeeded with transaction id: ${txId}`);
-            const blockExplorerUrl = (yield wallet.connector.getBlockExplorerUrlsForCurrentNetwork())[0];
-            const TxnSuccessAlert = (jsxs(Typography, { variant: 'body_normal', color: 'current-color', children: [t('dyn_wallet_funding.success'), blockExplorerUrl && (jsx(Typography, { as: 'a', href: `${blockExplorerUrl}/tx/${txId}`, target: '_blank', rel: 'noreferrer', style: {
+            let txLink;
+            if (txId) {
+                txLink = yield getTransactionLink({
+                    transactionHash: txId,
+                    walletConnector: wallet.connector,
+                });
+            }
+            const TxnSuccessAlert = (jsxs(Typography, { variant: 'body_normal', color: 'current-color', children: [t('dyn_wallet_funding.success'), txLink && (jsx(Typography, { as: 'a', href: txLink, target: '_blank', rel: 'noreferrer', style: {
                             marginLeft: pixelToRem(4),
                             textDecoration: 'underline',
                             textDecorationThickness: pixelToRem(1),