@dynamic-labs/sdk-react-core 4.18.7 → 4.19.0

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.
Files changed (50) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/package.cjs +1 -1
  3. package/package.js +1 -1
  4. package/package.json +11 -11
  5. package/src/lib/context/DynamicContext/useDynamicContext/useDynamicContext.cjs +7 -1
  6. package/src/lib/context/DynamicContext/useDynamicContext/useDynamicContext.js +8 -2
  7. package/src/lib/context/UserWalletsContext/UserWalletsContext.cjs +26 -3
  8. package/src/lib/context/UserWalletsContext/UserWalletsContext.js +27 -4
  9. package/src/lib/locale/en/translation.cjs +39 -0
  10. package/src/lib/locale/en/translation.d.ts +39 -0
  11. package/src/lib/locale/en/translation.js +39 -0
  12. package/src/lib/styles/index.shadow.cjs +1 -1
  13. package/src/lib/styles/index.shadow.js +1 -1
  14. package/src/lib/utils/functions/getSessionInformationName/getSessionInformationName.cjs +10 -0
  15. package/src/lib/utils/functions/getSessionInformationName/getSessionInformationName.d.ts +2 -0
  16. package/src/lib/utils/functions/getSessionInformationName/getSessionInformationName.js +6 -0
  17. package/src/lib/utils/functions/getSessionInformationName/index.d.ts +1 -0
  18. package/src/lib/utils/hooks/authenticationHooks/useConnectAndSign/useConnectAndSign.cjs +2 -0
  19. package/src/lib/utils/hooks/authenticationHooks/useConnectAndSign/useConnectAndSign.js +2 -0
  20. package/src/lib/utils/hooks/useAuthLayoutChecks/useAllowClose/useAllowClose.cjs +92 -4
  21. package/src/lib/utils/hooks/useAuthLayoutChecks/useAllowClose/useAllowClose.js +92 -4
  22. package/src/lib/utils/hooks/useDynamicWaas/useDynamicWaas.d.ts +2 -3
  23. package/src/lib/utils/hooks/useSessionKeys/index.d.ts +1 -0
  24. package/src/lib/utils/hooks/useSessionKeys/useSessionKeys.cjs +140 -0
  25. package/src/lib/utils/hooks/useSessionKeys/useSessionKeys.d.ts +5 -0
  26. package/src/lib/utils/hooks/useSessionKeys/useSessionKeys.js +136 -0
  27. package/src/lib/utils/hooks/useSubdomainCheck/useSubdomainCheck.cjs +3 -90
  28. package/src/lib/utils/hooks/useSubdomainCheck/useSubdomainCheck.js +3 -90
  29. package/src/lib/utils/hooks/useTokenBalances/useTokenBalances.cjs +5 -1
  30. package/src/lib/utils/hooks/useTokenBalances/useTokenBalances.js +5 -1
  31. package/src/lib/utils/types/SessionInformation.d.ts +25 -0
  32. package/src/lib/widgets/DynamicWidget/components/DynamicWidgetViews/mapViewToComponent.cjs +2 -0
  33. package/src/lib/widgets/DynamicWidget/components/DynamicWidgetViews/mapViewToComponent.d.ts +2 -1
  34. package/src/lib/widgets/DynamicWidget/components/DynamicWidgetViews/mapViewToComponent.js +2 -0
  35. package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.types.d.ts +1 -1
  36. package/src/lib/widgets/DynamicWidget/views/ConnectedAppsView/ConnectedAppsView.cjs +1 -1
  37. package/src/lib/widgets/DynamicWidget/views/ConnectedAppsView/ConnectedAppsView.js +1 -1
  38. package/src/lib/widgets/DynamicWidget/views/GlobalWalletView/GlobalWalletView.cjs +1 -1
  39. package/src/lib/widgets/DynamicWidget/views/GlobalWalletView/GlobalWalletView.js +1 -1
  40. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/RevokeAccessView/RevokeAccessView.cjs +51 -0
  41. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/RevokeAccessView/RevokeAccessView.d.ts +6 -0
  42. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/RevokeAccessView/RevokeAccessView.js +47 -0
  43. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/RevokeAccessView/index.d.ts +1 -0
  44. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/SessionListItem/SessionListItem.cjs +31 -0
  45. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/SessionListItem/SessionListItem.d.ts +8 -0
  46. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/SessionListItem/SessionListItem.js +27 -0
  47. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/SessionListItem/index.d.ts +1 -0
  48. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/SessionManagementView.cjs +15 -2
  49. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/SessionManagementView.d.ts +7 -1
  50. package/src/lib/widgets/DynamicWidget/views/SessionManagementView/SessionManagementView.js +16 -3
@@ -6,95 +6,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
6
6
  var _tslib = require('../../../../../_virtual/_tslib.cjs');
7
7
  var React = require('react');
8
8
  var sdkApiCore = require('@dynamic-labs/sdk-api-core');
