@dynamic-labs/sdk-react-core 0.17.0-RC.13 → 0.17.0-RC.15

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

@@ -42,14 +42,14 @@ var Wallet = require('../Wallet/Wallet.cjs');
 
 const DynamicWidgetWallets = () => {
     const { secondaryWallets, user } = useInternalDynamicContext.useInternalDynamicContext();
-    const { setNewWalletId, availableWalletsContainerRef } = DynamicWidgetContext.useWidgetContext();
+    const { availableWalletsContainerRef } = DynamicWidgetContext.useWidgetContext();
     const isEmpty = secondaryWallets.length === 0;
     const isKYCEnabled = useKYCFlag.useKYCFlag();
     return (jsxRuntime.jsxs("div", Object.assign({ ref: availableWalletsContainerRef, className: 'dynamic-widget-wallets', "data-testid": 'dynamicWidgetWallets' }, { children: [!isKYCEnabled && (jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'regular', variant: 'body_normal', color: 'secondary', className: 'dynamic-widget-wallets__title' }, { children: "My wallets" }))), jsxRuntime.jsx("div", Object.assign({ className: classNames.classNames('available-wallets__body', {
                     'dynamic-widget-wallets__body--apply-height': !isEmpty,
                 }) }, { children: isEmpty ? (jsxRuntime.jsx(EmptyWallets.EmptyWallets, {})) : (jsxRuntime.jsx("div", Object.assign({ className: 'available-wallets__wallet-list' }, { children: secondaryWallets.map((wallet, index) => {
                         var _a;
-                        return (jsxRuntime.jsx(Wallet.Wallet, { ens: (_a = getWalletVerifiedCredential.getWalletVerifiedCredential(wallet.address, user === null || user === void 0 ? void 0 : user.verifiedCredentials)) === null || _a === void 0 ? void 0 : _a.nameService, wallet: wallet, setNewWalletId: setNewWalletId }, wallet.id));
+                        return (jsxRuntime.jsx(Wallet.Wallet, { ens: (_a = getWalletVerifiedCredential.getWalletVerifiedCredential(wallet.address, user === null || user === void 0 ? void 0 : user.verifiedCredentials)) === null || _a === void 0 ? void 0 : _a.nameService, wallet: wallet }, wallet.id));
                     }) }))) }))] })));
 };
 

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

@@ -38,14 +38,14 @@ import { Wallet } from '../Wallet/Wallet.js';
 
 const DynamicWidgetWallets = () => {
     const { secondaryWallets, user } = useInternalDynamicContext();
-    const { setNewWalletId, availableWalletsContainerRef } = useWidgetContext();
+    const { availableWalletsContainerRef } = useWidgetContext();
     const isEmpty = secondaryWallets.length === 0;
     const isKYCEnabled = useKYCFlag();
     return (jsxs("div", Object.assign({ ref: availableWalletsContainerRef, className: 'dynamic-widget-wallets', "data-testid": 'dynamicWidgetWallets' }, { children: [!isKYCEnabled && (jsx(Typography, Object.assign({ weight: 'regular', variant: 'body_normal', color: 'secondary', className: 'dynamic-widget-wallets__title' }, { children: "My wallets" }))), jsx("div", Object.assign({ className: classNames('available-wallets__body', {
                     'dynamic-widget-wallets__body--apply-height': !isEmpty,
                 }) }, { children: isEmpty ? (jsx(EmptyWallets, {})) : (jsx("div", Object.assign({ className: 'available-wallets__wallet-list' }, { children: secondaryWallets.map((wallet, index) => {
                         var _a;
-                        return (jsx(Wallet, { ens: (_a = getWalletVerifiedCredential(wallet.address, user === null || user === void 0 ? void 0 : user.verifiedCredentials)) === null || _a === void 0 ? void 0 : _a.nameService, wallet: wallet, setNewWalletId: setNewWalletId }, wallet.id));
+                        return (jsx(Wallet, { ens: (_a = getWalletVerifiedCredential(wallet.address, user === null || user === void 0 ? void 0 : user.verifiedCredentials)) === null || _a === void 0 ? void 0 : _a.nameService, wallet: wallet }, wallet.id));
                     }) }))) }))] })));
 };
 

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

@@ -41,14 +41,10 @@ require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 var DotsMenu = require('../DotsMenu/DotsMenu.cjs');
 var helpers = require('../../helpers/helpers.cjs');
 var WalletIconWithStatus = require('../WalletIconWithStatus/WalletIconWithStatus.cjs');
-var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
 
