@bigbinary/neeto-molecules 1.11.7 → 1.12.0

package/dist/cjs/Sidebar.js

@@ -3,6 +3,7 @@
 var slicedToArray = require('./slicedToArray-f320d9e7.js');
 var React = require('react');
 var classnames = require('classnames');
+var neetoCist = require('@bigbinary/neeto-cist');
 var initializers = require('@bigbinary/neeto-commons-frontend/initializers');
 var useLocalStorage = require('@bigbinary/neeto-commons-frontend/react-utils/useLocalStorage');
 var neetoui = require('@bigbinary/neetoui');
@@ -11,9 +12,9 @@ var reactI18next = require('react-i18next');
 var reactRouterDom = require('react-router-dom');
 var useFetchNeetoApps = require('@bigbinary/neeto-commons-frontend/react-utils/useFetchNeetoApps');
 var neetoIcons = require('@bigbinary/neeto-icons');
+var sidebar = require('./sidebar-99f98b4d.js');
 var injectCss = require('./inject-css-80a5faa3.js');
 var _extends = require('./extends-1b35a664.js');
-var neetoCist = require('@bigbinary/neeto-cist');
 var AppIcons = require('@bigbinary/neeto-icons/app-icons');
 var i18next = require('i18next');
 var axios = require('@bigbinary/neeto-commons-frontend/utils/axios');
@@ -23,14 +24,14 @@ var defineProperty = require('./defineProperty-886ed289.js');
 var objectWithoutProperties = require('./objectWithoutProperties-2fed2d7d.js');
 var KeyboardShortcuts = require('./KeyboardShortcuts.js');
 var ProductTypefaceLogos = require('@bigbinary/neeto-icons/typeface-logos');
-var constants = require('@bigbinary/neeto-commons-frontend/constants');
-var useRegisterNavigationCheckpoint = require('@bigbinary/neeto-commons-frontend/react-utils/useRegisterNavigationCheckpoint');
-var neetoFiltersFrontend = require('@bigbinary/neeto-filters-frontend');
-var reactRouterDom_min = require('react-router-dom/cjs/react-router-dom.min');
-var MoreDropdown = require('./MoreDropdown.js');
-var utils = require('@bigbinary/neeto-commons-frontend/utils');
-var formik = require('@bigbinary/neetoui/formik');
-var yup = require('yup');
+require('@bigbinary/neeto-commons-frontend/constants');
+require('@bigbinary/neeto-commons-frontend/react-utils/useRegisterNavigationCheckpoint');
+require('@bigbinary/neeto-filters-frontend');
+require('react-router-dom/cjs/react-router-dom.min');
+require('./MoreDropdown.js');
+require('@bigbinary/neeto-commons-frontend/utils');
+require('@bigbinary/neetoui/formik');
+require('yup');
 require('@bigbinary/neeto-commons-frontend/react-utils/withImmutableActions');
 require('zustand');
 require('zustand/shallow');
@@ -64,23 +65,22 @@ var useLocalStorage__default = /*#__PURE__*/_interopDefaultLegacy(useLocalStorag
 var useFetchNeetoApps__default = /*#__PURE__*/_interopDefaultLegacy(useFetchNeetoApps);
 var AppIcons__namespace = /*#__PURE__*/_interopNamespace(AppIcons);
 var ProductTypefaceLogos__namespace = /*#__PURE__*/_interopNamespace(ProductTypefaceLogos);
-var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
 
 var Chevron = function Chevron(_ref) {
   var style = _ref.style;
   return /*#__PURE__*/React__default["default"].createElement("svg", {
+    style: style,
     height: "16",
     viewBox: "0 0 16 16",
-    width: "16",
-    style: style
+    width: "16"
   }, /*#__PURE__*/React__default["default"].createElement("path", {
     d: "M7.07031 13.8887C7.2207 14.0391 7.40527 14.1211 7.62402 14.1211C8.06836 14.1211 8.41699 13.7725 8.41699 13.3281C8.41699 13.1094 8.32812 12.9043 8.17773 12.7539L3.37207 8.05762L8.17773 3.375C8.32812 3.21777 8.41699 3.0127 8.41699 2.80078C8.41699 2.35645 8.06836 2.00781 7.62402 2.00781C7.40527 2.00781 7.2207 2.08984 7.07031 2.24023L1.73828 7.44922C1.56055 7.62012 1.46484 7.8252 1.46484 8.06445C1.46484 8.29688 1.55371 8.49512 1.73828 8.67969L7.07031 13.8887ZM13.1748 13.8887C13.3252 14.0391 13.5098 14.1211 13.7354 14.1211C14.1797 14.1211 14.5283 13.7725 14.5283 13.3281C14.5283 13.1094 14.4395 12.9043 14.2891 12.7539L9.4834 8.05762L14.2891 3.375C14.4395 3.21777 14.5283 3.0127 14.5283 2.80078C14.5283 2.35645 14.1797 2.00781 13.7354 2.00781C13.5098 2.00781 13.3252 2.08984 13.1748 2.24023L7.84961 7.44922C7.66504 7.62012 7.57617 7.8252 7.56934 8.06445C7.56934 8.29688 7.66504 8.49512 7.84961 8.67969L13.1748 13.8887Z",
     fill: "currentColor"
   }));
 };
 
-var css$1 = ".neeto-molecules-app-switcher__wrapper{align-items:flex-start;background-color:rgb(var(--neeto-ui-white));display:flex;flex-direction:column;justify-content:flex-start;max-width:100%;overflow-y:auto;padding:40px;position:relative;transition:all .3s;width:100%}@media only screen and (max-width:992px){.neeto-molecules-app-switcher__wrapper{padding:32px}}@media screen and (max-width:768px){.neeto-molecules-app-switcher__wrapper{padding:16px}}.neeto-molecules-app-switcher__grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(288px,1fr))}@media only screen and (max-width:992px){.neeto-molecules-app-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(248px,1fr))}}@media only screen and (max-width:640px){.neeto-molecules-app-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(100%,1fr))}}.neeto-molecules-app-switcher__header{align-items:center;display:flex;gap:32px;justify-content:space-between;margin-bottom:32px;position:relative;width:100%}@media only screen and (max-width:768px){.neeto-molecules-app-switcher__header{align-items:flex-start;flex-direction:column-reverse;gap:24px}}@media only screen and (max-width:640px){.neeto-molecules-app-switcher__header h1{font-size:24px}}.neeto-molecules-app-switcher__close-btn{position:absolute;right:12px;top:12px}.neeto-molecules-app-switcher__search-wrapper{flex-grow:1}@media only screen and (min-width:992px){.neeto-molecules-app-switcher__search-wrapper{flex-grow:0;width:296px}}.neeto-molecules-app-switcher__body{display:flex;flex-direction:column;font-size:var(--neeto-ui-text-sm);gap:12px;margin-bottom:24px;width:100%}.neeto-molecules-app-switcher-link{align-items:center;background-color:rgb(var(--neeto-ui-gray-100));border-color:rgb(var(--neeto-ui-gray-100));border-radius:var(--neeto-ui-rounded-lg);border-style:solid;border-width:2px;cursor:pointer;display:flex;gap:12px;max-width:100%;padding:12px 16px;text-decoration:none;transition:background-color .3s ease-in-out;width:100%}.neeto-molecules-app-switcher-link:focus,.neeto-molecules-app-switcher-link:focus-visible{outline:none}.neeto-molecules-app-switcher-link:focus-visible{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-app-switcher-link:not(.neeto-molecules-app-switcher-link--active):hover{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-app-switcher-link--active{background:rgb(var(--neeto-ui-primary-100));border-color:rgb(var(--neeto-ui-primary-600))}.neeto-molecules-app-switcher-link__icon-holder{align-items:center;border-radius:var(--neeto-ui-rounded-lg);display:flex;flex-shrink:0;height:42px;justify-content:center;width:42px}.neeto-molecules-app-switcher-link__content{flex-grow:1}.neeto-molecules-app-switcher-link__content span{display:block}";
-injectCss.n(css$1,{});
+var css = ".neeto-molecules-app-switcher__wrapper{align-items:flex-start;background-color:rgb(var(--neeto-ui-white));display:flex;flex-direction:column;justify-content:flex-start;max-width:100%;overflow-y:auto;padding:40px;position:relative;transition:all .3s;width:100%}@media only screen and (max-width:992px){.neeto-molecules-app-switcher__wrapper{padding:32px}}@media screen and (max-width:768px){.neeto-molecules-app-switcher__wrapper{padding:16px}}.neeto-molecules-app-switcher__grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(288px,1fr))}@media only screen and (max-width:992px){.neeto-molecules-app-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(248px,1fr))}}@media only screen and (max-width:640px){.neeto-molecules-app-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(100%,1fr))}}.neeto-molecules-app-switcher__header{align-items:center;display:flex;gap:32px;justify-content:space-between;margin-bottom:32px;position:relative;width:100%}@media only screen and (max-width:768px){.neeto-molecules-app-switcher__header{align-items:flex-start;flex-direction:column-reverse;gap:24px}}@media only screen and (max-width:640px){.neeto-molecules-app-switcher__header h1{font-size:24px}}.neeto-molecules-app-switcher__close-btn{position:absolute;right:12px;top:12px}.neeto-molecules-app-switcher__search-wrapper{flex-grow:1}@media only screen and (min-width:992px){.neeto-molecules-app-switcher__search-wrapper{flex-grow:0;width:296px}}.neeto-molecules-app-switcher__body{display:flex;flex-direction:column;font-size:var(--neeto-ui-text-sm);gap:12px;margin-bottom:24px;width:100%}.neeto-molecules-app-switcher-link{align-items:center;background-color:rgb(var(--neeto-ui-gray-100));border-color:rgb(var(--neeto-ui-gray-100));border-radius:var(--neeto-ui-rounded-lg);border-style:solid;border-width:2px;cursor:pointer;display:flex;gap:12px;max-width:100%;padding:12px 16px;text-decoration:none;transition:background-color .3s ease-in-out;width:100%}.neeto-molecules-app-switcher-link:focus,.neeto-molecules-app-switcher-link:focus-visible{outline:none}.neeto-molecules-app-switcher-link:focus-visible{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-app-switcher-link:not(.neeto-molecules-app-switcher-link--active):hover{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-app-switcher-link--active{background:rgb(var(--neeto-ui-primary-100));border-color:rgb(var(--neeto-ui-primary-600))}.neeto-molecules-app-switcher-link__icon-holder{align-items:center;border-radius:var(--neeto-ui-rounded-lg);display:flex;flex-shrink:0;height:42px;justify-content:center;width:42px}.neeto-molecules-app-switcher-link__content{flex-grow:1}.neeto-molecules-app-switcher-link__content span{display:block}";
+injectCss.n(css,{});
 
 var AppLink = function AppLink(_ref) {
   var name = _ref.name,
@@ -176,9 +176,6 @@ var AppSwitcher = function AppSwitcher() {
   }, /*#__PURE__*/React__default["default"].createElement(Body, null));
 };
 