9
- require('../../../context/DynamicContext/DynamicContext.cjs');
10
- require('../../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
11
- require('../../../shared/logger.cjs');
12
- require('@dynamic-labs/iconic');
13
- require('@dynamic-labs/wallet-connector-core');
14
- require('react/jsx-runtime');
15
- require('../../../context/ViewContext/ViewContext.cjs');
16
- require('@dynamic-labs/wallet-book');
17
- require('@dynamic-labs/utils');
18
- require('../../constants/colors.cjs');
19
- require('../../constants/values.cjs');
20
- require('../../../shared/consts/index.cjs');
21
- require('../../../events/dynamicEvents.cjs');
22
- require('../../../context/CaptchaContext/CaptchaContext.cjs');
23
- require('../../../context/ErrorContext/ErrorContext.cjs');
24
- require('@dynamic-labs/multi-wallet');
25
- require('react-international-phone');
26
- require('../../../store/state/nonce/nonce.cjs');
27
- require('../../../store/state/projectSettings/projectSettings.cjs');
28
- require('../../../config/ApiEndpoint.cjs');
29
- require('../../../store/state/user/user.cjs');
30
- require('../../../locale/locale.cjs');
31
9
  var user = require('../../../data/api/user/user.cjs');
32
- require('../../../store/state/dynamicContextProps/dynamicContextProps.cjs');
33
- require('../../../store/state/primaryWalletId/primaryWalletId.cjs');
34
- require('../../../store/state/connectedWalletsInfo/connectedWalletsInfo.cjs');
35
- require('../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
36
- require('../../../context/AccountExistsContext/AccountExistsContext.cjs');
37
- require('../../../context/UserWalletsContext/UserWalletsContext.cjs');
38
- require('../../../store/state/authMode/authMode.cjs');
39
- require('../../../context/VerificationContext/VerificationContext.cjs');
40
- require('react-dom');
41
- require('../../functions/compareChains/compareChains.cjs');
42
- require('../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.cjs');
43
- require('../../../context/ThemeContext/ThemeContext.cjs');
44
- require('../useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
45
- require('bs58');
46
- require('@dynamic-labs/types');
47
- require('../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
48
- require('../../../context/LoadingContext/LoadingContext.cjs');
49
- require('../../../context/WalletContext/WalletContext.cjs');
50
- require('../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.cjs');
51
- require('yup');
52
- require('../../../context/MockContext/MockContext.cjs');
53
- require('../../../views/CollectUserDataView/useFields.cjs');
54
- require('../../../context/FieldsStateContext/FieldsStateContext.cjs');
55
- require('../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
56
- require('@dynamic-labs/rpc-providers');
57
- require('../../../store/state/walletOptions/walletOptions.cjs');
58
- require('react-i18next');
59
- require('../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
60
- require('../../../components/Alert/Alert.cjs');
61
- require('../../../components/ShadowDOM/ShadowDOM.cjs');
62
- require('../../../components/IconButton/IconButton.cjs');
63
- require('../../../components/InlineWidget/InlineWidget.cjs');
64
- require('../../../components/Input/Input.cjs');
65
- require('../../../components/IsBrowser/IsBrowser.cjs');
66
- require('../../../components/MenuList/Dropdown/Dropdown.cjs');
67
- require('../../../components/OverlayCard/OverlayCard.cjs');
68
- require('../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
69
- require('../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
70
- require('../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
71
- require('../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
72
- require('../../../components/Popper/Popper/Popper.cjs');
73
- require('../../../components/Popper/PopperContext/PopperContext.cjs');
74
- require('react-focus-lock');
75
- require('qrcode');
76
- require('formik');
77
- require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
78
- require('../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
79
- require('../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
80
- require('../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
81
- require('@hcaptcha/react-hcaptcha');
82
- require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
83
- require('../../../context/FooterAnimationContext/index.cjs');
84
- require('../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
85
- require('../../../context/PasskeyContext/PasskeyContext.cjs');
86
- require('../../../store/state/sendBalances.cjs');
87
- require('../../../store/state/connectorsInitializing/connectorsInitializing.cjs');
88
- require('../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.cjs');
89
- require('../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
90
- require('../../../views/TransactionConfirmationView/TransactionConfirmationView.cjs');
91
- require('../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
92
- require('../../../context/OnrampContext/OnrampContext.cjs');
93
- require('../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
94
- require('../../../../index.cjs');
95
- require('../../../store/state/tokenBalances.cjs');
96
- require('../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
97
- var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
10
+ var dynamicContextProps = require('../../../store/state/dynamicContextProps/dynamicContextProps.cjs');
98
11
 
99
12
  exports.SubdomainCheckResponseError = void 0;
100
13
  (function (SubdomainCheckResponseError) {
@@ -102,9 +15,9 @@ exports.SubdomainCheckResponseError = void 0;
102
15
  })(exports.SubdomainCheckResponseError || (exports.SubdomainCheckResponseError = {}));
103
16
  /** Hook to check if a subdomain is available */
104
17
  const useSubdomainCheck = () => {
105
- const { environmentId } = useInternalDynamicContext.useInternalDynamicContext();
106
18
  const checkSubdomain = React.useCallback((_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ subdomain, }) {
107
19
  var _b;
20
+ const environmentId = dynamicContextProps.getEnvironmentId();
108
21
  const response = yield user.getUserFieldsCheck({
109
22
  environmentId,
110
23
  filter: {
@@ -122,7 +35,7 @@ const useSubdomainCheck = () => {
122
35
  available: (_b = response === null || response === void 0 ? void 0 : response.available) !== null && _b !== void 0 ? _b : false,
123
36
  error: undefined,
124
37
  };
125
- }), [environmentId]);
38
+ }), []);
126
39
  return checkSubdomain;
127
40
  };
128
41
 
@@ -2,95 +2,8 @@
2
2
  import { __awaiter } from '../../../../../_virtual/_tslib.js';
3
3
  import { useCallback } from 'react';
4
4
  import { UserFieldsCheckEnum } from '@dynamic-labs/sdk-api-core';
5
- import '../../../context/DynamicContext/DynamicContext.js';
6
- import '../../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
7
- import '../../../shared/logger.js';
8
- import '@dynamic-labs/iconic';
9
- import '@dynamic-labs/wallet-connector-core';
10
- import 'react/jsx-runtime';
11
- import '../../../context/ViewContext/ViewContext.js';
12
- import '@dynamic-labs/wallet-book';
13
- import '@dynamic-labs/utils';
14
- import '../../constants/colors.js';
15
- import '../../constants/values.js';
16
- import '../../../shared/consts/index.js';
17
- import '../../../events/dynamicEvents.js';
18
- import '../../../context/CaptchaContext/CaptchaContext.js';
19
- import '../../../context/ErrorContext/ErrorContext.js';
20
- import '@dynamic-labs/multi-wallet';
21
- import 'react-international-phone';
22
- import '../../../store/state/nonce/nonce.js';
23
- import '../../../store/state/projectSettings/projectSettings.js';
24
- import '../../../config/ApiEndpoint.js';
25
- import '../../../store/state/user/user.js';
26
- import '../../../locale/locale.js';
27
5
  import { getUserFieldsCheck } from '../../../data/api/user/user.js';
28
- import '../../../store/state/dynamicContextProps/dynamicContextProps.js';
29
- import '../../../store/state/primaryWalletId/primaryWalletId.js';
30
- import '../../../store/state/connectedWalletsInfo/connectedWalletsInfo.js';
31
- import '../../../context/AccessDeniedContext/AccessDeniedContext.js';
32
- import '../../../context/AccountExistsContext/AccountExistsContext.js';
33
- import '../../../context/UserWalletsContext/UserWalletsContext.js';
34
- import '../../../store/state/authMode/authMode.js';
35
- import '../../../context/VerificationContext/VerificationContext.js';
36
- import 'react-dom';
37
- import '../../functions/compareChains/compareChains.js';
38
- import '../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.js';
39
- import '../../../context/ThemeContext/ThemeContext.js';
40
- import '../useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
41
- import 'bs58';
42
- import '@dynamic-labs/types';
43
- import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
44
- import '../../../context/LoadingContext/LoadingContext.js';
45
- import '../../../context/WalletContext/WalletContext.js';
46
- import '../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js';
47
- import 'yup';
48
- import '../../../context/MockContext/MockContext.js';
49
- import '../../../views/CollectUserDataView/useFields.js';
50
- import '../../../context/FieldsStateContext/FieldsStateContext.js';
51
- import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
52
- import '@dynamic-labs/rpc-providers';
53
- import '../../../store/state/walletOptions/walletOptions.js';
54
- import 'react-i18next';
55
- import '../../../components/Accordion/components/AccordionItem/AccordionItem.js';
56
- import '../../../components/Alert/Alert.js';
57
- import '../../../components/ShadowDOM/ShadowDOM.js';
58
- import '../../../components/IconButton/IconButton.js';
59
- import '../../../components/InlineWidget/InlineWidget.js';
60
- import '../../../components/Input/Input.js';
61
- import '../../../components/IsBrowser/IsBrowser.js';
62
- import '../../../components/MenuList/Dropdown/Dropdown.js';
63
- import '../../../components/OverlayCard/OverlayCard.js';
64
- import '../../../components/Transition/ZoomTransition/ZoomTransition.js';
65
- import '../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
66
- import '../../../components/Transition/OpacityTransition/OpacityTransition.js';
67
- import '../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
68
- import '../../../components/Popper/Popper/Popper.js';
69
- import '../../../components/Popper/PopperContext/PopperContext.js';
70
- import 'react-focus-lock';
71
- import 'qrcode';
72
- import 'formik';
73
- import '../../../context/WalletGroupContext/WalletGroupContext.js';
74
- import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
75
- import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
76
- import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
77
- import '@hcaptcha/react-hcaptcha';
78
- import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
79
- import '../../../context/FooterAnimationContext/index.js';
80
- import '../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
81
- import '../../../context/PasskeyContext/PasskeyContext.js';
82
- import '../../../store/state/sendBalances.js';
83
- import '../../../store/state/connectorsInitializing/connectorsInitializing.js';
84
- import '../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js';
85
- import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
86
- import '../../../views/TransactionConfirmationView/TransactionConfirmationView.js';
87
- import '../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
88
- import '../../../context/OnrampContext/OnrampContext.js';
89
- import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
90
- import '../../../../index.js';
91
- import '../../../store/state/tokenBalances.js';
92
- import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
93
- import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
6
+ import { getEnvironmentId } from '../../../store/state/dynamicContextProps/dynamicContextProps.js';
94
7
 
95
8
  var SubdomainCheckResponseError;
96
9
  (function (SubdomainCheckResponseError) {
@@ -98,9 +11,9 @@ var SubdomainCheckResponseError;
98
11
  })(SubdomainCheckResponseError || (SubdomainCheckResponseError = {}));
99
12
  /** Hook to check if a subdomain is available */
100
13
  const useSubdomainCheck = () => {
101
- const { environmentId } = useInternalDynamicContext();
102
14
  const checkSubdomain = useCallback((_a) => __awaiter(void 0, [_a], void 0, function* ({ subdomain, }) {
103
15
  var _b;
16
+ const environmentId = getEnvironmentId();
104
17
  const response = yield getUserFieldsCheck({
105
18
  environmentId,
106
19
  filter: {
@@ -118,7 +31,7 @@ const useSubdomainCheck = () => {
118
31
  available: (_b = response === null || response === void 0 ? void 0 : response.available) !== null && _b !== void 0 ? _b : false,
119
32
  error: undefined,
120
33
  };
121
- }), [environmentId]);
34
+ }), []);
122
35
  return checkSubdomain;
123
36
  };
124
37
 
@@ -124,7 +124,11 @@ const useTokenBalances = ({ accountAddress, networkId, chainName = sdkApiCore.Ch
124
124
  // the reason why we need to get the network here again insteaf of using the value
125
125
  // from DynamicContext is because this function might run before the network state is
126
126
  // properly set when switching wallets, so we want to make sure we have the latest network
127
- const requestNetwork = networkId !== null && networkId !== void 0 ? networkId : (yield (walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.getNetwork(true)));
127
+ let requestNetwork = networkId !== null && networkId !== void 0 ? networkId : (yield (walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.getNetwork(true)));
128
+ if (requestChainName === sdkApiCore.ChainEnum.Btc) {
129
+ // Bitcoin does not need a network ID to fetch token balances but the request requires a network ID
130
+ requestNetwork = 1;
131
+ }
128
132
  const isValidRequest = requestNetwork && !isNaN(Number(requestNetwork));
129
133
  logger.logger.logVerboseTroubleshootingMessage('[useTokenBalances] will try to fetch token balances', {
130
134
  isLoading,
@@ -120,7 +120,11 @@ const useTokenBalances = ({ accountAddress, networkId, chainName = ChainEnum.Evm
120
120
  // the reason why we need to get the network here again insteaf of using the value
121
121
  // from DynamicContext is because this function might run before the network state is
122
122
  // properly set when switching wallets, so we want to make sure we have the latest network
123
- const requestNetwork = networkId !== null && networkId !== void 0 ? networkId : (yield (walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.getNetwork(true)));
123
+ let requestNetwork = networkId !== null && networkId !== void 0 ? networkId : (yield (walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.getNetwork(true)));
124
+ if (requestChainName === ChainEnum.Btc) {
125
+ // Bitcoin does not need a network ID to fetch token balances but the request requires a network ID
126
+ requestNetwork = 1;
127
+ }
124
128
  const isValidRequest = requestNetwork && !isNaN(Number(requestNetwork));
125
129
  logger.logVerboseTroubleshootingMessage('[useTokenBalances] will try to fetch token balances', {
126
130
  isLoading,
@@ -0,0 +1,25 @@
1
+ export type SessionInformation = {
2
+ blockNumber: bigint;
3
+ sessionId: string;
4
+ session: SessionConfig;
5
+ timestamp: number;
6
+ transactionHash: string;
7
+ origin?: string;
8
+ };
9
+ export type SessionConfig = {
10
+ signer: string;
11
+ expiresAt: bigint;
12
+ feeLimit: Limit;
13
+ callPolicies: unknown[];
14
+ transferPolicies: unknown[];
15
+ };
16
+ export type Limit = {
17
+ limitType: LimitType;
18
+ limit: bigint;
19
+ period: bigint;
20
+ };
21
+ export declare enum LimitType {
22
+ Unlimited = 0,
23
+ Lifetime = 1,
24
+ Allowance = 2
25
+ }
@@ -19,6 +19,7 @@ var DepositView = require('../../views/DepositView/DepositView.cjs');
19
19
  var GlobalWalletView = require('../../views/GlobalWalletView/GlobalWalletView.cjs');
20
20
  var ManageMfaWidgetView = require('../../views/ManageMfaWidgetView/ManageMfaWidgetView.cjs');
21
21
  var ReceiveWalletFunds = require('../../views/ReceiveWalletFunds/ReceiveWalletFunds.cjs');
22
+ var RevokeAccessView = require('../../views/SessionManagementView/RevokeAccessView/RevokeAccessView.cjs');
22
23
  var SessionManagementInfoView = require('../../views/SessionManagementView/SessionManagementInfoView/SessionManagementInfoView.cjs');
23
24
 
24
25
  const mapViewToComponent = {
@@ -38,6 +39,7 @@ const mapViewToComponent = {
38
39
  'send-balance': SendBalanceWidgetView.SendBalanceWidgetView,
39
40
  'session-management': SessionManagementView.SessionManagementView,
40
41
  'session-management-info': SessionManagementInfoView.SessionManagementInfoView,
42
+ 'session-management-revoke-access': RevokeAccessView.RevokeAccessView,
41
43
  settings: SettingsView.SettingsView,
42
44
  wallets: WalletsView.WalletsView,
43
45
  };
@@ -18,8 +18,9 @@ export declare const mapViewToComponent: {
18
18
  profile: import("react").FC;
19
19
  'receive-wallet-funds': import("react").FC<import("../../views/ReceiveWalletFunds/types").ReceiveWalletFundsProps>;
20
20
  'send-balance': import("react").FC;
21
- 'session-management': import("react").FC;
21
+ 'session-management': import("react").FC<import("../../views/SessionManagementView").SessionManagementViewProps>;
22
22
  'session-management-info': import("react").FC;
23
+ 'session-management-revoke-access': import("react").FC<import("../../views/SessionManagementView/RevokeAccessView").RevokeAccessViewProps>;
23
24
  settings: import("react").FC;
24
25
  wallets: import("react").FC;
25
26
  };
@@ -15,6 +15,7 @@ import { DepositView } from '../../views/DepositView/DepositView.js';
15
15
  import { GlobalWalletView } from '../../views/GlobalWalletView/GlobalWalletView.js';
16
16
  import { ManageMfaWidgetView } from '../../views/ManageMfaWidgetView/ManageMfaWidgetView.js';
17
17
  import { ReceiveWalletFunds } from '../../views/ReceiveWalletFunds/ReceiveWalletFunds.js';
18
+ import { RevokeAccessView } from '../../views/SessionManagementView/RevokeAccessView/RevokeAccessView.js';
18
19
  import { SessionManagementInfoView } from '../../views/SessionManagementView/SessionManagementInfoView/SessionManagementInfoView.js';
19
20
 
20
21
  const mapViewToComponent = {
@@ -34,6 +35,7 @@ const mapViewToComponent = {
34
35
  'send-balance': SendBalanceWidgetView,
35
36
  'session-management': SessionManagementView,
36
37
  'session-management-info': SessionManagementInfoView,
38
+ 'session-management-revoke-access': RevokeAccessView,
37
39
  settings: SettingsView,
38
40
  wallets: WalletsView,
39
41
  };
@@ -9,7 +9,7 @@ export declare const DynamicPasskeyWidgetViews: readonly ["manage-passkeys"];
9
9
  export declare const DynamicMfaWidgetViews: readonly ["manage-mfa", "manage-mfa-no-footer"];
10
10
  export type DynamicPasskeyWidgetViewsType = typeof DynamicPasskeyWidgetViews[number];
11
11
  export type DynamicMfaWidgetViewsType = typeof DynamicMfaWidgetViews[number];
12
- export declare const DynamicSessionManagementViews: readonly ["session-management", "session-management-info"];
12
+ export declare const DynamicSessionManagementViews: readonly ["session-management", "session-management-info", "session-management-revoke-access"];
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];
@@ -172,7 +172,7 @@ const ConnectedAppsView = ({ name }) => {
172
172
  logger.logger.warn('Error disconnecting app', error);
173
173
  }
174
174
  });
175
- return (jsxRuntime.jsxs("div", { className: 'connected-apps-view', children: [jsxRuntime.jsxs("div", { className: 'header', children: [jsxRuntime.jsx(IconButton.IconButton, { onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', className: 'back-button', type: 'button', children: jsxRuntime.jsx(arrowLeft.ReactComponent, { className: 'arrow-left-icon' }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'title', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.title') })] }), jsxRuntime.jsx("div", { className: 'subheader', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.subtitle') }) }), connectedApps.length > 0 && (jsxRuntime.jsx("ul", { className: 'connected-apps-list', children: connectedApps.map((app) => (jsxRuntime.jsxs("li", { className: 'connected-app-item', children: [jsxRuntime.jsx("img", { src: app.icon, alt: app.name, className: 'app-icon' }), jsxRuntime.jsx("div", { className: 'app-info', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: app.url }) }), jsxRuntime.jsxs("div", { className: 'app-actions', children: [jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => utils.PlatformService.openURL(app.url, 'blank'), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsxRuntime.jsx(externalLink.ReactComponent, {}), typographyProps: {
175
+ return (jsxRuntime.jsxs("div", { className: 'connected-apps-view', children: [jsxRuntime.jsxs("div", { className: 'header', children: [jsxRuntime.jsx(IconButton.IconButton, { onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', className: 'back-button', type: 'button', children: jsxRuntime.jsx(arrowLeft.ReactComponent, { className: 'arrow-left-icon' }) }), jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.title') })] }), jsxRuntime.jsx("div", { className: 'subheader', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.subtitle') }) }), connectedApps.length > 0 && (jsxRuntime.jsx("ul", { className: 'connected-apps-list', children: connectedApps.map((app) => (jsxRuntime.jsxs("li", { className: 'connected-app-item', children: [jsxRuntime.jsx("img", { src: app.icon, alt: app.name, className: 'app-icon' }), jsxRuntime.jsx("div", { className: 'app-info', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: app.url }) }), jsxRuntime.jsxs("div", { className: 'app-actions', children: [jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => utils.PlatformService.openURL(app.url, 'blank'), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsxRuntime.jsx(externalLink.ReactComponent, {}), typographyProps: {
176
176
  color: 'secondary',
177
177
  variant: 'button_secondary',
178
178
  }, dataTestId: 'open-app-button' }), jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: () => handleDisconnect(app.topic), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsxRuntime.jsx(unlink.ReactComponent, {}), typographyProps: {
@@ -168,7 +168,7 @@ const ConnectedAppsView = ({ name }) => {
168
168
  logger.warn('Error disconnecting app', error);
169
169
  }
170
170
  });
171
- return (jsxs("div", { className: 'connected-apps-view', children: [jsxs("div", { className: 'header', children: [jsx(IconButton, { onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', className: 'back-button', type: 'button', children: jsx(SvgArrowLeft, { className: 'arrow-left-icon' }) }), jsx(Typography, { variant: 'title', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.title') })] }), jsx("div", { className: 'subheader', children: jsx(Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.subtitle') }) }), connectedApps.length > 0 && (jsx("ul", { className: 'connected-apps-list', children: connectedApps.map((app) => (jsxs("li", { className: 'connected-app-item', children: [jsx("img", { src: app.icon, alt: app.name, className: 'app-icon' }), jsx("div", { className: 'app-info', children: jsx(Typography, { variant: 'body_normal', color: 'primary', children: app.url }) }), jsxs("div", { className: 'app-actions', children: [jsx(TypographyButton, { onClick: () => PlatformService.openURL(app.url, 'blank'), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsx(SvgExternalLink, {}), typographyProps: {
171
+ return (jsxs("div", { className: 'connected-apps-view', children: [jsxs("div", { className: 'header', children: [jsx(IconButton, { onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', className: 'back-button', type: 'button', children: jsx(SvgArrowLeft, { className: 'arrow-left-icon' }) }), jsx(Typography, { variant: 'title', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.title') })] }), jsx("div", { className: 'subheader', children: jsx(Typography, { variant: 'body_small', weight: 'medium', color: 'primary', className: 'title', children: t('global_wallet.connected_apps.subtitle') }) }), connectedApps.length > 0 && (jsx("ul", { className: 'connected-apps-list', children: connectedApps.map((app) => (jsxs("li", { className: 'connected-app-item', children: [jsx("img", { src: app.icon, alt: app.name, className: 'app-icon' }), jsx("div", { className: 'app-info', children: jsx(Typography, { variant: 'body_normal', color: 'primary', children: app.url }) }), jsxs("div", { className: 'app-actions', children: [jsx(TypographyButton, { onClick: () => PlatformService.openURL(app.url, 'blank'), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsx(SvgExternalLink, {}), typographyProps: {
172
172
  color: 'secondary',
173
173
  variant: 'button_secondary',
174
174
  }, dataTestId: 'open-app-button' }), jsx(TypographyButton, { onClick: () => handleDisconnect(app.topic), buttonVariant: 'tertiary', buttonPadding: 'none', startSlot: jsx(SvgUnlink, {}), typographyProps: {
@@ -228,7 +228,7 @@ const GlobalWalletView = () => {
228
228
  }
229
229
  // eslint-disable-next-line react-hooks/exhaustive-deps
230
230
  }, [walletConnectUri]);
231
- const renderHeader = () => (jsxRuntime.jsxs("div", { className: 'header', children: [jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: goToInitialDynamicWidgetView, "data-testid": 'back-button', children: jsxRuntime.jsx(arrowLeft.ReactComponent, {}) }), jsxRuntime.jsx(Typography.Typography, { variant: 'title', weight: 'medium', color: 'primary', as: 'h1', copykey: 'global_wallet.connect_to_apps', children: t('global_wallet.connect_to_apps') }), utils.isMobile() && (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: () => {
231
+ const renderHeader = () => (jsxRuntime.jsxs("div", { className: 'header', children: [jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: goToInitialDynamicWidgetView, "data-testid": 'back-button', children: jsxRuntime.jsx(arrowLeft.ReactComponent, {}) }), jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', as: 'h1', copykey: 'global_wallet.connect_to_apps', children: t('global_wallet.connect_to_apps') }), utils.isMobile() && (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: () => {
232
232
  pushView('global-wallet-info');
233
233
  setShowAuthFlow(true, {
234
234
  ignoreIfIsEmbeddedWidget: false,
@@ -224,7 +224,7 @@ const GlobalWalletView = () => {
224
224
  }
225
225
  // eslint-disable-next-line react-hooks/exhaustive-deps
226
226
  }, [walletConnectUri]);
227
- const renderHeader = () => (jsxs("div", { className: 'header', children: [jsx(IconButton, { type: 'button', onClick: goToInitialDynamicWidgetView, "data-testid": 'back-button', children: jsx(SvgArrowLeft, {}) }), jsx(Typography, { variant: 'title', weight: 'medium', color: 'primary', as: 'h1', copykey: 'global_wallet.connect_to_apps', children: t('global_wallet.connect_to_apps') }), isMobile() && (jsx(IconButton, { type: 'button', onClick: () => {
227
+ const renderHeader = () => (jsxs("div", { className: 'header', children: [jsx(IconButton, { type: 'button', onClick: goToInitialDynamicWidgetView, "data-testid": 'back-button', children: jsx(SvgArrowLeft, {}) }), jsx(Typography, { variant: 'title', color: 'primary', as: 'h1', copykey: 'global_wallet.connect_to_apps', children: t('global_wallet.connect_to_apps') }), isMobile() && (jsx(IconButton, { type: 'button', onClick: () => {
228
228
  pushView('global-wallet-info');
229
229
  setShowAuthFlow(true, {
230
230
  ignoreIfIsEmbeddedWidget: false,
@@ -0,0 +1,51 @@
1
+ 'use client'
2
+ 'use strict';
3
+
4
+ Object.defineProperty(exports, '__esModule', { value: true });
5
+
6
+ var _tslib = require('../../../../../../../_virtual/_tslib.cjs');
7
+ var jsxRuntime = require('react/jsx-runtime');
8
+ var reactI18next = require('react-i18next');
9
+ var ModalHeader = require('../../../../../components/ModalHeader/ModalHeader.cjs');
10
+ var Typography = require('../../../../../components/Typography/Typography.cjs');
11
+ var IconButton = require('../../../../../components/IconButton/IconButton.cjs');
12
+ var DynamicWidgetContext = require('../../../context/DynamicWidgetContext.cjs');
13
+ require('react');
14
+ var close = require('../../../../../shared/assets/close.cjs');
15
+ require('@dynamic-labs/iconic');
16
+ require('../../../../../context/ViewContext/ViewContext.cjs');
17
+ var TypographyButton = require('../../../../../components/TypographyButton/TypographyButton.cjs');
18
+ var useSessionKeys = require('../../../../../utils/hooks/useSessionKeys/useSessionKeys.cjs');
19
+ var getSessionInformationName = require('../../../../../utils/functions/getSessionInformationName/getSessionInformationName.cjs');
20
+
21
+ const RevokeAccessView = ({ session }) => {
22
+ const { t } = reactI18next.useTranslation();
23
+ const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
24
+ const { revokeSession } = useSessionKeys.useSessionKeys();
25
+ const handleCancel = () => {
26
+ setDynamicWidgetView('session-management');
27
+ };
28
+ const handleRevoke = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
29
+ try {
30
+ yield revokeSession(session.sessionId);
31
+ setDynamicWidgetView('session-management', {
32
+ bannerMessage: {
33
+ message: `Revoked ${getSessionInformationName.getSessionInformationName(session)}`,
34
+ type: 'success',
35
+ },
36
+ });
37
+ }
38
+ catch (error) {
39
+ setDynamicWidgetView('session-management', {
40
+ bannerMessage: {
41
+ message: `Failed to revoke ${getSessionInformationName.getSessionInformationName(session)}`,
42
+ type: 'error',
43
+ },
44
+ });
45
+ }
46
+ });
47
+ const renderCloseButton = () => (jsxRuntime.jsx(IconButton.IconButton, { onClick: handleCancel, "aria-label": t('dyn_session_management.aria.close_button_label'), children: jsxRuntime.jsx(close.ReactComponent, {}) }));
48
+ return (jsxRuntime.jsxs("div", { className: 'revoke-access-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { trailing: renderCloseButton(), children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_session_management.revoke_access_view.title', children: t('dyn_session_management.revoke_access_view.title') }) }), jsxRuntime.jsx("div", { className: 'revoke-access-view__body', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', copykey: 'dyn_session_management.revoke_access_view.description', align: 'center', children: t('dyn_session_management.revoke_access_view.description') }) }), jsxRuntime.jsxs("div", { className: 'revoke-access-view__footer', children: [jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'danger', buttonPadding: 'small', onClick: handleRevoke, dataTestId: 'revoke-access-confirm-button', copykey: 'dyn_session_management.revoke_access_view.revoke_button', expanded: true, children: t('dyn_session_management.revoke_access_view.revoke_button') }), jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonPadding: 'small', onClick: handleCancel, dataTestId: 'revoke-access-cancel-button', copykey: 'dyn_session_management.revoke_access_view.cancel_button', expanded: true, children: t('dyn_session_management.revoke_access_view.cancel_button') })] })] }));
49
+ };
50
+
51
+ exports.RevokeAccessView = RevokeAccessView;
@@ -0,0 +1,6 @@
1
+ import { FC } from 'react';
2
+ import { SessionInformation } from '../../../../../utils/types/SessionInformation';
3
+ export interface RevokeAccessViewProps {
4
+ session: SessionInformation;
5
+ }
6
+ export declare const RevokeAccessView: FC<RevokeAccessViewProps>;
@@ -0,0 +1,47 @@
1
+ 'use client'
2
+ import { __awaiter } from '../../../../../../../_virtual/_tslib.js';
3
+ import { jsxs, jsx } from 'react/jsx-runtime';
4
+ import { useTranslation } from 'react-i18next';
5
+ import { ModalHeader } from '../../../../../components/ModalHeader/ModalHeader.js';
6
+ import { Typography } from '../../../../../components/Typography/Typography.js';
7
+ import { IconButton } from '../../../../../components/IconButton/IconButton.js';
8
+ import { useWidgetContext } from '../../../context/DynamicWidgetContext.js';
9
+ import 'react';
10
+ import { ReactComponent as SvgClose } from '../../../../../shared/assets/close.js';
11
+ import '@dynamic-labs/iconic';
12
+ import '../../../../../context/ViewContext/ViewContext.js';
13
+ import { TypographyButton } from '../../../../../components/TypographyButton/TypographyButton.js';
14
+ import { useSessionKeys } from '../../../../../utils/hooks/useSessionKeys/useSessionKeys.js';
15
+ import { getSessionInformationName } from '../../../../../utils/functions/getSessionInformationName/getSessionInformationName.js';
16
+
17
+ const RevokeAccessView = ({ session }) => {
18
+ const { t } = useTranslation();
19
+ const { setDynamicWidgetView } = useWidgetContext();
20
+ const { revokeSession } = useSessionKeys();
21
+ const handleCancel = () => {
22
+ setDynamicWidgetView('session-management');
23
+ };
24
+ const handleRevoke = () => __awaiter(void 0, void 0, void 0, function* () {
25
+ try {
26
+ yield revokeSession(session.sessionId);
27
+ setDynamicWidgetView('session-management', {
28
+ bannerMessage: {
29
+ message: `Revoked ${getSessionInformationName(session)}`,
30
+ type: 'success',
31
+ },
32
+ });
33
+ }
34
+ catch (error) {
35
+ setDynamicWidgetView('session-management', {
36
+ bannerMessage: {
37
+ message: `Failed to revoke ${getSessionInformationName(session)}`,
38
+ type: 'error',
39
+ },
40
+ });
41
+ }
42
+ });
43
+ const renderCloseButton = () => (jsx(IconButton, { onClick: handleCancel, "aria-label": t('dyn_session_management.aria.close_button_label'), children: jsx(SvgClose, {}) }));
44
+ return (jsxs("div", { className: 'revoke-access-view', children: [jsx(ModalHeader, { trailing: renderCloseButton(), children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_session_management.revoke_access_view.title', children: t('dyn_session_management.revoke_access_view.title') }) }), jsx("div", { className: 'revoke-access-view__body', children: jsx(Typography, { variant: 'body_normal', color: 'primary', copykey: 'dyn_session_management.revoke_access_view.description', align: 'center', children: t('dyn_session_management.revoke_access_view.description') }) }), jsxs("div", { className: 'revoke-access-view__footer', children: [jsx(TypographyButton, { buttonVariant: 'danger', buttonPadding: 'small', onClick: handleRevoke, dataTestId: 'revoke-access-confirm-button', copykey: 'dyn_session_management.revoke_access_view.revoke_button', expanded: true, children: t('dyn_session_management.revoke_access_view.revoke_button') }), jsx(TypographyButton, { buttonPadding: 'small', onClick: handleCancel, dataTestId: 'revoke-access-cancel-button', copykey: 'dyn_session_management.revoke_access_view.cancel_button', expanded: true, children: t('dyn_session_management.revoke_access_view.cancel_button') })] })] }));
45
+ };
46
+
47
+ export { RevokeAccessView };
@@ -0,0 +1 @@
1
+ export * from './RevokeAccessView';
@@ -0,0 +1,31 @@
1
+ 'use client'
2
+ 'use strict';
3
+
4
+ Object.defineProperty(exports, '__esModule', { value: true });
5
+
6
+ var jsxRuntime = require('react/jsx-runtime');
7
+ var React = require('react');
8
+ var reactI18next = require('react-i18next');
9
+ var Typography = require('../../../../../components/Typography/Typography.cjs');
10
+ var TypographyButton = require('../../../../../components/TypographyButton/TypographyButton.cjs');
11
+ var IconButton = require('../../../../../components/IconButton/IconButton.cjs');
12
+ var chevronDown = require('../../../../../shared/assets/chevron-down.cjs');
13
+ require('@dynamic-labs/iconic');
14
+ require('../../../../../context/ViewContext/ViewContext.cjs');
15
+ var getSessionInformationName = require('../../../../../utils/functions/getSessionInformationName/getSessionInformationName.cjs');
16
+
17
+ const SessionListItem = ({ session, onRevokeAccessClick, }) => {
18
+ const { t } = reactI18next.useTranslation();
19
+ const [isExpanded, setIsExpanded] = React.useState(false);
20
+ const handleRevokeAccess = React.useCallback(() => {
21
+ onRevokeAccessClick(session);
22
+ }, [onRevokeAccessClick, session]);
23
+ const toggleExpanded = React.useCallback(() => {
24
+ setIsExpanded((prev) => !prev);
25
+ }, []);
26
+ return (jsxRuntime.jsxs("div", { className: 'session-management-session', children: [jsxRuntime.jsxs("div", { className: 'session-management-session__main', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', children: getSessionInformationName.getSessionInformationName(session) }), jsxRuntime.jsx(TypographyButton.TypographyButton, { onClick: handleRevokeAccess, children: t('dyn_session_management.session_component.revoke_button') })] }), jsxRuntime.jsxs("div", { className: 'session-management-session__permissions-toggle', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', children: t('dyn_session_management.session_component.permission_details') }), jsxRuntime.jsx(IconButton.IconButton, { onClick: toggleExpanded, "aria-label": t(isExpanded
27
+ ? 'dyn_session_management.session_component.aria.collapse_permissions'
28
+ : 'dyn_session_management.session_component.aria.expand_permissions'), className: 'session-management-session__icon-button', children: jsxRuntime.jsx(chevronDown.ReactComponent, {}) })] }), isExpanded && (jsxRuntime.jsx("div", { className: 'session-management-session__permissions', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', weight: 'bold', children: "TODO: Add permission details" }) }))] }));
29
+ };
30
+
31
+ exports.SessionListItem = SessionListItem;
@@ -0,0 +1,8 @@
1
+ import { FC } from 'react';
2
+ import { SessionInformation } from '../../../../../utils/types/SessionInformation';
3
+ interface SessionListItemProps {
4
+ session: SessionInformation;
5
+ onRevokeAccessClick: (session: SessionInformation) => void;
6
+ }
7
+ export declare const SessionListItem: FC<SessionListItemProps>;
8
+ export {};
@@ -0,0 +1,27 @@
1
+ 'use client'
2
+ import { jsxs, jsx } from 'react/jsx-runtime';
3
+ import { useState, useCallback } from 'react';
4
+ import { useTranslation } from 'react-i18next';
5
+ import { Typography } from '../../../../../components/Typography/Typography.js';
6
+ import { TypographyButton } from '../../../../../components/TypographyButton/TypographyButton.js';
7
+ import { IconButton } from '../../../../../components/IconButton/IconButton.js';
8
+ import { ReactComponent as SvgChevronDown } from '../../../../../shared/assets/chevron-down.js';
9
+ import '@dynamic-labs/iconic';
10
+ import '../../../../../context/ViewContext/ViewContext.js';
11
+ import { getSessionInformationName } from '../../../../../utils/functions/getSessionInformationName/getSessionInformationName.js';
12
+
13
+ const SessionListItem = ({ session, onRevokeAccessClick, }) => {
14
+ const { t } = useTranslation();
15
+ const [isExpanded, setIsExpanded] = useState(false);
16
+ const handleRevokeAccess = useCallback(() => {
17
+ onRevokeAccessClick(session);
18
+ }, [onRevokeAccessClick, session]);
19
+ const toggleExpanded = useCallback(() => {
20
+ setIsExpanded((prev) => !prev);
21
+ }, []);
22
+ return (jsxs("div", { className: 'session-management-session', children: [jsxs("div", { className: 'session-management-session__main', children: [jsx(Typography, { variant: 'body_normal', children: getSessionInformationName(session) }), jsx(TypographyButton, { onClick: handleRevokeAccess, children: t('dyn_session_management.session_component.revoke_button') })] }), jsxs("div", { className: 'session-management-session__permissions-toggle', children: [jsx(Typography, { variant: 'body_small', children: t('dyn_session_management.session_component.permission_details') }), jsx(IconButton, { onClick: toggleExpanded, "aria-label": t(isExpanded
23
+ ? 'dyn_session_management.session_component.aria.collapse_permissions'
24
+ : 'dyn_session_management.session_component.aria.expand_permissions'), className: 'session-management-session__icon-button', children: jsx(SvgChevronDown, {}) })] }), isExpanded && (jsx("div", { className: 'session-management-session__permissions', children: jsx(Typography, { variant: 'body_small', weight: 'bold', children: "TODO: Add permission details" }) }))] }));
25
+ };
26
+
27
+ export { SessionListItem };
@@ -0,0 +1 @@
1
+ export * from './SessionListItem';