@dynamic-labs/sdk-react-core 4.20.16 → 4.21.0

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

@@ -1,13 +1,17 @@
 'use client'
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
 import { isEmbeddedConnector } from '@dynamic-labs/wallet-connector-core';
+import { classNames } from '../../../../utils/functions/classNames/classNames.js';
+import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import { ReactComponent as SvgCopy } from '../../../../shared/assets/copy.js';
 import { ReactComponent as SvgKey } from '../../../../shared/assets/key.js';
 import { ReactComponent as SvgSwitchHorizontal } from '../../../../shared/assets/switch-horizontal.js';
 import { ReactComponent as SvgUnlink } from '../../../../shared/assets/unlink.js';
 import '@dynamic-labs/iconic';
 import '../../../../context/ViewContext/ViewContext.js';
+import '../../../../../../_virtual/_tslib.js';
 import '@dynamic-labs/sdk-api-core';
 import '../../../../shared/logger.js';
 import '@dynamic-labs/wallet-book';
@@ -15,11 +19,13 @@ import { shortenWalletAddress } from '../../../../shared/utils/functions/shorten
 import '@dynamic-labs/utils';
 import '../../../../utils/constants/colors.js';
 import '../../../../utils/constants/values.js';
-import '../../../../context/DynamicContext/DynamicContext.js';
-import '../../../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
 import '../../../../shared/consts/index.js';
+import '../../../../components/Alert/Alert.js';
 import '../../../../events/dynamicEvents.js';
-import '../../../../../../_virtual/_tslib.js';
+import '../../../../context/DynamicContext/DynamicContext.js';
+import '../../../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
+import { useAuthMode } from '../../../../store/state/authMode/authMode.js';
+import { useInternalDynamicContext } from '../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -37,7 +43,6 @@ import '../../../../store/state/connectedWalletsInfo/connectedWalletsInfo.js';
 import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../../../context/AccountExistsContext/AccountExistsContext.js';
 import '../../../../context/UserWalletsContext/UserWalletsContext.js';
-import { useAuthMode } from '../../../../store/state/authMode/authMode.js';
 import '../../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
 import '../../../../utils/functions/compareChains/compareChains.js';
@@ -57,59 +62,55 @@ import '../../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../store/state/walletOptions/walletOptions.js';
-import 'react-i18next';
-import { classNames } from '../../../../utils/functions/classNames/classNames.js';
-import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
-import '../../../../components/Alert/Alert.js';
 import { Typography } from '../../../../components/Typography/Typography.js';
-import { AuthProviderIcon } from '../../../../components/AuthProviderIcon/AuthProviderIcon.js';
+import '../../../../context/FooterAnimationContext/index.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
-import '../../../../components/IconButton/IconButton.js';
-import '../../../../components/InlineWidget/InlineWidget.js';
-import '../../../../components/Input/Input.js';
-import '../../../../components/IsBrowser/IsBrowser.js';
-import '../../../../components/MenuList/Dropdown/Dropdown.js';
-import '../../../../components/OverlayCard/OverlayCard.js';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import '../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
-import '../../../../components/Popper/Popper/Popper.js';
-import '../../../../components/Popper/PopperContext/PopperContext.js';
-import 'react-focus-lock';
-import 'qrcode';
-import 'formik';
-import '../../../../utils/hooks/useSubdomainCheck/useSubdomainCheck.js';
+import '../../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
-import '../../../../context/IpConfigurationContext/IpConfigurationContext.js';
-import '../../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
-import { DotsMenu } from '../DotsMenu/DotsMenu.js';
-import '../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '../DynamicWidgetHeader/DynamicWidgetHeader.js';
+import 'react-focus-lock';
+import { AuthProviderIcon } from '../../../../components/AuthProviderIcon/AuthProviderIcon.js';
 import { copyToClipboard, getExportKeysOption } from '../../helpers/helpers.js';
-import '@hcaptcha/react-hcaptcha';
 import '../../context/DynamicWidgetContext.js';
-import '../../../../context/FooterAnimationContext/index.js';
-import '../../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
-import '../../../../context/PasskeyContext/PasskeyContext.js';
-import '../../helpers/convertExchangeKeyAndProviderEnum.js';
-import '../../../../store/state/sendBalances.js';
-import '../../../../store/state/connectorsInitializing/connectorsInitializing.js';
-import '../../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js';
-import '../DynamicWidgetHeader/DynamicWidgetHeader.js';
 import { useSwitchWallet } from '../../../../utils/hooks/useSwitchWallet/useSwitchWallet.js';
+import { DotsMenu } from '../DotsMenu/DotsMenu.js';
+import 'formik';
+import '../../../../utils/hooks/useSubdomainCheck/useSubdomainCheck.js';
+import '../../../../components/IconButton/IconButton.js';
+import '../../../../store/state/sendBalances.js';
+import '../../../../components/Input/Input.js';
+import '../../../../components/OverlayCard/OverlayCard.js';
+import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../views/TransactionConfirmationView/TransactionConfirmationView.js';
+import '../../../../context/PasskeyContext/PasskeyContext.js';
 import '../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
 import '../../../../context/OnrampContext/OnrampContext.js';
+import '../../helpers/convertExchangeKeyAndProviderEnum.js';
+import 'qrcode';
 import '../../views/ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../../index.js';
+import '../../../../context/IpConfigurationContext/IpConfigurationContext.js';
+import '../../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
+import '../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '@hcaptcha/react-hcaptcha';
+import '../../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
+import '../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
+import '../../../../store/state/connectorsInitializing/connectorsInitializing.js';
 import '../../../../store/state/tokenBalances.js';
 import '../../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
