@bigbinary/neeto-filters-frontend 3.0.5 → 3.0.6

package/dist/index.cjs.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var classnames = require('classnames');
+var i18next = require('i18next');
 var neetoCist = require('@bigbinary/neeto-cist');
 var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
 var utils = require('@bigbinary/neeto-commons-frontend/utils');
@@ -12,11 +13,11 @@ var ramda = require('ramda');
 var reactI18next = require('react-i18next');
 var reactRouterDom = require('react-router-dom');
 var neetoIcons = require('@bigbinary/neeto-icons');
-var i18next = require('i18next');
-var yup = require('yup');
 var formik = require('@bigbinary/neetoui/formik');
 var reactQuery = require('react-query');
 var axios = require('axios');
+var yup = require('yup');
+var Search = require('@bigbinary/neeto-molecules/Search');
 var ReactDOM = require('react-dom');
 var MenuBar = require('@bigbinary/neeto-molecules/MenuBar');
 var InlineInput = require('@bigbinary/neeto-molecules/InlineInput');
@@ -44,8 +45,9 @@ function _interopNamespace(e) {
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
 var i18next__default = /*#__PURE__*/_interopDefaultLegacy(i18next);
-var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
 var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
+var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
+var Search__default = /*#__PURE__*/_interopDefaultLegacy(Search);
 var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 var MenuBar__default = /*#__PURE__*/_interopDefaultLegacy(MenuBar);
 
@@ -136,9 +138,6 @@ var SHORTCUTS = {
   }
 };
 
