@truedat/dd 4.41.0 → 4.41.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [4.41.1] 2022-03-25
+
+### Changed
+
+- [TD-4617] Use domainMenuSelector on editDomainForm
+
 ## [4.41.0] 2022-03-25
 
 ### Added

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/dd",
-  "version": "4.41.0",
+  "version": "4.41.1",
   "description": "Truedat Web Data Dictionary",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -34,7 +34,7 @@
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^12.0.0",
     "@testing-library/user-event": "^13.2.1",
-    "@truedat/test": "4.41.0",
+    "@truedat/test": "4.41.1",
     "babel-jest": "^27.0.6",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -84,9 +84,9 @@
     ]
   },
   "dependencies": {
-    "@truedat/auth": "4.41.0",
-    "@truedat/core": "4.41.0",
-    "@truedat/df": "4.41.0",
+    "@truedat/auth": "4.41.1",
+    "@truedat/core": "4.41.1",
+    "@truedat/df": "4.41.1",
     "lodash": "^4.17.21",
     "path-to-regexp": "^1.7.0",
     "prop-types": "^15.7.2",
@@ -107,5 +107,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 0.88.2 < 2.1"
   },
-  "gitHead": "f4d8bc5e536b847c7b562a84bfa70955a93166ea"
+  "gitHead": "6e19abfaa3541bfad20ea093e6666cbdbecf7b55"
 }

package/src/components/EditDomainForm.js

@@ -1,11 +1,19 @@
 import _ from "lodash/fp";
 import React, { useState } from "react";
-import { Button, Checkbox, Container, Form, Header } from "semantic-ui-react";
-import { DomainDropdownSelector } from "@truedat/bg/components";
+import {
+  Button,
+  Checkbox,
+  Container,
+  Form,
+  Header,
+  Segment,
+} from "semantic-ui-react";
 import { linkTo } from "@truedat/core/routes";
 import PropTypes from "prop-types";
 import { useIntl } from "react-intl";
 import { connect } from "react-redux";