-import { useInternalDynamicContext } from '../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
+import '../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../components/IsBrowser/IsBrowser.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
 
 const Wallet = ({ wallet, ens, clickable }) => {
     var _a;
     const { connector, address } = wallet;
     const switchWallet = useSwitchWallet();
+    const { t } = useTranslation();
     const { setSelectedWalletWithAction, projectSettings } = useInternalDynamicContext();
     const authMode = useAuthMode();
     const handleSwitchWallet = useCallback(() => {
@@ -120,28 +121,36 @@ const Wallet = ({ wallet, ens, clickable }) => {
         {
             Icon: jsx(SvgSwitchHorizontal, {}),
             callback: handleSwitchWallet,
+            copykey: 'dyn_secondary_wallet.title',
             hide: !((_a = wallet.connector) === null || _a === void 0 ? void 0 : _a.isAvailable),
-            text: 'Select wallet',
+            text: t('dyn_secondary_wallet.title'),
         },
     ];
     if (ens === null || ens === void 0 ? void 0 : ens.name) {
         options.push({
             Icon: jsx(SvgCopy, {}),
             callback: () => copyToClipboard(ens.name),
-            text: 'Copy ENS',
+            copykey: 'dyn_secondary_wallet.copy_ens',
+            text: t('dyn_secondary_wallet.copy_ens'),
         });
     }
     options.push({
         Icon: jsx(SvgCopy, {}),
         callback: () => copyToClipboard(address || ''),
-        text: 'Copy address',
+        copykey: 'dyn_secondary_wallet.copy_address',
+        text: t('dyn_secondary_wallet.copy_address'),
     });
     if (!isEmbeddedConnector(connector) &&
         !(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.multiWalletUnlinkDisabled)) {
         options.push({
             Icon: jsx(SvgUnlink, {}),
             callback: () => setSelectedWalletWithAction({ action: 'unlink', wallet }),
-            text: `${authMode === 'connect-only' ? 'Disconnect' : 'Unlink'} from my account`,
+            copykey: authMode === 'connect-only'
+                ? 'dyn_secondary_wallet.disconnect_from_account'
+                : 'dyn_secondary_wallet.unlink_from_account',
+            text: authMode === 'connect-only'
+                ? t('dyn_secondary_wallet.disconnect_from_account')
+                : t('dyn_secondary_wallet.unlink_from_account'),
         });
     }
     const exportKeysOption = getExportKeysOption(connector, projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers);
@@ -149,7 +158,8 @@ const Wallet = ({ wallet, ens, clickable }) => {
         options.push({
             Icon: jsx(SvgKey, {}),
             callback: exportKeysOption,
-            text: 'Export private keys',
+            copykey: 'dyn_secondary_wallet.export',
+            text: t('dyn_secondary_wallet.export'),
         });
     }
     return (jsxs("div", { className: 'wallet__container', "data-testid": 'wallet', children: [jsxs("div", { className: classNames('wallet__row', {

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

@@ -106,7 +106,7 @@ require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 const WalletDetailsCard = ({ address, open, onClose, }) => {
     const { t } = reactI18next.useTranslation();
     const copyIcon = (jsxRuntime.jsx(Icon.Icon, { size: 'small', color: 'text-secondary', children: jsxRuntime.jsx(copy.ReactComponent, {}) }));
-    return (jsxRuntime.jsxs(OverlayCard.OverlayCard, { isOpen: open, onClose: onClose, children: [jsxRuntime.jsx(OverlayCard.OverlayCard.Header, { children: t('dyn_wallet_details_card.header') }), jsxRuntime.jsxs(OverlayCard.OverlayCard.Content, { className: 'wallet-details-card__body', children: [jsxRuntime.jsx(Typography.Typography, { className: 'wallet-details-card__text', color: 'primary', weight: 'bold', variant: 'body_small', children: t('dyn_wallet_details_card.address') }), jsxRuntime.jsx(Typography.Typography, { className: 'wallet-details-card__text', color: 'secondary', weight: 'regular', variant: 'body_small', children: address }), jsxRuntime.jsx(CopyButton.CopyButton, { textToCopy: address, variant: 'button', startSlot: copyIcon, children: t('dyn_wallet_details_card.copy') })] })] }));
+    return (jsxRuntime.jsxs(OverlayCard.OverlayCard, { isOpen: open, onClose: onClose, children: [jsxRuntime.jsx(OverlayCard.OverlayCard.Header, { children: t('dyn_wallet_details_card.header') }), jsxRuntime.jsxs(OverlayCard.OverlayCard.Content, { className: 'wallet-details-card__body', children: [jsxRuntime.jsx(Typography.Typography, { className: 'wallet-details-card__text', color: 'primary', weight: 'bold', variant: 'body_small', copykey: 'dyn_wallet_details_card.address', children: t('dyn_wallet_details_card.address') }), jsxRuntime.jsx(Typography.Typography, { className: 'wallet-details-card__text', color: 'secondary', weight: 'regular', variant: 'body_small', children: address }), jsxRuntime.jsx(CopyButton.CopyButton, { textToCopy: address, variant: 'button', startSlot: copyIcon, children: t('dyn_wallet_details_card.copy') })] })] }));
 };
 
 exports.WalletDetailsCard = WalletDetailsCard;

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

@@ -102,7 +102,7 @@ import '../../../../components/Popper/PopperContext/PopperContext.js';
 const WalletDetailsCard = ({ address, open, onClose, }) => {
     const { t } = useTranslation();
     const copyIcon = (jsx(Icon, { size: 'small', color: 'text-secondary', children: jsx(SvgCopy, {}) }));
-    return (jsxs(OverlayCard, { isOpen: open, onClose: onClose, children: [jsx(OverlayCard.Header, { children: t('dyn_wallet_details_card.header') }), jsxs(OverlayCard.Content, { className: 'wallet-details-card__body', children: [jsx(Typography, { className: 'wallet-details-card__text', color: 'primary', weight: 'bold', variant: 'body_small', children: t('dyn_wallet_details_card.address') }), jsx(Typography, { className: 'wallet-details-card__text', color: 'secondary', weight: 'regular', variant: 'body_small', children: address }), jsx(CopyButton, { textToCopy: address, variant: 'button', startSlot: copyIcon, children: t('dyn_wallet_details_card.copy') })] })] }));
+    return (jsxs(OverlayCard, { isOpen: open, onClose: onClose, children: [jsx(OverlayCard.Header, { children: t('dyn_wallet_details_card.header') }), jsxs(OverlayCard.Content, { className: 'wallet-details-card__body', children: [jsx(Typography, { className: 'wallet-details-card__text', color: 'primary', weight: 'bold', variant: 'body_small', copykey: 'dyn_wallet_details_card.address', children: t('dyn_wallet_details_card.address') }), jsx(Typography, { className: 'wallet-details-card__text', color: 'secondary', weight: 'regular', variant: 'body_small', children: address }), jsx(CopyButton, { textToCopy: address, variant: 'button', startSlot: copyIcon, children: t('dyn_wallet_details_card.copy') })] })] }));
 };
 
 export { WalletDetailsCard };

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

@@ -227,19 +227,19 @@ const AccountAndSecuritySettingsView = () => {
     const identitySectionTitleClasses = React.useMemo(() => classNames.classNames('settings-view__body__section__title', 'settings-view__body__section__title__info-icon'), []);
     const emailButtonClasses = React.useMemo(() => classNames.classNames('settings-view__body__section__button', 'settings-view__body__section__button__badge'), []);
     return (jsxRuntime.jsxs("div", { className: 'account-and-security-settings-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx("div", { className: 'send-balance-page-layout__header-content', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_settings.account_security.title', children: t('dyn_settings.account_security.title') }) }) }), jsxRuntime.jsx("div", { className: 'account-wrap', children: jsxRuntime.jsxs("div", { className: 'settings-view__body', children: [jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [shouldShowPasskeyMFA ||
-                                    (isMfaEnabled && (jsxRuntime.jsx("div", { className: securitySectionTitleClasses, children: t('dyn_settings.security_section.title') }))), shouldShowPasskeyMFA && (jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'manage-passkeys-button', onClick: handlePasskeyButtonClick, buttonClassName: passkeyButtonClasses, startSlot: 
+                                    (isMfaEnabled && (jsxRuntime.jsx("div", { className: securitySectionTitleClasses, children: jsxRuntime.jsx(Typography.Typography, { copykey: 'dyn_settings.security_section.title', children: t('dyn_settings.security_section.title') }) }))), shouldShowPasskeyMFA && (jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'manage-passkeys-button', onClick: handlePasskeyButtonClick, buttonClassName: passkeyButtonClasses, startSlot: 
                                     // eslint-disable-next-line react/jsx-wrap-multilines
                                     jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(PasskeyDeviceIcon.PasskeyDeviceIcon, { className: 'settings-view__body__section__button__icon', defaultIcon: jsxRuntime.jsx(androidTouchId.ReactComponent, { "data-testid": 'default-icon' }) }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.security_section.passkey_button', children: t('dyn_settings.security_section.passkey_button') }), !isTurnkeyWalletWithAuthenticator && (jsxRuntime.jsx(Badge.Badge, { text: t('dyn_settings.tags.recommended'), copykey: 'dyn_settings.tags.recommended', variant: 'secondary' }))] }), endSlot: renderPasskeysButtonEndSlot(), disabled: isLoading, showInternalLoading: false })), isMfaEnabled && (jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'manage-mfa-button', onClick: handleMfaClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
                                     // eslint-disable-next-line react/jsx-wrap-multilines
-                                    jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(shield.ReactComponent, { className: 'settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.security_section.mfa_button', children: t('dyn_settings.security_section.mfa_button') })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false }))] }), isZKSyncWallet && (jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsx("div", { className: identitySectionTitleClasses, children: t('dyn_settings.session_management.title') }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'session-management-button', onClick: handleSessionManagementClick, buttonClassName: 'settings-view__body__section__button', startSlot: jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(session.ReactComponent, { className: 'settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.session_management.session_management_button', children: t('dyn_settings.session_management.session_management_button') })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false })] })), (isEmbeddedWallet || isV3WaasWallet) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [isTurnkeyWallet &&
+                                    jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(shield.ReactComponent, { className: 'settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.security_section.mfa_button', children: t('dyn_settings.security_section.mfa_button') })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false }))] }), isZKSyncWallet && (jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsx("div", { className: identitySectionTitleClasses, children: jsxRuntime.jsx(Typography.Typography, { copykey: 'dyn_settings.session_management.title', children: t('dyn_settings.session_management.title') }) }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'session-management-button', onClick: handleSessionManagementClick, buttonClassName: 'settings-view__body__section__button', startSlot: jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(session.ReactComponent, { className: 'settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.session_management.session_management_button', children: t('dyn_settings.session_management.session_management_button') })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false })] })), (isEmbeddedWallet || isV3WaasWallet) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [isTurnkeyWallet &&
                                     !hasRecoveryEmail &&
-                                    !isSessionKeyCompatible && (jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsxs("div", { className: identitySectionTitleClasses, children: [t('dyn_settings.identity_section.title'), jsxRuntime.jsx(Icon.Icon, { size: 'small', children: jsxRuntime.jsx(footerInfoIcon.ReactComponent, { className: 'settings-view__body__section__title__info-icon', "data-testid": 'email-info-icon-title' }) })] }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'manage-email-recovery-button', onClick: addEmbeddedWalletRecoveryEmail, buttonClassName: emailButtonClasses, startSlot: 
+                                    !isSessionKeyCompatible && (jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsxs("div", { className: identitySectionTitleClasses, children: [jsxRuntime.jsx(Typography.Typography, { copykey: 'dyn_settings.identity_section.title', children: t('dyn_settings.identity_section.title') }), jsxRuntime.jsx(Icon.Icon, { size: 'small', children: jsxRuntime.jsx(footerInfoIcon.ReactComponent, { className: 'settings-view__body__section__title__info-icon', "data-testid": 'email-info-icon-title' }) })] }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'manage-email-recovery-button', onClick: addEmbeddedWalletRecoveryEmail, buttonClassName: emailButtonClasses, startSlot: 
                                             // eslint-disable-next-line react/jsx-wrap-multilines
-                                            jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(signInWithEmail.ReactComponent, { className: 'settings-view__body__section__button__icon email' }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.identity_section.add_email_button', children: t('dyn_settings.identity_section.add_email_button') }), jsxRuntime.jsx(Badge.Badge, { text: t('dyn_settings.tags.recommended'), copykey: 'dyn_settings.tags.recommended', variant: 'secondary' })] }), endSlot: renderEmailButtonEndSlot(), disabled: isLoading || hasRecoveryEmail, showInternalLoading: false })] })), jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsx("div", { className: 'settings-view__body__section__title', children: t('dyn_settings.export_section.title') }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'embedded-reveal-account-button', onClick: handleExportButtonClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
+                                            jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(signInWithEmail.ReactComponent, { className: 'settings-view__body__section__button__icon email' }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.identity_section.add_email_button', children: t('dyn_settings.identity_section.add_email_button') }), jsxRuntime.jsx(Badge.Badge, { text: t('dyn_settings.tags.recommended'), copykey: 'dyn_settings.tags.recommended', variant: 'secondary' })] }), endSlot: renderEmailButtonEndSlot(), disabled: isLoading || hasRecoveryEmail, showInternalLoading: false })] })), jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsx("div", { className: 'settings-view__body__section__title', children: jsxRuntime.jsx(Typography.Typography, { copykey: 'dyn_settings.export_section.title', children: t('dyn_settings.export_section.title') }) }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'embedded-reveal-account-button', onClick: handleExportButtonClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
                                             // eslint-disable-next-line react/jsx-wrap-multilines
                                             jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(exportPrivateKey.ReactComponent, { className: exportIconClasses }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.export_section.private_key_button', children: t('dyn_settings.export_section.private_key_button') })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), showInternalLoading: false }), isTurnkeyHDWallet && (jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'embedded-reveal-button', onClick: handleExportWithPhraseClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
                                             // eslint-disable-next-line react/jsx-wrap-multilines
-                                            jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(exportRecoveryPhrase.ReactComponent, { className: exportIconClasses }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.export_section.srp_button', children: t('dyn_settings.export_section.srp_button') })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), showInternalLoading: false }))] })] }))] }) }), jsxRuntime.jsx("div", { className: 'account-and-security-settings-view__delete-account-container', children: jsxRuntime.jsx(Typography.Typography, { onClick: handleDeleteAccountClick, "data-testid": 'delete-account-button', color: 'error-1', variant: 'body_small', weight: 'medium', className: 'account-and-security-settings-view__delete-account-container__delete-button', children: t('dyn_settings.delete_account.title') }) })] }));
+                                            jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(exportRecoveryPhrase.ReactComponent, { className: exportIconClasses }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.export_section.srp_button', children: t('dyn_settings.export_section.srp_button') })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), showInternalLoading: false }))] })] }))] }) }), jsxRuntime.jsx("div", { className: 'account-and-security-settings-view__delete-account-container', children: jsxRuntime.jsx(Typography.Typography, { onClick: handleDeleteAccountClick, "data-testid": 'delete-account-button', color: 'error-1', variant: 'body_small', weight: 'medium', className: 'account-and-security-settings-view__delete-account-container__delete-button', copykey: 'dyn_settings.delete_account.title', children: t('dyn_settings.delete_account.title') }) })] }));
 };
 
 exports.AccountAndSecuritySettingsView = AccountAndSecuritySettingsView;

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

@@ -223,19 +223,19 @@ const AccountAndSecuritySettingsView = () => {
     const identitySectionTitleClasses = useMemo(() => classNames('settings-view__body__section__title', 'settings-view__body__section__title__info-icon'), []);
     const emailButtonClasses = useMemo(() => classNames('settings-view__body__section__button', 'settings-view__body__section__button__badge'), []);
     return (jsxs("div", { className: 'account-and-security-settings-view', children: [jsx(ModalHeader, { leading: backButton, children: jsx("div", { className: 'send-balance-page-layout__header-content', children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_settings.account_security.title', children: t('dyn_settings.account_security.title') }) }) }), jsx("div", { className: 'account-wrap', children: jsxs("div", { className: 'settings-view__body', children: [jsxs("div", { className: 'settings-view__body__section', children: [shouldShowPasskeyMFA ||
-                                    (isMfaEnabled && (jsx("div", { className: securitySectionTitleClasses, children: t('dyn_settings.security_section.title') }))), shouldShowPasskeyMFA && (jsx(TypographyButton, { dataTestId: 'manage-passkeys-button', onClick: handlePasskeyButtonClick, buttonClassName: passkeyButtonClasses, startSlot: 
+                                    (isMfaEnabled && (jsx("div", { className: securitySectionTitleClasses, children: jsx(Typography, { copykey: 'dyn_settings.security_section.title', children: t('dyn_settings.security_section.title') }) }))), shouldShowPasskeyMFA && (jsx(TypographyButton, { dataTestId: 'manage-passkeys-button', onClick: handlePasskeyButtonClick, buttonClassName: passkeyButtonClasses, startSlot: 
                                     // eslint-disable-next-line react/jsx-wrap-multilines
                                     jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(PasskeyDeviceIcon, { className: 'settings-view__body__section__button__icon', defaultIcon: jsx(SvgAndroidTouchId, { "data-testid": 'default-icon' }) }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.security_section.passkey_button', children: t('dyn_settings.security_section.passkey_button') }), !isTurnkeyWalletWithAuthenticator && (jsx(Badge, { text: t('dyn_settings.tags.recommended'), copykey: 'dyn_settings.tags.recommended', variant: 'secondary' }))] }), endSlot: renderPasskeysButtonEndSlot(), disabled: isLoading, showInternalLoading: false })), isMfaEnabled && (jsx(TypographyButton, { dataTestId: 'manage-mfa-button', onClick: handleMfaClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
                                     // eslint-disable-next-line react/jsx-wrap-multilines
-                                    jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgShield, { className: 'settings-view__body__section__button__icon' }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.security_section.mfa_button', children: t('dyn_settings.security_section.mfa_button') })] }), endSlot: jsx(SvgChevronLeft, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false }))] }), isZKSyncWallet && (jsxs("div", { className: 'settings-view__body__section', children: [jsx("div", { className: identitySectionTitleClasses, children: t('dyn_settings.session_management.title') }), jsx(TypographyButton, { dataTestId: 'session-management-button', onClick: handleSessionManagementClick, buttonClassName: 'settings-view__body__section__button', startSlot: jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgSession, { className: 'settings-view__body__section__button__icon' }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.session_management.session_management_button', children: t('dyn_settings.session_management.session_management_button') })] }), endSlot: jsx(SvgChevronLeft, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false })] })), (isEmbeddedWallet || isV3WaasWallet) && (jsxs(Fragment, { children: [isTurnkeyWallet &&
+                                    jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgShield, { className: 'settings-view__body__section__button__icon' }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.security_section.mfa_button', children: t('dyn_settings.security_section.mfa_button') })] }), endSlot: jsx(SvgChevronLeft, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false }))] }), isZKSyncWallet && (jsxs("div", { className: 'settings-view__body__section', children: [jsx("div", { className: identitySectionTitleClasses, children: jsx(Typography, { copykey: 'dyn_settings.session_management.title', children: t('dyn_settings.session_management.title') }) }), jsx(TypographyButton, { dataTestId: 'session-management-button', onClick: handleSessionManagementClick, buttonClassName: 'settings-view__body__section__button', startSlot: jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgSession, { className: 'settings-view__body__section__button__icon' }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.session_management.session_management_button', children: t('dyn_settings.session_management.session_management_button') })] }), endSlot: jsx(SvgChevronLeft, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false })] })), (isEmbeddedWallet || isV3WaasWallet) && (jsxs(Fragment, { children: [isTurnkeyWallet &&
                                     !hasRecoveryEmail &&
-                                    !isSessionKeyCompatible && (jsxs("div", { className: 'settings-view__body__section', children: [jsxs("div", { className: identitySectionTitleClasses, children: [t('dyn_settings.identity_section.title'), jsx(Icon, { size: 'small', children: jsx(SvgFooterInfoIcon, { className: 'settings-view__body__section__title__info-icon', "data-testid": 'email-info-icon-title' }) })] }), jsx(TypographyButton, { dataTestId: 'manage-email-recovery-button', onClick: addEmbeddedWalletRecoveryEmail, buttonClassName: emailButtonClasses, startSlot: 
+                                    !isSessionKeyCompatible && (jsxs("div", { className: 'settings-view__body__section', children: [jsxs("div", { className: identitySectionTitleClasses, children: [jsx(Typography, { copykey: 'dyn_settings.identity_section.title', children: t('dyn_settings.identity_section.title') }), jsx(Icon, { size: 'small', children: jsx(SvgFooterInfoIcon, { className: 'settings-view__body__section__title__info-icon', "data-testid": 'email-info-icon-title' }) })] }), jsx(TypographyButton, { dataTestId: 'manage-email-recovery-button', onClick: addEmbeddedWalletRecoveryEmail, buttonClassName: emailButtonClasses, startSlot: 
                                             // eslint-disable-next-line react/jsx-wrap-multilines
-                                            jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgSignInWithEmail, { className: 'settings-view__body__section__button__icon email' }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.identity_section.add_email_button', children: t('dyn_settings.identity_section.add_email_button') }), jsx(Badge, { text: t('dyn_settings.tags.recommended'), copykey: 'dyn_settings.tags.recommended', variant: 'secondary' })] }), endSlot: renderEmailButtonEndSlot(), disabled: isLoading || hasRecoveryEmail, showInternalLoading: false })] })), jsxs("div", { className: 'settings-view__body__section', children: [jsx("div", { className: 'settings-view__body__section__title', children: t('dyn_settings.export_section.title') }), jsx(TypographyButton, { dataTestId: 'embedded-reveal-account-button', onClick: handleExportButtonClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
+                                            jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgSignInWithEmail, { className: 'settings-view__body__section__button__icon email' }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.identity_section.add_email_button', children: t('dyn_settings.identity_section.add_email_button') }), jsx(Badge, { text: t('dyn_settings.tags.recommended'), copykey: 'dyn_settings.tags.recommended', variant: 'secondary' })] }), endSlot: renderEmailButtonEndSlot(), disabled: isLoading || hasRecoveryEmail, showInternalLoading: false })] })), jsxs("div", { className: 'settings-view__body__section', children: [jsx("div", { className: 'settings-view__body__section__title', children: jsx(Typography, { copykey: 'dyn_settings.export_section.title', children: t('dyn_settings.export_section.title') }) }), jsx(TypographyButton, { dataTestId: 'embedded-reveal-account-button', onClick: handleExportButtonClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
                                             // eslint-disable-next-line react/jsx-wrap-multilines
                                             jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgExportPrivateKey, { className: exportIconClasses }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.export_section.private_key_button', children: t('dyn_settings.export_section.private_key_button') })] }), endSlot: jsx(SvgChevronLeft, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), showInternalLoading: false }), isTurnkeyHDWallet && (jsx(TypographyButton, { dataTestId: 'embedded-reveal-button', onClick: handleExportWithPhraseClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
                                             // eslint-disable-next-line react/jsx-wrap-multilines
-                                            jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgExportRecoveryPhrase, { className: exportIconClasses }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.export_section.srp_button', children: t('dyn_settings.export_section.srp_button') })] }), endSlot: jsx(SvgChevronLeft, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), showInternalLoading: false }))] })] }))] }) }), jsx("div", { className: 'account-and-security-settings-view__delete-account-container', children: jsx(Typography, { onClick: handleDeleteAccountClick, "data-testid": 'delete-account-button', color: 'error-1', variant: 'body_small', weight: 'medium', className: 'account-and-security-settings-view__delete-account-container__delete-button', children: t('dyn_settings.delete_account.title') }) })] }));
+                                            jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgExportRecoveryPhrase, { className: exportIconClasses }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.export_section.srp_button', children: t('dyn_settings.export_section.srp_button') })] }), endSlot: jsx(SvgChevronLeft, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), showInternalLoading: false }))] })] }))] }) }), jsx("div", { className: 'account-and-security-settings-view__delete-account-container', children: jsx(Typography, { onClick: handleDeleteAccountClick, "data-testid": 'delete-account-button', color: 'error-1', variant: 'body_small', weight: 'medium', className: 'account-and-security-settings-view__delete-account-container__delete-button', copykey: 'dyn_settings.delete_account.title', children: t('dyn_settings.delete_account.title') }) })] }));
 };
 
 export { AccountAndSecuritySettingsView };

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

@@ -19,7 +19,7 @@ const ChooseLinkedWalletView = ({ showBackButton = true, onSelectWallet, wallets
     const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
     const { t } = reactI18next.useTranslation();
     const backButton = showBackButton ? (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', id: 'back-button', "data-testid": 'back-button', onClick: () => setDynamicWidgetView('choose-wallet-funding-method'), children: jsxRuntime.jsx(arrowLeft.ReactComponent, {}) })) : undefined;
-    return (jsxRuntime.jsxs("div", { className: 'choose-linked-wallet-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', children: t('dyn_wallet_funding.from_linked_wallet.title') }) }), jsxRuntime.jsx(UserWalletsList.UserWalletsList, { onSelectWallet: onSelectWallet, wallets: wallets })] }));
+    return (jsxRuntime.jsxs("div", { className: 'choose-linked-wallet-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', copykey: 'dyn_wallet_funding.from_linked_wallet.title', children: t('dyn_wallet_funding.from_linked_wallet.title') }) }), jsxRuntime.jsx(UserWalletsList.UserWalletsList, { onSelectWallet: onSelectWallet, wallets: wallets })] }));
 };
 
 exports.ChooseLinkedWalletView = ChooseLinkedWalletView;

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

@@ -15,7 +15,7 @@ const ChooseLinkedWalletView = ({ showBackButton = true, onSelectWallet, wallets
     const { setDynamicWidgetView } = useWidgetContext();
     const { t } = useTranslation();
     const backButton = showBackButton ? (jsx(IconButton, { type: 'button', id: 'back-button', "data-testid": 'back-button', onClick: () => setDynamicWidgetView('choose-wallet-funding-method'), children: jsx(SvgArrowLeft, {}) })) : undefined;
-    return (jsxs("div", { className: 'choose-linked-wallet-view', children: [jsx(ModalHeader, { leading: backButton, children: jsx(Typography, { variant: 'title', children: t('dyn_wallet_funding.from_linked_wallet.title') }) }), jsx(UserWalletsList, { onSelectWallet: onSelectWallet, wallets: wallets })] }));
+    return (jsxs("div", { className: 'choose-linked-wallet-view', children: [jsx(ModalHeader, { leading: backButton, children: jsx(Typography, { variant: 'title', copykey: 'dyn_wallet_funding.from_linked_wallet.title', children: t('dyn_wallet_funding.from_linked_wallet.title') }) }), jsx(UserWalletsList, { onSelectWallet: onSelectWallet, wallets: wallets })] }));
 };
 
 export { ChooseLinkedWalletView };

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

@@ -111,7 +111,7 @@ const ChooseOnrampProviderView = () => {
     const { primaryWallet } = useInternalDynamicContext.useInternalDynamicContext();
     const onrampOptions = React.useMemo(() => enabledOnrampProviders.filter(({ isPaymentMethod }) => !isPaymentMethod), [enabledOnrampProviders]);
     const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', id: 'back-button', "data-testid": 'back-button', onClick: () => setDynamicWidgetView('choose-wallet-funding-method'), children: jsxRuntime.jsx(arrowLeft.ReactComponent, {}) }));
-    return (jsxRuntime.jsxs("div", { className: 'deposit-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, description: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', className: 'choose-onramp-provider__header-description', children: t('dyn_wallet_funding.onramp_provider_selection.description') }), children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', children: t('dyn_wallet_funding.onramp_provider_selection.title') }) }), jsxRuntime.jsx("div", { className: 'choose-wallet-funding-method__options', children: primaryWallet &&
+    return (jsxRuntime.jsxs("div", { className: 'deposit-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, description: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', className: 'choose-onramp-provider__header-description', copykey: 'dyn_wallet_funding.onramp_provider_selection.description', children: t('dyn_wallet_funding.onramp_provider_selection.description') }), children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', copykey: 'dyn_wallet_funding.onramp_provider_selection.title', children: t('dyn_wallet_funding.onramp_provider_selection.title') }) }), jsxRuntime.jsx("div", { className: 'choose-wallet-funding-method__options', children: primaryWallet &&
                     onrampOptions.map((option) => (jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => selectOnrampProvider({
                             provider: option,
                             wallet: primaryWallet,

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

@@ -107,7 +107,7 @@ const ChooseOnrampProviderView = () => {
     const { primaryWallet } = useInternalDynamicContext();
     const onrampOptions = useMemo(() => enabledOnrampProviders.filter(({ isPaymentMethod }) => !isPaymentMethod), [enabledOnrampProviders]);
     const backButton = (jsx(IconButton, { type: 'button', id: 'back-button', "data-testid": 'back-button', onClick: () => setDynamicWidgetView('choose-wallet-funding-method'), children: jsx(SvgArrowLeft, {}) }));
-    return (jsxs("div", { className: 'deposit-view', children: [jsx(ModalHeader, { leading: backButton, description: jsx(Typography, { variant: 'body_small', color: 'secondary', className: 'choose-onramp-provider__header-description', children: t('dyn_wallet_funding.onramp_provider_selection.description') }), children: jsx(Typography, { variant: 'title', children: t('dyn_wallet_funding.onramp_provider_selection.title') }) }), jsx("div", { className: 'choose-wallet-funding-method__options', children: primaryWallet &&
+    return (jsxs("div", { className: 'deposit-view', children: [jsx(ModalHeader, { leading: backButton, description: jsx(Typography, { variant: 'body_small', color: 'secondary', className: 'choose-onramp-provider__header-description', copykey: 'dyn_wallet_funding.onramp_provider_selection.description', children: t('dyn_wallet_funding.onramp_provider_selection.description') }), children: jsx(Typography, { variant: 'title', copykey: 'dyn_wallet_funding.onramp_provider_selection.title', children: t('dyn_wallet_funding.onramp_provider_selection.title') }) }), jsx("div", { className: 'choose-wallet-funding-method__options', children: primaryWallet &&
                     onrampOptions.map((option) => (jsx(TypographyButton, { onClick: () => selectOnrampProvider({
                             provider: option,
                             wallet: primaryWallet,

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

@@ -23,7 +23,7 @@ const ChooseWalletFundingMethod = () => {
     const { t } = reactI18next.useTranslation();
     const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', id: 'back-button', "data-testid": 'back-button', onClick: goToInitialDynamicWidgetView, children: jsxRuntime.jsx(arrowLeft.ReactComponent, {}) }));
     const methods = useFundingMethods.useFundingMethods();
-    return (jsxRuntime.jsxs("div", { className: 'choose-wallet-funding-method', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', children: t('dyn_wallet_funding.funding_method_selection.title') }) }), jsxRuntime.jsx("div", { className: 'choose-wallet-funding-method__options', children: methods.map((method) => {
+    return (jsxRuntime.jsxs("div", { className: 'choose-wallet-funding-method', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', copykey: 'dyn_wallet_funding.funding_method_selection.title', children: t('dyn_wallet_funding.funding_method_selection.title') }) }), jsxRuntime.jsx("div", { className: 'choose-wallet-funding-method__options', children: methods.map((method) => {
                     var _a;
                     return (jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: method.onClick, description: method.description, leading: jsxRuntime.jsx(Icon.Icon, { color: 'text-tertiary', className: 'choose-wallet-funding-method__options__option__icon', children: method.icon }), trailing: jsxRuntime.jsx(MakeTrailing.MakeTrailing, { previewIcons: (_a = method.previewIcons) !== null && _a !== void 0 ? _a : [], showChevron: Boolean(method.showChevron) }), typographyProps: { variant: 'body_normal', weight: 'medium' }, buttonVariant: 'card', className: 'choose-wallet-funding-method__options__option', children: method.label }, method.key));
                 }) })] }));

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

@@ -19,7 +19,7 @@ const ChooseWalletFundingMethod = () => {
     const { t } = useTranslation();
     const backButton = (jsx(IconButton, { type: 'button', id: 'back-button', "data-testid": 'back-button', onClick: goToInitialDynamicWidgetView, children: jsx(SvgArrowLeft, {}) }));
     const methods = useFundingMethods();
-    return (jsxs("div", { className: 'choose-wallet-funding-method', children: [jsx(ModalHeader, { leading: backButton, children: jsx(Typography, { variant: 'title', children: t('dyn_wallet_funding.funding_method_selection.title') }) }), jsx("div", { className: 'choose-wallet-funding-method__options', children: methods.map((method) => {
+    return (jsxs("div", { className: 'choose-wallet-funding-method', children: [jsx(ModalHeader, { leading: backButton, children: jsx(Typography, { variant: 'title', copykey: 'dyn_wallet_funding.funding_method_selection.title', children: t('dyn_wallet_funding.funding_method_selection.title') }) }), jsx("div", { className: 'choose-wallet-funding-method__options', children: methods.map((method) => {
                     var _a;
                     return (jsx(TypographyButton, { onClick: method.onClick, description: method.description, leading: jsx(Icon, { color: 'text-tertiary', className: 'choose-wallet-funding-method__options__option__icon', children: method.icon }), trailing: jsx(MakeTrailing, { previewIcons: (_a = method.previewIcons) !== null && _a !== void 0 ? _a : [], showChevron: Boolean(method.showChevron) }), typographyProps: { variant: 'body_normal', weight: 'medium' }, buttonVariant: 'card', className: 'choose-wallet-funding-method__options__option', children: method.label }, method.key));
                 }) })] }));

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

@@ -113,24 +113,24 @@ const ConfirmExchangeTransferView = ({ amount, toAddress, exchange, token, accou
     const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', id: 'back-button', "data-testid": 'back-button', onClick: () => {
             onBack();
         }, children: jsxRuntime.jsx(arrowLeft.ReactComponent, {}) }));
-    return (jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', children: t('dyn_exchange_transfer_confirmation.title') }) }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content', children: [jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__modal', children: jsxRuntime.jsxs(ModalCard.ModalCard, { border: false, sharpBorder: true, dropShadow: false, children: [jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top', children: [jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top__token', children: [(token === null || token === void 0 ? void 0 : token.logoURI) ? (jsxRuntime.jsx(Image.Image, { src: token.logoURI, alt: token.symbol, className: 'confirm-exchange-transfer__content__modal__top__token__icon', dataTestId: 'confirm-exchange-transfer__content__modal__top__token__icon' })) : (jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__modal__top__token__icon--skeleton', "data-testid": 'confirm-exchange-transfer__content__modal__top__token__icon--skeleton' })), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', className: 'confirm-exchange-transfer__content__modal__top__token__name', children: token === null || token === void 0 ? void 0 : token.symbol }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top__token__balance-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', "data-testid": 'confirm-exchange-transfer_token-option__primary', children: t('dyn_exchange_transfer_confirmation.send', {
+    return (jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', copykey: 'dyn_exchange_transfer_confirmation.title', children: t('dyn_exchange_transfer_confirmation.title') }) }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content', children: [jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__modal', children: jsxRuntime.jsxs(ModalCard.ModalCard, { border: false, sharpBorder: true, dropShadow: false, children: [jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top', children: [jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top__token', children: [(token === null || token === void 0 ? void 0 : token.logoURI) ? (jsxRuntime.jsx(Image.Image, { src: token.logoURI, alt: token.symbol, className: 'confirm-exchange-transfer__content__modal__top__token__icon', dataTestId: 'confirm-exchange-transfer__content__modal__top__token__icon' })) : (jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__modal__top__token__icon--skeleton', "data-testid": 'confirm-exchange-transfer__content__modal__top__token__icon--skeleton' })), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', className: 'confirm-exchange-transfer__content__modal__top__token__name', children: token === null || token === void 0 ? void 0 : token.symbol }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top__token__balance-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', "data-testid": 'confirm-exchange-transfer_token-option__primary', copykey: 'dyn_exchange_transfer_confirmation.send', children: t('dyn_exchange_transfer_confirmation.send', {
                                                                 fiatCurrency: fiatAmount,
                                                                 fiatCurrencySymbol,
-                                                            }) }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer_token-option__secondary', children: `${amount} ${token === null || token === void 0 ? void 0 : token.symbol}` })] })] }), jsxRuntime.jsx(Divider.Divider, {})] }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction', children: [jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', children: t('dyn_exchange_transfer_confirmation.from') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: accountIdentifier
+                                                            }) }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer_token-option__secondary', children: `${amount} ${token === null || token === void 0 ? void 0 : token.symbol}` })] })] }), jsxRuntime.jsx(Divider.Divider, {})] }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction', children: [jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', copykey: 'dyn_exchange_transfer_confirmation.from', children: t('dyn_exchange_transfer_confirmation.from') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: accountIdentifier
                                                         ? `${(exchange === null || exchange === void 0 ? void 0 : exchange.charAt(0).toUpperCase()) + (exchange === null || exchange === void 0 ? void 0 : exchange.slice(1))} ${accountIdentifier}`
-                                                        : `${(exchange === null || exchange === void 0 ? void 0 : exchange.charAt(0).toUpperCase()) + (exchange === null || exchange === void 0 ? void 0 : exchange.slice(1))}` })] }), jsxRuntime.jsx(Divider.Divider, {}), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', children: t('dyn_exchange_transfer_confirmation.to') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: shortenWalletAddress.shortenWalletAddress(toAddress) })] }), jsxRuntime.jsx(Divider.Divider, {}), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', children: t('dyn_exchange_transfer_confirmation.fee') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: fee
+                                                        : `${(exchange === null || exchange === void 0 ? void 0 : exchange.charAt(0).toUpperCase()) + (exchange === null || exchange === void 0 ? void 0 : exchange.slice(1))}` })] }), jsxRuntime.jsx(Divider.Divider, {}), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', copykey: 'dyn_exchange_transfer_confirmation.to', children: t('dyn_exchange_transfer_confirmation.to') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: shortenWalletAddress.shortenWalletAddress(toAddress) })] }), jsxRuntime.jsx(Divider.Divider, {}), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', copykey: 'dyn_exchange_transfer_confirmation.fee', children: t('dyn_exchange_transfer_confirmation.fee') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', copykey: 'dyn_exchange_transfer_confirmation.fee_not_found', children: fee
                                                         ? `${feeInFiat} ${fiatCurrencySymbol} (${fee} ${token === null || token === void 0 ? void 0 : token.symbol})`
-                                                        : t('dyn_exchange_transfer_confirmation.fee_not_found') })] }), jsxRuntime.jsx(Divider.Divider, {}), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive', children: [jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive__container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container', children: t('dyn_exchange_transfer_confirmation.receive') }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container__fees', children: fee
+                                                        : t('dyn_exchange_transfer_confirmation.fee_not_found') })] }), jsxRuntime.jsx(Divider.Divider, {}), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive', children: [jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive__container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container', copykey: 'dyn_exchange_transfer_confirmation.receive', children: t('dyn_exchange_transfer_confirmation.receive') }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container__fees', copykey: 'dyn_exchange_transfer_confirmation.cost', children: fee
                                                                 ? t('dyn_exchange_transfer_confirmation.cost')
                                                                 : t('dyn_exchange_transfer_confirmation.cost_no_fee') })] }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive__amount-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'bold', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container', children: fee && fiatAmount && feeInFiat
                                                                 ? `${fiatAmount - feeInFiat} ${fiatCurrencySymbol}`
                                                                 : `${fiatAmount} ${fiatCurrencySymbol}` }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container__fees', children: fee && amount
                                                                 ? `${amount - fee} ${token === null || token === void 0 ? void 0 : token.symbol}`
-                                                                : `${amount} ${token === null || token === void 0 ? void 0 : token.symbol}` })] })] })] })] }) }), jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__terms', children: jsxRuntime.jsx(ModalCard.ModalCard, { border: false, sharpBorder: true, dropShadow: false, children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: t('dyn_exchange_transfer_confirmation.terms') }) }) }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__buttons', children: [jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__buttons__button', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'cancel-button', buttonVariant: 'card', typographyProps: { weight: 'bold' }, className: 'confirm-exchange-transfer__content__buttons__button', onClick: () => {
+                                                                : `${amount} ${token === null || token === void 0 ? void 0 : token.symbol}` })] })] })] })] }) }), jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__terms', children: jsxRuntime.jsx(ModalCard.ModalCard, { border: false, sharpBorder: true, dropShadow: false, children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', copykey: 'dyn_exchange_transfer_confirmation.terms', children: t('dyn_exchange_transfer_confirmation.terms') }) }) }), jsxRuntime.jsxs("div", { className: 'confirm-exchange-transfer__content__buttons', children: [jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__buttons__button', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'cancel-button', buttonVariant: 'card', typographyProps: { weight: 'bold' }, className: 'confirm-exchange-transfer__content__buttons__button', onClick: () => {
                                         goToInitialDynamicWidgetView();
-                                    }, children: t('dyn_exchange_transfer_confirmation.cancel') }) }), jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__buttons__button', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'confirm-button', buttonVariant: 'brand-primary', typographyProps: { color: 'white', weight: 'bold' }, className: 'confirm-exchange-transfer__content__buttons__button', onClick: () => {
+                                    }, copykey: 'dyn_exchange_transfer_confirmation.cancel', children: t('dyn_exchange_transfer_confirmation.cancel') }) }), jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__buttons__button', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'confirm-button', buttonVariant: 'brand-primary', typographyProps: { color: 'white', weight: 'bold' }, className: 'confirm-exchange-transfer__content__buttons__button', onClick: () => {
                                         onSubmit();