-const Wallet = ({ setNewWalletId, wallet, ens }) => {
-    const walletPublicKey = wallet.address;
-    const walletId = wallet.id;
-    const { connector } = wallet;
-    const { computeConnectedStateForWallets, setPrimaryWallet, setSelectedWalletConnector, } = useInternalDynamicContext.useInternalDynamicContext();
-    const { setWalletIdToUnlink } = DynamicWidgetContext.useWidgetContext();
+const Wallet = ({ wallet, ens }) => {
+    const { id: walletId, connector, address, connected } = wallet;
+    const { computeConnectedStateForWallets, setPrimaryWallet, setSelectedWalletConnector, setSelectedWalletWithAction, } = useInternalDynamicContext.useInternalDynamicContext();
     const iconSize = 20;
     const options = [
         {
@@ -66,23 +62,24 @@ const Wallet = ({ setNewWalletId, wallet, ens }) => {
     }
     options.push({
         Icon: jsxRuntime.jsx(copy.ReactComponent, {}),
-        callback: () => helpers.copyToClipboard(walletPublicKey || ''),
+        callback: () => helpers.copyToClipboard(address || ''),
         text: 'Copy address',
     }, {
         Icon: jsxRuntime.jsx(unlink.ReactComponent, {}),
-        callback: () => setWalletIdToUnlink(walletId),
+        callback: () => setSelectedWalletWithAction({ action: 'unlink', wallet }),
         text: 'Unlink from my account',
     });
     const onSelectWalletClick = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        if (wallet.connector.connectedChain === 'FLOW') {
-            wallet.connector.endSession();
+        var _a;
+        if (connector.connectedChain === 'FLOW') {
+            (_a = connector.endSession) === null || _a === void 0 ? void 0 : _a.call(connector);
         }
-        setNewWalletId === null || setNewWalletId === void 0 ? void 0 : setNewWalletId(walletId);
+        setSelectedWalletWithAction({ action: 'select', wallet });
         setPrimaryWallet(walletId);
         computeConnectedStateForWallets();
-        setSelectedWalletConnector(wallet.connector);
+        setSelectedWalletConnector(connector);
     });
-    return (jsxRuntime.jsxs("div", Object.assign({ className: 'wallet__container', "data-testid": 'wallet' }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: 'wallet__row' }, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'wallet__icon-container' }, { children: jsxRuntime.jsx(WalletIconWithStatus.WalletIconWithStatus, { iconSize: iconSize, walletName: connector.name, connected: wallet.connected, variant: 'secondary' }) })), (ens === null || ens === void 0 ? void 0 : ens.name) ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ className: 'wallet__ens-name', variant: 'body_small', color: 'primary', truncate: true }, { children: ens === null || ens === void 0 ? void 0 : ens.name })), jsxRuntime.jsx("div", { className: 'wallet__row__seperator' }), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_mini', color: 'secondary' }, { children: shortenWalletAddress.shortenWalletAddress(walletPublicKey, 3, 3) }))] })) : (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', color: 'primary' }, { children: shortenWalletAddress.shortenWalletAddress(walletPublicKey, 4, 4) })))] })), jsxRuntime.jsx(DotsMenu.DotsMenu, { "data-testid": 'dots-menu', options: options, title: 'Wallet options', buttonClassName: 'wallet__menu' })] })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'wallet__container', "data-testid": 'wallet' }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: 'wallet__row' }, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'wallet__icon-container' }, { children: jsxRuntime.jsx(WalletIconWithStatus.WalletIconWithStatus, { iconSize: iconSize, walletName: connector.name, connected: connected, variant: 'secondary' }) })), (ens === null || ens === void 0 ? void 0 : ens.name) ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ className: 'wallet__ens-name', variant: 'body_small', color: 'primary', truncate: true }, { children: ens === null || ens === void 0 ? void 0 : ens.name })), jsxRuntime.jsx("div", { className: 'wallet__row__seperator' }), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_mini', color: 'secondary' }, { children: shortenWalletAddress.shortenWalletAddress(address, 3, 3) }))] })) : (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', color: 'primary' }, { children: shortenWalletAddress.shortenWalletAddress(address, 4, 4) })))] })), jsxRuntime.jsx(DotsMenu.DotsMenu, { "data-testid": 'dots-menu', options: options, title: 'Wallet options', buttonClassName: 'wallet__menu' })] })));
 };
 
 exports.Wallet = Wallet;

package/src/lib/widgets/DynamicWidget/components/Wallet/Wallet.d.ts

