@bigbinary/neeto-filters-frontend 3.0.8 → 3.0.10

package/README.md

@@ -34,7 +34,9 @@ The engine is used to manage filters across neeto products.
     ```
 4. Execute the following command to generate the migration to generate the `neeto_filters_engine_segments` table.
     ```zsh
-    rails g neeto_filters_engine:install
+    bundle exec rails neeto_filters_engine:install:migrations
+
+    bundle exec rails db:migrate
     ```
 5. Add the following line to `models/organization.rb` file.
     ```ruby
@@ -303,6 +305,20 @@ const selectedFields = ["name", "age"];
 const filterColumns = buildFilterColumnsFromFields({ fields, selectedFields });
 
 ```
+
+#### 4. `useFetchSegments`([source code](https://github.com/bigbinary/neeto-filters-nano/blob/b6421775adb20ba859609e71610fad944492147e/app/javascript/src/hooks/reactQuery/useSegmentsApi.js#L10-L18))
+
+The `useFetchSegments` hook is used to fetch the array of segments based on the provided `entity`.
+
+#### Parameters
+
+- `entity`: The entity associated with the segments to be fetched.
+- `searchTerm`: The search term for fetching the segments filtered by names containing the search term.
+
+```js
+  const { data: segments = [], isLoading } = useFetchSegments({ entity: "User" });
+```
+
 ## Basic Usage
 
 Here is an example of how to use the `neeto-filters-engine` gem assuming that the

package/dist/index.cjs.js

@@ -123,21 +123,6 @@ function _defineProperty(obj, key, value) {
   return obj;
 }
 
-var SHORTCUTS = {
-  closePane: {
-    sequence: "escape",
-    description: i18next.t("neetoFilters.shortcuts.closePane")
-  },
-  deleteBlock: {
-    sequence: "backspace",
-    description: i18next.t("neetoFilters.shortcuts.deleteBlock")
-  },
-  openFilterPane: {
-    sequence: "enter",
-    description: i18next.t("neetoFilters.shortcuts.openFilterPane")
-  }
-};
-
 var SEGMENTS_BASE_URL = "/neeto_filters/segments";
 var DATE_OPTIONS = [{
   label: "Today",
@@ -217,6 +202,23 @@ var DATE_RULES = {
   yesterday: "on",
   "all-time": "before"
 };
+var SEARCH_TERM_KEY = "search_term";
+var SEGMENT_ID_KEY = "segment_id";
+
+var SHORTCUTS = {
+  closePane: {
+    sequence: "escape",
+    description: i18next.t("neetoFilters.shortcuts.closePane")
+  },
+  deleteBlock: {
+    sequence: "backspace",
+    description: i18next.t("neetoFilters.shortcuts.deleteBlock")
+  },
+  openFilterPane: {
+    sequence: "enter",
+    description: i18next.t("neetoFilters.shortcuts.openFilterPane")
+  }
+};
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
@@ -372,6 +374,11 @@ var standardizeColumnType = function standardizeColumnType(kind) {
   }
   return kind;
 };
+var getSnakeCasedQueryParams = function getSnakeCasedQueryParams() {
+  return utils.getQueryParams({
+    toCamelCase: false
+  });
+};
 var isBoolean = function isBoolean(type) {
   return type === "boolean" || type === "custom.boolean";
 };
@@ -516,7 +523,7 @@ var buildUpdatedFilter = function buildUpdatedFilter(_ref8) {
 };
 var buildFiltersFromSearchParams = function buildFiltersFromSearchParams(columns) {
   var skipEmpty = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-  var searchParams = utils.getQueryParams();
+  var searchParams = getSnakeCasedQueryParams();
   return columns.map(function (column) {
     var value = searchParams[column.key];
     var defaultType = column.defaultType || column.type;
@@ -526,7 +533,7 @@ var buildFiltersFromSearchParams = function buildFiltersFromSearchParams(columns
       }, column);
     } else if (ramda.isNil(value) || value === "" || column.key === "keyword") {
       return null;
-    } else if (column.key === "search_term") {
+    } else if (column.key === SEARCH_TERM_KEY) {
       if (ramda.isNil(column.node)) return null;
       return ramda.mergeLeft({
         value: value,
@@ -683,7 +690,7 @@ var buildFiltersPayload = function buildFiltersPayload(filters) {
   var payload = neetoCist.removeBy({
     value: ""
   }, filters).map(function (filter) {
-    if (filter.key === "search_term" && isMultiModelFilter(filter)) {
+    if (filter.key === SEARCH_TERM_KEY && isMultiModelFilter(filter)) {
       return splitFilter(filter);
     }
     var filterPayload = ramda.omit(["key", "label", "values", "setValue"], filter);
@@ -717,14 +724,14 @@ var buildSegmentsPayload = function buildSegmentsPayload(filters) {
   var payload = neetoCist.removeBy({
     value: ""
   }, filters).map(function (filter) {
-    if (filter.key === "search_term") {
+    if (filter.key === SEARCH_TERM_KEY) {
       return false;
     }
     var filterPayload = ramda.omit(["label", "values", "setValue", "defaultValue"], filter);
     var _filterPayload$defaul2 = filterPayload.defaultType,
       defaultType = _filterPayload$defaul2 === void 0 ? filterPayload.type : _filterPayload$defaul2,
       value = filterPayload.value;
-    if (filter.key !== "search_term" && isMultiModelFilter(filterPayload)) {
+    if (filter.key !== SEARCH_TERM_KEY && isMultiModelFilter(filterPayload)) {
       throw i18next__default["default"].t("neetoFilters.errors.cannotPassMultipleModels");
     }
     if (isMulti(defaultType)) {
@@ -734,7 +741,7 @@ var buildSegmentsPayload = function buildSegmentsPayload(filters) {
     }
     return filterPayload;
   });
-  var searchParams = utils.getQueryParams();
+  var searchParams = getSnakeCasedQueryParams();
   var modifiedPayload = childrenKeys.reduce(function (acc, key) {
     if (ramda.has(key, searchParams)) {
       var filterPayload = {
@@ -756,7 +763,7 @@ var buildFiltersFromURL = function buildFiltersFromURL(columns) {
   })));
 };
 var buildSelectorsFromURL = function buildSelectorsFromURL(columns) {
-  var searchParams = utils.getQueryParams();
+  var searchParams = getSnakeCasedQueryParams();
   var selectors = {};
   columns.filter(function (_ref9) {
     var node = _ref9.node;
@@ -827,7 +834,7 @@ var createUrlParamString = function createUrlParamString(_ref15) {
     _filter$defaultType = filter.defaultType,
     defaultType = _filter$defaultType === void 0 ? filter.type : _filter$defaultType,
     rule = filter.rule;
-  if (key === "search_term") {
+  if (key === SEARCH_TERM_KEY) {
     return value;
   } else if (isDigit(defaultType) || isText(defaultType)) {
     return "".concat(value, "+rule-").concat(rule);
@@ -852,9 +859,9 @@ var buildUrlFromFilters = function buildUrlFromFilters(_ref16) {
     isClearAll = _ref16$isClearAll === void 0 ? false : _ref16$isClearAll,
     _ref16$childrenKeys = _ref16.childrenKeys,
     childrenKeys = _ref16$childrenKeys === void 0 ? [] : _ref16$childrenKeys;
-  var searchParams = utils.getQueryParams();
+  var searchParams = getSnakeCasedQueryParams();
   var isKeywordFilterPresent = neetoCist.findBy({
-    key: "search_term"
+    key: SEARCH_TERM_KEY
   }, filters);
   columns.forEach(function (_ref17) {
     var key = _ref17.key,
@@ -865,18 +872,18 @@ var buildUrlFromFilters = function buildUrlFromFilters(_ref16) {
     childrenKeys.forEach(function (key) {
       return delete searchParams[key];
     });
-    delete searchParams["segmentId"];
+    delete searchParams[SEGMENT_ID_KEY];
   }
   var defaultFilters = buildDefaultFilters(columns, filters);
-  isKeywordFilterPresent && delete searchParams["search_term"];
+  isKeywordFilterPresent && delete searchParams[SEARCH_TERM_KEY];
   ramda.concat(filters, defaultFilters).forEach(function (filter) {
     searchParams[filter.key] = createUrlParamString({
       filter: filter,
       columns: columns
     });
   });
-  if (ramda.isEmpty(ramda.omit(["segmentId"], searchParams))) {
-    delete searchParams["segmentId"];
+  if (ramda.isEmpty(ramda.omit([SEGMENT_ID_KEY], searchParams))) {
+    delete searchParams[SEGMENT_ID_KEY];
   }
   return new URLSearchParams(searchParams).toString();
 };
@@ -898,33 +905,33 @@ var buildUrlFromSegment = function buildUrlFromSegment(_ref19) {
   var columns = _ref19.columns,
     filters = _ref19.filters,
     id = _ref19.id;
-  var searchParams = utils.getQueryParams();
+  var searchParams = getSnakeCasedQueryParams();
   columns.forEach(function (_ref20) {
     var key = _ref20.key,
       defaultValue = _ref20.defaultValue;
     return !defaultValue && delete searchParams[key];
   });
+  delete searchParams[SEARCH_TERM_KEY];
   var defaultFilters = buildDefaultFilters(columns, filters);
-  delete searchParams["searchTerm"];
-  ramda.concat(filters, defaultFilters).forEach(function (filter) {
-    neetoCist.isNotEmpty(id) && (searchParams["segmentId"] = id);
-    searchParams[filter.key] = createUrlParamStringForSegments({
+  var newSearchParams = ramda.concat(filters, defaultFilters).reduce(function (acc, filter) {
+    acc[filter.key] = createUrlParamStringForSegments({
       filter: filter,
       columns: columns
     });
-  });
-  return new URLSearchParams(searchParams).toString();
+    return acc;
+  }, neetoCist.isNotEmpty(id) ? _defineProperty({}, SEGMENT_ID_KEY, id) : {});
+  return new URLSearchParams(_objectSpread$4(_objectSpread$4({}, searchParams), newSearchParams)).toString();
 };
 var getSearchTermFromUrl = function getSearchTermFromUrl() {
-  return utils.getQueryParams()["search_term"] || "";
-};
-var buildFilterColumnsFromFields = function buildFilterColumnsFromFields(_ref21) {
-  var fields = _ref21.fields,
-    _ref21$selectedFields = _ref21.selectedFields,
-    selectedFields = _ref21$selectedFields === void 0 ? [] : _ref21$selectedFields,
-    _ref21$showRuleSelect = _ref21.showRuleSelector,
-    showRuleSelector = _ref21$showRuleSelect === void 0 ? false : _ref21$showRuleSelect,
-    groupName = _ref21.groupName;
+  return utils.getQueryParams().searchTerm || "";
+};
+var buildFilterColumnsFromFields = function buildFilterColumnsFromFields(_ref22) {
+  var fields = _ref22.fields,
+    _ref22$selectedFields = _ref22.selectedFields,
+    selectedFields = _ref22$selectedFields === void 0 ? [] : _ref22$selectedFields,
+    _ref22$showRuleSelect = _ref22.showRuleSelector,
+    showRuleSelector = _ref22$showRuleSelect === void 0 ? false : _ref22$showRuleSelect,
+    groupName = _ref22.groupName;
   return fields.reduce(function (columns, field) {
     if (ramda.isEmpty(selectedFields) || selectedFields.includes(field.name)) {
       var id = field.id,
@@ -1034,7 +1041,7 @@ var buildRuleValue = function buildRuleValue(_ref) {
   return "";
 };
 var hasOnlyKeywordFilter = function hasOnlyKeywordFilter(filters) {
-  return filters.length === 1 && filters[0].key === "search_term";
+  return filters.length === 1 && filters[0].key === SEARCH_TERM_KEY;
 };
 
 var Block = function Block(_ref) {
@@ -1072,7 +1079,7 @@ var Block = function Block(_ref) {
     theme: "light"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-filters-bar__block",
-    "data-cy": "neeto-filters-".concat(key, "-block"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-block"),
     tabIndex: 0,
     ref: function ref(node) {
       deleteBlockHotKeyRef.current = node;
@@ -1091,7 +1098,7 @@ var Block = function Block(_ref) {
   }, blockContent), !defaultValue && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-filters-bar__block-close"
   }, /*#__PURE__*/React__default["default"].createElement(neetoIcons.Close, {
-    "data-cy": "neeto-filters-".concat(key, "-block-close-btn"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-block-close-btn"),
     size: 16,
     strokeWidth: 2,
     onClick: function onClick(event) {
@@ -1117,7 +1124,7 @@ var ChildBlock = function ChildBlock(_ref) {
   });
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-filters-bar__block",
-    "data-cy": "neeto-filters-".concat(childKey, "-block"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(childKey), "-block"),
     tabIndex: 0,
     ref: function ref(node) {
       deleteBlockHotKeyRef.current = node;
@@ -1132,7 +1139,7 @@ var ChildBlock = function ChildBlock(_ref) {
   }, childKey), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-filters-bar__block-close"
   }, /*#__PURE__*/React__default["default"].createElement(neetoIcons.Close, {
-    "data-cy": "neeto-filters-".concat(childKey, "-block-close-btn"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(childKey), "-block-close-btn"),
     size: 16,
     strokeWidth: 2,
     onClick: function onClick(event) {
@@ -1402,14 +1409,16 @@ var Bar = function Bar(_ref) {
     var _useTranslation = reactI18next.useTranslation(),
       t = _useTranslation.t;
     var initialRenderRef = React.useRef(true);
-    var searchParams = reactUtils.useQueryParams();
-    var keywordValue = searchParams.search_term || "";
+    var searchParams = reactUtils.useQueryParams({
+      toCamelCase: false
+    });
+    var keywordValue = searchParams[SEARCH_TERM_KEY] || "";
     var keywordFilter = _objectSpread$2(_objectSpread$2({
       type: "text",
       rule: "contains",
       label: t("neetoFilters.common.searchTerm")
     }, keyword), {}, {
-      key: "search_term",
+      key: SEARCH_TERM_KEY,
       value: keywordValue
     });
     var filters = buildFiltersFromSearchParams(isKeywordFilterPresent(keywordFilter) && neetoCist.isNotEmpty(keywordValue) ? [keywordFilter].concat(_toConsumableArray(columns)) : columns);
@@ -1430,14 +1439,14 @@ var Bar = function Bar(_ref) {
       });
     };
     var handleDelete = function handleDelete(key) {
-      if (key === "search_term") {
-        var params = ramda.omit(["search_term"], utils.getQueryParams());
+      if (key === SEARCH_TERM_KEY) {
+        var params = ramda.omit([SEARCH_TERM_KEY], getSnakeCasedQueryParams());
         var pathname = window.location.pathname;
         history.push(utils.buildUrl(pathname, params));
         return;
       }
       if (childrenKeys.includes(key)) {
-        var _params = ramda.omit([key], utils.getQueryParams());
+        var _params = ramda.omit([key], getSnakeCasedQueryParams());
         var _pathname = window.location.pathname;
         history.push(utils.buildUrl(_pathname, _params));
       }
@@ -1447,7 +1456,7 @@ var Bar = function Bar(_ref) {
       handleSubmit(newFilters);
     };
     var handleClearAll = function handleClearAll() {
-      var params = isKeywordFilterPresent(keywordFilter) ? ramda.omit(["search_term"], utils.getQueryParams()) : utils.getQueryParams();
+      var params = isKeywordFilterPresent(keywordFilter) ? ramda.omit([SEARCH_TERM_KEY], getSnakeCasedQueryParams()) : getSnakeCasedQueryParams();
       var pathname = window.location.pathname;
       history.push(utils.buildUrl(pathname, params));
       handleSubmit([], true);
@@ -2482,7 +2491,7 @@ var useFilters = function useFilters(_ref) {
   };
   var handleChangesInURL = function handleChangesInURL() {
     var defaultFilters = buildDefaultFilters(columns, filters);
-    var searchParams = utils.getQueryParams();
+    var searchParams = getSnakeCasedQueryParams();
     var keys = ramda.pluck("key", ramda.append(keywordFilter, columns));
     if (keys.every(function (key) {
       return ramda.isNil(searchParams[key]);
@@ -2643,10 +2652,10 @@ var Boolean = function Boolean(_ref) {
     options: options,
     value: value,
     isClearable: true,
-    "data-cy": "neeto-filters-".concat(key, "-filter"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     strategy: "fixed",
     placeholder: t("neetoFilters.messages.selectOption", {
-      resource: label.toLocaleLowerCase()
+      resource: label
     }),
     onChange: handleChange
   }, otherProps));
@@ -2714,16 +2723,16 @@ var Datetime = function Datetime(_ref) {
     autoFocus: autoFocus,
     label: label,
     isClearable: true,
-    "data-cy": "neeto-filters-".concat(key, "-filter"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     options: DATE_OPTIONS,
     strategy: "fixed",
     value: selectedRule,
     placeholder: t("neetoFilters.messages.selectResource", {
-      resource: label.toLocaleLowerCase()
+      resource: label
     }),
     onChange: handleChange
   }), isDatePickerShown && /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, _extends({
-    "data-cy": "neeto-filters-".concat(key, "-date-range"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-date-range"),
     getPopupContainer: ramda.prop("parentNode"),
     type: (selectedRule === null || selectedRule === void 0 ? void 0 : selectedRule.value) === "custom-date-range" ? "range" : "date",
     value: getDateValue(filter === null || filter === void 0 ? void 0 : filter.value, selectedRule),
@@ -2777,12 +2786,12 @@ var Dropdown = function Dropdown(_ref) {
     label: label,
     options: options,
     value: value,
-    "data-cy": "neeto-filters-".concat(key, "-filter"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     isClearable: !defaultValue && isClearable,
     isMulti: isMulti(defaultType),
     strategy: "fixed",
     placeholder: t("neetoFilters.messages.selectResource", {
-      resource: label.toLocaleLowerCase()
+      resource: label
     }),
     onChange: handleChange
   }, otherProps));
@@ -2856,7 +2865,7 @@ var SingleDatetime = function SingleDatetime(_ref) {
     className: "neeto-filters-pane-filter__item-wrapper"
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.Select, {
     label: label,
-    "data-cy": "neeto-filters-".concat(key, "-filter-rule"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter-rule"),
     defaultValue: SINGLE_DATE_OPTIONS[0],
     options: SINGLE_DATE_OPTIONS,
     strategy: "fixed",
@@ -2865,7 +2874,7 @@ var SingleDatetime = function SingleDatetime(_ref) {
   }), /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, _extends({
     autoFocus: autoFocus,
     value: value,
-    "data-cy": "neeto-filters-".concat(key, "-filter"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     getPopupContainer: ramda.prop("parentNode"),
     type: datePickerType,
     onChange: handleChange
@@ -2941,7 +2950,7 @@ var SingleTime = function SingleTime(_ref) {
     value: value,
     use12Hours: true,
     className: "w-full",
-    "data-cy": "neeto-filters-".concat(key, "-filter"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     format: "h:mm A",
     getPopupContainer: ramda.prop("parentNode"),
     type: timePickerType,
@@ -3023,7 +3032,7 @@ var Text = function Text(_ref) {
     className: "neeto-filters-pane-filter__item-wrapper"
   }, showRuleSelector && /*#__PURE__*/React__default["default"].createElement(neetoui.Select, {
     label: label,
-    "data-cy": "neeto-filters-".concat(key, "-filter-rule"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter-rule"),
     defaultValue: ruleOptions[0],
     options: ruleOptions,
     strategy: "fixed",
@@ -3031,12 +3040,12 @@ var Text = function Text(_ref) {
     onChange: handleRuleChange
   }), /*#__PURE__*/React__default["default"].createElement(neetoui.Input, _extends({
     autoFocus: autoFocus,
-    "data-cy": "neeto-filters-".concat(key, "-filter"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     label: !showRuleSelector && label,
     type: inputType,
     value: inputValue,
     placeholder: t("neetoFilters.messages.enterResource", {
-      resource: label.toLocaleLowerCase()
+      resource: label
     }),
     onChange: function onChange(event) {
       return setInputValue(event.target.value);
@@ -3092,16 +3101,16 @@ var Time = function Time(_ref) {
     label: label,
     value: value,
     isClearable: true,
-    "data-cy": "neeto-filters-".concat(key, "-filter"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-filter"),
     options: TIME_OPTIONS,
     strategy: "fixed",
     placeholder: t("neetoFilters.messages.selectResource", {
-      resource: label.toLocaleLowerCase()
+      resource: label
     }),
     onChange: handleChange
   }), isCustomTimeRangeShown && /*#__PURE__*/React__default["default"].createElement(neetoui.TimePicker, _extends({
     use12Hours: true,
-    "data-cy": "neeto-filters-".concat(key, "-date-range"),
+    "data-cy": "neeto-filters-".concat(neetoCist.hyphenate(key), "-date-range"),
     format: "h:mm A",
     getPopupContainer: ramda.prop("parentNode"),
     type: "range",
@@ -3208,7 +3217,9 @@ var Pane = function Pane(_ref) {
     childrenKeys = _ref$childrenKeys === void 0 ? [] : _ref$childrenKeys,
     children = _ref.children,
     otherProps = _objectWithoutProperties(_ref, _excluded);
-  var searchParams = reactUtils.useQueryParams();
+  var searchParams = reactUtils.useQueryParams({
+    toCamelCase: false
+  });
   var _useState = React.useState(""),
     _useState2 = _slicedToArray(_useState, 2),
     searchTerm = _useState2[0],
@@ -3232,8 +3243,8 @@ var Pane = function Pane(_ref) {
     rule: "contains",
     label: t("neetoFilters.common.searchTerm")
   }, keyword), {}, {
-    key: "search_term",
-    value: searchParams.search_term || ""
+    key: SEARCH_TERM_KEY,
+    value: searchParams[SEARCH_TERM_KEY] || ""
   });
   var filters = useFilters({
     onFiltersChange: onChange,
@@ -3255,7 +3266,7 @@ var Pane = function Pane(_ref) {
     });
   };
   var handleClearAll = function handleClearAll() {
-    var params = isKeywordFilterPresent(keywordFilter) ? ramda.omit(["search_term"], utils.getQueryParams()) : utils.getQueryParams();
+    var params = isKeywordFilterPresent(keywordFilter) ? ramda.omit([SEARCH_TERM_KEY], getSnakeCasedQueryParams()) : getSnakeCasedQueryParams();
     var pathname = window.location.pathname;
     history.push(utils.buildUrl(pathname, params));
     handleChange([], true);
@@ -3594,23 +3605,20 @@ var ITEMS_MAX_COUNT = 20;
 
 var MenuBlocks = function MenuBlocks(_ref) {
   var entity = _ref.entity,
-    searchTerm = _ref.searchTerm,
     columns = _ref.columns,
     defaultSegmentName = _ref.defaultSegmentName;
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     showAll = _useState2[0],
     setShowAll = _useState2[1];
-  var location = reactRouterDom.useLocation();
   var history = reactRouterDom.useHistory();
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
-  var _Object$fromEntries = Object.fromEntries(new URLSearchParams(location.search)),
-    segmentId = _Object$fromEntries.segmentId;
+  var _getQueryParams = utils.getQueryParams(),
+    segmentId = _getQueryParams.segmentId;
   var appliedFilters = buildFiltersFromURL(columns);
   var _useFetchSegments = useFetchSegments({
-      entity: entity,
-      searchTerm: searchTerm
+      entity: entity
     }),
     _useFetchSegments$dat = _useFetchSegments.data,
     segments = _useFetchSegments$dat === void 0 ? [] : _useFetchSegments$dat,
@@ -3694,34 +3702,13 @@ var Segments = function Segments(_ref) {
     _ref$defaultSegmentNa = _ref.defaultSegmentName,
     defaultSegmentName = _ref$defaultSegmentNa === void 0 ? i18next.t("neetoFilters.common.allResults") : _ref$defaultSegmentNa;
   return function () {
-    var _useState = React.useState(""),
+    var _useState = React.useState(false),
       _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];
+      isSegmentsPaneOpen = _useState2[0],
+      setIsSegmentsPaneOpen = _useState2[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);
@@ -3739,24 +3726,10 @@ var Segments = function Segments(_ref) {
       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, {
+    }, t("neetoFilters.common.segments"))), /*#__PURE__*/React__default["default"].createElement(MenuBlocks$1, {
       columns: columns,
       defaultSegmentName: defaultSegmentName,
-      entity: entity,
-      searchTerm: debouncedSearchTerm
+      entity: entity
     }), /*#__PURE__*/React__default["default"].createElement(ManagePane, {
       columns: columns,
       defaultSegmentName: defaultSegmentName,
@@ -3776,4 +3749,5 @@ exports.Segments = index;
 exports.buildFilterColumnsFromFields = buildFilterColumnsFromFields;
 exports.buildFiltersFromURL = buildFiltersFromURL;
 exports.buildSelectorsFromURL = buildSelectorsFromURL;
+exports.useFetchSegments = useFetchSegments;
 //# sourceMappingURL=index.cjs.js.map