-var SEGMENT_VALIDATION_SCHEMA = yup__namespace.object({
-  name: yup__namespace.string().trim().required()
-});
 var SEGMENTS_BASE_URL = "/neeto_filters/segments";
 var DATE_OPTIONS = [{
   label: "Today",
@@ -782,7 +781,8 @@ var compareFilters = function compareFilters(oldFilters, newFilters) {
   return ramda.equals(formatFilters(oldFilters), formatFilters(newFilters));
 };
 var buildFilteredColumns = function buildFilteredColumns(_ref11) {
-  var searchTerm = _ref11.searchTerm,
+  var _ref11$searchTerm = _ref11.searchTerm,
+    searchTerm = _ref11$searchTerm === void 0 ? "" : _ref11$searchTerm,
     columns = _ref11.columns;
   var groupedColumsObject = groupByGroup(columns.filter(function (_ref12) {
     var label = _ref12.label,
@@ -1221,6 +1221,18 @@ var useDestroySegment = function useDestroySegment(options) {
   }, options));
 };
 
+var buildSegmentsValidationSchema = function buildSegmentsValidationSchema(defaultSegmentName) {
+  return yup__namespace.object({
+    name: yup__namespace.string().trim().required().test({
+      name: "not-default-segment-name",
+      test: function test(value) {
+        return (value === null || value === void 0 ? void 0 : value.toLocaleLowerCase()) !== defaultSegmentName.toLocaleLowerCase();
+      },
+      message: i18next.t("neetoFilters.segments.reservedNameErrorMessage")
+    })
+  });
+};
+
 var Menu = neetoui.Dropdown.Menu,
   MenuItem = neetoui.Dropdown.MenuItem;
 var Segment = function Segment(_ref) {
@@ -1228,7 +1240,8 @@ var Segment = function Segment(_ref) {
     filters = _ref.filters,
     columns = _ref.columns,
     childrenKeys = _ref.childrenKeys,
-    setIsFilterPaneOpen = _ref.setIsFilterPaneOpen;
+    setIsFilterPaneOpen = _ref.setIsFilterPaneOpen,
+    defaultSegmentName = _ref.defaultSegmentName;
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isSavePaneOpen = _useState2[0],
@@ -1331,7 +1344,7 @@ var Segment = function Segment(_ref) {
       },
       validateOnChange: true,
       validateOnBlur: true,
-      validationSchema: SEGMENT_VALIDATION_SCHEMA,
+      validationSchema: buildSegmentsValidationSchema(defaultSegmentName),
       onSubmit: handleSubmit
     }
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Body, null, /*#__PURE__*/React__default["default"].createElement(formik.Input, {
@@ -1382,118 +1395,123 @@ var Bar = function Bar(_ref) {
     _ref$setIsPaneOpen = _ref.setIsPaneOpen,
     setIsPaneOpen = _ref$setIsPaneOpen === void 0 ? ramda.identity : _ref$setIsPaneOpen,
     _ref$childrenKeys = _ref.childrenKeys,
-    childrenKeys = _ref$childrenKeys === void 0 ? [] : _ref$childrenKeys;
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
-  var initialRenderRef = React.useRef(true);
-  var searchParams = reactUtils.useQueryParams();
-  var keywordValue = searchParams.search_term || "";
-  var keywordFilter = _objectSpread$2(_objectSpread$2({
-    type: "text",
-    rule: "contains",
-    label: t("neetoFilters.common.searchTerm")
-  }, keyword), {}, {
-    key: "search_term",
-    value: keywordValue
-  });
-  var filters = buildFiltersFromSearchParams(isKeywordFilterPresent(keywordFilter) && neetoCist.isNotEmpty(keywordValue) ? [keywordFilter].concat(_toConsumableArray(columns)) : columns);
-  var nonHiddenFilters = neetoCist.removeBy({
-    hidden: true
-  }, filters);
-  var history = reactRouterDom.useHistory();
-  var handleSubmit = function handleSubmit(newFilters, isClearAll) {
-    var params = buildUrlFromFilters(_objectSpread$2({
-      columns: columns,
-      filters: isKeywordFilterPresent(keywordFilter) && neetoCist.isNotEmpty(getSearchTermFromUrl()) ? [].concat(_toConsumableArray(newFilters), [keywordFilter]) : newFilters
-    }, isClearAll && {
-      isClearAll: true,
-      childrenKeys: childrenKeys
-    }));
-    history.push({
-      search: params
+    childrenKeys = _ref$childrenKeys === void 0 ? [] : _ref$childrenKeys,
+    _ref$defaultSegmentNa = _ref.defaultSegmentName,
+    defaultSegmentName = _ref$defaultSegmentNa === void 0 ? i18next.t("neetoFilters.common.allResults") : _ref$defaultSegmentNa;
+  return function () {
+    var _useTranslation = reactI18next.useTranslation(),
+      t = _useTranslation.t;
+    var initialRenderRef = React.useRef(true);
+    var searchParams = reactUtils.useQueryParams();
+    var keywordValue = searchParams.search_term || "";
+    var keywordFilter = _objectSpread$2(_objectSpread$2({
+      type: "text",
+      rule: "contains",
+      label: t("neetoFilters.common.searchTerm")
+    }, keyword), {}, {
+      key: "search_term",
+      value: keywordValue
     });
-  };
-  var handleDelete = function handleDelete(key) {
-    if (key === "search_term") {
-      var params = ramda.omit(["search_term"], utils.getQueryParams());
+    var filters = buildFiltersFromSearchParams(isKeywordFilterPresent(keywordFilter) && neetoCist.isNotEmpty(keywordValue) ? [keywordFilter].concat(_toConsumableArray(columns)) : columns);
+    var nonHiddenFilters = neetoCist.removeBy({
+      hidden: true
+    }, filters);
+    var history = reactRouterDom.useHistory();
+    var handleSubmit = function handleSubmit(newFilters, isClearAll) {
+      var params = buildUrlFromFilters(_objectSpread$2({
+        columns: columns,
+        filters: isKeywordFilterPresent(keywordFilter) && neetoCist.isNotEmpty(getSearchTermFromUrl()) ? [].concat(_toConsumableArray(newFilters), [keywordFilter]) : newFilters
+      }, isClearAll && {
+        isClearAll: true,
+        childrenKeys: childrenKeys
+      }));
+      history.push({
+        search: params
+      });
+    };
+    var handleDelete = function handleDelete(key) {
+      if (key === "search_term") {
+        var params = ramda.omit(["search_term"], utils.getQueryParams());
+        var pathname = window.location.pathname;
+        history.push(utils.buildUrl(pathname, params));
+        return;
+      }
+      if (childrenKeys.includes(key)) {
+        var _params = ramda.omit([key], utils.getQueryParams());
+        var _pathname = window.location.pathname;
+        history.push(utils.buildUrl(_pathname, _params));
+      }
+      var newFilters = neetoCist.removeBy({
+        key: key
+      }, filters);
+      handleSubmit(newFilters);
+    };
+    var handleClearAll = function handleClearAll() {
+      var params = isKeywordFilterPresent(keywordFilter) ? ramda.omit(["search_term"], utils.getQueryParams()) : utils.getQueryParams();
       var pathname = window.location.pathname;
       history.push(utils.buildUrl(pathname, params));
-      return;
-    }
-    if (childrenKeys.includes(key)) {
-      var _params = ramda.omit([key], utils.getQueryParams());
-      var _pathname = window.location.pathname;
-      history.push(utils.buildUrl(_pathname, _params));
-    }
-    var newFilters = neetoCist.removeBy({
-      key: key
-    }, filters);
-    handleSubmit(newFilters);
-  };
-  var handleClearAll = function handleClearAll() {
-    var params = isKeywordFilterPresent(keywordFilter) ? ramda.omit(["search_term"], utils.getQueryParams()) : utils.getQueryParams();
-    var pathname = window.location.pathname;
-    history.push(utils.buildUrl(pathname, params));
-    handleSubmit([], true);
-  };
-  var childrenFiltersApplied = childrenKeys.some(function (key) {
-    return ramda.has(key, searchParams);
-  });
-  var hideClearButton = nonHiddenFilters.every(function (_ref2) {
-    var defaultValue = _ref2.defaultValue,
-      isClearable = _ref2.isClearable;
-    return defaultValue && !isClearable;
-  }) && !childrenFiltersApplied;
-  React.useEffect(function () {
-    if (initialRenderRef.current) {
-      initialRenderRef.current = false;
-      return neetoCist.noop;
-    }
-    var handler = setTimeout(function () {
-      handleSubmit(filters);
-    }, 500);
-    return function () {
-      return clearTimeout(handler);
+      handleSubmit([], true);
     };
-  }, [keywordValue]);
-  if (ramda.isEmpty(nonHiddenFilters) && !childrenFiltersApplied) return null;
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: classnames__default["default"]("neeto-filters-bar", _defineProperty({}, className, className))
-  }, nonHiddenFilters.map(function (filter) {
-    var _filter$suffixCompone;
-    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
-      key: filter.key
-    }, /*#__PURE__*/React__default["default"].createElement(Block, {
-      filter: filter,
-      handleDelete: handleDelete,
-      setIsPaneOpen: setIsPaneOpen
-    }), (_filter$suffixCompone = filter.suffixComponent) === null || _filter$suffixCompone === void 0 ? void 0 : _filter$suffixCompone.call(filter), /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "neeto-filters-bar--separator"
-    }));
-  }), childrenKeys.filter(function (childKey) {
-    return ramda.has(childKey, searchParams);
-  }).map(function (childKey) {
-    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
-      key: childKey
-    }, /*#__PURE__*/React__default["default"].createElement(ChildBlock, {
-      childKey: childKey,
-      handleDelete: handleDelete,
-      setIsPaneOpen: setIsPaneOpen
-    }), /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "neeto-filters-bar--separator"
+    var childrenFiltersApplied = childrenKeys.some(function (key) {
+      return ramda.has(key, searchParams);
+    });
+    var hideClearButton = nonHiddenFilters.every(function (_ref2) {
+      var defaultValue = _ref2.defaultValue,
+        isClearable = _ref2.isClearable;
+      return defaultValue && !isClearable;
+    }) && !childrenFiltersApplied;
+    React.useEffect(function () {
+      if (initialRenderRef.current) {
+        initialRenderRef.current = false;
+        return neetoCist.noop;
+      }
+      var handler = setTimeout(function () {
+        handleSubmit(filters);
+      }, 500);
+      return function () {
+        return clearTimeout(handler);
+      };
+    }, [keywordValue]);
+    if (ramda.isEmpty(nonHiddenFilters) && !childrenFiltersApplied) return null;
+    return /*#__PURE__*/React__default["default"].createElement("div", {
+      className: classnames__default["default"]("neeto-filters-bar", _defineProperty({}, className, className))
+    }, nonHiddenFilters.map(function (filter) {
+      var _filter$suffixCompone;
+      return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
+        key: filter.key
+      }, /*#__PURE__*/React__default["default"].createElement(Block, {
+        filter: filter,
+        handleDelete: handleDelete,
+        setIsPaneOpen: setIsPaneOpen
+      }), (_filter$suffixCompone = filter.suffixComponent) === null || _filter$suffixCompone === void 0 ? void 0 : _filter$suffixCompone.call(filter), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "neeto-filters-bar--separator"
+      }));
+    }), childrenKeys.filter(function (childKey) {
+      return ramda.has(childKey, searchParams);
+    }).map(function (childKey) {
+      return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
+        key: childKey
+      }, /*#__PURE__*/React__default["default"].createElement(ChildBlock, {
+        childKey: childKey,
+        handleDelete: handleDelete,
+        setIsPaneOpen: setIsPaneOpen
+      }), /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "neeto-filters-bar--separator"
+      }));
+    }), ramda.isNotNil(entity) && /*#__PURE__*/React__default["default"].createElement(Segment, {
+      childrenKeys: childrenKeys,
+      columns: columns,
+      defaultSegmentName: defaultSegmentName,
+      entity: entity,
+      filters: filters,
+      setIsFilterPaneOpen: setIsPaneOpen
+    }), !hideClearButton && /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
+      "data-cy": "neeto-filters-bar-clear-btn",
+      label: t("neetoFilters.common.clearFilters"),
+      style: "text",
+      onClick: handleClearAll
     }));
