@truedat/core 6.3.4 → 6.3.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/core",
-  "version": "6.3.4",
+  "version": "6.3.6",
   "description": "Truedat Web Core",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -36,7 +36,7 @@
     "@testing-library/react": "^12.0.0",
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/user-event": "^13.2.1",
-    "@truedat/test": "6.3.4",
+    "@truedat/test": "6.3.6",
     "babel-jest": "^28.1.0",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -118,5 +118,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 2.0.3 < 2.2"
   },
-  "gitHead": "e7d4c50cf2989fde79b5d1a46c83e6c6ce34f54d"
+  "gitHead": "3e628f8ac355fc31c1fed6265473c1b5cb678cb2"
 }

package/src/search/SearchContext.js

@@ -28,6 +28,7 @@ export const SearchContextProvider = (props) => {
   const userFilterScope = _.prop("userFilterScope")(props);
   const omitFilters = _.propOr([], "omitFilters")(props);
   const translations = _.propOr(() => ({}), "translations")(props);
+  const filtersGroup = _.propOr([], "filtersGroup")(props);
 
   const { formatMessage } = useIntl();
 
@@ -191,11 +192,38 @@ export const SearchContextProvider = (props) => {
     });
   }, [query, searchMust, sort, defaultFilters, page, size]);
 
+  const makeFiltersGroup = (filters, groups) =>
+    _.groupBy((filter) =>
+      _.flow(
+        _.find(([_group, fields]) => _.contains(filter)(fields)),
+        _.prop("[0]")
+      )(groups)
+    )(filters);
+
+  const filtersByGroup = makeFiltersGroup(availableFilters, filtersGroup);
+
+  const groupWithoutFilters = (groups) =>
+    _.flow(
+      _.prop("[0]"),
+      (groupName) => _.prop(groupName)(filtersByGroup),
+      _.isEmpty
+    )(groups);
+
+  const availableGroupedFilters = _.flow(
+    (groups) => _.concat(groups, [[undefined, []]]),
+    _.reject(groupWithoutFilters),
+    _.map(([groupName, _filters]) => [
+      groupName,
+      _.prop(groupName)(filtersByGroup),
+    ])
+  )(filtersGroup);
+
   const context = {
     disabled: false,
     loadingFilters,
 
     availableFilters,
+    availableGroupedFilters,
     selectedFilters,
     filterTypes,
 

package/src/search/SearchFilters.js

@@ -1,5 +1,5 @@
 import _ from "lodash/fp";
-import React from "react";
+import React, { Fragment } from "react";
 import { Dropdown } from "semantic-ui-react";
 import { FormattedMessage, useIntl } from "react-intl";
 import { i18nOrder } from "@truedat/core/services/sort";
@@ -10,7 +10,7 @@ const removePrefix = _.replace(/^.*\./, "");
 export default function SearchFilters() {
   const {
     disabled,
-    availableFilters,
+    availableGroupedFilters,
     addFilter,
     resetFilters,
     loadingFilters: loading,
@@ -40,20 +40,36 @@ export default function SearchFilters() {
             />
           </em>
         </Dropdown.Item>
-        {_.flow(
-          _.defaultTo([]),
-          _.sortBy(i18nOrder(formatMessage, "filters")),
-          _.map((filter) => (
-            <Dropdown.Item
-              key={filter}
-              text={formatMessage({
-                id: `filters.${filter}`,
-                defaultMessage: removePrefix(filter),
-              })}
-              onClick={() => addFilter({ filter })}
-            />
-          ))
-        )(availableFilters)}
+        {_.map.convert({ cap: false })(([groupName, filters], idx) => (
+          <Fragment key={idx}>
+            {idx == 0 ? null : <Dropdown.Divider />}
+            {groupName ? (
+              <Dropdown.Header key={groupName}>
+                <b>
+                  <FormattedMessage
+                    id={`filters.group.header.${groupName}`}
+                    defaultMessage={groupName}
+                  />
+                </b>
+              </Dropdown.Header>
+            ) : null}
+
+            {_.flow(
+              _.defaultTo([]),
+              _.sortBy(i18nOrder(formatMessage, "filters")),
+              _.map((filter) => (
+                <Dropdown.Item
+                  key={filter}
+                  text={formatMessage({
+                    id: `filters.${filter}`,
+                    defaultMessage: removePrefix(filter),
+                  })}
+                  onClick={() => addFilter({ filter })}
+                />
+              ))
+            )(filters)}
+          </Fragment>
+        ))(availableGroupedFilters)}
       </Dropdown.Menu>
     </Dropdown>
   );