@@ -1,4 +1,4 @@
-import { Dispatch, SetStateAction } from 'react';
+/// <reference types="react" />
 import { NameServiceData } from '@dynamic-labs/sdk-api';
 import { Wallet as WalletType } from '../../../../shared/types';
 type Props = {
@@ -6,8 +6,7 @@ type Props = {
     expanded?: boolean;
     expandedWallet?: string;
     setExpandedWallet?: (str?: string) => void;
-    setNewWalletId?: Dispatch<SetStateAction<string>>;
     wallet: WalletType;
 };
-export declare const Wallet: ({ setNewWalletId, wallet, ens }: Props) => JSX.Element;
+export declare const Wallet: ({ wallet, ens }: Props) => JSX.Element;
 export {};

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

@@ -37,14 +37,10 @@ import '../../../../components/Popper/PopperContext/PopperContext.js';
 import { DotsMenu } from '../DotsMenu/DotsMenu.js';
 import { copyToClipboard } from '../../helpers/helpers.js';
 import { WalletIconWithStatus } from '../WalletIconWithStatus/WalletIconWithStatus.js';
-import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
 
-const Wallet = ({ setNewWalletId, wallet, ens }) => {
-    const walletPublicKey = wallet.address;
-    const walletId = wallet.id;
-    const { connector } = wallet;
-    const { computeConnectedStateForWallets, setPrimaryWallet, setSelectedWalletConnector, } = useInternalDynamicContext();
-    const { setWalletIdToUnlink } = useWidgetContext();
+const Wallet = ({ wallet, ens }) => {
+    const { id: walletId, connector, address, connected } = wallet;
+    const { computeConnectedStateForWallets, setPrimaryWallet, setSelectedWalletConnector, setSelectedWalletWithAction, } = useInternalDynamicContext();
     const iconSize = 20;
     const options = [
         {
@@ -62,23 +58,24 @@ const Wallet = ({ setNewWalletId, wallet, ens }) => {
     }
     options.push({
         Icon: jsx(SvgCopy, {}),
-        callback: () => copyToClipboard(walletPublicKey || ''),
+        callback: () => copyToClipboard(address || ''),
         text: 'Copy address',
     }, {
         Icon: jsx(SvgUnlink, {}),
-        callback: () => setWalletIdToUnlink(walletId),
+        callback: () => setSelectedWalletWithAction({ action: 'unlink', wallet }),
         text: 'Unlink from my account',
     });
     const onSelectWalletClick = () => __awaiter(void 0, void 0, void 0, function* () {
-        if (wallet.connector.connectedChain === 'FLOW') {
-            wallet.connector.endSession();
+        var _a;
+        if (connector.connectedChain === 'FLOW') {
+            (_a = connector.endSession) === null || _a === void 0 ? void 0 : _a.call(connector);
         }
-        setNewWalletId === null || setNewWalletId === void 0 ? void 0 : setNewWalletId(walletId);
+        setSelectedWalletWithAction({ action: 'select', wallet });
         setPrimaryWallet(walletId);
         computeConnectedStateForWallets();
-        setSelectedWalletConnector(wallet.connector);
+        setSelectedWalletConnector(connector);
     });
-    return (jsxs("div", Object.assign({ className: 'wallet__container', "data-testid": 'wallet' }, { children: [jsxs("div", Object.assign({ className: 'wallet__row' }, { children: [jsx("div", Object.assign({ className: 'wallet__icon-container' }, { children: jsx(WalletIconWithStatus, { iconSize: iconSize, walletName: connector.name, connected: wallet.connected, variant: 'secondary' }) })), (ens === null || ens === void 0 ? void 0 : ens.name) ? (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ className: 'wallet__ens-name', variant: 'body_small', color: 'primary', truncate: true }, { children: ens === null || ens === void 0 ? void 0 : ens.name })), jsx("div", { className: 'wallet__row__seperator' }), jsx(Typography, Object.assign({ variant: 'body_mini', color: 'secondary' }, { children: shortenWalletAddress(walletPublicKey, 3, 3) }))] })) : (jsx(Typography, Object.assign({ variant: 'body_small', color: 'primary' }, { children: shortenWalletAddress(walletPublicKey, 4, 4) })))] })), jsx(DotsMenu, { "data-testid": 'dots-menu', options: options, title: 'Wallet options', buttonClassName: 'wallet__menu' })] })));
+    return (jsxs("div", Object.assign({ className: 'wallet__container', "data-testid": 'wallet' }, { children: [jsxs("div", Object.assign({ className: 'wallet__row' }, { children: [jsx("div", Object.assign({ className: 'wallet__icon-container' }, { children: jsx(WalletIconWithStatus, { iconSize: iconSize, walletName: connector.name, connected: connected, variant: 'secondary' }) })), (ens === null || ens === void 0 ? void 0 : ens.name) ? (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ className: 'wallet__ens-name', variant: 'body_small', color: 'primary', truncate: true }, { children: ens === null || ens === void 0 ? void 0 : ens.name })), jsx("div", { className: 'wallet__row__seperator' }), jsx(Typography, Object.assign({ variant: 'body_mini', color: 'secondary' }, { children: shortenWalletAddress(address, 3, 3) }))] })) : (jsx(Typography, Object.assign({ variant: 'body_small', color: 'primary' }, { children: shortenWalletAddress(address, 4, 4) })))] })), jsx(DotsMenu, { "data-testid": 'dots-menu', options: options, title: 'Wallet options', buttonClassName: 'wallet__menu' })] })));
 };
 
 export { Wallet };

package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.cjs

@@ -41,8 +41,6 @@ const DynamicWidgetContextProvider = ({ children, }) => {
     const inlineControlsRef = React.useRef(null);
     const availableWalletsContainerRef = React.useRef(null);
     const { setShowDynamicUserProfile, showDynamicUserProfile } = useInternalDynamicContext.useInternalDynamicContext();
-    const [newWalletId, setNewWalletId] = React.useState('');
-    const [walletIdToUnlink, setWalletIdToUnlink] = React.useState(undefined);
     const isKYCEnabled = useKYCFlag.useKYCFlag();
     const isMultiWalletEnabled = useMultiWalletFlag.useMultiWalletFlag();
     const initialView = React.useMemo(() => (isKYCEnabled && !isMultiWalletEnabled ? 'profile' : 'index'), [isKYCEnabled, isMultiWalletEnabled]);
@@ -72,20 +70,14 @@ const DynamicWidgetContextProvider = ({ children, }) => {
         goToProfileView,
         inlineControlsRef,
         isOpen: showDynamicUserProfile,
-        newWalletId,
         setDynamicWidgetView,
         setIsOpen: setShowDynamicUserProfile,
-        setNewWalletId,
-        setWalletIdToUnlink,
-        walletIdToUnlink,
         widgetRef,
     }), [
         dynamicWidgetView,
         goToProfileView,
-        newWalletId,
         setShowDynamicUserProfile,
         showDynamicUserProfile,
-        walletIdToUnlink,
     ]);
     return (jsxRuntime.jsx(DynamicWidgetContext.Provider, Object.assign({ value: value }, { children: children })));
 };

