'use client'
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var React = require('react');
var reactI18next = require('react-i18next');
var Typography = require('../../../../../components/Typography/Typography.cjs');
var TypographyButton = require('../../../../../components/TypographyButton/TypographyButton.cjs');
var chevronLeft = require('../../../../../shared/assets/chevron-left.cjs');
var session = require('../../../../../shared/assets/session.cjs');
require('@dynamic-labs/iconic');
require('../../../../../context/ViewContext/ViewContext.cjs');
require('@dynamic-labs-sdk/client/core');
require('@dynamic-labs/sdk-api-core');
require('../../../../../client/client.cjs');
require('@dynamic-labs-sdk/client');
require('../../../../../config/ApiEndpoint.cjs');
require('@dynamic-labs/wallet-connector-core');
require('../../../../../shared/logger.cjs');
require('@dynamic-labs/wallet-book');
require('@dynamic-labs/utils');
require('../../../../../utils/constants/colors.cjs');
require('../../../../../utils/constants/values.cjs');
require('../../../../../shared/consts/index.cjs');
require('../../../../../../../_virtual/_tslib.cjs');
require('@dynamic-labs/multi-wallet');
require('react-international-phone');
require('../../../../../store/state/nonce/nonce.cjs');
require('@dynamic-labs/locale');
require('../../../../../store/state/dynamicContextProps/dynamicContextProps.cjs');
require('../../../../../store/state/primaryWalletId/primaryWalletId.cjs');
require('../../../../../store/state/connectedWalletsInfo/connectedWalletsInfo.cjs');
var isZKSyncEnabled = require('../../../../../utils/functions/isZKSyncEnabled/isZKSyncEnabled.cjs');
require('../../../../../events/dynamicEvents.cjs');
var useProjectSettings = require('../../../../../client/extension/projectSettings/useProjectSettings/useProjectSettings.cjs');
var classNames = require('../../../../../utils/functions/classNames/classNames.cjs');
var DynamicWidgetContext = require('../../../context/DynamicWidgetContext.cjs');

const ZKSyncSessionsSection = ({ isLoading = false }) => {
    const { t } = reactI18next.useTranslation();
    const projectSettings = useProjectSettings.useProjectSettings();
    const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
    const isZKSyncWallet = React.useMemo(() => isZKSyncEnabled.isZKSyncEnabled(projectSettings), [projectSettings]);
    const handleSessionManagementClick = React.useCallback(() => setDynamicWidgetView('session-management'), [setDynamicWidgetView]);
    if (!isZKSyncWallet) {
        return null;
    }
    return (jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsx("div", { className: classNames.classNames('settings-view__body__section__title', 'settings-view__body__section__title__info-icon'), children: jsxRuntime.jsx(Typography.Typography, { copykey: 'dyn_settings.session_management.title', color: 'secondary', weight: 'medium', children: t('dyn_settings.session_management.title') }) }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'session-management-button', onClick: handleSessionManagementClick, buttonClassName: 'settings-view__body__section__button', startSlot: 
                // eslint-disable-next-line react/jsx-wrap-multilines
                jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(session.ReactComponent, { className: 'settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.session_management.session_management_button', children: t('dyn_settings.session_management.session_management_button') })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: isLoading, showInternalLoading: false })] }));
};

exports.ZKSyncSessionsSection = ZKSyncSessionsSection;