-                                    }, children: t('dyn_exchange_transfer_confirmation.confirm') }) })] })] }), jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__footer', children: jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, { asFooter: true }) })] }));
+                                    }, copykey: 'dyn_exchange_transfer_confirmation.confirm', children: t('dyn_exchange_transfer_confirmation.confirm') }) })] })] }), jsxRuntime.jsx("div", { className: 'confirm-exchange-transfer__content__footer', children: jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, { asFooter: true }) })] }));
 };
 
 exports.ConfirmExchangeTransferView = ConfirmExchangeTransferView;

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

@@ -109,24 +109,24 @@ const ConfirmExchangeTransferView = ({ amount, toAddress, exchange, token, accou
     const backButton = (jsx(IconButton, { type: 'button', id: 'back-button', "data-testid": 'back-button', onClick: () => {
             onBack();
         }, children: jsx(SvgArrowLeft, {}) }));
-    return (jsxs("div", { className: 'confirm-exchange-transfer', children: [jsx(ModalHeader, { leading: backButton, children: jsx(Typography, { variant: 'title', children: t('dyn_exchange_transfer_confirmation.title') }) }), jsxs("div", { className: 'confirm-exchange-transfer__content', children: [jsx("div", { className: 'confirm-exchange-transfer__content__modal', children: jsxs(ModalCard, { border: false, sharpBorder: true, dropShadow: false, children: [jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top', children: [jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top__token', children: [(token === null || token === void 0 ? void 0 : token.logoURI) ? (jsx(Image, { src: token.logoURI, alt: token.symbol, className: 'confirm-exchange-transfer__content__modal__top__token__icon', dataTestId: 'confirm-exchange-transfer__content__modal__top__token__icon' })) : (jsx("div", { className: 'confirm-exchange-transfer__content__modal__top__token__icon--skeleton', "data-testid": 'confirm-exchange-transfer__content__modal__top__token__icon--skeleton' })), jsx(Typography, { variant: 'body_normal', className: 'confirm-exchange-transfer__content__modal__top__token__name', children: token === null || token === void 0 ? void 0 : token.symbol }), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top__token__balance-container', children: [jsx(Typography, { variant: 'body_normal', weight: 'medium', "data-testid": 'confirm-exchange-transfer_token-option__primary', children: t('dyn_exchange_transfer_confirmation.send', {
+    return (jsxs("div", { className: 'confirm-exchange-transfer', children: [jsx(ModalHeader, { leading: backButton, children: jsx(Typography, { variant: 'title', copykey: 'dyn_exchange_transfer_confirmation.title', children: t('dyn_exchange_transfer_confirmation.title') }) }), jsxs("div", { className: 'confirm-exchange-transfer__content', children: [jsx("div", { className: 'confirm-exchange-transfer__content__modal', children: jsxs(ModalCard, { border: false, sharpBorder: true, dropShadow: false, children: [jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top', children: [jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top__token', children: [(token === null || token === void 0 ? void 0 : token.logoURI) ? (jsx(Image, { src: token.logoURI, alt: token.symbol, className: 'confirm-exchange-transfer__content__modal__top__token__icon', dataTestId: 'confirm-exchange-transfer__content__modal__top__token__icon' })) : (jsx("div", { className: 'confirm-exchange-transfer__content__modal__top__token__icon--skeleton', "data-testid": 'confirm-exchange-transfer__content__modal__top__token__icon--skeleton' })), jsx(Typography, { variant: 'body_normal', className: 'confirm-exchange-transfer__content__modal__top__token__name', children: token === null || token === void 0 ? void 0 : token.symbol }), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__top__token__balance-container', children: [jsx(Typography, { variant: 'body_normal', weight: 'medium', "data-testid": 'confirm-exchange-transfer_token-option__primary', copykey: 'dyn_exchange_transfer_confirmation.send', children: t('dyn_exchange_transfer_confirmation.send', {
                                                                 fiatCurrency: fiatAmount,
                                                                 fiatCurrencySymbol,
-                                                            }) }), jsx(Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer_token-option__secondary', children: `${amount} ${token === null || token === void 0 ? void 0 : token.symbol}` })] })] }), jsx(Divider, {})] }), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction', children: [jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', children: t('dyn_exchange_transfer_confirmation.from') }), jsx(Typography, { variant: 'body_normal', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: accountIdentifier
+                                                            }) }), jsx(Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer_token-option__secondary', children: `${amount} ${token === null || token === void 0 ? void 0 : token.symbol}` })] })] }), jsx(Divider, {})] }), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction', children: [jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', copykey: 'dyn_exchange_transfer_confirmation.from', children: t('dyn_exchange_transfer_confirmation.from') }), jsx(Typography, { variant: 'body_normal', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: accountIdentifier
                                                         ? `${(exchange === null || exchange === void 0 ? void 0 : exchange.charAt(0).toUpperCase()) + (exchange === null || exchange === void 0 ? void 0 : exchange.slice(1))} ${accountIdentifier}`
-                                                        : `${(exchange === null || exchange === void 0 ? void 0 : exchange.charAt(0).toUpperCase()) + (exchange === null || exchange === void 0 ? void 0 : exchange.slice(1))}` })] }), jsx(Divider, {}), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', children: t('dyn_exchange_transfer_confirmation.to') }), jsx(Typography, { variant: 'body_normal', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: shortenWalletAddress(toAddress) })] }), jsx(Divider, {}), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', children: t('dyn_exchange_transfer_confirmation.fee') }), jsx(Typography, { variant: 'body_normal', weight: 'medium', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: fee
+                                                        : `${(exchange === null || exchange === void 0 ? void 0 : exchange.charAt(0).toUpperCase()) + (exchange === null || exchange === void 0 ? void 0 : exchange.slice(1))}` })] }), jsx(Divider, {}), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', copykey: 'dyn_exchange_transfer_confirmation.to', children: t('dyn_exchange_transfer_confirmation.to') }), jsx(Typography, { variant: 'body_normal', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: shortenWalletAddress(toAddress) })] }), jsx(Divider, {}), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__from', children: [jsx(Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'confirm-exchange-transfer__content__modal__transaction__from__title', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__title', copykey: 'dyn_exchange_transfer_confirmation.fee', children: t('dyn_exchange_transfer_confirmation.fee') }), jsx(Typography, { variant: 'body_normal', weight: 'medium', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', copykey: 'dyn_exchange_transfer_confirmation.fee_not_found', children: fee
                                                         ? `${feeInFiat} ${fiatCurrencySymbol} (${fee} ${token === null || token === void 0 ? void 0 : token.symbol})`
-                                                        : t('dyn_exchange_transfer_confirmation.fee_not_found') })] }), jsx(Divider, {}), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive', children: [jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive__container', children: [jsx(Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container', children: t('dyn_exchange_transfer_confirmation.receive') }), jsx(Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container__fees', children: fee
+                                                        : t('dyn_exchange_transfer_confirmation.fee_not_found') })] }), jsx(Divider, {}), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive', children: [jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive__container', children: [jsx(Typography, { variant: 'body_normal', weight: 'bold', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container', copykey: 'dyn_exchange_transfer_confirmation.receive', children: t('dyn_exchange_transfer_confirmation.receive') }), jsx(Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container__fees', copykey: 'dyn_exchange_transfer_confirmation.cost', children: fee
                                                                 ? t('dyn_exchange_transfer_confirmation.cost')
                                                                 : t('dyn_exchange_transfer_confirmation.cost_no_fee') })] }), jsxs("div", { className: 'confirm-exchange-transfer__content__modal__transaction__receive__amount-container', children: [jsx(Typography, { variant: 'body_normal', weight: 'bold', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container', children: fee && fiatAmount && feeInFiat
                                                                 ? `${fiatAmount - feeInFiat} ${fiatCurrencySymbol}`
                                                                 : `${fiatAmount} ${fiatCurrencySymbol}` }), jsx(Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__receive__container__fees', children: fee && amount
                                                                 ? `${amount - fee} ${token === null || token === void 0 ? void 0 : token.symbol}`
-                                                                : `${amount} ${token === null || token === void 0 ? void 0 : token.symbol}` })] })] })] })] }) }), jsx("div", { className: 'confirm-exchange-transfer__content__terms', children: jsx(ModalCard, { border: false, sharpBorder: true, dropShadow: false, children: jsx(Typography, { variant: 'body_small', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', children: t('dyn_exchange_transfer_confirmation.terms') }) }) }), jsxs("div", { className: 'confirm-exchange-transfer__content__buttons', children: [jsx("div", { className: 'confirm-exchange-transfer__content__buttons__button', children: jsx(TypographyButton, { dataTestId: 'cancel-button', buttonVariant: 'card', typographyProps: { weight: 'bold' }, className: 'confirm-exchange-transfer__content__buttons__button', onClick: () => {
+                                                                : `${amount} ${token === null || token === void 0 ? void 0 : token.symbol}` })] })] })] })] }) }), jsx("div", { className: 'confirm-exchange-transfer__content__terms', children: jsx(ModalCard, { border: false, sharpBorder: true, dropShadow: false, children: jsx(Typography, { variant: 'body_small', weight: 'regular', className: 'confirm-exchange-transfer__content__modal__transaction__from__exchange', "data-testid": 'confirm-exchange-transfer__content__modal__transaction__from__exchange', copykey: 'dyn_exchange_transfer_confirmation.terms', children: t('dyn_exchange_transfer_confirmation.terms') }) }) }), jsxs("div", { className: 'confirm-exchange-transfer__content__buttons', children: [jsx("div", { className: 'confirm-exchange-transfer__content__buttons__button', children: jsx(TypographyButton, { dataTestId: 'cancel-button', buttonVariant: 'card', typographyProps: { weight: 'bold' }, className: 'confirm-exchange-transfer__content__buttons__button', onClick: () => {
                                         goToInitialDynamicWidgetView();
-                                    }, children: t('dyn_exchange_transfer_confirmation.cancel') }) }), jsx("div", { className: 'confirm-exchange-transfer__content__buttons__button', children: jsx(TypographyButton, { dataTestId: 'confirm-button', buttonVariant: 'brand-primary', typographyProps: { color: 'white', weight: 'bold' }, className: 'confirm-exchange-transfer__content__buttons__button', onClick: () => {
+                                    }, copykey: 'dyn_exchange_transfer_confirmation.cancel', children: t('dyn_exchange_transfer_confirmation.cancel') }) }), jsx("div", { className: 'confirm-exchange-transfer__content__buttons__button', children: jsx(TypographyButton, { dataTestId: 'confirm-button', buttonVariant: 'brand-primary', typographyProps: { color: 'white', weight: 'bold' }, className: 'confirm-exchange-transfer__content__buttons__button', onClick: () => {
                                         onSubmit();
-                                    }, children: t('dyn_exchange_transfer_confirmation.confirm') }) })] })] }), jsx("div", { className: 'confirm-exchange-transfer__content__footer', children: jsx(PoweredByDynamic, { asFooter: true }) })] }));
+                                    }, copykey: 'dyn_exchange_transfer_confirmation.confirm', children: t('dyn_exchange_transfer_confirmation.confirm') }) })] })] }), jsx("div", { className: 'confirm-exchange-transfer__content__footer', children: jsx(PoweredByDynamic, { asFooter: true }) })] }));
 };
 
 export { ConfirmExchangeTransferView };

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

