@bigbinary/neeto-molecules 1.12.0 → 1.12.2

package/dist/cjs/FloatingActionMenu.js

@@ -12,11 +12,13 @@ var useFetchNeetoApps = require('@bigbinary/neeto-commons-frontend/react-utils/u
 var neetoTeamMembersFrontend = require('@bigbinary/neeto-team-members-frontend');
 var neetoui = require('@bigbinary/neetoui');
 var KeyboardShortcuts = require('./KeyboardShortcuts.js');
-var neetoIcons = require('@bigbinary/neeto-icons');
-var reactI18next = require('react-i18next');
+var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
 var injectCss = require('./inject-css-80a5faa3.js');
 var classnames = require('classnames');
+var neetoIcons = require('@bigbinary/neeto-icons');
+var reactI18next = require('react-i18next');
 var AppIcons = require('@bigbinary/neeto-icons/app-icons');
+var useBreakpoints = require('@bigbinary/neeto-commons-frontend/react-utils/useBreakpoints');
 var i18next = require('i18next');
 var ramda = require('ramda');
 var axios = require('@bigbinary/neeto-commons-frontend/utils/axios');
@@ -52,8 +54,9 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var useFetchNeetoApps__default = /*#__PURE__*/_interopDefaultLegacy(useFetchNeetoApps);
 var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
 var AppIcons__namespace = /*#__PURE__*/_interopNamespace(AppIcons);
+var useBreakpoints__default = /*#__PURE__*/_interopDefaultLegacy(useBreakpoints);
 
-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}";
+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;gap:24px}}@media only screen and (max-width:640px){.neeto-molecules-app-switcher__header h1{font-size:24px}}@media only screen and (max-width:768px){.neeto-molecules-app-switcher_modal-container .neeto-molecules-app-switcher__header-mobile{align-items:flex-start;margin-bottom: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}.neeto-molecules-app-switcher_modal{z-index:100000}.neeto-molecules-app-switcher_modal .neeto-ui-modal__wrapper--fullscreen{display:flex;flex-direction:column;height:100dvh!important;width:100vw!important}.neeto-molecules-app-switcher_modal .neeto-ui-modal__wrapper--fullscreen .neeto-ui-modal__header{flex-shrink:0}.neeto-molecules-app-switcher_modal .neeto-ui-modal__wrapper--fullscreen .neeto-ui-modal__body{flex-grow:1;min-height:0;overflow-y:auto}";
 injectCss.n(css$1,{});
 
 var AppLink = function AppLink(_ref) {
@@ -95,7 +98,8 @@ var AppLink = function AppLink(_ref) {
 };
 var AppLink$1 = /*#__PURE__*/React__default["default"].memo(AppLink);
 
-var Body = function Body() {
+var Body = function Body(_ref) {
+  var isMobile = _ref.isMobile;
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
   var _useState = React.useState(""),
@@ -107,17 +111,19 @@ var Body = function Body() {
     }),
     data = _useFetchNeetoApps.data;
   var substring = searchTerm.replace(/ /g, "").toLowerCase();
-  var filteredApps = data === null || data === void 0 ? void 0 : data.neetoApps.filter(function (_ref) {
-    var name = _ref.name;
+  var filteredApps = data === null || data === void 0 ? void 0 : data.neetoApps.filter(function (_ref2) {
+    var name = _ref2.name;
     return name.toLowerCase().includes(substring);
   });
   var handleSearch = function handleSearch(e) {
     return setSearchTerm(e.target.value);
   };
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "neeto-molecules-app-switcher__header",
-    "data-cy": "app-switcher-body-wrapper"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+    "data-cy": "app-switcher-body-wrapper",
+    className: classnames__default["default"]("neeto-molecules-app-switcher__header", {
+      "neeto-molecules-app-switcher__header-mobile": isMobile
+    })
+  }, !isMobile && /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
     style: "h1"
   }, t("neetoMolecules.appSwitcher.chooseNeetoProduct")), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-molecules-app-switcher__search-wrapper"
@@ -130,7 +136,7 @@ var Body = function Body() {
     value: searchTerm,
     onChange: handleSearch
   }))), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "neeto-molecules-app-switcher__body"