package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.d.ts

@@ -5,12 +5,8 @@ export interface WidgetContextProps {
     goToProfileView: () => void;
     inlineControlsRef: RefObject<HTMLDivElement>;
     isOpen: boolean;
-    newWalletId: string;
     setDynamicWidgetView: Dispatch<SetStateAction<DynamicWidgetViews>>;
     setIsOpen: Dispatch<SetStateAction<boolean>>;
-    setNewWalletId: Dispatch<SetStateAction<string>>;
-    setWalletIdToUnlink: Dispatch<SetStateAction<string | undefined>>;
-    walletIdToUnlink?: string;
     widgetRef: RefObject<HTMLDivElement>;
 }
 export type DynamicWidgetViews = 'index' | 'profile' | 'edit-profile';

package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { createContext, useRef, useState, useMemo, useCallback, useEffect, useContext } from 'react';
+import { createContext, useRef, useMemo, useState, useCallback, useEffect, useContext } from 'react';
 import '@dynamic-labs/utils';
 import '@dynamic-labs/sdk-api';
 import '../../../config/ApiEndpoint.js';
@@ -37,8 +37,6 @@ const DynamicWidgetContextProvider = ({ children, }) => {
     const inlineControlsRef = useRef(null);
     const availableWalletsContainerRef = useRef(null);
     const { setShowDynamicUserProfile, showDynamicUserProfile } = useInternalDynamicContext();
-    const [newWalletId, setNewWalletId] = useState('');
-    const [walletIdToUnlink, setWalletIdToUnlink] = useState(undefined);
     const isKYCEnabled = useKYCFlag();
     const isMultiWalletEnabled = useMultiWalletFlag();
     const initialView = useMemo(() => (isKYCEnabled && !isMultiWalletEnabled ? 'profile' : 'index'), [isKYCEnabled, isMultiWalletEnabled]);
@@ -68,20 +66,14 @@ const DynamicWidgetContextProvider = ({ children, }) => {
         goToProfileView,
         inlineControlsRef,
         isOpen: showDynamicUserProfile,
-        newWalletId,
         setDynamicWidgetView,
         setIsOpen: setShowDynamicUserProfile,
-        setNewWalletId,
-        setWalletIdToUnlink,
-        walletIdToUnlink,
         widgetRef,
     }), [
         dynamicWidgetView,
         goToProfileView,
-        newWalletId,
         setShowDynamicUserProfile,
         showDynamicUserProfile,
-        walletIdToUnlink,
     ]);
     return (jsx(DynamicWidgetContext.Provider, Object.assign({ value: value }, { children: children })));
 };

package/src/lib/widgets/DynamicWidget/hooks/useFetchChain/useFetchChain.cjs

@@ -20,7 +20,7 @@ const useFetchChain = (connector) => {
                 name: chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.displayName,
             };
             /* istanbul ignore else */
