@bigbinary/neeto-molecules 1.3.18 → 1.3.19-beta

package/dist/cjs/Sidebar.js

@@ -2,16 +2,16 @@
 
 var React = require('react');
 var classnames = require('classnames');
+var neetoCist = require('@bigbinary/neeto-cist');
 var initializers = require('@bigbinary/neeto-commons-frontend/initializers');
 var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
 var neetoui = require('@bigbinary/neetoui');
 var ramda = require('ramda');
 var reactI18next = require('react-i18next');
 var reactRouterDom = require('react-router-dom');
+var i18next = require('i18next');
 var neetoIcons = require('@bigbinary/neeto-icons');
-var neetoCist = require('@bigbinary/neeto-cist');
 var AppIcons = require('@bigbinary/neeto-icons/app-icons');
-var i18next = require('i18next');
 var utils = require('@bigbinary/neeto-commons-frontend/utils');
 var KeyboardShortcuts = require('@bigbinary/neeto-molecules/KeyboardShortcuts');
 var ProductTypefaceLogos = require('@bigbinary/neeto-icons/typeface-logos');
@@ -110,6 +110,48 @@ var Chevron = function Chevron(_ref) {
   }));
 };
 
+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 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 NAVLINK_KEYS_TO_OMIT = ["Component", "component"];
+var SETTINGS = "Settings";
+
 var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
 
 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}";