+    className: classnames__default["default"]("neeto-molecules-app-switcher__body", defineProperty._defineProperty({}, "neeto-molecules-app-switcher__body-mobile", isMobile))
   }, (filteredApps === null || filteredApps === void 0 ? void 0 : filteredApps.length) > 0 ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-molecules-app-switcher__grid"
   }, filteredApps.map(function (app) {
@@ -143,83 +149,155 @@ var Body = function Body() {
   }, t("neetoMolecules.appSwitcher.noApps"))));
 };
 
-var AppSwitcher = function AppSwitcher() {
+var AppSwitcher = function AppSwitcher(_ref) {
+  var _ref$isMobile = _ref.isMobile,
+    isMobile = _ref$isMobile === void 0 ? false : _ref$isMobile;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-molecules-app-switcher__wrapper",
     "data-cy": "switcher-wrapper",
     "data-testid": "switcher-wrapper",
     key: "switcher-wrapper"
-  }, /*#__PURE__*/React__default["default"].createElement(Body, null));
+  }, /*#__PURE__*/React__default["default"].createElement(Body, {
+    isMobile: isMobile
+  }));
 };
 
-var _excluded$2 = ["showLoading"];
-var ProductSwitcherIcon = function ProductSwitcherIcon(_ref) {
-  var showLoading = _ref.showLoading,
-    otherProps = objectWithoutProperties._objectWithoutProperties(_ref, _excluded$2);
-  return showLoading ? /*#__PURE__*/React__default["default"].createElement("span", {
-    "data-testid": "app-switcher-button-loader"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Spinner, _extends._extends({
-    size: 18
-  }, otherProps))) : /*#__PURE__*/React__default["default"].createElement(neetoIcons.AppSwitcher, _extends._extends({
-    size: 18
-  }, otherProps));
-};
-var AppSwitcherMenu = function AppSwitcherMenu() {
+var AppSwitcherModal = reactUtils.withT(function (_ref) {
+  var t = _ref.t,
+    isOpen = _ref.isOpen,
+    onClose = _ref.onClose;
+  return /*#__PURE__*/React__default["default"].createElement(neetoui.Modal, {
+    isOpen: isOpen,
+    onClose: onClose,
+    backdropClassName: "neeto-molecules-app-switcher_modal",
+    size: "fullScreen"
+  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Modal.Header, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+    className: "pr-4",
+    style: "h2"
+  }, t("neetoMolecules.appSwitcher.chooseNeetoProduct"))), /*#__PURE__*/React__default["default"].createElement(neetoui.Modal.Body, null, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "neeto-molecules-app-switcher_modal-container",
+    "data-testid": "app-switcher-modal"
+  }, /*#__PURE__*/React__default["default"].createElement(AppSwitcher, {
+    isMobile: true
+  }))));
+});
+
+function _objectDestructuringEmpty(obj) {
+  if (obj == null) throw new TypeError("Cannot destructure " + obj);
+}
+
+var MenuItemButton = function MenuItemButton(_ref) {
+  var otherProps = _extends._extends({}, (_objectDestructuringEmpty(_ref), _ref));
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
-  var Menu = neetoui.Dropdown.Menu,
-    MenuItem = neetoui.Dropdown.MenuItem;
-  var _useState = React.useState(false),
-    _useState2 = slicedToArray._slicedToArray(_useState, 2),
-    hasHovered = _useState2[0],
-    setHasHovered = _useState2[1];
-  var _useFetchNeetoApps = useFetchNeetoApps__default["default"]({
-      enabled: false
-    }),
-    data = _useFetchNeetoApps.data,
+  var MenuItem = neetoui.Dropdown.MenuItem;
+  var _useFetchNeetoApps = useFetchNeetoApps__default["default"](),
     refetchNeetoApps = _useFetchNeetoApps.refetch,
     isStale = _useFetchNeetoApps.isStale;
+  return /*#__PURE__*/React__default["default"].createElement(MenuItem.Button, _extends._extends({
+    className: "neeto-molecules-menu-sublist__item-btn",
+    "data-cy": "app-switcher-button",
+    "data-testid": "app-switcher-button",
+    label: t("neetoMolecules.sidebar.productSwitcher"),
+    style: "text",
+    suffix: /*#__PURE__*/React__default["default"].createElement(neetoIcons.Right, {
+      size: 18
+    }),
+    onMouseEnter: function onMouseEnter() {
+      if (!isStale) return;
+      refetchNeetoApps();
+    }
+  }, otherProps), t("neetoMolecules.sidebar.productSwitcher"));
+};
+
+var AppSwitcherDropdown = function AppSwitcherDropdown() {
+  var Menu = neetoui.Dropdown.Menu,
+    MenuItem = neetoui.Dropdown.MenuItem;
+  var _useBreakpoints = useBreakpoints__default["default"](),
+    isSize = _useBreakpoints.isSize;
+  var isMobile = isSize("mobile");
+  var _useFetchNeetoApps = useFetchNeetoApps__default["default"](),
+    data = _useFetchNeetoApps.data;
   return /*#__PURE__*/React__default["default"].createElement(neetoui.Dropdown, {
     className: "neeto-molecules-app-switcher-menu-popup-wrapper",
     closeOnSelect: false,
+    customTarget: /*#__PURE__*/React__default["default"].createElement(MenuItemButton, null),
+    delay: 500,
     disabled: !data,
     interactiveDebounce: 30,
     isOpen: !data ? false : undefined,
     offset: [0, 5],
     position: "right",
-    trigger: "hover",
+    trigger: isMobile ? "click" : "hover",
     zIndex: 99999,
-    customTarget: /*#__PURE__*/React__default["default"].createElement(MenuItem.Button, {
-      className: "neeto-molecules-menu-sublist__item-btn",
-      "data-cy": "app-switcher-button",
-      "data-testid": "app-switcher-button",
-      label: t("neetoMolecules.sidebar.productSwitcher"),
-      style: "text",
-      suffix: /*#__PURE__*/React__default["default"].createElement(neetoIcons.Right, {
-        size: 18
-      }),
-      prefix: /*#__PURE__*/React__default["default"].createElement(ProductSwitcherIcon, {
-        showLoading: !data && hasHovered,
-        size: 18
-      }),
-      onMouseEnter: function onMouseEnter() {
-        if (!isStale) return;
-        refetchNeetoApps();
-        setHasHovered(true);
-      }
-    }, t("neetoMolecules.sidebar.productSwitcher")),
     dropdownProps: {
       classNames: "neeto-molecules-app-switcher-menu-popup__dropdown"
     }
   }, /*#__PURE__*/React__default["default"].createElement(Menu, null, /*#__PURE__*/React__default["default"].createElement(MenuItem, null, /*#__PURE__*/React__default["default"].createElement(AppSwitcher, null))));
 };
 
