@truedat/core 4.37.2 → 4.37.6

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## [4.37.4] 2022-02-04
+
+### Changed
+
+- [TD-4424] `UserFilters` are now disabled when the `SelectedFilters` `loading`
+  prop is truthy
+
+## [4.37.3] 2022-02-03
+
+### Added
+
+- [TD-2929] Added `scope` control on `SelectedFilters` for generic `UserSearchFilters`
+
 ## [4.36.8] 2022-01-24
 
 ### Changed

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/core",
-  "version": "4.37.2",
+  "version": "4.37.6",
   "description": "Truedat Web Core",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -104,5 +104,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 0.88.2 < 2.1"
   },
-  "gitHead": "ca6ba01d31ab5ec415b9b21d6ce02b418fc6e0ff"
+  "gitHead": "7a5cbf3bc73e19015fe5cc9891ed0c64f5b7246e"
 }

package/src/components/ModalSaveFilter.js

@@ -29,7 +29,7 @@ SaveFilterForm.propTypes = {
   setFilterName: PropTypes.func,
 };
 
-export const ModalSaveFilter = ({ saveFilters, activeFilters }) => {
+export const ModalSaveFilter = ({ saveFilters, activeFilters, scope }) => {
   const [filterName, setFilterName] = useState("");
 
   const actions = (handleSubmit) => [
@@ -52,6 +52,7 @@ export const ModalSaveFilter = ({ saveFilters, activeFilters }) => {
     saveFilters({
       filters: activeFilters,
       filterName: filterName,
+      scope,
     });
   };
 
@@ -78,6 +79,7 @@ export const ModalSaveFilter = ({ saveFilters, activeFilters }) => {
 ModalSaveFilter.propTypes = {
   saveFilters: PropTypes.func,
   activeFilters: PropTypes.object,
+  scope: PropTypes.string,
 };
 
 export default ModalSaveFilter;

package/src/components/SelectedFilters.js

@@ -24,16 +24,19 @@ export const SelectedFilters = ({
   selectedUserFilter,
   toggleFilterValue,
   userFilters,
+  userFilterScope,
   filterItemMapping,
 }) => (
   <>
-    {!_.isEmpty(userFilters) && (
+    {_.isEmpty(userFilters) ? null : (
       <UserFilters
         applyUserFilter={applyUserFilter}
+        userFilterScope={userFilterScope}
         deleteUserFilter={deleteUserFilter}
         resetFilters={resetFilters}
         selectedUserFilter={selectedUserFilter}
         userFilters={userFilters}
+        disabled={loading}
       />
     )}
     <div className="selectedFilters">
@@ -74,6 +77,7 @@ export const SelectedFilters = ({
             <ModalSaveFilter
               saveFilters={saveFilters}
               activeFilters={activeFilters}
+              scope={userFilterScope}
             />
           )}
         </>
@@ -100,6 +104,7 @@ SelectedFilters.propTypes = {
   selectedUserFilter: PropTypes.string,
   toggleFilterValue: PropTypes.func,
   userFilters: PropTypes.array,
+  userFilterScope: PropTypes.string,
 };
 
 export default SelectedFilters;

package/src/components/UserFilters.js

@@ -8,67 +8,69 @@ import { ConfirmModal } from "./ConfirmModal";
 export const UserFilters = ({
   applyUserFilter,
   deleteUserFilter,
+  disabled,
   resetFilters,
   selectedUserFilter,
   userFilters,
+  userFilterScope,
 }) => {
-  return (
-    <>
-      {!_.isEmpty(userFilters) && (
-        <div className="selectedFilters">
-          {userFilters.map((userFilter, i) => (
-            <Label
-              basic={selectedUserFilter == userFilter.name ? false : true}
-              circular={true}
-              key={`label${userFilter.id}.${i}`}
-            >
-              <span
-                onClick={(e) => {
-                  e.preventDefault();
-                  e.stopPropagation();
-                  if (selectedUserFilter == userFilter.name) {
-                    resetFilters();
-                  } else {
-                    applyUserFilter({ userFilter });
+  return _.isEmpty(userFilters) ? null : (
+    <div className="selectedFilters">
+      {userFilters.map((userFilter, i) => (
+        <Label
+          basic={selectedUserFilter == userFilter.name ? false : true}
+          circular={true}
+          key={`label${userFilter.id}.${i}`}
+        >
+          <span
+            onClick={
+              disabled
+                ? null
+                : (e) => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    if (selectedUserFilter == userFilter.name) {
+                      resetFilters();
+                    } else {
+                      applyUserFilter({ userFilter, scope: userFilterScope });
+                    }
                   }
-                }}
-                className="userFilter"
-              >
-                {userFilter.name}
-              </span>
+            }
+            className="userFilter"
+          >
+            {userFilter.name}
+          </span>
 
-              <ConfirmModal
-                icon="trash"
-                trigger={
-                  <Icon
-                    className="selectable"
-                    color="grey"
-                    size="small"
-                    name="trash alternate outline"
-                  />
-                }
-                header={
-                  <FormattedMessage id="search.filters.actions.delete.confirmation.header" />
-                }
-                content={
-                  <FormattedMessage
-                    id="search.filters.actions.delete.confirmation.content"
-                    values={{
-                      name: (
-                        <b>
-                          <i>{userFilter.name}</i>
-                        </b>
-                      ),
-                    }}
-                  />
-                }
-                onConfirm={() => deleteUserFilter({ id: userFilter.id })}
+          <ConfirmModal
+            icon="trash"
+            trigger={
+              <Icon
+                className="selectable"
+                color="grey"
+                size="small"
+                name="trash alternate outline"
+              />
+            }
+            header={
+              <FormattedMessage id="search.filters.actions.delete.confirmation.header" />
+            }
+            content={
+              <FormattedMessage
+                id="search.filters.actions.delete.confirmation.content"
+                values={{
+                  name: (
+                    <b>
+                      <i>{userFilter.name}</i>
+                    </b>
+                  ),
+                }}
               />
-            </Label>
-          ))}
-        </div>
-      )}
-    </>
+            }
+            onConfirm={() => deleteUserFilter({ id: userFilter.id })}
+          />
+        </Label>
+      ))}
+    </div>
   );
 };
 
@@ -78,6 +80,8 @@ UserFilters.propTypes = {
   resetFilters: PropTypes.func,
   selectedUserFilter: PropTypes.string,
   userFilters: PropTypes.array,
+  disabled: PropTypes.bool,
+  userFilterScope: PropTypes.string,
 };
 
 export default UserFilters;

package/src/components/__tests__/__snapshots__/UserFilters.spec.js.snap

@@ -1,98 +1,96 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`<UserFilters /> matches the latest snapshot 1`] = `
-<Fragment>
-  <div
-    className="selectedFilters"
+<div
+  className="selectedFilters"
+>
+  <Label
+    basic={true}
+    circular={true}
+    key="labelundefined.0"
   >
-    <Label
-      basic={true}
-      circular={true}
-      key="labelundefined.0"
+    <span
+      className="userFilter"
+      onClick={[Function]}
     >
-      <span
-        className="userFilter"
-        onClick={[Function]}
-      >
-        a
-      </span>
-      <ConfirmModal
-        content={
-          <Memo(MemoizedFormattedMessage)
-            id="search.filters.actions.delete.confirmation.content"
-            values={
-              Object {
-                "name": <b>
-                  <i>
-                    a
-                  </i>
-                </b>,
-              }
+      a
+    </span>
+    <ConfirmModal
+      content={
+        <Memo(MemoizedFormattedMessage)
+          id="search.filters.actions.delete.confirmation.content"
+          values={
+            Object {
+              "name": <b>
+                <i>
+                  a
+                </i>
+              </b>,
             }
-          />
-        }
-        header={
-          <Memo(MemoizedFormattedMessage)
-            id="search.filters.actions.delete.confirmation.header"
-          />
-        }
-        icon="trash"
-        onConfirm={[Function]}
-        trigger={
-          <Icon
-            as="i"
-            className="selectable"
-            color="grey"
-            name="trash alternate outline"
-            size="small"
-          />
-        }
-      />
-    </Label>
-    <Label
-      basic={true}
-      circular={true}
-      key="labelundefined.1"
+          }
+        />
+      }
+      header={
+        <Memo(MemoizedFormattedMessage)
+          id="search.filters.actions.delete.confirmation.header"
+        />
+      }
+      icon="trash"
+      onConfirm={[Function]}
+      trigger={
+        <Icon
+          as="i"
+          className="selectable"
+          color="grey"
+          name="trash alternate outline"
+          size="small"
+        />
+      }
+    />
+  </Label>
+  <Label
+    basic={true}
+    circular={true}
+    key="labelundefined.1"
+  >
+    <span
+      className="userFilter"
+      onClick={[Function]}
     >
-      <span
-        className="userFilter"
-        onClick={[Function]}
-      >
-        b
-      </span>
-      <ConfirmModal
-        content={
-          <Memo(MemoizedFormattedMessage)
-            id="search.filters.actions.delete.confirmation.content"
-            values={
-              Object {
-                "name": <b>
-                  <i>
-                    b
-                  </i>
-                </b>,
-              }
+      b
+    </span>
+    <ConfirmModal
+      content={
+        <Memo(MemoizedFormattedMessage)
+          id="search.filters.actions.delete.confirmation.content"
+          values={
+            Object {
+              "name": <b>
+                <i>
+                  b
+                </i>
+              </b>,
             }
-          />
-        }
-        header={
-          <Memo(MemoizedFormattedMessage)
-            id="search.filters.actions.delete.confirmation.header"
-          />
-        }
-        icon="trash"
-        onConfirm={[Function]}
-        trigger={
-          <Icon
-            as="i"
-            className="selectable"
-            color="grey"
-            name="trash alternate outline"
-            size="small"
-          />
-        }
-      />
-    </Label>
-  </div>
-</Fragment>
+          }
+        />
+      }
+      header={
+        <Memo(MemoizedFormattedMessage)
+          id="search.filters.actions.delete.confirmation.header"
+        />
+      }
+      icon="trash"
+      onConfirm={[Function]}
+      trigger={
+        <Icon
+          as="i"
+          className="selectable"
+          color="grey"
+          name="trash alternate outline"
+          size="small"
+        />
+      }
+    />
+  </Label>
+</div>
 `;

package/src/services/filters.js

@@ -28,21 +28,17 @@ export const getSearchPayload = (searchQuery, props) => {
   ]);
 };
 
-export const formatFilterValues =
-  (implementationSelectedFilter) => (values) => {
-    if (implementationSelectedFilter === "taxonomy") {
-      const domains = _.flow(
-        _.map((domain) => ({
-          ...domain,
-          parent_id: _.head(domain.parent_ids),
-        })),
-        _.map(_.omit(["parent_ids"]))
-      )(values);
-      return getDomainSelectorOptions({ domains });
-    }
+export const formatFilterValues = (selectedFilter) => (values) => {
+  if (selectedFilter === "taxonomy") {
+    const domains = _.flow(
+      _.map((domain) => ({ ...domain, parent_id: _.head(domain.parent_ids) })),
+      _.map(_.omit(["parent_ids"]))
+    )(values);
+    return getDomainSelectorOptions({ domains });
+  }
 
-    return values;
-  };
+  return values;
+};
 
 export const toFilterValues = (filterValues) =>
   _.map((v) => (_.isObject(v) ? v.id : v))(filterValues);