@@ -175,13 +175,13 @@ 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', 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: {
+    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', color: 'primary', className: 'title', copykey: 'global_wallet.connected_apps.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', copykey: 'global_wallet.connected_apps.subtitle', 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',
                                     }, 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 }) })] }))] }));
+                                    } })] })] }, app.url))) })), showSuccessMessage && (jsxRuntime.jsxs("div", { className: 'success-message', children: [jsxRuntime.jsx(check.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'primary', copykey: 'global_wallet.connected_apps.success', children: t('global_wallet.connected_apps.success', { name }) })] }))] }));
 };
 
 exports.ConnectedAppsView = ConnectedAppsView;

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

@@ -171,13 +171,13 @@ 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', 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: {
+    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', color: 'primary', className: 'title', copykey: 'global_wallet.connected_apps.title', children: t('global_wallet.connected_apps.title') })] }), jsx("div", { className: 'subheader', children: jsx(Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', copykey: 'global_wallet.connected_apps.subtitle', 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',
                                     }, 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 }) })] }))] }));
+                                    } })] })] }, app.url))) })), showSuccessMessage && (jsxs("div", { className: 'success-message', children: [jsx(SvgCheck, {}), jsx(Typography, { variant: 'body_small', color: 'primary', copykey: 'global_wallet.connected_apps.success', children: t('global_wallet.connected_apps.success', { name }) })] }))] }));
 };
 
 export { ConnectedAppsView, ConnectedAppsView as default };