+var AppSwitcherMenu = function AppSwitcherMenu(_ref) {
+  var toggleModal = _ref.toggleModal;
+  var _useBreakpoints = useBreakpoints__default["default"](),
+    isSize = _useBreakpoints.isSize;
+  var isMobile = isSize("mobile");
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isMobile ? /*#__PURE__*/React__default["default"].createElement(MenuItemButton, {
+    "data-cy": "app-switcher-button",
+    "data-testid": "app-switcher-button",
+    onClick: function onClick() {
+      return toggleModal(true);
+    }
+  }) : /*#__PURE__*/React__default["default"].createElement(AppSwitcherDropdown, null));
+};
+
+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_ORGANIZATION_URL = "/auth/organization/edit";
+var CHANGELOG_WIDGET_TRIGGER_ID = "neetochangelog-trigger";
+var MENU_ITEMS_WITH_ICONS = ["Chat with support", "Help articles"];
+var DEFAULT_HELP_LINK_PROPS = {
+  helpCenterProps: {
+    label: i18next.t("neetoMolecules.sidebar.helpLinks.helpArticles"),
+    icon: neetoIcons.Book,
+    "data-cy": "help-link-help-center-button",
+    "data-btn-weight": "bold",
+    href: "https://help.".concat(ramda.toLower(globalProps.appName), ".com/"),
+    target: "_blank"
+  },
+  liveChatProps: {
+    label: i18next.t("neetoMolecules.sidebar.helpLinks.liveChat"),
+    icon: neetoIcons.Help,
+    "data-cy": "help-link-live-chat-button",
+    "data-btn-weight": "bold",
+    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();
+    }
+  }
+};
+var DEFAULT_MENU_LINK_PROPS = {
+  changelogProps: {
+    id: CHANGELOG_WIDGET_TRIGGER_ID,
+    label: i18next.t("neetoMolecules.sidebar.helpLinks.whatsNew"),
+    "data-cy": "help-link-changelog-button",
+    isVisible: shouldShowWhatsNew
+  },
+  keyboardShortcutProps: {
+    label: i18next.t("neetoMolecules.sidebar.helpLinks.keyboardShortcuts"),
+    "data-cy": "help-link-keyboard-shortcut-button"
+  }
+};
+
 var _excluded$1 = ["label", "icon", "changesCount"];
 var LinkSection = function LinkSection(_ref) {
   var links = _ref.links;
   var MenuItem = neetoui.Dropdown.MenuItem;
   if (neetoCist.isNotPresent(links)) return null;
-  return links.map(function (_ref2, idx) {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, links.map(function (_ref2, idx) {
     var label = _ref2.label,
       Icon = _ref2.icon,
       changesCount = _ref2.changesCount,
@@ -228,16 +306,16 @@ var LinkSection = function LinkSection(_ref) {
       className: "neeto-molecules-menu-sublist__item-btn",
       "data-cy": "floating-action-menu-link-section",
       key: idx,
-      prefix: /*#__PURE__*/React__default["default"].createElement(Icon, {
+      style: "text",
+      prefix: MENU_ITEMS_WITH_ICONS.includes(label) ? /*#__PURE__*/React__default["default"].createElement(Icon, {
         size: 18
-      }),
-      style: "text"
+      }) : undefined
     }, otherProps), label, neetoCist.isPresent(changesCount) && /*#__PURE__*/React__default["default"].createElement("span", {
       className: "neeto-molecules-menu-list__item-btn-count",
       "data-cy": "help-section-menu-changes-count",
       "data-testid": "help-section-menu-changes-count"
     }, changesCount));
-  });
+  }));
 };
 
 var ProfileHeader = function ProfileHeader(_ref) {
@@ -275,9 +353,11 @@ var ProfileMenu = function ProfileMenu(_ref) {
   var profileInfo = _ref.profileInfo,
     showAppSwitcher = _ref.showAppSwitcher,
     helpLinks = _ref.helpLinks,
+    defaultLinks = _ref.defaultLinks,
     topLinks = _ref.topLinks,
     bottomLinks = _ref.bottomLinks,
-    customContent = _ref.customContent;
+    customContent = _ref.customContent,
+    toggleModal = _ref.toggleModal;
   var Menu = neetoui.Dropdown.Menu,
     MenuItem = neetoui.Dropdown.MenuItem,
     Divider = neetoui.Dropdown.Divider;
@@ -289,56 +369,21 @@ var ProfileMenu = function ProfileMenu(_ref) {
     "data-testid": "profile-popup"
   }, /*#__PURE__*/React__default["default"].createElement(ProfileHeader, {
     profileInfo: profileInfo
-  })), showAppSwitcher && /*#__PURE__*/React__default["default"].createElement(AppSwitcherMenu, null), /*#__PURE__*/React__default["default"].createElement(Divider, null), /*#__PURE__*/React__default["default"].createElement(LinkSection, {
+  })), /*#__PURE__*/React__default["default"].createElement(Divider, null), /*#__PURE__*/React__default["default"].createElement(LinkSection, {
     links: topLinks
+  }), /*#__PURE__*/React__default["default"].createElement(Divider, null), showAppSwitcher && /*#__PURE__*/React__default["default"].createElement(AppSwitcherMenu, {
+    toggleModal: toggleModal
   }), neetoCist.isPresent(customContent) && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Divider, null), /*#__PURE__*/React__default["default"].createElement(MenuItem, {
     className: "neeto-molecules-floating-action-button__profile-wrapper-custom-content"
   }, customContent)), /*#__PURE__*/React__default["default"].createElement(Divider, null), /*#__PURE__*/React__default["default"].createElement(LinkSection, {
+    links: defaultLinks
+  }), /*#__PURE__*/React__default["default"].createElement(Divider, null), /*#__PURE__*/React__default["default"].createElement(LinkSection, {
     links: helpLinks
   }), /*#__PURE__*/React__default["default"].createElement(Divider, null), /*#__PURE__*/React__default["default"].createElement(LinkSection, {
     links: bottomLinks
   }));
 };
 