-var css = ":root{--neeto-molecules-sidebar-width:240px;--neeto-molecules-sidebar-wrapper-z-index:99997;--neeto-molecules-sidebar-z-index:99998;--neeto-chat-primary:136,134,255;--neeto-wireframe-primary:106,103,232;--neeto-site-primary:129,118,255;--neeto-desk-primary:253,148,55;--neeto-planner-primary:82,169,198;--neeto-replay-primary:32,199,189;--neeto-course-primary:140,214,114;--neeto-ci-primary:255,133,184;--neeto-invoice-primary:70,160,211;--neeto-quiz-primary:254,99,99;--neeto-runner-primary:75,71,255;--neeto-form-primary:254,128,114;--neeto-crm-primary:96,154,240;--neeto-changelog-primary:255,135,135;--neeto-deploy-primary:20,209,164;--neeto-kb-primary:101,205,161;--neeto-cal-primary:238,77,95;--neeto-invisible-primary:121,157,250;--neeto-testify-primary:255,158,69;--neeto-monitor-primary:70,181,197;--neeto-git-primary:255,78,110}@media screen and (min-width:1024px){:root{--neeto-molecules-sidebar-width:240px}}.neeto-molecules-sidebar__wrapper{display:flex;max-width:240px;max-width:var(--neeto-molecules-sidebar-width);position:relative;transition:all .15s;width:240px;width:var(--neeto-molecules-sidebar-width)}@media screen and (max-width:768px){.neeto-molecules-sidebar__wrapper{height:100%;left:0;max-width:100%;position:fixed;top:0;transition:none;width:100%;z-index:99997;z-index:var(--neeto-molecules-sidebar-wrapper-z-index)}.neeto-molecules-sidebar__wrapper .neeto-molecules-sidebar{left:0;max-width:240px;max-width:var(--neeto-molecules-sidebar-width);position:fixed;top:0;transition:none;width:240px;width:var(--neeto-molecules-sidebar-width)}}.neeto-molecules-sidebar__wrapper--collapsed{max-width:0;width:0}.neeto-molecules-sidebar__wrapper--collapsed .neeto-molecules-sidebar__toggler{right:-36px;transform:scale(-1)}@media screen and (max-width:768px){.neeto-molecules-sidebar__wrapper--collapsed .neeto-molecules-sidebar__toggler{left:8px;right:auto}.neeto-molecules-sidebar__wrapper--collapsed .neeto-molecules-sidebar{left:-240px;left:calc(var(--neeto-molecules-sidebar-width)*-1)}}.neeto-molecules-sidebar{background-color:rgb(var(--neeto-ui-gray-100));border-right:1px solid rgb(var(--neeto-ui-gray-100));height:100vh;padding:24px 0;width:100%;z-index:99998;z-index:var(--neeto-molecules-sidebar-z-index)}.neeto-molecules-sidebar__no-shrinkable{max-width:240px;max-width:var(--neeto-molecules-sidebar-width);width:240px;width:var(--neeto-molecules-sidebar-width)}.neeto-molecules-sidebar::-webkit-scrollbar{height:0;width:0}.neeto-molecules-sidebar::-webkit-scrollbar-thumb{background:rgb(var(--neeto-ui-gray-300));border-radius:50px}.neeto-molecules-sidebar::-webkit-scrollbar-track{background:\"transparent\"}.neeto-molecules-sidebar__toggler{position:absolute;right:8px;top:8px;z-index:99998;z-index:var(--neeto-molecules-sidebar-z-index)}@media screen and (max-width:768px){.neeto-molecules-sidebar__toggler{left:202px;left:calc(var(--neeto-molecules-sidebar-width) - 38px);right:auto;transition:none}}.neeto-molecules-sidebar__header{margin:14px 0 28px;padding:0 24px}.neeto-molecules-sidebar__logo svg{height:20px;max-width:100%;width:auto}.neeto-molecules-sidebar__links{margin-bottom:40px}.neeto-molecules-sidebar__link{color:rgb(var(--neeto-ui-gray-800));gap:10px;padding:12px 24px;position:relative;text-decoration:none!important;transition:var(--neeto-ui-transition);width:100%}.neeto-molecules-sidebar__link-icon{flex-shrink:0;transition:var(--neeto-ui-transition)}.neeto-molecules-sidebar__link-icon svg path{vector-effect:non-scaling-stroke}.neeto-molecules-sidebar__link-icon--rotate{transform:scale(-1)}.neeto-molecules-sidebar__link-icon--caret{opacity:0;transition:opacity .3s ease-in-out}.neeto-molecules-sidebar__link-label,.neeto-molecules-sidebar__link-sub-label{flex-grow:1;text-align:left}.neeto-molecules-sidebar__link:hover{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-black))}.neeto-molecules-sidebar__link:focus,.neeto-molecules-sidebar__link:focus-visible,.neeto-molecules-sidebar__link[aria-expanded=true]{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-black));outline:none}.neeto-molecules-sidebar__link.active{background-color:rgb(var(--neeto-ui-white));color:rgb(var(--neeto-ui-black))}.neeto-molecules-sidebar__link.active .neeto-molecules-sidebar__link-label{font-weight:var(--neeto-ui-font-medium)}.neeto-molecules-sidebar__link.active .neeto-molecules-sidebar__link-icon--caret,.neeto-molecules-sidebar__link:focus .neeto-molecules-sidebar__link-icon--caret,.neeto-molecules-sidebar__link:focus-visible .neeto-molecules-sidebar__link-icon--caret,.neeto-molecules-sidebar__link:hover .neeto-molecules-sidebar__link-icon--caret,.neeto-molecules-sidebar__link[aria-expanded=true] .neeto-molecules-sidebar__link-icon--caret{opacity:1}.neeto-molecules-sidebar__link--button:focus{background-color:transparent}.neeto-molecules-sidebar__link--button:focus-visible{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-gray-800))}.neeto-molecules-sidebar__link--change-log{outline:none!important}.neeto-molecules-sidebar__sublink-wrapper{background-color:rgb(var(--neeto-ui-white));padding:4px 0}.neeto-molecules-sidebar__sublink{background-color:rgb(var(--neeto-ui-white));color:rgb(var(--neeto-ui-gray-700));cursor:pointer;gap:8px;padding:8px 24px 8px 58px;text-decoration:none;transition:all .3s}.neeto-molecules-sidebar__sublink:not(:last-child){margin-bottom:4px}.neeto-molecules-sidebar__sublink .neeto-molecules-sidebar__link-sub-count{opacity:.75}.neeto-molecules-sidebar__sublink:hover{color:rgb(var(--neeto-ui-gray-800));text-decoration:none}.neeto-molecules-sidebar__sublink:hover .neeto-molecules-sidebar__link-sub-count{opacity:1}.neeto-molecules-sidebar__sublink:focus,.neeto-molecules-sidebar__sublink:focus-visible{color:rgb(var(--neeto-ui-gray-800));outline:none;text-decoration:none}.neeto-molecules-sidebar__sublink:focus .neeto-molecules-sidebar__link-sub-count,.neeto-molecules-sidebar__sublink:focus-visible .neeto-molecules-sidebar__link-sub-count{opacity:1}.neeto-molecules-sidebar__sublink.active,.neeto-molecules-sidebar__sublink:active{color:rgb(var(--neeto-ui-black));font-weight:var(--neeto-ui-font-medium);text-decoration:none}.neeto-molecules-sidebar__sublink.active .neeto-molecules-sidebar__link-sub-count,.neeto-molecules-sidebar__sublink:active .neeto-molecules-sidebar__link-sub-count{opacity:1}.neeto-molecules-sidebar__footer{margin-top:auto}.sidebar-featured-tooltip__content{border-radius:8px!important;box-shadow:var(--neeto-ui-shadow-sm)!important}.sidebar-featured-tooltip__content .tippy-content{padding:0}.sidebar-featured-tooltip{padding:12px;width:150px}.sidebar-featured-tooltip__icon-wrap{background-color:rgb(var(--neeto-ui-gray-100));border-radius:8px;height:40px;margin-bottom:8px;margin-left:auto;margin-right:auto;width:40px}.sidebar-featured-tooltip__title{margin-bottom:4px}.neeto-molecules-app-switcher-popup-wrapper,.neeto-molecules-help-popup-wrapper,.neeto-molecules-profile-popup-wrapper{border:1px solid rgb(var(--neeto-ui-gray-400));border-radius:var(--neeto-ui-rounded)!important;box-shadow:0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12),0 5px 5px -3px rgba(0,0,0,.2)!important;min-width:240px}.neeto-molecules-app-switcher-popup-wrapper .tippy-content,.neeto-molecules-help-popup-wrapper .tippy-content,.neeto-molecules-profile-popup-wrapper .tippy-content{padding:0}.neeto-molecules-app-switcher-popup-wrapper .tippy-svg-arrow,.neeto-molecules-help-popup-wrapper .tippy-svg-arrow,.neeto-molecules-profile-popup-wrapper .tippy-svg-arrow{display:none!important}.neeto-molecules-profile-popup__top-section{border-top-left-radius:var(--neeto-ui-rounded);border-top-right-radius:var(--neeto-ui-rounded)}.neeto-molecules-profile-sublist{border-top:1px solid rgb(var(--neeto-ui-gray-400))}.neeto-molecules-help-sublist,.neeto-molecules-profile-sublist{list-style:none;margin:0;padding:4px 0}.neeto-molecules-help-sublist__item,.neeto-molecules-profile-sublist__item{width:100%}.neeto-molecules-help-sublist__item-btn,.neeto-molecules-profile-sublist__item-btn{border-radius:0;justify-content:flex-end!important;min-height:40px;text-align:left}.neeto-molecules-help-sublist__item-btn.active,.neeto-molecules-profile-sublist__item-btn.active{background-color:rgb(var(--neeto-ui-gray-800));color:rgb(var(--neeto-ui-white))}.neeto-molecules-help-sublist__item-btn-icon svg path,.neeto-molecules-profile-sublist__item-btn-icon svg path{vector-effect:non-scaling-stroke}.neeto-molecules-help-sublist__item-btn span,.neeto-molecules-profile-sublist__item-btn span{align-items:center;display:flex;gap:8px}.neeto-molecules-sidebar__link-icon{position:relative}.neeto-molecules-sidebar__notif-count{position:absolute;right:-6px;top:-6px;z-index:1}.neeto-molecules-help-sublist__item-btn-count,.neeto-molecules-sidebar__notif-count{align-items:center;background-color:rgb(var(--neeto-ui-primary-500));border-radius:var(--neeto-ui-rounded-full);color:rgb(var(--neeto-ui-white));display:inline-flex;flex-shrink:0;font-size:var(--neeto-ui-text-xxs);height:15px;justify-content:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:15px}.neeto-molecules-app-switcher-popup-wrapper{height:calc(100vh - 16px);margin-bottom:8px;min-width:calc(100vw - 176px);overflow-y:auto}@media screen and (max-width:768px){.neeto-molecules-app-switcher-popup-wrapper{width:calc(100vw - 185px)!important}}.neeto-molecules-sidebar__backdrop{background-color:rgba(var(--neeto-ui-black),.4);height:100%;left:0;position:absolute;top:0;width:100%}@media screen and (min-width:769px){.neeto-molecules-sidebar__backdrop{display:none;visibility:hidden}}.neeto-molecules-sidebar-segments-header{padding-left:58px}";
-injectCss.n(css,{});
-
 var AppSwitcherButton = function AppSwitcherButton() {
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
@@ -227,71 +224,6 @@ var AppSwitcherButton = function AppSwitcherButton() {
   }, t("neetoMolecules.sidebar.productSwitcher"))));
 };
 
