@dynamic-labs/sdk-react-core 4.36.1 → 4.37.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +11 -0
- package/package.cjs +1 -1
- package/package.js +1 -1
- package/package.json +11 -11
- package/src/index.cjs +2 -0
- package/src/index.d.ts +1 -1
- package/src/index.js +1 -0
- package/src/lib/locale/en/translation.cjs +24 -3
- package/src/lib/locale/en/translation.d.ts +23 -2
- package/src/lib/locale/en/translation.js +24 -3
- package/src/lib/shared/assets/connect.cjs +57 -0
- package/src/lib/shared/assets/connect.js +33 -0
- package/src/lib/shared/assets/index.d.ts +1 -0
- package/src/lib/styles/index.shadow.cjs +1 -1
- package/src/lib/styles/index.shadow.js +1 -1
- package/src/lib/utils/hooks/index.d.ts +1 -0
- package/src/lib/utils/hooks/useWalletDelegation/useWalletDelegation.cjs +22 -0
- package/src/lib/utils/hooks/useWalletDelegation/useWalletDelegation.d.ts +6 -0
- package/src/lib/utils/hooks/useWalletDelegation/useWalletDelegation.js +22 -0
- package/src/lib/views/WalletDelegation/WalletDelegationView/AgreementSection.cjs +28 -0
- package/src/lib/views/WalletDelegation/WalletDelegationView/AgreementSection.d.ts +9 -0
- package/src/lib/views/WalletDelegation/WalletDelegationView/AgreementSection.js +24 -0
- package/src/lib/views/WalletDelegation/WalletDelegationView/WalletDelegationView.cjs +78 -5
- package/src/lib/views/WalletDelegation/WalletDelegationView/WalletDelegationView.js +79 -6
- package/src/lib/widgets/DynamicWidget/components/DynamicWidgetViews/mapViewToComponent.cjs +2 -0
- package/src/lib/widgets/DynamicWidget/components/DynamicWidgetViews/mapViewToComponent.d.ts +1 -0
- package/src/lib/widgets/DynamicWidget/components/DynamicWidgetViews/mapViewToComponent.js +2 -0
- package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.types.d.ts +1 -1
- package/src/lib/widgets/DynamicWidget/views/ConnectedAppsView/ConnectedAppsView.cjs +2 -6
- package/src/lib/widgets/DynamicWidget/views/ConnectedAppsView/ConnectedAppsView.js +2 -6
- package/src/lib/widgets/DynamicWidget/views/SettingsView/SettingsView.cjs +17 -1
- package/src/lib/widgets/DynamicWidget/views/SettingsView/SettingsView.js +17 -1
- package/src/lib/widgets/DynamicWidget/views/WalletsDelegatedSettingsView/WalletsDelegatedSettingsView.cjs +149 -0
- package/src/lib/widgets/DynamicWidget/views/WalletsDelegatedSettingsView/WalletsDelegatedSettingsView.d.ts +12 -0
- package/src/lib/widgets/DynamicWidget/views/WalletsDelegatedSettingsView/WalletsDelegatedSettingsView.js +144 -0
- package/src/lib/widgets/DynamicWidget/views/WalletsDelegatedSettingsView/index.d.ts +1 -0
- package/src/lib/widgets/DynamicWidget/views/index.d.ts +1 -0
- package/src/lib/widgets/DynamicWidget/views/ConnectedAppsView/EmbeddedDelegatedSection/EmbeddedDelegatedSection.cjs +0 -34
- package/src/lib/widgets/DynamicWidget/views/ConnectedAppsView/EmbeddedDelegatedSection/EmbeddedDelegatedSection.d.ts +0 -2
- package/src/lib/widgets/DynamicWidget/views/ConnectedAppsView/EmbeddedDelegatedSection/EmbeddedDelegatedSection.js +0 -30
- package/src/lib/widgets/DynamicWidget/views/ConnectedAppsView/EmbeddedDelegatedSection/index.d.ts +0 -1
|
@@ -95,3 +95,4 @@ export { usePromptMfaAuth } from './usePromptMfaAuth';
|
|
|
95
95
|
export { useUpgradeToDynamicWaasFlow } from './useUpgradeToDynamicWaasFlow';
|
|
96
96
|
export { useGetMfaToken } from './useGetMfaToken';
|
|
97
97
|
export { useIsMfaRequiredForAction } from './useIsMfaRequiredForAction';
|
|
98
|
+
export { useWalletDelegation } from './useWalletDelegation';
|
|
@@ -155,7 +155,29 @@ const useWalletDelegation = () => {
|
|
|
155
155
|
dynamicEvents.dynamicEvents.once('embeddedWalletDelegationFailed', (error) => reject(error));
|
|
156
156
|
});
|
|
157
157
|
}), [primaryWallet, setShowAuthFlow, pushView, user]);
|
|
158
|
+
const getWalletsDelegatedStatus = React.useCallback(() => {
|
|
159
|
+
var _a, _b;
|
|
160
|
+
if (!primaryWallet) {
|
|
161
|
+
return [];
|
|
162
|
+
}
|
|
163
|
+
const state = utils.StorageService.getItem(localStorage.DELEGATION_STATE);
|
|
164
|
+
const userId = (user === null || user === void 0 ? void 0 : user.userId) || 'anonymous';
|
|
165
|
+
const completedForUser = new Set(((_a = state === null || state === void 0 ? void 0 : state.completed) === null || _a === void 0 ? void 0 : _a[userId]) || []);
|
|
166
|
+
const deniedForUser = new Set(((_b = state === null || state === void 0 ? void 0 : state.denied) === null || _b === void 0 ? void 0 : _b[userId]) || []);
|
|
167
|
+
return userWallets.map((wallet) => {
|
|
168
|
+
let status = 'pending';
|
|
169
|
+
if (completedForUser.has(wallet.id)) {
|
|
170
|
+
status = 'delegated';
|
|
171
|
+
}
|
|
172
|
+
else if (deniedForUser.has(wallet.id)) {
|
|
173
|
+
status = 'denied';
|
|
174
|
+
}
|
|
175
|
+
return Object.assign(Object.assign({}, wallet), { status });
|
|
176
|
+
});
|
|
177
|
+
}, [primaryWallet, user === null || user === void 0 ? void 0 : user.userId, userWallets]);
|
|
158
178
|
return {
|
|
179
|
+
delegatedAccessEnabled,
|
|
180
|
+
getWalletsDelegatedStatus,
|
|
159
181
|
initDelegationProcess,
|
|
160
182
|
requiresDelegation,
|
|
161
183
|
shouldPromptWalletDelegation,
|
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
import { Wallet } from '../../../shared';
|
|
2
|
+
export type WalletDelegationStatus = 'delegated' | 'denied' | 'pending';
|
|
3
|
+
export type WalletWithStatus = Wallet & {
|
|
4
|
+
status: WalletDelegationStatus;
|
|
5
|
+
};
|
|
2
6
|
export declare const useWalletDelegation: () => {
|
|
7
|
+
readonly delegatedAccessEnabled: boolean | undefined;
|
|
8
|
+
readonly getWalletsDelegatedStatus: () => WalletWithStatus[];
|
|
3
9
|
readonly initDelegationProcess: (options?: {
|
|
4
10
|
wallets?: Wallet[];
|
|
5
11
|
}) => Promise<void>;
|
|
@@ -151,7 +151,29 @@ const useWalletDelegation = () => {
|
|
|
151
151
|
dynamicEvents.once('embeddedWalletDelegationFailed', (error) => reject(error));
|
|
152
152
|
});
|
|
153
153
|
}), [primaryWallet, setShowAuthFlow, pushView, user]);
|
|
154
|
+
const getWalletsDelegatedStatus = useCallback(() => {
|
|
155
|
+
var _a, _b;
|
|
156
|
+
if (!primaryWallet) {
|
|
157
|
+
return [];
|
|
158
|
+
}
|
|
159
|
+
const state = StorageService.getItem(DELEGATION_STATE);
|
|
160
|
+
const userId = (user === null || user === void 0 ? void 0 : user.userId) || 'anonymous';
|
|
161
|
+
const completedForUser = new Set(((_a = state === null || state === void 0 ? void 0 : state.completed) === null || _a === void 0 ? void 0 : _a[userId]) || []);
|
|
162
|
+
const deniedForUser = new Set(((_b = state === null || state === void 0 ? void 0 : state.denied) === null || _b === void 0 ? void 0 : _b[userId]) || []);
|
|
163
|
+
return userWallets.map((wallet) => {
|
|
164
|
+
let status = 'pending';
|
|
165
|
+
if (completedForUser.has(wallet.id)) {
|
|
166
|
+
status = 'delegated';
|
|
167
|
+
}
|
|
168
|
+
else if (deniedForUser.has(wallet.id)) {
|
|
169
|
+
status = 'denied';
|
|
170
|
+
}
|
|
171
|
+
return Object.assign(Object.assign({}, wallet), { status });
|
|
172
|
+
});
|
|
173
|
+
}, [primaryWallet, user === null || user === void 0 ? void 0 : user.userId, userWallets]);
|
|
154
174
|
return {
|
|
175
|
+
delegatedAccessEnabled,
|
|
176
|
+
getWalletsDelegatedStatus,
|
|
155
177
|
initDelegationProcess,
|
|
156
178
|
requiresDelegation,
|
|
157
179
|
shouldPromptWalletDelegation,
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
'use client'
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
|
+
|
|
6
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
var Checkbox = require('../../../components/Checkbox/Checkbox.cjs');
|
|
8
|
+
var Typography = require('../../../components/Typography/Typography.cjs');
|
|
9
|
+
|
|
10
|
+
const AgreementSection = ({ checked, onToggle, text, className, }) => {
|
|
11
|
+
const handleKeyDown = (event) => {
|
|
12
|
+
if (event.key === ' ' || event.key === 'Enter') {
|
|
13
|
+
event.preventDefault();
|
|
14
|
+
onToggle();
|
|
15
|
+
}
|
|
16
|
+
};
|
|
17
|
+
const handleCheckboxClick = (event) => {
|
|
18
|
+
// Prevent the container onClick from firing twice
|
|
19
|
+
event.stopPropagation();
|
|
20
|
+
onToggle();
|
|
21
|
+
};
|
|
22
|
+
const containerClassName = className
|
|
23
|
+
? `embedded-delegated-view__agreement-section ${className}`
|
|
24
|
+
: 'embedded-delegated-view__agreement-section';
|
|
25
|
+
return (jsxRuntime.jsxs("div", { className: containerClassName, onClick: onToggle, role: 'checkbox', "aria-checked": checked, tabIndex: 0, onKeyDown: handleKeyDown, children: [jsxRuntime.jsx(Checkbox.Checkbox, { checked: checked, onChange: handleCheckboxClick, value: 'agreement' }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', children: text })] }));
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
exports.AgreementSection = AgreementSection;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use client'
|
|
2
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { Checkbox } from '../../../components/Checkbox/Checkbox.js';
|
|
4
|
+
import { Typography } from '../../../components/Typography/Typography.js';
|
|
5
|
+
|
|
6
|
+
const AgreementSection = ({ checked, onToggle, text, className, }) => {
|
|
7
|
+
const handleKeyDown = (event) => {
|
|
8
|
+
if (event.key === ' ' || event.key === 'Enter') {
|
|
9
|
+
event.preventDefault();
|
|
10
|
+
onToggle();
|
|
11
|
+
}
|
|
12
|
+
};
|
|
13
|
+
const handleCheckboxClick = (event) => {
|
|
14
|
+
// Prevent the container onClick from firing twice
|
|
15
|
+
event.stopPropagation();
|
|
16
|
+
onToggle();
|
|
17
|
+
};
|
|
18
|
+
const containerClassName = className
|
|
19
|
+
? `embedded-delegated-view__agreement-section ${className}`
|
|
20
|
+
: 'embedded-delegated-view__agreement-section';
|
|
21
|
+
return (jsxs("div", { className: containerClassName, onClick: onToggle, role: 'checkbox', "aria-checked": checked, tabIndex: 0, onKeyDown: handleKeyDown, children: [jsx(Checkbox, { checked: checked, onChange: handleCheckboxClick, value: 'agreement' }), jsx(Typography, { variant: 'body_small', color: 'secondary', children: text })] }));
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export { AgreementSection };
|
|
@@ -18,6 +18,7 @@ var useDynamicContext = require('../../../context/DynamicContext/useDynamicConte
|
|
|
18
18
|
var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
|
|
19
19
|
var dynamicEvents = require('../../../events/dynamicEvents.cjs');
|
|
20
20
|
var getProperErrorMessage = require('../../../modals/SignMessageConfirmationModal/getProperErrorMessage.cjs');
|
|
21
|
+
var arrowLeft = require('../../../shared/assets/arrow-left.cjs');
|
|
21
22
|
var check = require('../../../shared/assets/check.cjs');
|
|
22
23
|
var close = require('../../../shared/assets/close.cjs');
|
|
23
24
|
var switchHorizontal = require('../../../shared/assets/switch-horizontal.cjs');
|
|
@@ -33,6 +34,7 @@ var useWalletDelegation = require('../../../utils/hooks/useWalletDelegation/useW
|
|
|
33
34
|
var localStorage = require('../../../utils/constants/localStorage.cjs');
|
|
34
35
|
require('../../../utils/constants/colors.cjs');
|
|
35
36
|
require('../../../utils/constants/values.cjs');
|
|
37
|
+
var AgreementSection = require('./AgreementSection.cjs');
|
|
36
38
|
|
|
37
39
|
const WalletDelegationView = ({ wallets, }) => {
|
|
38
40
|
const { setShowAuthFlow, handleLogOut } = useInternalDynamicContext.useInternalDynamicContext();
|
|
@@ -42,6 +44,9 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
42
44
|
const { delegateKeyShares } = useDynamicWaas.useDynamicWaas();
|
|
43
45
|
const { requiresDelegation } = useWalletDelegation.useWalletDelegation();
|
|
44
46
|
const [selectedWallets, setSelectedWallets] = React.useState(new Set());
|
|
47
|
+
const [showEditView, setShowEditView] = React.useState(false);
|
|
48
|
+
const [agreementChecked, setAgreementChecked] = React.useState(false);
|
|
49
|
+
const [selectionInitialized, setSelectionInitialized] = React.useState(false);
|
|
45
50
|
// Get waas wallets that are not yet delegated or use provided wallets override
|
|
46
51
|
const waasWallets = React.useMemo(() => {
|
|
47
52
|
const items = wallets && wallets.length > 0
|
|
@@ -53,11 +58,25 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
53
58
|
const completedForUser = new Set(state.completed[userId] || []);
|
|
54
59
|
return items.filter((wallet) => !deniedForUser.has(wallet.id) && !completedForUser.has(wallet.id));
|
|
55
60
|
}, [userWallets, wallets, user === null || user === void 0 ? void 0 : user.userId]);
|
|
61
|
+
// Auto-select wallets only on initial load
|
|
62
|
+
React.useEffect(() => {
|
|
63
|
+
if (selectionInitialized)
|
|
64
|
+
return;
|
|
65
|
+
if (waasWallets.length === 1) {
|
|
66
|
+
setSelectedWallets(new Set([waasWallets[0].id]));
|
|
67
|
+
setSelectionInitialized(true);
|
|
68
|
+
}
|
|
69
|
+
else if (waasWallets.length > 1) {
|
|
70
|
+
setSelectedWallets(new Set(waasWallets.map((w) => w.id)));
|
|
71
|
+
setSelectionInitialized(true);
|
|
72
|
+
}
|
|
73
|
+
}, [waasWallets, selectionInitialized]);
|
|
56
74
|
const handleWalletToggle = (walletId, event) => {
|
|
57
75
|
// Prevent event propagation if called from checkbox
|
|
58
76
|
if (event) {
|
|
59
77
|
event.stopPropagation();
|
|
60
78
|
}
|
|
79
|
+
setSelectionInitialized(true);
|
|
61
80
|
setSelectedWallets((prev) => {
|
|
62
81
|
const newSet = new Set(prev);
|
|
63
82
|
if (newSet.has(walletId)) {
|
|
@@ -70,9 +89,11 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
70
89
|
});
|
|
71
90
|
};
|
|
72
91
|
const handleSelectAll = () => {
|
|
92
|
+
setSelectionInitialized(true);
|
|
73
93
|
setSelectedWallets(new Set(waasWallets.map((wallet) => wallet.id)));
|
|
74
94
|
};
|
|
75
95
|
const handleDeselectAll = () => {
|
|
96
|
+
setSelectionInitialized(true);
|
|
76
97
|
setSelectedWallets(new Set());
|
|
77
98
|
};
|
|
78
99
|
const persistDeniedWallets = () => {
|
|
@@ -160,10 +181,28 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
160
181
|
: t('dyn_wallet_delegation.approval_requested') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', className: 'embedded-delegated-view__approval-description', copykey: 'dyn_wallet_delegation.approval_description', children: t('dyn_wallet_delegation.approval_description', {
|
|
161
182
|
appName,
|
|
162
183
|
}) })] }) }));
|
|
163
|
-
|
|
184
|
+
// Single wallet view
|
|
185
|
+
const displaySingleWallet = () => {
|
|
186
|
+
const [wallet] = waasWallets;
|
|
187
|
+
if (!wallet)
|
|
188
|
+
return null;
|
|
189
|
+
return (jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__wallet-card-container', children: [jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__wallet-card', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', color: 'primary', children: t('dyn_wallet_delegation.my_wallet') }), jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__wallet-address', children: [jsxRuntime.jsx("div", { className: 'embedded-delegated-view__wallet-address-dot' }), jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: [wallet.address.slice(0, 6), "...", wallet.address.slice(-4)] })] })] }), jsxRuntime.jsx(AgreementSection.AgreementSection, { checked: agreementChecked, onToggle: () => setAgreementChecked(!agreementChecked), text: t('dyn_wallet_delegation.agreement_text') })] }));
|
|
190
|
+
};
|
|
191
|
+
// Multi-wallet initial view
|
|
192
|
+
const displayMultiWalletSummary = () => (jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__wallet-card-container', children: [jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__wallet-card', children: [jsxRuntime.jsxs("div", { style: { alignItems: 'baseline', display: 'flex', gap: '4px' }, children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'medium', color: 'primary', children: t(selectedWallets.size === waasWallets.length
|
|
193
|
+
? 'dyn_wallet_delegation.all_wallets'
|
|
194
|
+
: 'dyn_wallet_delegation.selected_wallets') }), selectedWallets.size !== waasWallets.length && (jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'tertiary', children: selectedWallets.size.toString().padStart(2, '0') }))] }), jsxRuntime.jsx("button", { onClick: () => setShowEditView(true), className: 'embedded-delegated-view__edit-selections-button', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', children: t('dyn_wallet_delegation.edit_selections') }) })] }), jsxRuntime.jsx(AgreementSection.AgreementSection, { checked: agreementChecked, onToggle: () => setAgreementChecked(!agreementChecked), text: t('dyn_wallet_delegation.agreement_text') })] }));
|
|
195
|
+
// Edit view (full wallet selection)
|
|
196
|
+
const displayWaasWallets = () => (jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__wallet-selection', children: [jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__wallet-selection__header', children: [jsxRuntime.jsxs("div", { style: { display: 'flex', gap: '4px' }, children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'secondary', children: t('dyn_wallet_delegation.selected_wallets') }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'tertiary', children: selectedWallets.size.toString().padStart(2, '0') })] }), jsxRuntime.jsx("button", { onClick: selectedWallets.size === waasWallets.length
|
|
164
197
|
? handleDeselectAll
|
|
165
|
-
: handleSelectAll, className: 'embedded-delegated-view__wallet-selection__deselect-all', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: '
|
|
166
|
-
|
|
198
|
+
: handleSelectAll, className: 'embedded-delegated-view__wallet-selection__deselect-all', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', color: 'tertiary', children: getSelectButtonText() }) })] }), jsxRuntime.jsx("div", { className: 'embedded-delegated-view__wallet-list', children: waasWallets === null || waasWallets === void 0 ? void 0 : waasWallets.map((wallet) => (jsxRuntime.jsx("div", { className: `embedded-delegated-view__wallet-item${selectedWallets.has(wallet.id)
|
|
199
|
+
? ' embedded-delegated-view__wallet-item--selected'
|
|
200
|
+
: ''}`, onClick: () => handleWalletToggle(wallet.id), children: jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__wallet-item__content', children: [jsxRuntime.jsx("div", { className: 'embedded-delegated-view__wallet-item__icon', children: jsxRuntime.jsx(WalletIconWithNetwork.WalletIconWithNetwork, { walletKey: wallet.key, Icon: null, iconUrl: wallet.connector.metadata.icon, chainName: wallet.chain, iconSize: 24, showNetwork: true }) }), jsxRuntime.jsx("div", { className: 'embedded-delegated-view__wallet-item__info', children: jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', weight: 'medium', children: [wallet.address.slice(0, 6), "...", wallet.address.slice(-4)] }) }), jsxRuntime.jsx("div", { className: 'embedded-delegated-view__wallet-item__checkbox', children: jsxRuntime.jsx(Checkbox.Checkbox, { checked: selectedWallets.has(wallet.id), onChange: (e) => e.stopPropagation(), value: wallet.id }) })] }) }, wallet.id))) })] }));
|
|
201
|
+
const navigationButton = showEditView ? (jsxRuntime.jsx(IconButton.IconButton, { onClick: () => {
|
|
202
|
+
setShowEditView(false);
|
|
203
|
+
// Reset agreement when coming back from edit view
|
|
204
|
+
setAgreementChecked(false);
|
|
205
|
+
}, type: 'button', children: jsxRuntime.jsx(arrowLeft.ReactComponent, {}) })) : (jsxRuntime.jsx(IconButton.IconButton, { onClick: () => {
|
|
167
206
|
// Mark prompt as dismissed until logout (unified state + legacy)
|
|
168
207
|
const state = utils.StorageService.getItem(localStorage.DELEGATION_STATE) || { completed: {}, denied: {}, dismissed: false };
|
|
169
208
|
state.dismissed = true;
|
|
@@ -203,9 +242,23 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
203
242
|
width: '100%',
|
|
204
243
|
}, className: 'embedded-delegated-view__body__button', expanded: true, children: t('dyn_wallet_delegation.try_again_button') }));
|
|
205
244
|
}
|
|
245
|
+
// If in edit view, show Done button
|
|
246
|
+
if (showEditView) {
|
|
247
|
+
return (jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonPadding: 'medium', buttonVariant: 'secondary', typographyProps: {
|
|
248
|
+
color: 'primary',
|
|
249
|
+
weight: 'medium',
|
|
250
|
+
}, onClick: () => {
|
|
251
|
+
setShowEditView(false);
|
|
252
|
+
setAgreementChecked(false);
|
|
253
|
+
}, dataTestId: 'embedded-delegation-done-button', copykey: 'dyn_wallet_delegation.done_button', style: {
|
|
254
|
+
backgroundColor: 'white',
|
|
255
|
+
border: '1px solid var(--dynamic-base-4)',
|
|
256
|
+
width: '100%',
|
|
257
|
+
}, className: 'embedded-delegated-view__body__button', expanded: true, children: t('dyn_wallet_delegation.done_button') }));
|
|
258
|
+
}
|
|
206
259
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonPadding: 'medium', buttonVariant: 'brand-primary', typographyProps: {
|
|
207
260
|
color: 'inherit',
|
|
208
|
-
}, onClick: () => handleDelegateWallets(), loading: isLoading, disabled: selectedWallets.size === 0, dataTestId: 'embedded-delegation-button', copykey: 'dyn_wallet_delegation.approve_button', style: { width: '100%' }, className: 'embedded-delegated-view__body__button', expanded: true, children: t('dyn_wallet_delegation.approve_button') }), !isLoading && !requiresDelegation && (jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonPadding: 'medium', buttonVariant: 'brand-primary', typographyProps: {
|
|
261
|
+
}, onClick: () => handleDelegateWallets(), loading: isLoading, disabled: selectedWallets.size === 0 || !agreementChecked, dataTestId: 'embedded-delegation-button', copykey: 'dyn_wallet_delegation.approve_button', style: { width: '100%' }, className: 'embedded-delegated-view__body__button', expanded: true, children: t('dyn_wallet_delegation.approve_button') }), !isLoading && !requiresDelegation && (jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonPadding: 'medium', buttonVariant: 'brand-primary', typographyProps: {
|
|
209
262
|
color: 'primary',
|
|
210
263
|
weight: 'bold',
|
|
211
264
|
}, onClick: () => {
|
|
@@ -226,7 +279,27 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
226
279
|
width: '100%',
|
|
227
280
|
}, className: 'embedded-delegated-view__body__button embedded-delegated-view__body__logout-button', expanded: true, children: t('dyn_wallet_delegation.logout_button') }))] }));
|
|
228
281
|
};
|
|
229
|
-
|
|
282
|
+
// Header configuration
|
|
283
|
+
let headerLeading;
|
|
284
|
+
if (showEditView) {
|
|
285
|
+
headerLeading = navigationButton;
|
|
286
|
+
}
|
|
287
|
+
else if (!requiresDelegation) {
|
|
288
|
+
headerLeading = navigationButton;
|
|
289
|
+
}
|
|
290
|
+
else {
|
|
291
|
+
headerLeading = undefined;
|
|
292
|
+
}
|
|
293
|
+
const headerChildren = showEditView ? (jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'bold', color: 'primary', children: t('dyn_wallet_delegation.edit_wallets_to_delegate') })) : undefined;
|
|
294
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: headerLeading, children: headerChildren }), jsxRuntime.jsx("div", { className: 'embedded-delegated-view', children: jsxRuntime.jsxs("div", { className: 'embedded-delegated-view__body', children: [!showEditView && getContentHeader(), errorText && jsxRuntime.jsx(ErrorContainer.ErrorContainer, { children: errorText }), !isLoading && !isSuccess && !error && (jsxRuntime.jsx("div", { className: 'embedded-delegated-view__body__card', children: (() => {
|
|
295
|
+
if (showEditView)
|
|
296
|
+
return displayWaasWallets();
|
|
297
|
+
if (waasWallets.length === 1)
|
|
298
|
+
return displaySingleWallet();
|
|
299
|
+
if (waasWallets.length > 1)
|
|
300
|
+
return displayMultiWalletSummary();
|
|
301
|
+
return null;
|
|
302
|
+
})() })), jsxRuntime.jsx("div", { className: 'embedded-delegated-view__body__button_section', children: getButtons() })] }) })] }));
|
|
230
303
|
};
|
|
231
304
|
|
|
232
305
|
exports.WalletDelegationView = WalletDelegationView;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client'
|
|
2
2
|
import { __awaiter } from '../../../../../_virtual/_tslib.js';
|
|
3
3
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
4
|
-
import { useState, useMemo } from 'react';
|
|
4
|
+
import { useState, useMemo, useEffect } from 'react';
|
|
5
5
|
import { useTranslation } from 'react-i18next';
|
|
6
6
|
import { StorageService, DynamicError } from '@dynamic-labs/utils';
|
|
7
7
|
import { Checkbox } from '../../../components/Checkbox/Checkbox.js';
|
|
@@ -14,6 +14,7 @@ import { useDynamicContext } from '../../../context/DynamicContext/useDynamicCon
|
|
|
14
14
|
import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
|
|
15
15
|
import { dynamicEvents } from '../../../events/dynamicEvents.js';
|
|
16
16
|
import { getProperErrorMessage } from '../../../modals/SignMessageConfirmationModal/getProperErrorMessage.js';
|
|
17
|
+
import { ReactComponent as SvgArrowLeft } from '../../../shared/assets/arrow-left.js';
|
|
17
18
|
import { ReactComponent as SvgCheck } from '../../../shared/assets/check.js';
|
|
18
19
|
import { ReactComponent as SvgClose } from '../../../shared/assets/close.js';
|
|
19
20
|
import { ReactComponent as SvgSwitchHorizontal } from '../../../shared/assets/switch-horizontal.js';
|
|
@@ -29,6 +30,7 @@ import { useWalletDelegation } from '../../../utils/hooks/useWalletDelegation/us
|
|
|
29
30
|
import { DELEGATION_STATE } from '../../../utils/constants/localStorage.js';
|
|
30
31
|
import '../../../utils/constants/colors.js';
|
|
31
32
|
import '../../../utils/constants/values.js';
|
|
33
|
+
import { AgreementSection } from './AgreementSection.js';
|
|
32
34
|
|
|
33
35
|
const WalletDelegationView = ({ wallets, }) => {
|
|
34
36
|
const { setShowAuthFlow, handleLogOut } = useInternalDynamicContext();
|
|
@@ -38,6 +40,9 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
38
40
|
const { delegateKeyShares } = useDynamicWaas();
|
|
39
41
|
const { requiresDelegation } = useWalletDelegation();
|
|
40
42
|
const [selectedWallets, setSelectedWallets] = useState(new Set());
|
|
43
|
+
const [showEditView, setShowEditView] = useState(false);
|
|
44
|
+
const [agreementChecked, setAgreementChecked] = useState(false);
|
|
45
|
+
const [selectionInitialized, setSelectionInitialized] = useState(false);
|
|
41
46
|
// Get waas wallets that are not yet delegated or use provided wallets override
|
|
42
47
|
const waasWallets = useMemo(() => {
|
|
43
48
|
const items = wallets && wallets.length > 0
|
|
@@ -49,11 +54,25 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
49
54
|
const completedForUser = new Set(state.completed[userId] || []);
|
|
50
55
|
return items.filter((wallet) => !deniedForUser.has(wallet.id) && !completedForUser.has(wallet.id));
|
|
51
56
|
}, [userWallets, wallets, user === null || user === void 0 ? void 0 : user.userId]);
|
|
57
|
+
// Auto-select wallets only on initial load
|
|
58
|
+
useEffect(() => {
|
|
59
|
+
if (selectionInitialized)
|
|
60
|
+
return;
|
|
61
|
+
if (waasWallets.length === 1) {
|
|
62
|
+
setSelectedWallets(new Set([waasWallets[0].id]));
|
|
63
|
+
setSelectionInitialized(true);
|
|
64
|
+
}
|
|
65
|
+
else if (waasWallets.length > 1) {
|
|
66
|
+
setSelectedWallets(new Set(waasWallets.map((w) => w.id)));
|
|
67
|
+
setSelectionInitialized(true);
|
|
68
|
+
}
|
|
69
|
+
}, [waasWallets, selectionInitialized]);
|
|
52
70
|
const handleWalletToggle = (walletId, event) => {
|
|
53
71
|
// Prevent event propagation if called from checkbox
|
|
54
72
|
if (event) {
|
|
55
73
|
event.stopPropagation();
|
|
56
74
|
}
|
|
75
|
+
setSelectionInitialized(true);
|
|
57
76
|
setSelectedWallets((prev) => {
|
|
58
77
|
const newSet = new Set(prev);
|
|
59
78
|
if (newSet.has(walletId)) {
|
|
@@ -66,9 +85,11 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
66
85
|
});
|
|
67
86
|
};
|
|
68
87
|
const handleSelectAll = () => {
|
|
88
|
+
setSelectionInitialized(true);
|
|
69
89
|
setSelectedWallets(new Set(waasWallets.map((wallet) => wallet.id)));
|
|
70
90
|
};
|
|
71
91
|
const handleDeselectAll = () => {
|
|
92
|
+
setSelectionInitialized(true);
|
|
72
93
|
setSelectedWallets(new Set());
|
|
73
94
|
};
|
|
74
95
|
const persistDeniedWallets = () => {
|
|
@@ -156,10 +177,28 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
156
177
|
: t('dyn_wallet_delegation.approval_requested') }), jsx(Typography, { variant: 'body_small', color: 'secondary', className: 'embedded-delegated-view__approval-description', copykey: 'dyn_wallet_delegation.approval_description', children: t('dyn_wallet_delegation.approval_description', {
|
|
157
178
|
appName,
|
|
158
179
|
}) })] }) }));
|
|
159
|
-
|
|
180
|
+
// Single wallet view
|
|
181
|
+
const displaySingleWallet = () => {
|
|
182
|
+
const [wallet] = waasWallets;
|
|
183
|
+
if (!wallet)
|
|
184
|
+
return null;
|
|
185
|
+
return (jsxs("div", { className: 'embedded-delegated-view__wallet-card-container', children: [jsxs("div", { className: 'embedded-delegated-view__wallet-card', children: [jsx(Typography, { variant: 'body_normal', weight: 'medium', color: 'primary', children: t('dyn_wallet_delegation.my_wallet') }), jsxs("div", { className: 'embedded-delegated-view__wallet-address', children: [jsx("div", { className: 'embedded-delegated-view__wallet-address-dot' }), jsxs(Typography, { variant: 'body_small', color: 'secondary', children: [wallet.address.slice(0, 6), "...", wallet.address.slice(-4)] })] })] }), jsx(AgreementSection, { checked: agreementChecked, onToggle: () => setAgreementChecked(!agreementChecked), text: t('dyn_wallet_delegation.agreement_text') })] }));
|
|
186
|
+
};
|
|
187
|
+
// Multi-wallet initial view
|
|
188
|
+
const displayMultiWalletSummary = () => (jsxs("div", { className: 'embedded-delegated-view__wallet-card-container', children: [jsxs("div", { className: 'embedded-delegated-view__wallet-card', children: [jsxs("div", { style: { alignItems: 'baseline', display: 'flex', gap: '4px' }, children: [jsx(Typography, { variant: 'body_normal', weight: 'medium', color: 'primary', children: t(selectedWallets.size === waasWallets.length
|
|
189
|
+
? 'dyn_wallet_delegation.all_wallets'
|
|
190
|
+
: 'dyn_wallet_delegation.selected_wallets') }), selectedWallets.size !== waasWallets.length && (jsx(Typography, { variant: 'body_normal', color: 'tertiary', children: selectedWallets.size.toString().padStart(2, '0') }))] }), jsx("button", { onClick: () => setShowEditView(true), className: 'embedded-delegated-view__edit-selections-button', children: jsx(Typography, { variant: 'body_small', color: 'secondary', children: t('dyn_wallet_delegation.edit_selections') }) })] }), jsx(AgreementSection, { checked: agreementChecked, onToggle: () => setAgreementChecked(!agreementChecked), text: t('dyn_wallet_delegation.agreement_text') })] }));
|
|
191
|
+
// Edit view (full wallet selection)
|
|
192
|
+
const displayWaasWallets = () => (jsxs("div", { className: 'embedded-delegated-view__wallet-selection', children: [jsxs("div", { className: 'embedded-delegated-view__wallet-selection__header', children: [jsxs("div", { style: { display: 'flex', gap: '4px' }, children: [jsx(Typography, { variant: 'body_small', color: 'secondary', children: t('dyn_wallet_delegation.selected_wallets') }), jsx(Typography, { variant: 'body_small', color: 'tertiary', children: selectedWallets.size.toString().padStart(2, '0') })] }), jsx("button", { onClick: selectedWallets.size === waasWallets.length
|
|
160
193
|
? handleDeselectAll
|
|
161
|
-
: handleSelectAll, className: 'embedded-delegated-view__wallet-selection__deselect-all', children: jsx(Typography, { variant: 'body_small', color: '
|
|
162
|
-
|
|
194
|
+
: handleSelectAll, className: 'embedded-delegated-view__wallet-selection__deselect-all', children: jsx(Typography, { variant: 'body_small', color: 'tertiary', children: getSelectButtonText() }) })] }), jsx("div", { className: 'embedded-delegated-view__wallet-list', children: waasWallets === null || waasWallets === void 0 ? void 0 : waasWallets.map((wallet) => (jsx("div", { className: `embedded-delegated-view__wallet-item${selectedWallets.has(wallet.id)
|
|
195
|
+
? ' embedded-delegated-view__wallet-item--selected'
|
|
196
|
+
: ''}`, onClick: () => handleWalletToggle(wallet.id), children: jsxs("div", { className: 'embedded-delegated-view__wallet-item__content', children: [jsx("div", { className: 'embedded-delegated-view__wallet-item__icon', children: jsx(WalletIconWithNetwork, { walletKey: wallet.key, Icon: null, iconUrl: wallet.connector.metadata.icon, chainName: wallet.chain, iconSize: 24, showNetwork: true }) }), jsx("div", { className: 'embedded-delegated-view__wallet-item__info', children: jsxs(Typography, { variant: 'body_small', weight: 'medium', children: [wallet.address.slice(0, 6), "...", wallet.address.slice(-4)] }) }), jsx("div", { className: 'embedded-delegated-view__wallet-item__checkbox', children: jsx(Checkbox, { checked: selectedWallets.has(wallet.id), onChange: (e) => e.stopPropagation(), value: wallet.id }) })] }) }, wallet.id))) })] }));
|
|
197
|
+
const navigationButton = showEditView ? (jsx(IconButton, { onClick: () => {
|
|
198
|
+
setShowEditView(false);
|
|
199
|
+
// Reset agreement when coming back from edit view
|
|
200
|
+
setAgreementChecked(false);
|
|
201
|
+
}, type: 'button', children: jsx(SvgArrowLeft, {}) })) : (jsx(IconButton, { onClick: () => {
|
|
163
202
|
// Mark prompt as dismissed until logout (unified state + legacy)
|
|
164
203
|
const state = StorageService.getItem(DELEGATION_STATE) || { completed: {}, denied: {}, dismissed: false };
|
|
165
204
|
state.dismissed = true;
|
|
@@ -199,9 +238,23 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
199
238
|
width: '100%',
|
|
200
239
|
}, className: 'embedded-delegated-view__body__button', expanded: true, children: t('dyn_wallet_delegation.try_again_button') }));
|
|
201
240
|
}
|
|
241
|
+
// If in edit view, show Done button
|
|
242
|
+
if (showEditView) {
|
|
243
|
+
return (jsx(TypographyButton, { buttonPadding: 'medium', buttonVariant: 'secondary', typographyProps: {
|
|
244
|
+
color: 'primary',
|
|
245
|
+
weight: 'medium',
|
|
246
|
+
}, onClick: () => {
|
|
247
|
+
setShowEditView(false);
|
|
248
|
+
setAgreementChecked(false);
|
|
249
|
+
}, dataTestId: 'embedded-delegation-done-button', copykey: 'dyn_wallet_delegation.done_button', style: {
|
|
250
|
+
backgroundColor: 'white',
|
|
251
|
+
border: '1px solid var(--dynamic-base-4)',
|
|
252
|
+
width: '100%',
|
|
253
|
+
}, className: 'embedded-delegated-view__body__button', expanded: true, children: t('dyn_wallet_delegation.done_button') }));
|
|
254
|
+
}
|
|
202
255
|
return (jsxs(Fragment, { children: [jsx(TypographyButton, { buttonPadding: 'medium', buttonVariant: 'brand-primary', typographyProps: {
|
|
203
256
|
color: 'inherit',
|
|
204
|
-
}, onClick: () => handleDelegateWallets(), loading: isLoading, disabled: selectedWallets.size === 0, dataTestId: 'embedded-delegation-button', copykey: 'dyn_wallet_delegation.approve_button', style: { width: '100%' }, className: 'embedded-delegated-view__body__button', expanded: true, children: t('dyn_wallet_delegation.approve_button') }), !isLoading && !requiresDelegation && (jsx(TypographyButton, { buttonPadding: 'medium', buttonVariant: 'brand-primary', typographyProps: {
|
|
257
|
+
}, onClick: () => handleDelegateWallets(), loading: isLoading, disabled: selectedWallets.size === 0 || !agreementChecked, dataTestId: 'embedded-delegation-button', copykey: 'dyn_wallet_delegation.approve_button', style: { width: '100%' }, className: 'embedded-delegated-view__body__button', expanded: true, children: t('dyn_wallet_delegation.approve_button') }), !isLoading && !requiresDelegation && (jsx(TypographyButton, { buttonPadding: 'medium', buttonVariant: 'brand-primary', typographyProps: {
|
|
205
258
|
color: 'primary',
|
|
206
259
|
weight: 'bold',
|
|
207
260
|
}, onClick: () => {
|
|
@@ -222,7 +275,27 @@ const WalletDelegationView = ({ wallets, }) => {
|
|
|
222
275
|
width: '100%',
|
|
223
276
|
}, className: 'embedded-delegated-view__body__button embedded-delegated-view__body__logout-button', expanded: true, children: t('dyn_wallet_delegation.logout_button') }))] }));
|
|
224
277
|
};
|
|
225
|
-
|
|
278
|
+
// Header configuration
|
|
279
|
+
let headerLeading;
|
|
280
|
+
if (showEditView) {
|
|
281
|
+
headerLeading = navigationButton;
|
|
282
|
+
}
|
|
283
|
+
else if (!requiresDelegation) {
|
|
284
|
+
headerLeading = navigationButton;
|
|
285
|
+
}
|
|
286
|
+
else {
|
|
287
|
+
headerLeading = undefined;
|
|
288
|
+
}
|
|
289
|
+
const headerChildren = showEditView ? (jsx(Typography, { variant: 'body_normal', weight: 'bold', color: 'primary', children: t('dyn_wallet_delegation.edit_wallets_to_delegate') })) : undefined;
|
|
290
|
+
return (jsxs(Fragment, { children: [jsx(ModalHeader, { leading: headerLeading, children: headerChildren }), jsx("div", { className: 'embedded-delegated-view', children: jsxs("div", { className: 'embedded-delegated-view__body', children: [!showEditView && getContentHeader(), errorText && jsx(ErrorContainer, { children: errorText }), !isLoading && !isSuccess && !error && (jsx("div", { className: 'embedded-delegated-view__body__card', children: (() => {
|
|
291
|
+
if (showEditView)
|
|
292
|
+
return displayWaasWallets();
|
|
293
|
+
if (waasWallets.length === 1)
|
|
294
|
+
return displaySingleWallet();
|
|
295
|
+
if (waasWallets.length > 1)
|
|
296
|
+
return displayMultiWalletSummary();
|
|
297
|
+
return null;
|
|
298
|
+
})() })), jsx("div", { className: 'embedded-delegated-view__body__button_section', children: getButtons() })] }) })] }));
|
|
226
299
|
};
|
|
227
300
|
|
|
228
301
|
export { WalletDelegationView };
|
|
@@ -12,6 +12,7 @@ var ManagePasskeysWidgetView = require('../../views/ManagePasskeysWidgetView/Man
|
|
|
12
12
|
var SettingsView = require('../../views/SettingsView/SettingsView.cjs');
|
|
13
13
|
var AccountAndSecuritySettingsView = require('../../views/AccountAndSecuritySettingsView/AccountAndSecuritySettingsView.cjs');
|
|
14
14
|
var SessionManagementView = require('../../views/SessionManagementView/SessionManagementView.cjs');
|
|
15
|
+
var WalletsDelegatedSettingsView = require('../../views/WalletsDelegatedSettingsView/WalletsDelegatedSettingsView.cjs');
|
|
15
16
|
var ChooseLinkedWalletView = require('../../views/ChooseLinkedWalletView/ChooseLinkedWalletView.cjs');
|
|
16
17
|
var ChooseOnrampProviderView = require('../../views/ChooseOnrampProviderView/ChooseOnrampProviderView.cjs');
|
|
17
18
|
var ChooseWalletFundingMethod = require('../../views/ChooseWalletFundingMethod/ChooseWalletFundingMethod.cjs');
|
|
@@ -51,6 +52,7 @@ const mapViewToComponent = {
|
|
|
51
52
|
settings: SettingsView.SettingsView,
|
|
52
53
|
'wallet-delegation': WalletDelegationView.WalletDelegationView,
|
|
53
54
|
wallets: WalletsView.WalletsView,
|
|
55
|
+
'wallets-delegated-settings': WalletsDelegatedSettingsView.WalletsDelegatedSettingsView,
|
|
54
56
|
};
|
|
55
57
|
|
|
56
58
|
exports.mapViewToComponent = mapViewToComponent;
|
|
@@ -36,4 +36,5 @@ export declare const mapViewToComponent: {
|
|
|
36
36
|
wallets?: import("dist/packages/wallet-connector-core/src").Wallet<import("dist/packages/wallet-connector-core/src").WalletConnectorCore.WalletConnector>[] | undefined;
|
|
37
37
|
}>;
|
|
38
38
|
wallets: import("react").FC;
|
|
39
|
+
'wallets-delegated-settings': import("react").FC<import("../../views/WalletsDelegatedSettingsView/WalletsDelegatedSettingsView").WalletsDelegatedSettingsViewProps>;
|
|
39
40
|
};
|
|
@@ -8,6 +8,7 @@ import { ManagePasskeysWidgetView } from '../../views/ManagePasskeysWidgetView/M
|
|
|
8
8
|
import { SettingsView } from '../../views/SettingsView/SettingsView.js';
|
|
9
9
|
import { AccountAndSecuritySettingsView } from '../../views/AccountAndSecuritySettingsView/AccountAndSecuritySettingsView.js';
|
|
10
10
|
import { SessionManagementView } from '../../views/SessionManagementView/SessionManagementView.js';
|
|
11
|
+
import { WalletsDelegatedSettingsView } from '../../views/WalletsDelegatedSettingsView/WalletsDelegatedSettingsView.js';
|
|
11
12
|
import { ChooseLinkedWalletView } from '../../views/ChooseLinkedWalletView/ChooseLinkedWalletView.js';
|
|
12
13
|
import { ChooseOnrampProviderView } from '../../views/ChooseOnrampProviderView/ChooseOnrampProviderView.js';
|
|
13
14
|
import { ChooseWalletFundingMethod } from '../../views/ChooseWalletFundingMethod/ChooseWalletFundingMethod.js';
|
|
@@ -47,6 +48,7 @@ const mapViewToComponent = {
|
|
|
47
48
|
settings: SettingsView,
|
|
48
49
|
'wallet-delegation': WalletDelegationView,
|
|
49
50
|
wallets: WalletsView,
|
|
51
|
+
'wallets-delegated-settings': WalletsDelegatedSettingsView,
|
|
50
52
|
};
|
|
51
53
|
|
|
52
54
|
export { mapViewToComponent };
|
|
@@ -13,7 +13,7 @@ export declare const DynamicSessionManagementViews: readonly ["session-managemen
|
|
|
13
13
|
export type DynamicSessionManagementViewsType = typeof DynamicSessionManagementViews[number];
|
|
14
14
|
export declare const DynamicTransactionsWidgetViews: readonly ["send-balance"];
|
|
15
15
|
export type DynamicTransactionsWidgetViewsType = typeof DynamicTransactionsWidgetViews[number];
|
|
16
|
-
export type DynamicWidgetViews = 'wallets' | 'profile' | 'edit-profile' | 'choose-wallet-funding-method' | 'receive-wallet-funds' | 'deposited-exchange' | 'receive-exchange-funds' | DynamicTransactionsWidgetViewsType | DynamicPasskeyWidgetViewsType | DynamicMfaWidgetViewsType | DynamicSettingsType | DynamicGlobalWalletType | DynamicSessionManagementViewsType | 'connected-apps' | 'deposit-view' | 'confirm-exchange-transfer' | 'choose-onramp-provider' | 'choose-linked-wallet' | 'wallet-delegation';
|
|
16
|
+
export type DynamicWidgetViews = 'wallets' | 'profile' | 'edit-profile' | 'choose-wallet-funding-method' | 'receive-wallet-funds' | 'deposited-exchange' | 'receive-exchange-funds' | DynamicTransactionsWidgetViewsType | DynamicPasskeyWidgetViewsType | DynamicMfaWidgetViewsType | DynamicSettingsType | DynamicGlobalWalletType | DynamicSessionManagementViewsType | 'connected-apps' | 'deposit-view' | 'confirm-exchange-transfer' | 'choose-onramp-provider' | 'choose-linked-wallet' | 'wallet-delegation' | 'wallets-delegated-settings';
|
|
17
17
|
export type DynamicWidgetViewMapConstraint = Record<DynamicWidgetViews, FC<any>>;
|
|
18
18
|
export type DynamicWidgetViewMap = typeof mapViewToComponent;
|
|
19
19
|
export type SetDynamicWidgetView = <T extends DynamicWidgetViews>(view: T, props?: ComponentProps<DynamicWidgetViewMap[T]>) => void;
|
|
@@ -35,7 +35,6 @@ require('@dynamic-labs-sdk/client/core');
|
|
|
35
35
|
require('../../../../client/client.cjs');
|
|
36
36
|
require('@dynamic-labs-sdk/client');
|
|
37
37
|
require('../../../../config/ApiEndpoint.cjs');
|
|
38
|
-
var useProjectSettings = require('../../../../client/extension/projectSettings/useProjectSettings/useProjectSettings.cjs');
|
|
39
38
|
require('../../../../locale/locale.cjs');
|
|
40
39
|
require('../../../../store/state/dynamicContextProps/dynamicContextProps.cjs');
|
|
41
40
|
require('../../../../store/state/primaryWalletId/primaryWalletId.cjs');
|
|
@@ -90,7 +89,6 @@ require('../../components/PasskeyCard/PasskeyCard.cjs');
|
|
|
90
89
|
require('../../../../context/OnrampContext/OnrampContext.cjs');
|
|
91
90
|
require('../../../../../index.cjs');
|
|
92
91
|
require('../../helpers/convertExchangeKeyAndProviderEnum.cjs');
|
|
93
|
-
var EmbeddedDelegatedSection = require('./EmbeddedDelegatedSection/EmbeddedDelegatedSection.cjs');
|
|
94
92
|
require('qrcode');
|
|
95
93
|
require('../ReceiveWalletFunds/ReceiveWalletFunds.cjs');
|
|
96
94
|
require('../../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
|
|
@@ -110,16 +108,14 @@ require('../../../../components/Popper/Popper/Popper.cjs');
|
|
|
110
108
|
require('../../../../components/Popper/PopperContext/PopperContext.cjs');
|
|
111
109
|
|
|
112
110
|
const ConnectedAppsView = ({ name }) => {
|
|
113
|
-
var _a
|
|
111
|
+
var _a;
|
|
114
112
|
const { t } = reactI18next.useTranslation();
|
|
115
113
|
const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
|
|
116
114
|
const { primaryWallet } = useDynamicContext.useDynamicContext();
|
|
117
115
|
const [connectedApps, setConnectedApps] = React.useState([]);
|
|
118
116
|
const [refreshing, setRefreshing] = React.useState(false);
|
|
119
117
|
const [showSuccessMessage, setShowSuccessMessage] = React.useState(false);
|
|
120
|
-
const projectSettings = useProjectSettings.useProjectSettings();
|
|
121
118
|
const { globalWallet } = (_a = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) !== null && _a !== void 0 ? _a : {};
|
|
122
|
-
const isWalletDelegationEnabled = (_d = (_c = (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.waas) === null || _c === void 0 ? void 0 : _c.delegatedAccess) === null || _d === void 0 ? void 0 : _d.enabled;
|
|
123
119
|
React.useEffect(() => {
|
|
124
120
|
const fetchConnectedApps = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
|
|
125
121
|
try {
|
|
@@ -187,7 +183,7 @@ const ConnectedAppsView = ({ name }) => {
|
|
|
187
183
|
}, dataTestId: 'open-app-button' }), jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => handleDisconnect(app.topic), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsxRuntime.jsx(unlink.ReactComponent, {}), typographyProps: {
|
|
188
184
|
color: 'secondary',
|
|
189
185
|
variant: 'button_secondary',
|
|
190
|
-
} })] })] }, 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 }) })] }))
|
|
186
|
+
} })] })] }, 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 }) })] }))] }));
|
|
191
187
|
};
|
|
192
188
|
|
|
193
189
|
exports.ConnectedAppsView = ConnectedAppsView;
|
|
@@ -31,7 +31,6 @@ import '@dynamic-labs-sdk/client/core';
|
|
|
31
31
|
import '../../../../client/client.js';
|
|
32
32
|
import '@dynamic-labs-sdk/client';
|
|
33
33
|
import '../../../../config/ApiEndpoint.js';
|
|
34
|
-
import { useProjectSettings } from '../../../../client/extension/projectSettings/useProjectSettings/useProjectSettings.js';
|
|
35
34
|
import '../../../../locale/locale.js';
|
|
36
35
|
import '../../../../store/state/dynamicContextProps/dynamicContextProps.js';
|
|
37
36
|
import '../../../../store/state/primaryWalletId/primaryWalletId.js';
|
|
@@ -86,7 +85,6 @@ import '../../components/PasskeyCard/PasskeyCard.js';
|
|
|
86
85
|
import '../../../../context/OnrampContext/OnrampContext.js';
|
|
87
86
|
import '../../../../../index.js';
|
|
88
87
|
import '../../helpers/convertExchangeKeyAndProviderEnum.js';
|
|
89
|
-
import { EmbeddedDelegatedSection } from './EmbeddedDelegatedSection/EmbeddedDelegatedSection.js';
|
|
90
88
|
import 'qrcode';
|
|
91
89
|
import '../ReceiveWalletFunds/ReceiveWalletFunds.js';
|
|
92
90
|
import '../../../../context/IpConfigurationContext/IpConfigurationContext.js';
|
|
@@ -106,16 +104,14 @@ import '../../../../components/Popper/Popper/Popper.js';
|
|
|
106
104
|
import '../../../../components/Popper/PopperContext/PopperContext.js';
|
|
107
105
|
|
|
108
106
|
const ConnectedAppsView = ({ name }) => {
|
|
109
|
-
var _a
|
|
107
|
+
var _a;
|
|
110
108
|
const { t } = useTranslation();
|
|
111
109
|
const { setDynamicWidgetView } = useWidgetContext();
|
|
112
110
|
const { primaryWallet } = useDynamicContext();
|
|
113
111
|
const [connectedApps, setConnectedApps] = useState([]);
|
|
114
112
|
const [refreshing, setRefreshing] = useState(false);
|
|
115
113
|
const [showSuccessMessage, setShowSuccessMessage] = useState(false);
|
|
116
|
-
const projectSettings = useProjectSettings();
|
|
117
114
|
const { globalWallet } = (_a = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector) !== null && _a !== void 0 ? _a : {};
|
|
118
|
-
const isWalletDelegationEnabled = (_d = (_c = (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.waas) === null || _c === void 0 ? void 0 : _c.delegatedAccess) === null || _d === void 0 ? void 0 : _d.enabled;
|
|
119
115
|
useEffect(() => {
|
|
120
116
|
const fetchConnectedApps = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
121
117
|
try {
|
|
@@ -183,7 +179,7 @@ const ConnectedAppsView = ({ name }) => {
|
|
|
183
179
|
}, dataTestId: 'open-app-button' }), jsx(TypographyButton, { onClick: () => handleDisconnect(app.topic), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsx(SvgUnlink, {}), typographyProps: {
|
|
184
180
|
color: 'secondary',
|
|
185
181
|
variant: 'button_secondary',
|
|
186
|
-
} })] })] }, 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 }) })] }))
|
|
182
|
+
} })] })] }, 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 }) })] }))] }));
|
|
187
183
|
};
|
|
188
184
|
|
|
189
185
|
export { ConnectedAppsView, ConnectedAppsView as default };
|