'use strict';

var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var React = require('react');
var classnames = require('classnames');
var Button = require('@bigbinary/neetoui/Button');
var ramda = require('ramda');
var reactI18next = require('react-i18next');
var reactRouterDom = require('react-router-dom');
var Chevron = require('./Chevron-brQURuT5.js');
var jsxRuntime = require('react/jsx-runtime');
require('@babel/runtime/helpers/defineProperty');
require('@babel/runtime/helpers/objectWithoutProperties');
require('@bigbinary/neeto-commons-frontend/react-utils');
require('@bigbinary/neeto-commons-frontend/utils/general');
require('@bigbinary/neeto-icons/Home');
require('@bigbinary/neetoui/Typography');
require('@bigbinary/neeto-cist');
require('@bigbinary/neeto-filters-frontend/Segments');
require('@bigbinary/neetoui/Tag');
require('@bigbinary/neeto-commons-frontend/react-utils/useRegisterNavigationCheckpoint');
require('./inject-css-B6qYtOJe.js');

var ConfigurePageSidebar = function ConfigurePageSidebar(_ref) {
  var label = _ref.label,
    items = _ref.navLinks,
    configurePageRoute = _ref.configurePageRoute;
  var history = reactRouterDom.useHistory();
  var _useState = React.useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    isSidebarPaneOpen = _useState2[0],
    setIsSidebarPaneOpen = _useState2[1];
  var _useState3 = React.useState(false),
    _useState4 = _slicedToArray(_useState3, 2),
    isSidebarCollapsed = _useState4[0],
    setIsSidebarCollapsed = _useState4[1];
  var _useTranslation = reactI18next.useTranslation(),
    t = _useTranslation.t;
  var isLargerScreen = function isLargerScreen() {
    return window.innerWidth > 768;
  };
  var isSidebarClosed = isLargerScreen() ? isSidebarCollapsed : ramda.not(isSidebarPaneOpen);
  React.useEffect(function () {
    var handleResize = function handleResize() {
      if (isLargerScreen()) return;
      setIsSidebarPaneOpen(false);
      setIsSidebarCollapsed(true);
    };
    window.addEventListener("resize", handleResize);
    return function () {
      return window.removeEventListener("resize", handleResize);
    };
  }, []);
  var handleConfigureLinkClick = function handleConfigureLinkClick() {
    history.push(configurePageRoute);
  };
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
    "data-testid": "configure-page-sidebar-container",
    className: classnames("neeto-molecules-sidebar__wrapper neeto-molecules-sidebar__wrapper__configure-page", {
      "neeto-molecules-sidebar__wrapper--collapsed": isLargerScreen() ? isSidebarCollapsed : ramda.not(isSidebarPaneOpen)
    }),
    children: [/*#__PURE__*/jsxRuntime.jsx("div", {
      className: "neeto-molecules-sidebar__backdrop",
      onClick: function onClick() {
        setIsSidebarPaneOpen(false);
      }
    }), /*#__PURE__*/jsxRuntime.jsx("div", {
      className: "neeto-molecules-sidebar neeto-molecules-sidebar__configure-page neeto-ui-flex neeto-ui-flex-col neeto-ui-flex-shrink-0 neeto-ui-overflow-y-auto neeto-ui-overflow-x-hidden neeto-molecules-sidebar--focus-mode",
      "data-testid": "configure-page-sidebar",
      children: /*#__PURE__*/jsxRuntime.jsx(Chevron.SelectedLink, {
        isConfigureSidebar: true,
        handleGoBack: handleConfigureLinkClick,
        navLink: {
          label: label,
          items: items
        }
      })
    }), /*#__PURE__*/jsxRuntime.jsx(Button, {
      className: "neeto-molecules-sidebar__toggler",
      "data-testid": "configure-page-neeto-molecules-sidebar-toggler",
      icon: function icon() {
        return /*#__PURE__*/jsxRuntime.jsx(Chevron.Chevron, {});
      },
      style: isLargerScreen() ? "text" : "secondary",
      tooltipProps: {
        content: isSidebarClosed ? t("neetoMolecules.sidebar.showMenu") : t("neetoMolecules.sidebar.hideMenu"),
        position: "bottom",
        touch: ["hold", 500]
      },
      onClick: function onClick() {
        setIsSidebarCollapsed(!isSidebarCollapsed);
        setIsSidebarPaneOpen(ramda.not);
      }
    })]
  });
};

module.exports = ConfigurePageSidebar;
//# sourceMappingURL=ConfigurePageSidebar.js.map