+import { DomainMenuSelector } from "@truedat/bg/taxonomy/components/DomainMenuSelector";
+import { getDomainSelectorOptions } from "@truedat/bg/taxonomy/selectors";
 import { updateStructure } from "../routines";
 
 export const EditDomainForm = ({
@@ -13,6 +21,7 @@ export const EditDomainForm = ({
   title,
   updateStructure,
   structure,
+  domainOptions,
 }) => {
   const { formatMessage } = useIntl();
   const [domainIds, setDomainIds] = useState(structure?.domain_ids || []);
@@ -32,26 +41,26 @@ export const EditDomainForm = ({
   return (
     <Container style={{ width: "400px" }}>
       <Header as="h2" content={title} />
-      <DomainDropdownSelector
-        clearable={false}
-        multiple={true}
-        onChange={handleDomainSelected}
-        name="domain"
-        value={domainIds}
-      />
-
-      <Checkbox
-        label={formatMessage({
-          id: "structureDomain.actions.update.inherit",
-        })}
-        checked={inherit}
-        onChange={(e) => {
-          setInherit(!inherit);
-          e.preventDefault();
-        }}
-      />
 
       <Form onSubmit={saving ? null : onSubmit}>
+        <Segment>
+          <DomainMenuSelector
+            domainOptions={domainOptions}
+            onChange={handleDomainSelected}
+            value={domainIds}
+          />
+        </Segment>
+
+        <Checkbox
+          label={formatMessage({
+            id: "structureDomain.actions.update.inherit",
+          })}
+          checked={inherit}
+          onChange={(e) => {
+            setInherit(!inherit);
+            e.preventDefault();
+          }}
+        />
         <div className="actions">
           <Button
             type="submit"
@@ -71,15 +80,19 @@ export const EditDomainForm = ({
 };
 
 EditDomainForm.propTypes = {
+  domainOptions: PropTypes.array,
   structure: PropTypes.object,
   updateStructure: PropTypes.func,
   title: PropTypes.string,
   saving: PropTypes.bool,
 };
 
-const mapStateToProps = (state) => ({
-  structure: _.pick(["id", "domain_ids"])(state.structure),
-  saving: state.structureUpdating,
-});
+const mapStateToProps = (state) => {
+  return {
+    structure: _.pick(["id", "domain_ids"])(state.structure),
+    saving: state.structureUpdating,
+    domainOptions: getDomainSelectorOptions(state),
+  };
+};
 
 export default connect(mapStateToProps, { updateStructure })(EditDomainForm);

package/src/components/StructuresDomainsUploadOption.js

@@ -18,7 +18,9 @@ export const StructuresDomainsUploadOption = ({
       trigger={
         <Dropdown.Item
           icon="upload"
-          text={formatMessage({ id: "structures.actions.uploadDomains.tooltip" })}
+          text={formatMessage({
+            id: "structures.actions.uploadDomains.tooltip",
+          })}
           disabled={loading}
         />
       }

package/src/components/__tests__/EditDomainForm.spec.js

@@ -20,6 +20,7 @@ describe("<EditDomainForm />", () => {
     title: "title",
     updateStructure,
     structure,
+    domainOptions: domains,
   };
 
   const messages = {
@@ -29,6 +30,7 @@ describe("<EditDomainForm />", () => {
       "structureDomain.actions.update.inherit": "Apply on children",
       "domain.selector.label": "Domain",
       "domain.selector.placeholder": "Select a domain...",
+      "domain.multiple.placeholder": "Select domains ...",
     },
   };
 

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

@@ -11,107 +11,96 @@ exports[`<EditDomainForm /> matches the latest snapshot 1`] = `
     >
       title
     </h2>
-    <div
-      class="required field"
+    <form
+      class="ui form"
     >
-      <label>
-        Domain
-      </label>
       <div
-        class="field"
+        class="ui segment"
       >
         <div
-          aria-expanded="false"
-          class="ui fluid multiple search selection dropdown"
-          name="domain"
-          role="combobox"
+          class="field"
         >
-          <input
-            aria-autocomplete="list"
-            autocomplete="off"
-            class="search"
-            tabindex="0"
-            type="text"
-            value=""
-          />
-          <span
-            class="sizer"
-          />
-          <div
-            aria-atomic="true"
-            aria-live="polite"
-            class="divider default text"
-            role="alert"
-          >
-            Select a domain...
-          </div>
-          <i
-            aria-hidden="true"
-            class="dropdown icon"
-          />
           <div
+            aria-expanded="false"
             aria-multiselectable="true"
-            class="menu transition"
+            class="ui floating multiple dropdown"
             role="listbox"
+            tabindex="0"
           >
+            <label>
+              Select domains ...
+            </label>
+            <i
+              aria-hidden="true"
+              class="dropdown icon"
+            />
             <div
-              aria-checked="false"
-              aria-selected="true"
-              class="selected item"
-              role="option"
-              style="pointer-events: all;"
+              class="menu transition"
             >
               <div
-                class="text"
-                style="margin-left: 0px;"
+                class="ui left icon input search"
               >
+                <input
+                  type="text"
+                />
                 <i
                   aria-hidden="true"
-                  class="icon"
+                  class="search icon"
                 />
-                Domain 1
               </div>
-            </div>
-            <div
-              aria-checked="false"
-              aria-selected="false"
-              class="item"
-              role="option"
-              style="pointer-events: all;"
-            >
               <div
-                class="text"
-                style="margin-left: 0px;"
+                class="scrolling menu transition"
               >
-                <i
-                  aria-hidden="true"
-                  class="icon"
-                />
-                Domain 2
+                <div
+                  aria-selected="false"
+                  class="item"
+                  role="option"
+                >
+                  <div
+                    style="margin-left: 0px;"
+                  >
+                    <i
+                      aria-hidden="true"
+                      class="icon"
+                    />
+                    Domain 1
+                  </div>
+                </div>
+                <div
+                  aria-selected="false"
+                  class="item"
+                  role="option"
+                >
+                  <div
+                    style="margin-left: 0px;"
+                  >
+                    <i
+                      aria-hidden="true"
+                      class="icon"
+                    />
+                    Domain 2
+                  </div>
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="ui checked checkbox"
-    >
-      <input
-        checked=""
-        class="hidden"
-        readonly=""
-        tabindex="0"
-        type="checkbox"
-        value=""
-      />
-      <label>
-        Apply on children
-      </label>
-    </div>
-    <form
-      class="ui form"
-    >
+      <div
+        class="ui checked checkbox"
+      >
+        <input
+          checked=""
+          class="hidden"
+          readonly=""
+          tabindex="0"
+          type="checkbox"
+          value=""
+        />
+        <label>
+          Apply on children
+        </label>
+      </div>
       <div
         class="actions"
       >

package/src/reducers/__tests__/ddMessage.spec.js

@@ -17,7 +17,8 @@ describe("reducers: ddMessage", () => {
         data: {
           errors: [
             {
-              external_id: "postgres://Postgres-Test/postgres/public/city/city_id",
+              external_id:
+                "postgres://Postgres-Test/postgres/public/city/city_id",
               message: {
                 external_domain_ids: ["must exist: UEUEUEU"],
               },
@@ -42,7 +43,7 @@ describe("reducers: ddMessage", () => {
       header: "structures.bulkUploadStructuresDomains.success.header",
       icon: "check",
       color: "orange",
-      fields: { count_errors: 2, count_ids: 1}
+      fields: { count_errors: 2, count_ids: 1 },
     });
     const { messages: errors } = ddMsg;
     expect(errors.length).toEqual(2);
@@ -69,8 +70,4 @@ describe("reducers: ddMessage", () => {
       content: "invalid_headers, must be: external_id, domain_external_ids",
     });
   });
-
-
-
-
 });

package/src/routines.js

@@ -132,7 +132,9 @@ export const updateStructureTag = createRoutine("UPDATE_STRUCTURE_TAG");
 export const updateStructureType = createRoutine("UPDATE_STRUCTURE_TYPE");
 export const updateSystem = createRoutine("UPDATE_SYSTEM");
 export const uploadStructures = createRoutine("UPLOAD_STRUCTURES");
-export const uploadStructuresDomains = createRoutine("UPLOAD_STRUCTURES_DOMAINS");
+export const uploadStructuresDomains = createRoutine(
+  "UPLOAD_STRUCTURES_DOMAINS"
+);
 export const addGrantRequestToCart = createRoutine("ADD_GRANT_REQUEST_TO_CART");
 export const removeGrantRequestFromCart = createRoutine(
   "REMOVE_GRANT_REQUEST_FROM_CART"