-var shouldShowWhatsNew = function shouldShowWhatsNew() {
-  var _window$globalProps, _window$globalProps$u;
-  var currentUserEmail = (_window$globalProps = window.globalProps) === null || _window$globalProps === void 0 ? void 0 : (_window$globalProps$u = _window$globalProps.user) === null || _window$globalProps$u === void 0 ? void 0 : _window$globalProps$u.email;
-  return window.location.hostname === "localhost" || currentUserEmail === "oliver@example.com" || (currentUserEmail === null || currentUserEmail === void 0 ? void 0 : currentUserEmail.endsWith("@bigbinary.com"));
-};
-var MY_PROFILE_URL = "/auth/profile/edit";
-var MY_ORGANIZATION_URL = "/auth/organization/edit";
-var CHANGELOG_WIDGET_TRIGGER_ID = "neetochangelog-trigger";
-var SUB_LINK_TYPES = {
-  SYSTEM_VIEW: "system_view",
-  SEGMENT: "segment"
-};
-var DEFAULT_HELP_LINK_PROPS = {
-  liveChatProps: {
-    label: i18next.t("neetoMolecules.sidebar.helpLinks.liveChat"),
-    icon: neetoIcons.ChatEmpty,
-    "data-cy": "help-link-live-chat-button",
-    onClick: function onClick() {
-      var _window$NeetoChat, _window$NeetoChat$con, _window$NeetoChat2, _window$NeetoChat2$co;
-      (_window$NeetoChat = window.NeetoChat) === null || _window$NeetoChat === void 0 ? void 0 : (_window$NeetoChat$con = _window$NeetoChat.contextualHelp) === null || _window$NeetoChat$con === void 0 ? void 0 : _window$NeetoChat$con.maximizeWidget();
-      (_window$NeetoChat2 = window.NeetoChat) === null || _window$NeetoChat2 === void 0 ? void 0 : (_window$NeetoChat2$co = _window$NeetoChat2.contextualHelp) === null || _window$NeetoChat2$co === void 0 ? void 0 : _window$NeetoChat2$co.openWidget();
-    }
-  },
-  helpCenterProps: {
-    label: i18next.t("neetoMolecules.sidebar.helpLinks.helpArticles"),
-    icon: neetoIcons.Book,
-    "data-cy": "help-link-help-center-button",
-    href: "https://help.".concat(ramda.toLower(globalProps.appName), ".com/"),
-    target: "_blank"
-  },
-  changelogProps: {
-    id: CHANGELOG_WIDGET_TRIGGER_ID,
-    label: i18next.t("neetoMolecules.sidebar.helpLinks.whatsNew"),
-    icon: neetoIcons.Gift,
-    "data-cy": "help-link-changelog-button",
-    isVisible: shouldShowWhatsNew
-  },
-  keyboardShortcutProps: {
-    label: i18next.t("neetoMolecules.sidebar.helpLinks.keyboardShortcuts"),
-    icon: neetoIcons.Keyboard,
-    "data-cy": "help-link-keyboard-shortcut-button"
-  }
-};
-
-var isSubRouteActive = function isSubRouteActive(subRoute, location) {
-  var currentBrowserUrl = new URL(location.pathname + location.search, window.location.origin);
-  var targetUrl = new URL(subRoute, window.location.origin);
-  if (!currentBrowserUrl.pathname.startsWith(targetUrl.pathname)) {
-    return false;
-  }
-  var targetSearchParams = targetUrl.searchParams;
-  var targetSearchKeys = Array.from(targetSearchParams.keys());
-  if (neetoCist.isPresent(currentBrowserUrl.searchParams.get("segment_id"))) {
-    return false;
-  }
-  return ramda.all(function (key) {
-    return currentBrowserUrl.searchParams.get(key) === targetSearchParams.get(key);
-  }, targetSearchKeys);
-};
-var getSidebarStateLocalStorageKey = function getSidebarStateLocalStorageKey() {
-  var _globalProps$user, _globalProps$user2;
-  var user = ((_globalProps$user = globalProps.user) === null || _globalProps$user === void 0 ? void 0 : _globalProps$user.email) || ((_globalProps$user2 = globalProps.user) === null || _globalProps$user2 === void 0 ? void 0 : _globalProps$user2.phoneNumber);
-  return "sidebarState-".concat(user);
-};
-
 var getProfileInfo = function getProfileInfo(isOwner, profileInfoOverrides) {
   var _globalProps$user, _globalProps$user2, _globalProps$user3, _globalProps$user4, _globalProps$user5;
   return ramda.mergeDeepLeft(profileInfoOverrides, {
@@ -302,14 +234,14 @@ var getProfileInfo = function getProfileInfo(isOwner, profileInfoOverrides) {
       label: i18next.t("neetoMolecules.sidebar.myProfile"),
       icon: neetoIcons.User,
       onClick: function onClick() {
-        return window.open(MY_PROFILE_URL, "_blank");
+        return window.open(sidebar.MY_PROFILE_URL, "_blank");
       },
       "data-cy": "my-profile-button"
     }, isOwner && {
       label: i18next.t("neetoMolecules.sidebar.myOrganization"),
       icon: neetoIcons.Settings,
       onClick: function onClick() {
-        return window.open(MY_ORGANIZATION_URL, "_blank");
+        return window.open(sidebar.MY_ORGANIZATION_URL, "_blank");
       },
       "data-cy": "profile-organization-settings-button"
     }].filter(Boolean),
@@ -318,7 +250,7 @@ var getProfileInfo = function getProfileInfo(isOwner, profileInfoOverrides) {
       label: i18next.t("neetoMolecules.sidebar.logout"),
       onClick: function onClick() {
         axios.resetAuthTokens();
-        general.removeFromLocalStorage(getSidebarStateLocalStorageKey());
+        general.removeFromLocalStorage(sidebar.getSidebarStateLocalStorageKey());
         // Directly attaching static "/logout" string should be safe as there are no dynamic values involved.
         // eslint-disable-next-line xss/no-location-href-assign
         window.location.href = "/logout";
@@ -364,9 +296,9 @@ var ProfileSection = function ProfileSection(_ref, ref) {
 };
 var ProfileSection$1 = /*#__PURE__*/React.forwardRef(ProfileSection);
 
-var _excluded$4 = ["onClick", "label", "icon"];
-function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { defineProperty._defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$2 = ["onClick", "label", "icon"];
+function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { defineProperty._defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var LinkSection = function LinkSection(_ref) {
   var links = _ref.links;
   return /*#__PURE__*/React__default["default"].createElement("ul", {
@@ -376,7 +308,7 @@ var LinkSection = function LinkSection(_ref) {
       label = _ref2.label,
       _ref2$icon = _ref2.icon,
       icon = _ref2$icon === void 0 ? null : _ref2$icon,
-      otherProps = objectWithoutProperties._objectWithoutProperties(_ref2, _excluded$4);
+      otherProps = objectWithoutProperties._objectWithoutProperties(_ref2, _excluded$2);
     return /*#__PURE__*/React__default["default"].createElement("li", {
       className: "neeto-molecules-profile-sublist__item",
       key: idx
@@ -386,7 +318,7 @@ var LinkSection = function LinkSection(_ref) {
       iconPosition: "left",
       iconSize: 18,
       style: "text"
-    }, _objectSpread$3({
+    }, _objectSpread$2({
       icon: icon,
       label: label,
       onClick: onClick
@@ -409,7 +341,7 @@ var ProfileMenu = function ProfileMenu(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: classnames__default["default"]("neeto-ui-relative neeto-ui-flex neeto-ui-items-center neeto-ui-p-3 neeto-ui-bg-primary-100 neeto-molecules-profile-popup__top-section")
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "top-0 left-0"
+    className: "left-0 top-0"
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Avatar, {
     size: "large",
     user: profileInfo
@@ -489,20 +421,20 @@ var HelpSection = function HelpSection(_ref, ref) {
 };
 var HelpSection$1 = /*#__PURE__*/React.forwardRef(HelpSection);
 
-var _excluded$3 = ["label"];
-function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { defineProperty._defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var _excluded$1 = ["label"];
+function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { defineProperty._defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var HelpSectionMenu = function HelpSectionMenu(_ref) {
   var helpLinkOverrides = _ref.helpLinkOverrides,
     changesCount = _ref.changesCount;
   var _KeyboardShortcuts$us = KeyboardShortcuts.usePaneState(),
     _KeyboardShortcuts$us2 = slicedToArray._slicedToArray(_KeyboardShortcuts$us, 2),
     setIsOpen = _KeyboardShortcuts$us2[1];
-  var helpLinks = Object.keys(DEFAULT_HELP_LINK_PROPS).filter(function (key) {
+  var helpLinks = Object.keys(sidebar.DEFAULT_HELP_LINK_PROPS).filter(function (key) {
     var _DEFAULT_HELP_LINK_PR, _DEFAULT_HELP_LINK_PR2, _DEFAULT_HELP_LINK_PR3;
-    return (_DEFAULT_HELP_LINK_PR = (_DEFAULT_HELP_LINK_PR2 = (_DEFAULT_HELP_LINK_PR3 = DEFAULT_HELP_LINK_PROPS[key]).isVisible) === null || _DEFAULT_HELP_LINK_PR2 === void 0 ? void 0 : _DEFAULT_HELP_LINK_PR2.call(_DEFAULT_HELP_LINK_PR3)) !== null && _DEFAULT_HELP_LINK_PR !== void 0 ? _DEFAULT_HELP_LINK_PR : true;
+    return (_DEFAULT_HELP_LINK_PR = (_DEFAULT_HELP_LINK_PR2 = (_DEFAULT_HELP_LINK_PR3 = sidebar.DEFAULT_HELP_LINK_PROPS[key]).isVisible) === null || _DEFAULT_HELP_LINK_PR2 === void 0 ? void 0 : _DEFAULT_HELP_LINK_PR2.call(_DEFAULT_HELP_LINK_PR3)) !== null && _DEFAULT_HELP_LINK_PR !== void 0 ? _DEFAULT_HELP_LINK_PR : true;
   }).map(function (key) {
-    return _objectSpread$2(_objectSpread$2(_objectSpread$2(_objectSpread$2({}, DEFAULT_HELP_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
+    return _objectSpread$1(_objectSpread$1(_objectSpread$1(_objectSpread$1({}, sidebar.DEFAULT_HELP_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
       onClick: function onClick() {
         return setIsOpen(true);
       }
@@ -517,7 +449,7 @@ var HelpSectionMenu = function HelpSectionMenu(_ref) {
     className: "neeto-molecules-help-sublist"
   }, helpLinks.map(function (_ref3, idx) {
     var label = _ref3.label,
-      buttonProps = objectWithoutProperties._objectWithoutProperties(_ref3, _excluded$3);
+      buttonProps = objectWithoutProperties._objectWithoutProperties(_ref3, _excluded$1);
     return /*#__PURE__*/React__default["default"].createElement("li", {
       className: "neeto-molecules-help-sublist__item",
       key: idx
@@ -609,308 +541,27 @@ var Header = function Header(_ref) {
 };
 var Header$1 = /*#__PURE__*/React__default["default"].memo(Header);
 
-var _excluded$2 = ["checkpointKey", "to", "children"];
-var CheckPointNavLinks = function CheckPointNavLinks(_ref) {
-  var checkpointKey = _ref.checkpointKey,
-    to = _ref.to,
-    children = _ref.children,
-    others = objectWithoutProperties._objectWithoutProperties(_ref, _excluded$2);
-  var _useNavigationCheckpo = useRegisterNavigationCheckpoint.useNavigationCheckpoints(checkpointKey),
-    checkpoint = _useNavigationCheckpo[checkpointKey];
-  return /*#__PURE__*/React__default["default"].createElement(reactRouterDom.NavLink, _extends._extends({
-    to: checkpoint || to
-  }, others), children);
-};
-
-var DeleteAlert = function DeleteAlert(_ref) {
-  var isOpen = _ref.isOpen,
-    onClose = _ref.onClose,
-    segment = _ref.segment,
-    columns = _ref.columns;
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
-  var history = reactRouterDom.useHistory();
-  var _getQueryParams = general.getQueryParams(),
-    segmentId = _getQueryParams.segmentId;
-  var _useDestroySegment = neetoFiltersFrontend.useDestroySegment(),
-    deleteSegment = _useDestroySegment.mutate,
-    isDeleting = _useDestroySegment.isLoading;
-  var handleClearAll = function handleClearAll() {
-    var params = neetoFiltersFrontend.buildUrlFromFilters({
-      columns: columns,
-      filters: [],
-      isClearAll: true
-    });
-    history.push({
-      search: params
-    });
-  };
-  var handleDelete = function handleDelete() {
-    segment.id === segmentId && handleClearAll();
-    deleteSegment(segment.id, {
-      onSuccess: onClose
-    });
-  };
-  return /*#__PURE__*/React__default["default"].createElement(neetoui.Alert, {
-    isOpen: isOpen,
-    onClose: onClose,
-    isSubmitting: isDeleting,
-    submitButtonLabel: t("neetoMolecules.common.actions.delete"),
-    message: /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
-      i18nKey: "neetoMolecules.sidebar.segments.deleteAlertMessage",
-      values: {
-        entity: segment.name
-      }
-    }),
-    title: t("neetoMolecules.common.deleteAlert.title", {
-      entity: t("neetoMolecules.sidebar.segments.segment", constants.SINGULAR)
-    }),
-    onSubmit: handleDelete
-  });
-};
-
-var RENAME_SEGMENT_FORM_VALIDATION = yup__namespace.object().shape({
-  name: yup__namespace.string().trim().required(i18next.t("neetoMolecules.sidebar.segments.validations.nameIsRequired"))
-});
-
-function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { defineProperty._defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Rename = function Rename(_ref) {
-  var isOpen = _ref.isOpen,
-    setIsOpen = _ref.setIsOpen,
-    segment = _ref.segment;
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
-  var _useUpdateSegment = neetoFiltersFrontend.useUpdateSegment(),
-    updateSegment = _useUpdateSegment.mutate;
-  var inputRef = React.useRef();
-  var handleSubmit = function handleSubmit(values, _ref2) {
-    var setSubmitting = _ref2.setSubmitting,
-      setFieldError = _ref2.setFieldError;
-    setSubmitting(true);
-    updateSegment({
-      id: segment.id,
-      payload: _objectSpread$1(_objectSpread$1({}, segment), values),
-      showToastr: false
-    }, {
-      onSuccess: function onSuccess() {
-        setIsOpen(false);
-        utils.showThumbsUpToastr();
-      },
-      onSettled: function onSettled() {
-        setSubmitting(false);
-      },
-      onError: function onError(error) {
-        var _error$response, _error$response3, _error$response3$data;
-        if (((_error$response = error.response) === null || _error$response === void 0 ? void 0 : _error$response.status) !== 422) {
-          var _error$response2, _error$response2$data;
-          var errorMessage = (_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : (_error$response2$data = _error$response2.data) === null || _error$response2$data === void 0 ? void 0 : _error$response2$data.error;
-          neetoui.Toastr.error(errorMessage || t("neetoMolecules.common.somethingWentWrong"));
-          return;
-        }
-        setFieldError("name", (_error$response3 = error.response) === null || _error$response3 === void 0 ? void 0 : (_error$response3$data = _error$response3.data) === null || _error$response3$data === void 0 ? void 0 : _error$response3$data.error);
-      }
-    });
-  };
-  return /*#__PURE__*/React__default["default"].createElement(neetoui.Pane, {
-    isOpen: isOpen,
-    initialFocusRef: inputRef,
-    onClose: function onClose() {
-      return setIsOpen(false);
-    }
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Header, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-    "data-cy": "edit-pane-header",
-    style: "h2"
-  }, t("neetoMolecules.sidebar.segments.renameTitle"))), /*#__PURE__*/React__default["default"].createElement(formik.Form, {
-    className: "w-full",
-    formikProps: {
-      initialValues: {
-        name: segment.name
-      },
-      validateOnChange: true,
-      validateOnBlur: true,
-      validationSchema: RENAME_SEGMENT_FORM_VALIDATION,
-      onSubmit: handleSubmit
-    }
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Body, null, /*#__PURE__*/React__default["default"].createElement(formik.Input, {
-    required: true,
-    className: "w-full",
-    "data-testid": "segment-name-input-field",
-    label: t("neetoMolecules.sidebar.segments.renameFieldLabel"),
-    name: "name",
-    ref: inputRef
-  })), /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Footer, {
-    className: "flex items-center space-x-2"
-  }, /*#__PURE__*/React__default["default"].createElement(formik.ActionBlock, {
-    cancelButtonProps: {
-      onClick: function onClick() {
-        return setIsOpen(false);
-      },
-      disabled: false,
-      className: "ml-2"
-    }
-  }))));
-};
-
-var Segment = function Segment(_ref) {
-  var dataCy = _ref.dataCy,
-    segment = _ref.segment,
-    label = _ref.label,
-    columns = _ref.columns;
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
-  var _useState = React.useState(false),
-    _useState2 = slicedToArray._slicedToArray(_useState, 2),
-    isDeleteAlertOpen = _useState2[0],
-    setIsDeleteAlertOpen = _useState2[1];
-  var _useState3 = React.useState(false),
-    _useState4 = slicedToArray._slicedToArray(_useState3, 2),
-    isRenamePaneOpen = _useState4[0],
-    setIsRenamePaneOpen = _useState4[1];
-  var history = reactRouterDom_min.useHistory();
-  var _getQueryParams = general.getQueryParams(),
-    segmentId = _getQueryParams.segmentId;
-  var handleSelectSegment = function handleSelectSegment() {
-    var _segment$filters$;
-    history.push({
-      search: neetoFiltersFrontend.buildUrlFromSegment({
-        columns: columns,
-        filters: (_segment$filters$ = segment.filters[0]) === null || _segment$filters$ === void 0 ? void 0 : _segment$filters$.conditions,
-        id: segment.id
-      })
-    });
-  };
-  var dataCyPrefix = dataCy || neetoCist.hyphenate(label);
-  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("button", {
-    "data-cy": "".concat(dataCyPrefix, "-segment-link"),
-    className: classnames__default["default"]("neeto-molecules-sidebar-segment neeto-molecules-sidebar__sublink neeto-ui-flex neeto-ui-items-center neeto-ui-select-none mb-0 w-full py-1", {
-      active: segmentId === segment.id
-    }),
-    onClick: handleSelectSegment
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-    className: "neeto-molecules-sidebar__link-sub-label neeto-molecules-sidebar-segment__label neeto-ui-flex-grow min-w-0",
-    component: "span",
-    "data-cy": "".concat(dataCyPrefix, "-sub-link-label"),
-    style: "body2"
-  }, label), /*#__PURE__*/React__default["default"].createElement(MoreDropdown, {
-    dropdownButtonProps: {
-      "data-testid": "segment-more-menu-".concat(dataCyPrefix),
-      className: "flex-shrink-0",
-      size: "small",
-      style: "secondary"
-    },
-    dropdownProps: {
-      position: "bottom-end",
-      strategy: "fixed",
-      autoWidth: true,
-      onClick: function onClick(e) {
-        e.stopPropagation();
-      }
-    },
-    menuItems: [{
-      label: t("neetoMolecules.common.actions.rename"),
-      onClick: function onClick(e) {
-        setIsRenamePaneOpen(true);
-        e.stopPropagation();
-      },
-      key: "edit-custom-segment-button"
-    }, {
-      label: t("neetoMolecules.common.actions.delete"),
-      onClick: function onClick(e) {
-        setIsDeleteAlertOpen(true);
-        e.stopPropagation();
-      },
-      key: "delete-custom-segment-button"
-    }]
-  })), /*#__PURE__*/React__default["default"].createElement(DeleteAlert, {
-    columns: columns,
-    segment: segment,
-    isOpen: isDeleteAlertOpen,
-    onClose: function onClose() {
-      return setIsDeleteAlertOpen(false);
-    }
-  }), /*#__PURE__*/React__default["default"].createElement(Rename, {
-    segment: segment,
-    isOpen: isRenamePaneOpen,
-    setIsOpen: setIsRenamePaneOpen
-  }));
-};
-
-var _excluded$1 = ["data-cy", "to", "label", "type", "count", "columns", "filters", "id", "isCountsLoading"];
-var SubLink = function SubLink(_ref) {
-  var dataCy = _ref["data-cy"],
-    to = _ref.to,
-    label = _ref.label,
-    _ref$type = _ref.type,
-    type = _ref$type === void 0 ? SUB_LINK_TYPES.SYSTEM_VIEW : _ref$type,
-    count = _ref.count,
-    columns = _ref.columns,
-    filters = _ref.filters,
-    id = _ref.id,
-    isCountsLoading = _ref.isCountsLoading,
-    otherProps = objectWithoutProperties._objectWithoutProperties(_ref, _excluded$1);
-  var segment = {
-    id: id,
-    name: label,
-    filters: filters
-  };
-  if (type === SUB_LINK_TYPES.SEGMENT) {
-    return /*#__PURE__*/React__default["default"].createElement(Segment, {
-      columns: columns,
-      dataCy: dataCy,
-      label: label,
-      segment: segment
-    });
-  }
-  var dataCyPrefix = dataCy || neetoCist.hyphenate(label);
-  var renderCount = function renderCount(count) {
-    return count > 999 ? "999+" : count;
-  };
-  return /*#__PURE__*/React__default["default"].createElement(CheckPointNavLinks, _extends._extends({
-    to: to,
-    activeClassName: "active",
-    className: "neeto-molecules-sidebar__sublink neeto-ui-flex neeto-ui-items-center neeto-ui-select-none",
-    "data-cy": "".concat(dataCyPrefix, "-sub-link"),
-    isActive: function isActive() {
-      return isSubRouteActive(to, location);
-    }
-  }, otherProps), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-    className: "neeto-molecules-sidebar__link-sub-label neeto-ui-flex-grow",
-    component: "span",
-    "data-cy": "".concat(dataCyPrefix, "-sub-link-label"),
-    style: "body2"
-  }, label), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-    className: "neeto-molecules-sidebar__link-sub-count neeto-ui-flex-shrink-0",
-    component: "span",
-    "data-cy": "".concat(dataCyPrefix, "-sub-link-count"),
-    style: "body2"
-  }, isCountsLoading ? /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "neeto-ui-rounded neeto-ui-bg-gray-200 h-4 w-4 animate-pulse"
-  }) : renderCount(count)));
-};
-
-var _excluded = ["label", "to", "icon", "items", "isCountsLoading"];
+var _excluded = ["label", "to", "icon", "items", "isConfigureNavLink", "isCountsLoading"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { defineProperty._defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Links = function Links(_ref) {
   var navLinks = _ref.navLinks,
-    isCountsLoadingDeprecated = _ref.isCountsLoading;
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
+    isCountsLoadingDeprecated = _ref.isCountsLoading,
+    setSelectedNavLink = _ref.setSelectedNavLink;
   var location = reactRouterDom.useLocation();
   var _useState = React.useState(true),
     _useState2 = slicedToArray._slicedToArray(_useState, 2),
     isActiveLinkExpanded = _useState2[0],
     setIsActiveLinkExpanded = _useState2[1];
-  var filterByPermissions = ramda.curry(function (_ref2) {
-    var permissions = _ref2.permissions;
-    if (permissions) {
-      return ramda.is(Array, permissions) ? permissions.some(ramda.includes(ramda.__, initializers.globalProps.permissions)) : initializers.globalProps.permissions.includes(permissions);
-    }
-    return true;
-  });
-  var handleNavLinkClick = function handleNavLinkClick(event, isActive, items) {
+  var handleNavLinkClick = function handleNavLinkClick(_ref2) {
+    var event = _ref2.event,
+      isActive = _ref2.isActive,
+      items = _ref2.items,
+      navLink = _ref2.navLink;
     if (neetoCist.isNotPresent(items)) return;
+    if (navLink.isConfigureNavLink && neetoCist.isNotEmpty(navLink.items)) {
+      setSelectedNavLink(navLink);
+    }
     if (isActive()) {
       setIsActiveLinkExpanded(ramda.not);
       event.preventDefault();
@@ -920,31 +571,34 @@ var Links = function Links(_ref) {
   };
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-molecules-sidebar__links neeto-molecules-sidebar__no-shrinkable"
-  }, navLinks.filter(filterByPermissions).map(function (_ref3, mainIndex) {
-    var label = _ref3.label,
-      to = _ref3.to,
-      icon = _ref3.icon,
-      items = _ref3.items,
-      _ref3$isCountsLoading = _ref3.isCountsLoading,
-      isCountsLoading = _ref3$isCountsLoading === void 0 ? false : _ref3$isCountsLoading,
-      otherProps = objectWithoutProperties._objectWithoutProperties(_ref3, _excluded);
+  }, navLinks.filter(sidebar.filterByPermissions).map(function (navLink) {
+    var label = navLink.label,
+      to = navLink.to,
+      icon = navLink.icon,
+      items = navLink.items,
+      isConfigureNavLink = navLink.isConfigureNavLink,
+      _navLink$isCountsLoad = navLink.isCountsLoading,
+      isCountsLoading = _navLink$isCountsLoad === void 0 ? false : _navLink$isCountsLoad,
+      otherProps = objectWithoutProperties._objectWithoutProperties(navLink, _excluded);
     var IconSVG = icon;
     var url = new URL(to, window.location.href);
     var isActive = function isActive() {
       return ramda.is(Function, otherProps.isActive) ? otherProps.isActive() : location.pathname.startsWith(url.pathname);
     };
     var isMenuExpanded = isActive() && isActiveLinkExpanded && !isCountsLoadingDeprecated;
-    var firstSegmentIndex = neetoCist._findIndexBy({
-      type: SUB_LINK_TYPES.SEGMENT
-    }, items);
     return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
-      key: mainIndex
-    }, /*#__PURE__*/React__default["default"].createElement(CheckPointNavLinks, _extends._extends({
+      key: to
+    }, /*#__PURE__*/React__default["default"].createElement(sidebar.CheckPointNavLinks, _extends._extends({
       activeClassName: "active",
       className: "neeto-ui-flex neeto-ui-items-center neeto-ui-no-underline neeto-ui-select-none neeto-molecules-sidebar__link",
       "data-testid": "navlink-".concat(neetoCist.hyphenate(label)),
       onClick: function onClick(event) {
-        return handleNavLinkClick(event, isActive, items);
+        return handleNavLinkClick({
+          event: event,
+          isActive: isActive,
+          items: items,
+          navLink: navLink
+        });
       }
     }, _objectSpread({
       isActive: isActive,
@@ -957,28 +611,16 @@ var Links = function Links(_ref) {
       component: "span",
       style: "body2",
       weight: "normal"
-    }, label), items && /*#__PURE__*/React__default["default"].createElement("span", {
+    }, label), items && !isConfigureNavLink && /*#__PURE__*/React__default["default"].createElement("span", {
       className: classnames__default["default"]("neeto-molecules-sidebar__link-icon neeto-molecules-sidebar__link-icon--caret", {
         "neeto-molecules-sidebar__link-icon--rotate": isMenuExpanded
       })
     }, /*#__PURE__*/React__default["default"].createElement(neetoIcons.Down, {
       size: 16
-    }))), items && isMenuExpanded && /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "neeto-molecules-sidebar__sublink-wrapper",
-      "data-cy": "sidebar-sub-link-wrapper"
-    }, items.filter(filterByPermissions).map(function (subItem, subIndex) {
-      return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
-        key: subIndex
-      }, subIndex === firstSegmentIndex && /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-        className: "neeto-molecules-sidebar-segments-header neeto-ui-text-transform-capitalize neeto-ui-text-gray-600 py-2 uppercase",
-        style: "body3",
-        weight: "semibold"
-      }, t("neetoMolecules.sidebar.segments.segment", constants.PLURAL)), /*#__PURE__*/React__default["default"].createElement(SubLink, _extends._extends({}, _objectSpread(_objectSpread({}, subItem), {}, {
-        isCountsLoading: isCountsLoading
-      }), {
-        columns: otherProps.columns
-      })));
-    })));
+    }))), items && !isConfigureNavLink && isMenuExpanded && /*#__PURE__*/React__default["default"].createElement(sidebar.Items, _objectSpread({
+      isCountsLoading: isCountsLoading,
+      items: items
+    }, otherProps)));
   }));
 };
 
@@ -997,6 +639,7 @@ var Sidebar = function Sidebar(_ref) {
     showAppSwitcher = _ref$showAppSwitcher === void 0 ? true : _ref$showAppSwitcher,
     _ref$showFooter = _ref.showFooter,
     showFooter = _ref$showFooter === void 0 ? true : _ref$showFooter;
+  var productName = initializers.globalProps.appName.substr(5).toLowerCase();
   var _useState = React.useState(false),
     _useState2 = slicedToArray._slicedToArray(_useState, 2),
     isAppSwitcherOpen = _useState2[0],
@@ -1005,7 +648,11 @@ var Sidebar = function Sidebar(_ref) {
     _useState4 = slicedToArray._slicedToArray(_useState3, 2),
     isSidebarPaneOpen = _useState4[0],
     setIsSidebarPaneOpen = _useState4[1];
-  var _useLocalStorage = useLocalStorage__default["default"](getSidebarStateLocalStorageKey(), false),
+  var _useState5 = React.useState({}),
+    _useState6 = slicedToArray._slicedToArray(_useState5, 2),
+    selectedNavLink = _useState6[0],
+    setSelectedNavLink = _useState6[1];
+  var _useLocalStorage = useLocalStorage__default["default"](sidebar.getSidebarStateLocalStorageKey(), false),
     _useLocalStorage2 = slicedToArray._slicedToArray(_useLocalStorage, 2),
     isSidebarCollapsed = _useLocalStorage2[0],
     setIsSidebarCollapsed = _useLocalStorage2[1];
@@ -1016,6 +663,17 @@ var Sidebar = function Sidebar(_ref) {
     return window.innerWidth > 768;
   };
   var isSidebarClosed = isLargerScreen() ? isSidebarCollapsed : ramda.not(isSidebarPaneOpen);
+  React.useEffect(function () {
+    var currentLink = navLinks.find(function (_ref2) {
+      var to = _ref2.to,
+        isActive = _ref2.isActive;
+      var url = new URL(to, window.location.href);
+      return ramda.is(Function, isActive) ? isActive() : location.pathname.startsWith(url.pathname);
+    });
+    if (neetoCist.isPresent(currentLink) && currentLink.isConfigureNavLink) {
+      setSelectedNavLink(currentLink);
+    }
+  }, []);
   React.useEffect(function () {
     isAppSwitcherOpen && setIsAppSwitcherOpen(false);
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -1031,7 +689,10 @@ var Sidebar = function Sidebar(_ref) {
       return window.removeEventListener("resize", handleResize);
     };
   }, []);
-  var productName = initializers.globalProps.appName.substr(5).toLowerCase();
+  var handleGoBack = function handleGoBack(event) {
+    event.preventDefault();
+    setSelectedNavLink({});
+  };
   return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-testid": "sidebar-container",
     className: classnames__default["default"]("neeto-molecules-sidebar__wrapper", {
@@ -1041,16 +702,23 @@ var Sidebar = function Sidebar(_ref) {
     className: "neeto-molecules-sidebar__backdrop",
     onClick: function onClick() {
       setIsSidebarPaneOpen(false);
+      setSelectedNavLink({});
     }
   }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "neeto-molecules-sidebar neeto-ui-flex neeto-ui-flex-col neeto-ui-flex-shrink-0 neeto-ui-overflow-y-auto neeto-ui-overflow-x-hidden",
     "data-cy": "sidebar-wrapper",
-    "data-testid": "sidebar"
+    "data-testid": "sidebar",
+    className: classnames__default["default"]("neeto-molecules-sidebar 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": neetoCist.isPresent(selectedNavLink)
+    })
   }, /*#__PURE__*/React__default["default"].createElement(Header$1, {
     customLogo: customLogo
-  }), /*#__PURE__*/React__default["default"].createElement(Links, {
+  }), neetoCist.isPresent(selectedNavLink) ? /*#__PURE__*/React__default["default"].createElement(sidebar.SelectedLink, {
+    handleGoBack: handleGoBack,
+    navLink: selectedNavLink
+  }) : /*#__PURE__*/React__default["default"].createElement(Links, {
     isCountsLoading: isCountsLoading,
-    navLinks: navLinks
+    navLinks: navLinks,
+    setSelectedNavLink: setSelectedNavLink
   }), showFooter && /*#__PURE__*/React__default["default"].createElement(Footer, {
     extraTopLinks: extraTopLinks,
     helpLinkOverrides: helpLinkOverrides,