-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_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 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);
@@ -347,7 +392,6 @@ var getSidebarStateLocalStorageKey = function getSidebarStateLocalStorageKey() {
 var getDefaultTopLinks = function getDefaultTopLinks(isOwner, setIsProfilePaneOpen) {
   return [{
     label: i18next.t("neetoMolecules.sidebar.myProfile"),
-    icon: neetoIcons.User,
     onClick: function onClick() {
       return setIsProfilePaneOpen(true);
     },
@@ -355,7 +399,6 @@ var getDefaultTopLinks = function getDefaultTopLinks(isOwner, setIsProfilePaneOp
     "data-testid": "my-profile-button"
   }, isOwner && {
     label: i18next.t("neetoMolecules.sidebar.myOrganization"),
-    icon: neetoIcons.Settings,
     onClick: function onClick() {
       return window.open(MY_ORGANIZATION_URL, "_blank");
     },
@@ -364,7 +407,6 @@ var getDefaultTopLinks = function getDefaultTopLinks(isOwner, setIsProfilePaneOp
 };
 var getDefaultBottomLinks = function getDefaultBottomLinks() {
   return [{
-    icon: neetoIcons.LeftArrow,
     label: i18next.t("neetoMolecules.sidebar.logout"),
     onClick: function onClick() {
       axios.resetAuthTokens();
@@ -393,23 +435,25 @@ var ProfileButton = function ProfileButton(_ref) {
     bottomLinks = _ref.bottomLinks,
     topLinks = _ref.topLinks,
     customContent = _ref.customContent;
+  var _useState = React.useState(false),
+    _useState2 = slicedToArray._slicedToArray(_useState, 2),
+    isModalOpen = _useState2[0],
+    setIsModalOpen = _useState2[1];
   var _KeyboardShortcuts$us = KeyboardShortcuts.usePaneState(),
     _KeyboardShortcuts$us2 = slicedToArray._slicedToArray(_KeyboardShortcuts$us, 2),
     setIsOpen = _KeyboardShortcuts$us2[1];
   var _Profile$usePaneState = neetoTeamMembersFrontend.Profile.usePaneState(),
     _Profile$usePaneState2 = slicedToArray._slicedToArray(_Profile$usePaneState, 2),
     setIsProfilePaneOpen = _Profile$usePaneState2[1];
-  var _useFetchNeetoApps = useFetchNeetoApps__default["default"]({
-      enabled: false
-    }),
+  var _useFetchNeetoApps = useFetchNeetoApps__default["default"](),
     data = _useFetchNeetoApps.data;
   var profileInfo = getProfileInfo(profileInfoOverrides);
   var newTopLinks = globalProps.appName !== "neetoAuth" ? [].concat(toConsumableArray._toConsumableArray(getDefaultTopLinks(data === null || data === void 0 ? void 0 : data.isOwner, setIsProfilePaneOpen)), toConsumableArray._toConsumableArray(topLinks)) : topLinks;
   var newBottomLinks = [].concat(toConsumableArray._toConsumableArray(getDefaultBottomLinks()), toConsumableArray._toConsumableArray(bottomLinks));
-  var _useState = React.useState(null),
-    _useState2 = slicedToArray._slicedToArray(_useState, 2),
-    changesCount = _useState2[0],
-    setChangesCount = _useState2[1];
+  var _useState3 = React.useState(null),
+    _useState4 = slicedToArray._slicedToArray(_useState3, 2),
+    changesCount = _useState4[0],
+    setChangesCount = _useState4[1];
   React.useEffect(function () {
     var Nv = {
       onReceiveData: function onReceiveData(data) {
@@ -422,11 +466,17 @@ var ProfileButton = function ProfileButton(_ref) {
     };
     window.Nv = window.Nv ? Object.assign(window.Nv, Nv) : Nv;
   }, []);
-  var helpLinks = Object.keys(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;
+  var helpLinks = Object.keys(DEFAULT_HELP_LINK_PROPS).map(function (key) {
+    return _objectSpread({}, DEFAULT_HELP_LINK_PROPS[key]);
+  }).filter(function (_ref2) {
+    var hide = _ref2.hide;
+    return !hide;
+  });
+  var defaultLinks = Object.keys(DEFAULT_MENU_LINK_PROPS).filter(function (key) {
+    var _DEFAULT_MENU_LINK_PR, _DEFAULT_MENU_LINK_PR2, _DEFAULT_MENU_LINK_PR3;
+    return (_DEFAULT_MENU_LINK_PR = (_DEFAULT_MENU_LINK_PR2 = (_DEFAULT_MENU_LINK_PR3 = DEFAULT_MENU_LINK_PROPS[key]).isVisible) === null || _DEFAULT_MENU_LINK_PR2 === void 0 ? void 0 : _DEFAULT_MENU_LINK_PR2.call(_DEFAULT_MENU_LINK_PR3)) !== null && _DEFAULT_MENU_LINK_PR !== void 0 ? _DEFAULT_MENU_LINK_PR : true;
   }).map(function (key) {
-    return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, DEFAULT_HELP_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
+    return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, DEFAULT_MENU_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
       onClick: function onClick() {
         return setIsOpen(function (prev) {
           return !prev;
@@ -435,8 +485,8 @@ var ProfileButton = function ProfileButton(_ref) {
     }), key === "changelogProps" && changesCount && {
       changesCount: changesCount
     });
-  }).filter(function (_ref2) {
-    var hide = _ref2.hide;
+  }).filter(function (_ref3) {
+    var hide = _ref3.hide;
     return !hide;
   });
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(neetoTeamMembersFrontend.Profile.Pane, null), /*#__PURE__*/React__default["default"].createElement(neetoui.Dropdown, {
@@ -456,31 +506,41 @@ var ProfileButton = function ProfileButton(_ref) {
     theme: "light",
     trigger: "hover",
     zIndex: 99999,
-    customTarget: /*#__PURE__*/React__default["default"].createElement(neetoui.Avatar, {
+    customTarget: /*#__PURE__*/React__default["default"].createElement("button", {
+      className: "neeto-molecules-floating-action-button",
+      type: "button"
+    }, /*#__PURE__*/React__default["default"].createElement(neetoui.Avatar, {
       className: "neeto-ui-flex-shrink-0 neeto-molecules-floating-action-button__profile-avatar",
       "data-cy": "profile-avatar",
       "data-testid": "profile-avatar",
       size: "medium",
       user: profileInfo
-    }),
+    })),
     dropdownProps: {
       classNames: "neeto-molecules-floating-action-button__dropdown"
     }
   }, /*#__PURE__*/React__default["default"].createElement(ProfileMenu, {
     customContent: customContent,
+    defaultLinks: defaultLinks,
     helpLinks: helpLinks,
     profileInfo: profileInfo,
     showAppSwitcher: showAppSwitcher,
     bottomLinks: newBottomLinks,
+    toggleModal: setIsModalOpen,
     topLinks: newTopLinks
   })), neetoCist.isPresent(changesCount) && /*#__PURE__*/React__default["default"].createElement("span", {
     className: "neeto-molecules-menu__notif-count",
     "data-cy": "help-icon-changes-count",
     "data-testid": "help-icon-changes-count"
-  }, changesCount));
+  }, changesCount), /*#__PURE__*/React__default["default"].createElement(AppSwitcherModal, {
+    isOpen: isModalOpen,
+    onClose: function onClose() {
+      return setIsModalOpen(false);
+    }
+  }));
 };
 
-var css = ":root{--neeto-molecules-floating-menu-z-index:99999}.neeto-molecules-floating-action-menu__container{align-items:center;background-color:rgb(var(--neeto-ui-white));border-bottom-right-radius:30px;border-top-right-radius:30px;bottom:20px;box-shadow:0 1px 1px 0 rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);display:flex;justify-content:center;left:0;padding:6px;position:fixed;z-index:99999;z-index:var(--neeto-molecules-floating-menu-z-index)}.neeto-molecules-floating-action-button__dropdown{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;flex-shrink:0;max-height:none!important;max-width:none;width:220px;z-index:99999;z-index:var(--neeto-molecules-floating-menu-z-index)}.neeto-molecules-floating-action-button__dropdown ul{padding-top:0!important}.neeto-molecules-app-switcher-menu-popup__dropdown{max-height:none!important;max-width:none}.neeto-molecules-menu__notif-count{position:absolute;right:3px;top:3px;z-index:1}.neeto-molecules-menu-list__item-btn-count,.neeto-molecules-menu__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:flex;flex-shrink:0;font-size:var(--neeto-ui-text-xxs);height:15px;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:15px}.neeto-ui-dropdown__popup .neeto-molecules-app-switcher-menu-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-ui-dropdown__popup .neeto-molecules-app-switcher-menu-popup-wrapper .tippy-content{padding:0}.neeto-ui-dropdown__popup .neeto-molecules-app-switcher-menu-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-menu-sublist__item-btn{font-weight:500!important;height:40px}.neeto-molecules-menu-sublist__item-btn.active{background-color:rgb(var(--neeto-ui-gray-800));color:rgb(var(--neeto-ui-white))}.neeto-molecules-menu-sublist__item-btn-icon svg path{vector-effect:non-scaling-stroke}.neeto-molecules-menu-sublist__item-btn span{align-items:center;display:flex;gap:8px}.neeto-molecules-app-switcher-menu-popup-wrapper{height:95vh;overflow-y:auto;width:calc(100vw - 400px)}.neeto-molecules-floating-action-button__profile-wrapper-custom-content:hover{background-color:rgb(var(--neeto-ui-white))!important}";
+var css = ":root{--neeto-molecules-floating-menu-z-index:99999}.neeto-molecules-floating-action-menu__container{background-color:rgb(var(--neeto-ui-white));border-bottom-right-radius:30px;border-top-right-radius:30px;bottom:16px;left:0;position:fixed;z-index:99999;z-index:var(--neeto-molecules-floating-menu-z-index)}.neeto-molecules-floating-action-button{align-items:center;background-color:rgba(var(--neeto-ui-primary-500),.6);border-bottom-right-radius:30px;border-color:rgba(var(--neeto-ui-primary-500),.6);border-top-right-radius:30px;display:flex;justify-content:center;padding:4px}.neeto-molecules-floating-action-button__profile-avatar{border:2px solid #fff;border-radius:100px}.neeto-molecules-floating-action-button__profile-avatar .neeto-ui-avatar{height:100%!important;width:100%!important}.neeto-molecules-floating-action-button__dropdown{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;flex-shrink:0;max-height:none!important;max-width:none;width:256px;z-index:99999;z-index:var(--neeto-molecules-floating-menu-z-index)}.neeto-molecules-floating-action-button__dropdown ul{padding-top:0!important}.neeto-molecules-app-switcher-menu-popup__dropdown{max-height:none!important;max-width:none}.neeto-molecules-menu__notif-count{position:absolute;right:3px;top:3px;z-index:1}.neeto-molecules-menu-list__item-btn-count,.neeto-molecules-menu__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:flex;flex-shrink:0;font-size:var(--neeto-ui-text-xxs);height:15px;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:15px}.neeto-ui-dropdown__popup .neeto-molecules-app-switcher-menu-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-ui-dropdown__popup .neeto-molecules-app-switcher-menu-popup-wrapper .tippy-content{padding:0}.neeto-ui-dropdown__popup .neeto-molecules-app-switcher-menu-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-menu-sublist__item-btn{font-weight:500!important;height:40px}.neeto-molecules-menu-sublist__item-btn[data-btn-weight=bold]{font-weight:700!important}.neeto-molecules-menu-sublist__item-btn.active{background-color:rgb(var(--neeto-ui-gray-800));color:rgb(var(--neeto-ui-white))}.neeto-molecules-menu-sublist__item-btn-icon svg path{vector-effect:non-scaling-stroke}.neeto-molecules-menu-sublist__item-btn span{align-items:center;display:flex;gap:8px}.neeto-molecules-app-switcher-menu-popup-wrapper{height:95vh;overflow-y:auto;width:calc(100vw - 400px)}.neeto-molecules-floating-action-button__profile-wrapper-custom-content:hover{background-color:rgb(var(--neeto-ui-white))!important}";
 injectCss.n(css,{});
 
 var _excluded = ["profileInfoOverrides", "helpLinkOverrides", "topLinks", "bottomLinks", "showAppSwitcher", "customContent"];
@@ -499,7 +559,7 @@ var FloatingActionMenu = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     otherProps = objectWithoutProperties._objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React__default["default"].createElement("div", _extends._extends({
     ref: ref,
-    className: "neeto-molecules-floating-action-menu__container neeto-ui-border-gray-300 border border-l-0",
+    className: "neeto-molecules-floating-action-menu__container",
     "data-cy": "floating-action-menu-container",
     "data-testid": "floating-action-menu-container"
   }, otherProps), /*#__PURE__*/React__default["default"].createElement(ProfileButton, {