-  }), ramda.isNotNil(entity) && /*#__PURE__*/React__default["default"].createElement(Segment, {
-    childrenKeys: childrenKeys,
-    columns: columns,
-    entity: entity,
-    filters: filters,
-    setIsFilterPaneOpen: setIsPaneOpen
-  }), !hideClearButton && /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
-    "data-cy": "neeto-filters-bar-clear-btn",
-    label: t("neetoFilters.common.clearFilters"),
-    style: "text",
-    onClick: handleClearAll
-  }));
+  }();
 };
 
 function _extends() {
@@ -3273,16 +3291,13 @@ var Pane = function Pane(_ref) {
     weight: "semibold"
   }, t("neetoFilters.common.filters"))), /*#__PURE__*/React__default["default"].createElement(Slider.Body, {
     className: "neeto-filters-pane-filter__body neeto-ui-pt-2"
-  }, isSearchable && /*#__PURE__*/React__default["default"].createElement(neetoui.Input, {
-    autoFocus: true,
+  }, isSearchable && /*#__PURE__*/React__default["default"].createElement(Search__default["default"], {
     "data-cy": "neeto-filters-column-search",
-    prefix: /*#__PURE__*/React__default["default"].createElement(neetoIcons.Search, null),
-    value: searchTerm,
     placeholder: t("neetoFilters.messages.searchResources", {
       resources: t("neetoFilters.common.filters").toLocaleLowerCase()
     }),
-    onChange: function onChange(event) {
-      return setSearchTerm(event.target.value);
+    onSearch: function onSearch(value) {
+      return setSearchTerm(value);
     }
   }), ungroupedColumns.map(function (column) {
     return /*#__PURE__*/React__default["default"].createElement(Item, {
@@ -3442,7 +3457,8 @@ var DeleteAlert = function DeleteAlert(_ref) {
 
 var Card = function Card(_ref) {
   var segment = _ref.segment,
-    columns = _ref.columns;
+    columns = _ref.columns,
+    defaultSegmentName = _ref.defaultSegmentName;
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isEditing = _useState2[0],
@@ -3476,7 +3492,7 @@ var Card = function Card(_ref) {
       initialValues: segment,
       validateOnChange: true,
       validateOnBlur: true,
-      validationSchema: SEGMENT_VALIDATION_SCHEMA,
+      validationSchema: buildSegmentsValidationSchema(defaultSegmentName),
       onSubmit: handleRename,
       enableReinitialize: true
     }
@@ -3494,6 +3510,7 @@ var Card = function Card(_ref) {
       style: "body2"
     }, segment.name), /*#__PURE__*/React__default["default"].createElement(neetoui.Dropdown, {
       buttonStyle: "text",
+      disabled: neetoCist.isNotPresent(segment.id),
       icon: neetoIcons.MenuHorizontal,
       size: "small"
     }, /*#__PURE__*/React__default["default"].createElement(Menu, null, /*#__PURE__*/React__default["default"].createElement(MenuItem.Button, {
@@ -3521,7 +3538,8 @@ var ManagePane = function ManagePane(_ref) {
   var isOpen = _ref.isOpen,
     onClose = _ref.onClose,
     entity = _ref.entity,
-    columns = _ref.columns;
+    columns = _ref.columns,
+    defaultSegmentName = _ref.defaultSegmentName;
   var _useState = React.useState(""),
     _useState2 = _slicedToArray(_useState, 2),
     searchTerm = _useState2[0],
@@ -3545,25 +3563,26 @@ var ManagePane = function ManagePane(_ref) {
     style: "h2"
   }, t("neetoFilters.segments.manageSegments"))), /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Body, {
     className: "max-h-full gap-4 overflow-scroll"
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Input, {
+  }, /*#__PURE__*/React__default["default"].createElement(Search__default["default"], {
     className: "w-full flex-grow-0",
     placeholder: t("neetoFilters.segments.searchSegments"),
-    prefix: /*#__PURE__*/React__default["default"].createElement(neetoIcons.Search, null),
     ref: inputRef,
-    type: "search",
-    value: searchTerm,
-    onChange: function onChange(_ref2) {
-      var value = _ref2.target.value;
+    onSearch: function onSearch(value) {
       return setSearchTerm(value);
     }
   }), isLoading ? /*#__PURE__*/React__default["default"].createElement(neetoui.Spinner, {
     className: "mx-auto mt-4"
-  }) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, ramda.isEmpty(segments) ? /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+  }) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Card$1, {
+    segment: {
+      name: defaultSegmentName
+    }
+  }), ramda.isEmpty(segments) ? /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
     className: "mx-auto",
     style: "body2"
   }, t("neetoFilters.segments.noSegmentsFound")) : segments.map(function (segment) {
     return /*#__PURE__*/React__default["default"].createElement(Card$1, {
       columns: columns,
+      defaultSegmentName: defaultSegmentName,
       segment: segment,
       key: segment.id
     });
@@ -3575,7 +3594,8 @@ var ITEMS_MAX_COUNT = 20;
 var MenuBlocks = function MenuBlocks(_ref) {
   var entity = _ref.entity,
     searchTerm = _ref.searchTerm,
-    columns = _ref.columns;
+    columns = _ref.columns,
+    defaultSegmentName = _ref.defaultSegmentName;
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     showAll = _useState2[0],
@@ -3586,6 +3606,7 @@ var MenuBlocks = function MenuBlocks(_ref) {
     t = _useTranslation.t;
   var _Object$fromEntries = Object.fromEntries(new URLSearchParams(location.search)),
     segmentId = _Object$fromEntries.segmentId;
+  var appliedFilters = buildFiltersFromURL(columns);
   var _useFetchSegments = useFetchSegments({
       entity: entity,
       searchTerm: searchTerm
@@ -3593,27 +3614,40 @@ var MenuBlocks = function MenuBlocks(_ref) {
     _useFetchSegments$dat = _useFetchSegments.data,
     segments = _useFetchSegments$dat === void 0 ? [] : _useFetchSegments$dat,
     isLoading = _useFetchSegments.isLoading;
-  var handleSelectSegment = function handleSelectSegment(_ref2) {
+  var clearAppliedFilters = function clearAppliedFilters() {
     var _filters$, _filters$2;
-    var id = _ref2.id,
-      filters = _ref2.filters;
-    return ramda.equals(id, segmentId) ? history.push({
+    var filters = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : appliedFilters;
+    history.push({
       search: buildUrlFromFilters({
         columns: columns,
         filters: [],
         isClearAll: true,
-        childrenKeys: ramda.pluck("key", neetoCist.filterBy({
+        childrenKeys: ((_filters$ = filters[0]) === null || _filters$ === void 0 ? void 0 : _filters$.conditions) && ramda.pluck("key", neetoCist.filterBy({
           node: "children"
-        }, (_filters$ = filters[0]) === null || _filters$ === void 0 ? void 0 : _filters$.conditions))
+        }, (_filters$2 = filters[0]) === null || _filters$2 === void 0 ? void 0 : _filters$2.conditions))
       })
-    }) : history.push({
+    });
+  };
+  var applySelectedSegment = function applySelectedSegment(_ref2) {
+    var _filters$3;
+    var id = _ref2.id,
+      filters = _ref2.filters;
+    history.push({
       search: buildUrlFromSegment({
         columns: columns,
-        filters: (_filters$2 = filters[0]) === null || _filters$2 === void 0 ? void 0 : _filters$2.conditions,
+        filters: (_filters$3 = filters[0]) === null || _filters$3 === void 0 ? void 0 : _filters$3.conditions,
         id: id
       })
     });
   };
+  var handleSelectSegment = function handleSelectSegment(_ref3) {
+    var id = _ref3.id,
+      filters = _ref3.filters;
+    return ramda.equals(id, segmentId) ? clearAppliedFilters(filters) : applySelectedSegment({
+      id: id,
+      filters: filters
+    });
+  };
   if (isLoading) {
     return /*#__PURE__*/React__default["default"].createElement(neetoui.Spinner, null);
   }
@@ -3633,6 +3667,10 @@ var MenuBlocks = function MenuBlocks(_ref) {
         return !open;
       });
     }
+  }), /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].Block, {
+    active: ramda.isEmpty(appliedFilters),
+    label: defaultSegmentName,
+    onClick: clearAppliedFilters
   }), segments.slice(0, showAll ? segments.length : ITEMS_MAX_COUNT).map(function (segment) {
     return /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].Block, {
       active: segment.id === segmentId,
@@ -3651,77 +3689,83 @@ var Segments = function Segments(_ref) {
   var entity = _ref.entity,
     columns = _ref.columns,
     _ref$setIsFilterPaneO = _ref.setIsFilterPaneOpen,
-    setIsFilterPaneOpen = _ref$setIsFilterPaneO === void 0 ? neetoCist.noop : _ref$setIsFilterPaneO;
-  var _useState = React.useState(""),
-    _useState2 = _slicedToArray(_useState, 2),
-    searchTerm = _useState2[0],
-    setSearchTerm = _useState2[1];
-  var _useState3 = React.useState(true),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isSearchCollapsed = _useState4[0],
-    setIsSearchCollapsed = _useState4[1];
-  var _useState5 = React.useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    isSegmentsPaneOpen = _useState6[0],
-    setIsSegmentsPaneOpen = _useState6[1];
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
-  var debouncedSearchTerm = reactUtils.useDebounce(searchTerm);
-  var iconProps = [{
-    icon: neetoIcons.Search,
-    onClick: function onClick() {
-      setSearchTerm("");
-      setIsSearchCollapsed(function (collapsed) {
-        return !collapsed;
-      });
-    },
-    tooltipProps: {
-      content: t("neetoFilters.segments.searchSegments"),
-      position: "top"
-    }
-  }, {
-    icon: neetoIcons.Settings,
-    onClick: function onClick() {
-      setIsFilterPaneOpen(false);
-      setIsSegmentsPaneOpen(true);
-    },
-    tooltipProps: {
-      content: t("neetoFilters.segments.manageSegments"),
-      position: "top"
-    }
-  }];
-  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].SubTitle, {
-    iconProps: iconProps
-  }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
-    component: "h4",
-    style: "h5",
-    textTransform: "uppercase",
-    weight: "bold"
-  }, t("neetoFilters.common.segments"))), /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].Search, {
-    autoFocus: true,
-    isCollapsed: isSearchCollapsed,
-    placeholder: t("neetoFilters.segments.searchSegments"),
-    value: searchTerm,
-    onChange: function onChange(_ref2) {
-      var value = _ref2.target.value;
-      return setSearchTerm(value);
-    },
-    onCollapse: function onCollapse() {
-      setSearchTerm("");
-      setIsSearchCollapsed(true);
-    }
-  }), /*#__PURE__*/React__default["default"].createElement(MenuBlocks$1, {
-    columns: columns,
-    entity: entity,
-    searchTerm: debouncedSearchTerm
-  }), /*#__PURE__*/React__default["default"].createElement(ManagePane, {
-    columns: columns,
-    entity: entity,
-    isOpen: isSegmentsPaneOpen,
-    onClose: function onClose() {
-      return setIsSegmentsPaneOpen(false);
-    }
-  }));
+    setIsFilterPaneOpen = _ref$setIsFilterPaneO === void 0 ? neetoCist.noop : _ref$setIsFilterPaneO,
+    _ref$defaultSegmentNa = _ref.defaultSegmentName,
+    defaultSegmentName = _ref$defaultSegmentNa === void 0 ? i18next.t("neetoFilters.common.allResults") : _ref$defaultSegmentNa;
+  return function () {
+    var _useState = React.useState(""),
+      _useState2 = _slicedToArray(_useState, 2),
+      searchTerm = _useState2[0],
+      setSearchTerm = _useState2[1];
+    var _useState3 = React.useState(true),
+      _useState4 = _slicedToArray(_useState3, 2),
+      isSearchCollapsed = _useState4[0],
+      setIsSearchCollapsed = _useState4[1];
+    var _useState5 = React.useState(false),
+      _useState6 = _slicedToArray(_useState5, 2),
+      isSegmentsPaneOpen = _useState6[0],
+      setIsSegmentsPaneOpen = _useState6[1];
+    var _useTranslation = reactI18next.useTranslation(),
+      t = _useTranslation.t;
+    var debouncedSearchTerm = reactUtils.useDebounce(searchTerm);
+    var iconProps = [{
+      icon: neetoIcons.Search,
+      onClick: function onClick() {
+        setSearchTerm("");
+        setIsSearchCollapsed(function (collapsed) {
+          return !collapsed;
+        });
+      },
+      tooltipProps: {
+        content: t("neetoFilters.segments.searchSegments"),
+        position: "top"
+      }
+    }, {
+      icon: neetoIcons.Settings,
+      onClick: function onClick() {
+        setIsFilterPaneOpen(false);
+        setIsSegmentsPaneOpen(true);
+      },
+      tooltipProps: {
+        content: t("neetoFilters.segments.manageSegments"),
+        position: "top"
+      }
+    }];
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].SubTitle, {
+      iconProps: iconProps
+    }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+      component: "h4",
+      style: "h5",
+      textTransform: "uppercase",
+      weight: "bold"
+    }, t("neetoFilters.common.segments"))), /*#__PURE__*/React__default["default"].createElement(MenuBar__default["default"].Search, {
+      autoFocus: true,
+      isCollapsed: isSearchCollapsed,
+      placeholder: t("neetoFilters.segments.searchSegments"),
+      value: searchTerm,
+      onChange: function onChange(_ref2) {
+        var value = _ref2.target.value;
+        return setSearchTerm(value);
+      },
+      onCollapse: function onCollapse() {
+        setSearchTerm("");
+        setIsSearchCollapsed(true);
+      }
+    }), /*#__PURE__*/React__default["default"].createElement(MenuBlocks$1, {
+      columns: columns,
+      defaultSegmentName: defaultSegmentName,
+      entity: entity,
+      searchTerm: debouncedSearchTerm
+    }), /*#__PURE__*/React__default["default"].createElement(ManagePane, {
+      columns: columns,
+      defaultSegmentName: defaultSegmentName,
+      entity: entity,
+      isOpen: isSegmentsPaneOpen,
+      onClose: function onClose() {
+        return setIsSegmentsPaneOpen(false);
+      }
+    }));
+  }();
 };
 var index = /*#__PURE__*/React__default["default"].memo(Segments);