@bigbinary/neeto-filters-frontend 2.12.11 → 2.12.13

package/dist/index.js

@@ -1,4 +1,4 @@
-import React, { createElement, isValidElement, cloneElement, createContext, useContext, useState, useRef, useEffect, useMemo } from 'react';
+import React, { createElement, isValidElement, cloneElement, createContext, useContext, useState, useRef, useEffect, useTransition, useMemo } from 'react';
 import classnames from 'classnames';
 import { capitalize as capitalize$1, removeBy, findBy, isNotEmpty, humanize, noop as noop$2, toLabelAndValue, replaceBy, isPresent, existsBy, filterBy } from '@bigbinary/neeto-commons-frontend/pure';
 import { Tooltip, Typography, Dropdown as Dropdown$2, Button, Pane as Pane$1, Alert, Select, DatePicker, TimePicker, Input as Input$1, Accordion, Spinner } from '@bigbinary/neetoui';
@@ -4037,7 +4037,8 @@ var Segment = function Segment(_ref) {
   var entity = _ref.entity,
     filters = _ref.filters,
     columns = _ref.columns,
-    childrenKeys = _ref.childrenKeys;
+    childrenKeys = _ref.childrenKeys,
+    setIsFilterPaneOpen = _ref.setIsFilterPaneOpen;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isSavePaneOpen = _useState2[0],
@@ -4104,7 +4105,8 @@ var Segment = function Segment(_ref) {
     label: t("segments.saveAsSegment"),
     style: "secondary",
     onClick: function onClick() {
-      return setIsSavePaneOpen(true);
+      setIsFilterPaneOpen(false);
+      setIsSavePaneOpen(true);
     }
   }) : /*#__PURE__*/React.createElement(Dropdown$2, {
     buttonStyle: "secondary",
@@ -4113,7 +4115,10 @@ var Segment = function Segment(_ref) {
     isDisabled: equals(filtersPayload, selectedSegment === null || selectedSegment === void 0 ? void 0 : selectedSegment.filters),
     onClick: setIsUpdateAlertOpen
   }, t("segments.saveSegment")), /*#__PURE__*/React.createElement(MenuItem.Button, {
-    onClick: setIsSavePaneOpen
+    onClick: function onClick() {
+      setIsFilterPaneOpen(false);
+      setIsSavePaneOpen(true);
+    }
   }, t("segments.saveAsNewSegment")))), /*#__PURE__*/React.createElement(Pane$1, {
     initialFocusRef: inputRef,
     isOpen: isSavePaneOpen,
@@ -4280,7 +4285,8 @@ var Bar = function Bar(_ref) {
     childrenKeys: childrenKeys,
     columns: columns,
     entity: entity,
-    filters: filters
+    filters: filters,
+    setIsFilterPaneOpen: setIsPaneOpen
   }), !hideClearButton && /*#__PURE__*/React.createElement(Button, {
     "data-cy": "neeto-filters-bar-clear-btn",
     label: t("common.clearFilters"),
@@ -6762,6 +6768,10 @@ var useFilters = function useFilters(_ref) {
     columns = _ref.columns,
     keyword = _ref.keyword,
     onSelectorsChange = _ref.onSelectorsChange;
+  var _useTransition = useTransition(),
+    _useTransition2 = _slicedToArray(_useTransition, 2);
+    _useTransition2[0];
+    var startTransition = _useTransition2[1];
   var initialRender = useRef(true);
   var prevFilters = useRef([]);
   var location = useLocation();
@@ -6783,6 +6793,13 @@ var useFilters = function useFilters(_ref) {
       search: params
     });
   };
+  var handleFiltersChange = function handleFiltersChange(filtersPayload) {
+    startTransition(function () {
+      onFiltersChange(buildFiltersPayload(filtersPayload.filter(function (filter) {
+        return !isNil(filter.node);
+      })));
+    });
+  };
 
   //This function sends the updated filters to host via callbacks.
   var sendUpdatedFilters = function sendUpdatedFilters() {
@@ -6791,9 +6808,7 @@ var useFilters = function useFilters(_ref) {
     }
     var newFilters = buildFiltersFromSearchParams(columns);
     var filtersPayload = keyword.value ? append(keywordFilter, newFilters) : newFilters;
-    onFiltersChange(buildFiltersPayload(filtersPayload.filter(function (filter) {
-      return !isNil(filter.node);
-    })));
+    handleFiltersChange(filtersPayload);
     onSelectorsChange(buildSelectorsFromURL(columns));
   };
   var handleChangesInURL = function handleChangesInURL() {