@@ -224,7 +266,7 @@ 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:16px;justify-content:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:16px}.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}}";
+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--configure-page{position:relative;transition:all .15s}.neeto-molecules-sidebar__wrapper .neeto-molecules-sidebar,.neeto-molecules-sidebar__wrapper--configure-page{max-width:240px;max-width:var(--neeto-molecules-sidebar-width);width:240px;width:var(--neeto-molecules-sidebar-width)}.neeto-molecules-sidebar__wrapper .neeto-molecules-sidebar{left:0;position:fixed;top:0;transition:none}.neeto-molecules-sidebar__wrapper .neeto-molecules-sidebar--configure-page{max-width:100%;position:static;transition:all .15s;width:100%}}.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--configure-page{height:auto}.neeto-molecules-sidebar--configure-page .neeto-molecules-sidebar__toggler{display: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:16px;justify-content:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:16px}.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.neeto-molecules-sidebar--focus-mode{padding-top:0}.neeto-molecules-sidebar.neeto-molecules-sidebar--focus-mode .neeto-molecules-sidebar__header{padding-top:24px}.neeto-molecules-sidebar.neeto-molecules-sidebar--focus-mode .neeto-molecules-sidebar__links{margin-bottom:0}.neeto-molecules-sidebar__links--focus-mode .neeto-molecules-sidebar__sublink-wrapper{margin:0!important;padding:0!important}.neeto-molecules-sidebar__links--focus-mode .neeto-molecules-sidebar__link{--neeto-ui-text-body2:16px;gap:4px;padding:12px 4px;position:sticky;top:0;z-index:1}.neeto-molecules-sidebar__links--focus-mode>.neeto-molecules-sidebar__sublink-wrapper>.neeto-molecules-sidebar__sublink{--neeto-ui-text-body2:15px;border-top:1px solid rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-black));font-weight:var(--neeto-ui-font-medium);margin-bottom:0!important;padding-bottom:8px!important;padding-top:8px!important}.neeto-molecules-sidebar__links--focus-mode>.neeto-molecules-sidebar__sublink-wrapper>.neeto-molecules-sidebar__sublink-wrapper>.neeto-molecules-sidebar__sublink-wrapper .neeto-molecules-sidebar__sublink{--neeto-ui-text-body2:13px;padding-left:40px!important}.neeto-molecules-sidebar__links--focus-mode .neeto-molecules-sidebar__sublink{margin-bottom:4px;padding:4px 4px 4px 30px!important;position:relative}.neeto-molecules-sidebar__links--focus-mode .neeto-molecules-sidebar__sublink:hover{background-color:rgb(var(--neeto-ui-gray-100))}.neeto-molecules-sidebar__links--focus-mode .neeto-molecules-sidebar__sublink.active{background-color:rgb(var(--neeto-ui-primary-100))!important}.neeto-molecules-sidebar__links--focus-mode .neeto-molecules-sidebar__sublink.active:before{background-color:rgb(var(--neeto-ui-primary-500));border-radius:var(--neeto-ui-rounded);content:\"\";height:100%;left:-1px;position:absolute;top:0;width:3px}";
 n(css,{});
 
 var AppSwitcherButton = function AppSwitcherButton() {
@@ -275,63 +317,39 @@ 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 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 isSubRouteActive = function isSubRouteActive(_ref) {
+  var subRoute = _ref.subRoute,
+    location = _ref.location,
+    isSettingsItems = _ref.isSettingsItems;
+  var currentBrowserUrl = new URL(location.pathname + location.search + location.hash, 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());
-  return ramda.all(function (key) {
+  var targetUrlWithSearch = targetUrl.pathname + targetUrl.search + targetUrl.hash;
+  var currentUrlWithSearch = currentBrowserUrl.pathname + currentBrowserUrl.search + currentBrowserUrl.hash;
+  var isLinkActive = ramda.all(function (key) {
     return currentBrowserUrl.searchParams.get(key) === targetSearchParams.get(key);
-  }, targetSearchKeys);
+  }, targetSearchKeys) && ramda.equals(currentBrowserUrl.hash, targetUrl.hash);
+  if (isSettingsItems) {
+    return isLinkActive && ramda.equals(currentUrlWithSearch, targetUrlWithSearch);
+  }
+  return isLinkActive;
 };
 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 filterByPermissions = ramda.curry(function (_ref2) {
+  var permissions = _ref2.permissions;
+  if (permissions) {
+    return ramda.is(Array, permissions) ? permissions.some(ramda.includes(ramda.__, globalProps.permissions)) : globalProps.permissions.includes(permissions);
+  }
+  return true;
+});
 
 var getProfileInfo = function getProfileInfo(isOwner, profileInfoOverrides) {
   var _globalProps$user, _globalProps$user2, _globalProps$user3, _globalProps$user4, _globalProps$user5;
@@ -490,9 +508,9 @@ function _objectWithoutProperties(source, excluded) {
   return target;
 }
 
-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(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$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(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 LinkSection = function LinkSection(_ref) {
   var links = _ref.links;
   return /*#__PURE__*/React__default["default"].createElement("ul", {
@@ -502,7 +520,7 @@ var LinkSection = function LinkSection(_ref) {
       label = _ref2.label,
       _ref2$icon = _ref2.icon,
       icon = _ref2$icon === void 0 ? null : _ref2$icon,
-      otherProps = _objectWithoutProperties(_ref2, _excluded$2);
+      otherProps = _objectWithoutProperties(_ref2, _excluded$4);
     return /*#__PURE__*/React__default["default"].createElement("li", {
       className: "neeto-molecules-profile-sublist__item",
       key: idx
@@ -512,7 +530,7 @@ var LinkSection = function LinkSection(_ref) {
       iconPosition: "left",
       iconSize: 18,
       style: "text"
-    }, _objectSpread$2({
+    }, _objectSpread$3({
       icon: icon,
       label: label,
       onClick: onClick
@@ -615,9 +633,9 @@ var HelpSection = function HelpSection(_ref, ref) {
 };
 var HelpSection$1 = /*#__PURE__*/React.forwardRef(HelpSection);
 
-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(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 _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(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 HelpSectionMenu = function HelpSectionMenu(_ref) {
   var helpLinkOverrides = _ref.helpLinkOverrides,
     changesCount = _ref.changesCount;
@@ -628,7 +646,7 @@ var HelpSectionMenu = function HelpSectionMenu(_ref) {
     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;
   }).map(function (key) {
-    return _objectSpread$1(_objectSpread$1(_objectSpread$1(_objectSpread$1({}, DEFAULT_HELP_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
+    return _objectSpread$2(_objectSpread$2(_objectSpread$2(_objectSpread$2({}, DEFAULT_HELP_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
       onClick: function onClick() {
         return setIsOpen(true);
       }
@@ -643,7 +661,7 @@ var HelpSectionMenu = function HelpSectionMenu(_ref) {
     className: "neeto-molecules-help-sublist"
   }, helpLinks.map(function (_ref3, idx) {
     var label = _ref3.label,
-      buttonProps = _objectWithoutProperties(_ref3, _excluded$1);
+      buttonProps = _objectWithoutProperties(_ref3, _excluded$3);
     return /*#__PURE__*/React__default["default"].createElement("li", {
       className: "neeto-molecules-help-sublist__item",
       key: idx
@@ -735,26 +753,74 @@ var Header = function Header(_ref) {
 };
 var Header$1 = /*#__PURE__*/React__default["default"].memo(Header);
 
-var _excluded = ["label", "to", "icon", "items"],
-  _excluded2 = ["label", "to", "count", "data-cy"];
-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(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 _excluded$2 = ["label", "to", "count", "dataCy", "items"];
+var Items = function Items(_ref) {
+  var items = _ref.items,
+    _ref$level = _ref.level,
+    level = _ref$level === void 0 ? 0 : _ref$level,
+    _ref$isSettingsItems = _ref.isSettingsItems,
+    isSettingsItems = _ref$isSettingsItems === void 0 ? false : _ref$isSettingsItems;
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "neeto-molecules-sidebar__sublink-wrapper ml-".concat(level * 2),
+    "data-cy": "sidebar-sub-link-wrapper"
+  }, items.filter(filterByPermissions).map(function (_ref2, index) {
+    var label = _ref2.label,
+      to = _ref2.to,
+      count = _ref2.count,
+      dataCy = _ref2.dataCy,
+      subItems = _ref2.items,
+      otherProps = _objectWithoutProperties(_ref2, _excluded$2);
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
+      key: index
+    }, /*#__PURE__*/React__default["default"].createElement(reactRouterDom.NavLink, _extends({
+      to: to,
+      activeClassName: "active",
+      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-select-none neeto-molecules-sidebar__sublink",
+      "data-cy": "".concat(dataCy, "-sub-link"),
+      key: index,
+      isActive: function isActive() {
+        return isSubRouteActive({
+          subRoute: to,
+          location: location,
+          isSettingsItems: isSettingsItems
+        });
+      }
+    }, ramda.omit(NAVLINK_KEYS_TO_OMIT, otherProps)), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+      className: "neeto-molecules-sidebar__link-sub-label neeto-ui-flex-grow",
+      component: "span",
+      "data-cy": "".concat(dataCy, "-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(dataCy, "-sub-link-count"),
+      style: "body2"
+    }, count > 999 ? "999+" : count)), neetoCist.isPresent(subItems) && /*#__PURE__*/React__default["default"].createElement(Items, {
+      isSettingsItems: isSettingsItems,
+      items: subItems,
+      level: ramda.inc(level)
+    }));
+  }));
+};
+
+var _excluded$1 = ["label", "to", "icon", "items"];
+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(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 Links = function Links(_ref) {
-  var navLinks = _ref.navLinks;
-  var location = reactRouterDom.useLocation();
+  var navLinks = _ref.navLinks,
+    setSelectedNavLink = _ref.setSelectedNavLink;
   var _useState = React.useState(true),
     _useState2 = _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 location = reactRouterDom.useLocation();
+  var handleNavLinkClick = function handleNavLinkClick(_ref2) {
+    var event = _ref2.event,
+      isActive = _ref2.isActive,
+      items = _ref2.items,
+      navLink = _ref2.navLink;
     if (neetoCist.isNotPresent(items)) return;
+    ramda.equals(navLink.label, SETTINGS) && setSelectedNavLink(navLink);
     if (isActive()) {
       setIsActiveLinkExpanded(ramda.not);
       event.preventDefault();
@@ -764,12 +830,12 @@ 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,
-      otherProps = _objectWithoutProperties(_ref3, _excluded);
+  }, navLinks.filter(filterByPermissions).map(function (navLink, index) {
+    var label = navLink.label,
+      to = navLink.to,
+      icon = navLink.icon,
+      items = navLink.items,
+      otherProps = _objectWithoutProperties(navLink, _excluded$1);
     var IconSVG = icon;
     var url = new URL(to, window.location.href);
     var isActive = function isActive() {
@@ -777,14 +843,19 @@ var Links = function Links(_ref) {
     };
     var isMenuExpanded = isActive() && isActiveLinkExpanded;
     return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
-      key: mainIndex
+      key: index
     }, /*#__PURE__*/React__default["default"].createElement(reactRouterDom.NavLink, _extends({
       activeClassName: "active",
       className: "neeto-ui-flex neeto-ui-items-center neeto-ui-no-underline neeto-ui-select-none neeto-molecules-sidebar__link",
       onClick: function onClick(event) {
-        return handleNavLinkClick(event, isActive, items);
+        return handleNavLinkClick({
+          event: event,
+          isActive: isActive,
+          items: items,
+          navLink: navLink
+        });
       }
-    }, _objectSpread({
+    }, _objectSpread$1({
       isActive: isActive,
       to: to
     }, otherProps)), icon && /*#__PURE__*/React__default["default"].createElement("span", {
@@ -795,42 +866,70 @@ var Links = function Links(_ref) {
       component: "span",
       style: "body2",
       weight: "normal"
-    }, label), items && /*#__PURE__*/React__default["default"].createElement("span", {
+    }, label), items && neetoCist.notEquals(label, SETTINGS) && /*#__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 (_ref4, subIndex) {
-      var subLabel = _ref4.label,
-        subRoute = _ref4.to,
-        count = _ref4.count,
-        dataCy = _ref4["data-cy"],
-        otherProps = _objectWithoutProperties(_ref4, _excluded2);
-      return /*#__PURE__*/React__default["default"].createElement(reactRouterDom.NavLink, _extends({
-        activeClassName: "active",
-        className: "neeto-molecules-sidebar__sublink neeto-ui-flex neeto-ui-items-center neeto-ui-select-none",
-        "data-cy": "".concat(dataCy, "-sub-link"),
-        isActive: function isActive() {
-          return isSubRouteActive(subRoute, location);
-        },
-        key: subIndex,
-        to: subRoute
-      }, otherProps), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-        className: "neeto-molecules-sidebar__link-sub-label neeto-ui-flex-grow",
-        component: "span",
-        "data-cy": "".concat(dataCy, "-sub-link-label"),
-        style: "body2"
-      }, subLabel), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-        className: "neeto-molecules-sidebar__link-sub-count neeto-ui-flex-shrink-0",
-        component: "span",
-        "data-cy": "".concat(dataCy, "-sub-link-count"),
-        style: "body2"
-      }, count > 999 ? "999+" : count));
-    })));
+    }))), items && neetoCist.notEquals(label, SETTINGS) && isMenuExpanded && /*#__PURE__*/React__default["default"].createElement(Items, {
+      items: items
+    }));
+  }));
+};
+
+var _excluded = ["label", "to", "items"];
+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(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 SelectedLink = function SelectedLink(_ref) {
+  var navLink = _ref.navLink,
+    _ref$setSelectedNavLi = _ref.setSelectedNavLink,
+    setSelectedNavLink = _ref$setSelectedNavLi === void 0 ? neetoCist.noop : _ref$setSelectedNavLi,
+    _ref$isConfigurePage = _ref.isConfigurePage,
+    isConfigurePage = _ref$isConfigurePage === void 0 ? false : _ref$isConfigurePage;
+  var location = reactRouterDom.useLocation();
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var label = navLink.label,
+    to = navLink.to,
+    items = navLink.items,
+    otherProps = _objectWithoutProperties(navLink, _excluded);
+  var HeaderComponent = neetoCist.isPresent(to) ? reactRouterDom.NavLink : "div";
+  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 handleGoBack = function handleGoBack(event) {
+    event.preventDefault();
+    setSelectedNavLink({});
+  };
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "neeto-molecules-sidebar__links neeto-molecules-sidebar__links--focus-mode neeto-molecules-sidebar__no-shrinkable"
+  }, /*#__PURE__*/React__default["default"].createElement(HeaderComponent, _extends({
+    activeClassName: "active",
+    className: classnames__default["default"]("neeto-ui-flex neeto-ui-items-center neeto-ui-no-underline neeto-ui-select-none neeto-molecules-sidebar__link", {
+      active: isConfigurePage
+    })
+  }, _objectSpread({
+    isActive: isActive,
+    to: to
+  }, otherProps)), ramda.not(isConfigurePage) && /*#__PURE__*/React__default["default"].createElement(neetoui.Tooltip, {
+    content: t("neetoMolecules.sidebar.goBack"),
+    position: "top"
+  }, /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "neeto-molecules-sidebar__link-icon",
+    "data-testid": "".concat(label, "-go-back-button"),
+    onClick: handleGoBack
+  }, /*#__PURE__*/React__default["default"].createElement(neetoIcons.Left, null))), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+    component: "span",
+    style: "body2",
+    weight: "normal",
+    className: classnames__default["default"]("neeto-molecules-sidebar__link-label", {
+      "ml-7": isConfigurePage
+    })
+  }, label)), items && /*#__PURE__*/React__default["default"].createElement(Items, {
+    items: items,
+    isSettingsItems: ramda.not(isConfigurePage)
   }));
 };
 
@@ -849,10 +948,14 @@ var Sidebar = function Sidebar(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     isAppSwitcherOpen = _useState2[0],
     setIsAppSwitcherOpen = _useState2[1];
-  var _useState3 = React.useState(false),
+  var _useState3 = React.useState({}),
     _useState4 = _slicedToArray(_useState3, 2),
-    isSidebarPaneOpen = _useState4[0],
-    setIsSidebarPaneOpen = _useState4[1];
+    selectedNavLink = _useState4[0],
+    setSelectedNavLink = _useState4[1];
+  var _useState5 = React.useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isSidebarPaneOpen = _useState6[0],
+    setIsSidebarPaneOpen = _useState6[1];
   var _useLocalStorage = reactUtils.useLocalStorage(getSidebarStateLocalStorageKey(), false),
     _useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
     isSidebarCollapsed = _useLocalStorage2[0],
@@ -880,6 +983,17 @@ var Sidebar = function Sidebar(_ref) {
     };
   }, []);
   var productName = initializers.globalProps.appName.substr(5).toLowerCase();
+  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) && ramda.equals(currentLink.label, SETTINGS)) {
+      setSelectedNavLink(currentLink);
+    }
+  }, []);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-testid": "sidebar-container",
     className: classnames__default["default"]("neeto-molecules-sidebar__wrapper", {
@@ -891,14 +1005,20 @@ var Sidebar = function Sidebar(_ref) {
       setIsSidebarPaneOpen(false);
     }
   }), /*#__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, {
-    navLinks: navLinks
-  }), /*#__PURE__*/React__default["default"].createElement(Footer, {
+  }), neetoCist.isPresent(selectedNavLink) ? /*#__PURE__*/React__default["default"].createElement(SelectedLink, {
+    setSelectedNavLink: setSelectedNavLink,
+    navLink: selectedNavLink
+  }) : /*#__PURE__*/React__default["default"].createElement(Links, {
+    navLinks: navLinks,
+    setSelectedNavLink: setSelectedNavLink
+  }), neetoCist.isNotPresent(selectedNavLink) && /*#__PURE__*/React__default["default"].createElement(Footer, {
     extraTopLinks: extraTopLinks,
     helpLinkOverrides: helpLinkOverrides,
     profileInfoOverrides: profileInfoOverrides,