-            if (chainId) {
+            if (chainId && connector.evmNetworks) {
                 const result = connector.evmNetworks.find((element) => element.chainId === chainId);
                 chainWithIcon.name = (_a = result === null || result === void 0 ? void 0 : result.vanityName) !== null && _a !== void 0 ? _a : chainWithIcon.name;
                 chainWithIcon.icon = result === null || result === void 0 ? void 0 : result.iconUrls[0];

package/src/lib/widgets/DynamicWidget/hooks/useFetchChain/useFetchChain.js

@@ -16,7 +16,7 @@ const useFetchChain = (connector) => {
                 name: chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.displayName,
             };
             /* istanbul ignore else */
-            if (chainId) {
+            if (chainId && connector.evmNetworks) {
                 const result = connector.evmNetworks.find((element) => element.chainId === chainId);
                 chainWithIcon.name = (_a = result === null || result === void 0 ? void 0 : result.vanityName) !== null && _a !== void 0 ? _a : chainWithIcon.name;
                 chainWithIcon.icon = result === null || result === void 0 ? void 0 : result.iconUrls[0];

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

@@ -38,7 +38,7 @@ require('../../../../components/Alert/Alert.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 
-const DetectedKnownSecondaryWalletModal = ({ setNewWalletId, }) => {
+const DetectedKnownSecondaryWalletModal = ({ setSelectedWalletWithAction, }) => {
     const { setMultiWalletWidgetState, primaryWallet, secondaryWallets, setPrimaryWallet, } = useInternalDynamicContext.useInternalDynamicContext();
     const handleButtonClick = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         const publicAddress = yield (primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.fetchPublicAddress());
@@ -50,7 +50,7 @@ const DetectedKnownSecondaryWalletModal = ({ setNewWalletId, }) => {
             return;
         }
         setMultiWalletWidgetState('idle');
-        setNewWalletId(wallet.id);
+        setSelectedWalletWithAction({ action: 'select', wallet });
         setPrimaryWallet(wallet.id);
     });
     return (jsxRuntime.jsx(WidgetPortal.WidgetPortal, Object.assign({ onBackdropClick: handleButtonClick }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'detected-known-secondary-wallet-modal__content' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ color: 'primary', variant: 'body_normal' }, { children: "Account Change Detected" })), jsxRuntime.jsx(promptAccountSwitch.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: `Your active account in ${primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name} has changed. We’re updating the primary account here to match your wallet status.` })), jsxRuntime.jsx(Button.Button, Object.assign({ onClick: handleButtonClick, buttonVariant: 'primary', expanded: true, buttonRounded: 'default', typographyProps: {

package/src/lib/widgets/DynamicWidget/prompts/DetectedKnownSecondaryWalletModal/DetectedKnownSecondaryWalletModal.d.ts

@@ -1,6 +1,7 @@
-import { SetStateAction, Dispatch } from 'react';
+/// <reference types="react" />
+import { WalletWithAction } from '../../../../shared';
 type Props = {
-    setNewWalletId: Dispatch<SetStateAction<string>>;
+    setSelectedWalletWithAction(walletWithAction: WalletWithAction | null): void;
 };
-export declare const DetectedKnownSecondaryWalletModal: ({ setNewWalletId, }: Props) => JSX.Element;
+export declare const DetectedKnownSecondaryWalletModal: ({ setSelectedWalletWithAction, }: Props) => JSX.Element;
 export {};

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

@@ -34,7 +34,7 @@ import '../../../../components/Alert/Alert.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
 
-const DetectedKnownSecondaryWalletModal = ({ setNewWalletId, }) => {
+const DetectedKnownSecondaryWalletModal = ({ setSelectedWalletWithAction, }) => {
     const { setMultiWalletWidgetState, primaryWallet, secondaryWallets, setPrimaryWallet, } = useInternalDynamicContext();
     const handleButtonClick = () => __awaiter(void 0, void 0, void 0, function* () {
         const publicAddress = yield (primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.fetchPublicAddress());
@@ -46,7 +46,7 @@ const DetectedKnownSecondaryWalletModal = ({ setNewWalletId, }) => {
             return;
         }
         setMultiWalletWidgetState('idle');
-        setNewWalletId(wallet.id);
+        setSelectedWalletWithAction({ action: 'select', wallet });
         setPrimaryWallet(wallet.id);
     });
     return (jsx(WidgetPortal, Object.assign({ onBackdropClick: handleButtonClick }, { children: jsxs("div", Object.assign({ className: 'detected-known-secondary-wallet-modal__content' }, { children: [jsx(Typography, Object.assign({ color: 'primary', variant: 'body_normal' }, { children: "Account Change Detected" })), jsx(SvgPromptAccountSwitch, {}), jsx(Typography, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: `Your active account in ${primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector.name} has changed. We’re updating the primary account here to match your wallet status.` })), jsx(Button, Object.assign({ onClick: handleButtonClick, buttonVariant: 'primary', expanded: true, buttonRounded: 'default', typographyProps: {

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

@@ -6,7 +6,6 @@ var _tslib = require('../../../../../../_virtual/_tslib.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 var useInternalDynamicContext = require('../../../../context/DynamicContext/useInternalDynamicContext.cjs');
 var LoadingContext = require('../../../../context/LoadingContext/LoadingContext.cjs');
-var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
 var WidgetPortal = require('../../components/WidgetPortal/WidgetPortal.cjs');
 require('react');
 var Typography = require('../../../../components/Typography/Typography.cjs');
@@ -40,15 +39,14 @@ require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 
 const UnlinkWalletPopUp = ({ walletId }) => {
-    const { setWalletIdToUnlink } = DynamicWidgetContext.useWidgetContext();
-    const { handleUnlinkWallet, eventsCallbacks, user } = useInternalDynamicContext.useInternalDynamicContext();
+    const { handleUnlinkWallet, eventsCallbacks, setSelectedWalletWithAction, user, } = useInternalDynamicContext.useInternalDynamicContext();
     const { loading, setLoading } = LoadingContext.useLoadingContext();
     const onConfirmClick = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         var _a;
         try {
             setLoading(true);
             yield handleUnlinkWallet(walletId);
-            setWalletIdToUnlink(undefined);
+            setSelectedWalletWithAction(null);
             const walletFromId = user === null || user === void 0 ? void 0 : user.verifiedCredentials.find((wallet) => wallet.id === walletId);
             if (walletFromId) {
                 (_a = eventsCallbacks === null || eventsCallbacks === void 0 ? void 0 : eventsCallbacks.onUnlinkSuccess) === null || _a === void 0 ? void 0 : _a.call(eventsCallbacks, walletFromId);
@@ -62,7 +60,7 @@ const UnlinkWalletPopUp = ({ walletId }) => {
         }
     });
     const onCancelClick = () => {
-        setWalletIdToUnlink(undefined);
+        setSelectedWalletWithAction(null);
     };
     return (jsxRuntime.jsx(WidgetPortal.WidgetPortal, Object.assign({ onBackdropClick: onCancelClick }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'unlink-wallet-popup__container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ color: 'primary', className: 'unlink-wallet-popup__title', variant: 'body_normal', as: 'h6' }, { children: "Unlink your wallet?" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ className: 'unlink-wallet-popup__label', variant: 'body_small', color: 'secondary' }, { children: "Are you sure you want to unlink your wallet?" })), jsxRuntime.jsx(Button.Button, Object.assign({ buttonPadding: 'small', onClick: onConfirmClick, disabled: loading, buttonClassName: 'unlink-wallet-popup__button unlink-wallet-popup__button--shadow', color: 'primary', expanded: true, buttonRounded: 'small', typographyProps: {
                         variant: 'button_secondary',

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

@@ -2,7 +2,6 @@ import { __awaiter } from '../../../../../../_virtual/_tslib.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useInternalDynamicContext } from '../../../../context/DynamicContext/useInternalDynamicContext.js';
 import { useLoadingContext } from '../../../../context/LoadingContext/LoadingContext.js';
-import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
 import { WidgetPortal } from '../../components/WidgetPortal/WidgetPortal.js';
 import 'react';
 import { Typography } from '../../../../components/Typography/Typography.js';
@@ -36,15 +35,14 @@ import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
 
 const UnlinkWalletPopUp = ({ walletId }) => {
-    const { setWalletIdToUnlink } = useWidgetContext();
-    const { handleUnlinkWallet, eventsCallbacks, user } = useInternalDynamicContext();
+    const { handleUnlinkWallet, eventsCallbacks, setSelectedWalletWithAction, user, } = useInternalDynamicContext();
     const { loading, setLoading } = useLoadingContext();
     const onConfirmClick = () => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
         try {
             setLoading(true);
             yield handleUnlinkWallet(walletId);
-            setWalletIdToUnlink(undefined);
+            setSelectedWalletWithAction(null);
             const walletFromId = user === null || user === void 0 ? void 0 : user.verifiedCredentials.find((wallet) => wallet.id === walletId);
             if (walletFromId) {
                 (_a = eventsCallbacks === null || eventsCallbacks === void 0 ? void 0 : eventsCallbacks.onUnlinkSuccess) === null || _a === void 0 ? void 0 : _a.call(eventsCallbacks, walletFromId);
@@ -58,7 +56,7 @@ const UnlinkWalletPopUp = ({ walletId }) => {
         }
     });
     const onCancelClick = () => {
-        setWalletIdToUnlink(undefined);
+        setSelectedWalletWithAction(null);
     };
     return (jsx(WidgetPortal, Object.assign({ onBackdropClick: onCancelClick }, { children: jsxs("div", Object.assign({ className: 'unlink-wallet-popup__container' }, { children: [jsx(Typography, Object.assign({ color: 'primary', className: 'unlink-wallet-popup__title', variant: 'body_normal', as: 'h6' }, { children: "Unlink your wallet?" })), jsx(Typography, Object.assign({ className: 'unlink-wallet-popup__label', variant: 'body_small', color: 'secondary' }, { children: "Are you sure you want to unlink your wallet?" })), jsx(Button, Object.assign({ buttonPadding: 'small', onClick: onConfirmClick, disabled: loading, buttonClassName: 'unlink-wallet-popup__button unlink-wallet-popup__button--shadow', color: 'primary', expanded: true, buttonRounded: 'small', typographyProps: {
                         variant: 'button_secondary',

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

@@ -44,13 +44,13 @@ var useUserDataForm = require('../../../../utils/hooks/useUserDataForm/useUserDa
 var index = require('../../../../views/CollectUserDataView/UserDataFields/index.cjs');
 var DynamicWidgetFooter = require('../../components/DynamicWidgetFooter/DynamicWidgetFooter.cjs');
 var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
-var getEnabledUserProfileFields = require('../../../../utils/functions/getEnabledUserProfileFields/getEnabledUserProfileFields.cjs');
+var getUserProfileFields = require('../../../../utils/functions/getUserProfileFields/getUserProfileFields.cjs');
 
 const EditProfileView = ({ rootClassName, }) => {
     const { setView } = ViewContext.useViewContext();
     const { projectSettings, setShowAuthFlow, user } = useInternalDynamicContext.useInternalDynamicContext();
     const { goToProfileView } = DynamicWidgetContext.useWidgetContext();
-    const userFields = getEnabledUserProfileFields.getUserProfileFields({
+    const allUserFields = getUserProfileFields.getUserProfileFields({
         projectSettingsKyc: projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.kyc,
         user,
     });
@@ -66,14 +66,14 @@ const EditProfileView = ({ rootClassName, }) => {
         }
     }), [goToProfileView, setShowAuthFlow, setView, updateUser]);
     const { fetch, formikInitialValues, formikValidationSchema, onFormSubmit } = useUserDataForm.useUserDataForm({
-        fields: userFields,
+        fields: allUserFields,
         onSubmit: onEditProfileFormSubmit,
         shouldEnforcePolicies: false,
         userProfile: user,
     });
     const isKYCEnabled = useKYCFlag.useKYCFlag();
     const isMultiWalletEnabled = useMultiWalletFlag.useMultiWalletFlag();
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isMultiWalletEnabled && isKYCEnabled && (jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'regular', color: 'secondary', variant: 'body_normal', className: 'dynamic-widget-edit-profile-view__profile-title' }, { children: "My profile" }))), jsxRuntime.jsx(formik.Formik, Object.assign({ onSubmit: onFormSubmit, initialValues: formikInitialValues, validationSchema: formikValidationSchema, validateOnChange: true }, { children: ({ errors, touched, isSubmitting, isValid, dirty }) => (jsxRuntime.jsxs(formik.Form, Object.assign({ className: classNames.classNames('dynamic-widget-edit-profile-view', rootClassName), "data-testid": 'editUserProfileForm' }, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'dynamic-widget-edit-profile-view__fields' }, { children: jsxRuntime.jsx(index.UserDataFields, { errors: errors, fields: userFields, touched: touched }) })), jsxRuntime.jsxs(DynamicWidgetFooter.DynamicWidgetFooter, { children: [jsxRuntime.jsx(Button.Button, Object.assign({ disabled: fetch, buttonRounded: 'small', expanded: true, buttonPadding: 'medium', buttonVariant: 'secondary', type: 'button', typographyProps: { variant: 'button_secondary' }, onClick: goToProfileView }, { children: "Cancel" })), jsxRuntime.jsx(Button.Button, Object.assign({ buttonClassName: 'dynamic-widget-footer__button', disabled: fetch || !isValid || !dirty, buttonRounded: 'small', expanded: true, type: 'submit', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, loading: isSubmitting, startSlot: jsxRuntime.jsx(check.ReactComponent, {}) }, { children: "Save" }))] })] }))) }))] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isMultiWalletEnabled && isKYCEnabled && (jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'regular', color: 'secondary', variant: 'body_normal', className: 'dynamic-widget-edit-profile-view__profile-title' }, { children: "My profile" }))), jsxRuntime.jsx(formik.Formik, Object.assign({ onSubmit: onFormSubmit, initialValues: formikInitialValues, validationSchema: formikValidationSchema, validateOnChange: true }, { children: ({ errors, touched, isSubmitting, isValid, dirty }) => (jsxRuntime.jsxs(formik.Form, Object.assign({ className: classNames.classNames('dynamic-widget-edit-profile-view', rootClassName), "data-testid": 'editUserProfileForm' }, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'dynamic-widget-edit-profile-view__fields' }, { children: jsxRuntime.jsx(index.UserDataFields, { errors: errors, fields: allUserFields, touched: touched }) })), jsxRuntime.jsxs(DynamicWidgetFooter.DynamicWidgetFooter, { children: [jsxRuntime.jsx(Button.Button, Object.assign({ disabled: fetch, buttonRounded: 'small', expanded: true, buttonPadding: 'medium', buttonVariant: 'secondary', type: 'button', typographyProps: { variant: 'button_secondary' }, onClick: goToProfileView }, { children: "Cancel" })), jsxRuntime.jsx(Button.Button, Object.assign({ buttonClassName: 'dynamic-widget-footer__button', disabled: fetch || !isValid || !dirty, buttonRounded: 'small', expanded: true, type: 'submit', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, loading: isSubmitting, startSlot: jsxRuntime.jsx(check.ReactComponent, {}) }, { children: "Save" }))] })] }))) }))] }));
 };
 
 exports.EditProfileView = EditProfileView;

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

@@ -40,13 +40,13 @@ import { useUserDataForm } from '../../../../utils/hooks/useUserDataForm/useUser
 import { UserDataFields } from '../../../../views/CollectUserDataView/UserDataFields/index.js';
 import { DynamicWidgetFooter } from '../../components/DynamicWidgetFooter/DynamicWidgetFooter.js';
 import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
-import { getUserProfileFields } from '../../../../utils/functions/getEnabledUserProfileFields/getEnabledUserProfileFields.js';
+import { getUserProfileFields } from '../../../../utils/functions/getUserProfileFields/getUserProfileFields.js';
 
 const EditProfileView = ({ rootClassName, }) => {
     const { setView } = useViewContext();
     const { projectSettings, setShowAuthFlow, user } = useInternalDynamicContext();
     const { goToProfileView } = useWidgetContext();
-    const userFields = getUserProfileFields({
+    const allUserFields = getUserProfileFields({
         projectSettingsKyc: projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.kyc,
         user,
     });
@@ -62,14 +62,14 @@ const EditProfileView = ({ rootClassName, }) => {
         }
     }), [goToProfileView, setShowAuthFlow, setView, updateUser]);
     const { fetch, formikInitialValues, formikValidationSchema, onFormSubmit } = useUserDataForm({
-        fields: userFields,
+        fields: allUserFields,
         onSubmit: onEditProfileFormSubmit,
         shouldEnforcePolicies: false,
         userProfile: user,
     });
     const isKYCEnabled = useKYCFlag();
     const isMultiWalletEnabled = useMultiWalletFlag();
-    return (jsxs(Fragment, { children: [!isMultiWalletEnabled && isKYCEnabled && (jsx(Typography, Object.assign({ weight: 'regular', color: 'secondary', variant: 'body_normal', className: 'dynamic-widget-edit-profile-view__profile-title' }, { children: "My profile" }))), jsx(Formik, Object.assign({ onSubmit: onFormSubmit, initialValues: formikInitialValues, validationSchema: formikValidationSchema, validateOnChange: true }, { children: ({ errors, touched, isSubmitting, isValid, dirty }) => (jsxs(Form, Object.assign({ className: classNames('dynamic-widget-edit-profile-view', rootClassName), "data-testid": 'editUserProfileForm' }, { children: [jsx("div", Object.assign({ className: 'dynamic-widget-edit-profile-view__fields' }, { children: jsx(UserDataFields, { errors: errors, fields: userFields, touched: touched }) })), jsxs(DynamicWidgetFooter, { children: [jsx(Button, Object.assign({ disabled: fetch, buttonRounded: 'small', expanded: true, buttonPadding: 'medium', buttonVariant: 'secondary', type: 'button', typographyProps: { variant: 'button_secondary' }, onClick: goToProfileView }, { children: "Cancel" })), jsx(Button, Object.assign({ buttonClassName: 'dynamic-widget-footer__button', disabled: fetch || !isValid || !dirty, buttonRounded: 'small', expanded: true, type: 'submit', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, loading: isSubmitting, startSlot: jsx(SvgCheck, {}) }, { children: "Save" }))] })] }))) }))] }));
+    return (jsxs(Fragment, { children: [!isMultiWalletEnabled && isKYCEnabled && (jsx(Typography, Object.assign({ weight: 'regular', color: 'secondary', variant: 'body_normal', className: 'dynamic-widget-edit-profile-view__profile-title' }, { children: "My profile" }))), jsx(Formik, Object.assign({ onSubmit: onFormSubmit, initialValues: formikInitialValues, validationSchema: formikValidationSchema, validateOnChange: true }, { children: ({ errors, touched, isSubmitting, isValid, dirty }) => (jsxs(Form, Object.assign({ className: classNames('dynamic-widget-edit-profile-view', rootClassName), "data-testid": 'editUserProfileForm' }, { children: [jsx("div", Object.assign({ className: 'dynamic-widget-edit-profile-view__fields' }, { children: jsx(UserDataFields, { errors: errors, fields: allUserFields, touched: touched }) })), jsxs(DynamicWidgetFooter, { children: [jsx(Button, Object.assign({ disabled: fetch, buttonRounded: 'small', expanded: true, buttonPadding: 'medium', buttonVariant: 'secondary', type: 'button', typographyProps: { variant: 'button_secondary' }, onClick: goToProfileView }, { children: "Cancel" })), jsx(Button, Object.assign({ buttonClassName: 'dynamic-widget-footer__button', disabled: fetch || !isValid || !dirty, buttonRounded: 'small', expanded: true, type: 'submit', buttonPadding: 'medium', typographyProps: { variant: 'button_secondary' }, loading: isSubmitting, startSlot: jsx(SvgCheck, {}) }, { children: "Save" }))] })] }))) }))] }));
 };
 
 export { EditProfileView };

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

@@ -29,7 +29,7 @@ require('../../../../components/Transition/OpacityTransition/OpacityTransition.c
 require('../../../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../../../context/ErrorContext/ErrorContext.cjs');
-var getEnabledUserProfileFields = require('../../../../utils/functions/getEnabledUserProfileFields/getEnabledUserProfileFields.cjs');
+var getUserProfileFields = require('../../../../utils/functions/getUserProfileFields/getUserProfileFields.cjs');
 require('../../../../context/MockContext/MockContext.cjs');
 require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
@@ -44,7 +44,8 @@ var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
 const ProfileView = () => {
     const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
     const { projectSettings } = useInternalDynamicContext.useInternalDynamicContext();
-    const editableUserFields = getEnabledUserProfileFields.getEditableUserProfileFields(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.kyc);
+    // Allow to navigate to edit profile view when there are fields what can be edited
+    const editableUserFields = getUserProfileFields.getEditableUserProfileFields(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.kyc);
     return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(UserProfile.UserProfile, { rootClassName: 'profile-view' }), jsxRuntime.jsx(DynamicWidgetFooter.DynamicWidgetFooter, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'profile-view__footer' }, { children: [editableUserFields.length > 0 && (jsxRuntime.jsx(Button.Button, Object.assign({ buttonClassName: 'dynamic-widget-footer__button', buttonVariant: 'tertiary', buttonPadding: 'none', typographyProps: {
                                 color: 'secondary',
                                 variant: 'button_tertiary',

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

@@ -25,7 +25,7 @@ import '../../../../components/Transition/OpacityTransition/OpacityTransition.js
 import '../../../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../context/ErrorContext/ErrorContext.js';
-import { getEditableUserProfileFields } from '../../../../utils/functions/getEnabledUserProfileFields/getEnabledUserProfileFields.js';
+import { getEditableUserProfileFields } from '../../../../utils/functions/getUserProfileFields/getUserProfileFields.js';
 import '../../../../context/MockContext/MockContext.js';
 import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
@@ -40,6 +40,7 @@ import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
 const ProfileView = () => {
     const { setDynamicWidgetView } = useWidgetContext();
     const { projectSettings } = useInternalDynamicContext();
+    // Allow to navigate to edit profile view when there are fields what can be edited
     const editableUserFields = getEditableUserProfileFields(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.kyc);
     return (jsxs(Fragment, { children: [jsx(UserProfile, { rootClassName: 'profile-view' }), jsx(DynamicWidgetFooter, { children: jsxs("div", Object.assign({ className: 'profile-view__footer' }, { children: [editableUserFields.length > 0 && (jsx(Button, Object.assign({ buttonClassName: 'dynamic-widget-footer__button', buttonVariant: 'tertiary', buttonPadding: 'none', typographyProps: {
                                 color: 'secondary',