@truedat/dd 4.51.1 → 4.51.3

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

@@ -2,14 +2,17 @@ import React from "react";
 import { waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { render } from "@truedat/test/render";
+import { domainsMock } from "@truedat/test/mocks";
 import { EditDomainForm } from "../EditDomainForm";
 
+const mocks = [domainsMock({ action: "manageStructuresDomain" })];
+
 describe("<EditDomainForm />", () => {
   const updateStructure = jest.fn();
 
   const domains = [
-    { id: 1, name: "Domain 1", level: 0 },
-    { id: 2, name: "Domain 2", level: 0 },
+    { id: 1, name: "fooDomain", level: 0 },
+    { id: 2, name: "barDomain", level: 0 },
   ];
 
   const structure = {
@@ -20,61 +23,46 @@ describe("<EditDomainForm />", () => {
     title: "title",
     updateStructure,
     structure,
-    domainOptions: domains,
   };
 
-  const messages = {
-    en: {
-      "structure.edit_domain.title": "Edit domain",
-      "structureDomain.actions.update": "Update",
-      "structureDomain.actions.update.inherit": "Apply on children",
-      "domain.selector.label": "Domain",
-      "domain.selector.placeholder": "Select a domain...",
-      "domain.multiple.placeholder": "Select domains ...",
-    },
-  };
+  const renderOpts = { mocks, state: { domains } };
 
   beforeEach(() => {
     jest.clearAllMocks();
   });
 
   it("matches the latest snapshot", () => {
-    const { container } = render(<EditDomainForm {...props} />, {
-      state: { domains },
-      messages,
-    });
+    const { container } = render(<EditDomainForm {...props} />, renderOpts);
     expect(container).toMatchSnapshot();
   });
 
   it("enables send button when selecting domain", async () => {
-    const { getByRole } = render(<EditDomainForm {...props} />, {
-      state: { domains },
-      messages,
-    });
+    const { getByRole, findByText } = render(
+      <EditDomainForm {...props} />,
+      renderOpts
+    );
 
     const button = getByRole("button", { name: /update/i });
-    const option = getByRole("option", { name: /Domain 1/i });
 
     expect(button).toBeDisabled();
-    userEvent.click(option);
+    userEvent.click(await findByText("fooDomain"));
     await waitFor(() => {
       expect(button).not.toBeDisabled();
     });
   });
 
   it("invokes function when send button clicked", async () => {
-    const { getByRole } = render(<EditDomainForm {...props} />, {
-      state: { domains },
-      messages,
-    });
+    const { getByRole, findByText } = render(
+      <EditDomainForm {...props} />,
+      renderOpts
+    );
 
     const button = getByRole("button", { name: /update/i });
     const checkbox = getByRole("checkbox");
-    const option = getByRole("option", { name: /Domain 1/i });
 
     expect(button).toBeDisabled();
     expect(checkbox).toBeChecked();
-    userEvent.click(option);
+    userEvent.click(await findByText("fooDomain"));
     await waitFor(() => {
       expect(button).not.toBeDisabled();
     });
@@ -84,7 +72,7 @@ describe("<EditDomainForm />", () => {
     });
     expect(updateStructure).toHaveBeenCalledWith(
       expect.objectContaining({
-        data_structure: { domain_ids: [1], id: 42 },
+        data_structure: { domain_ids: ["1"], id: 42 },
         inherit: true,
         redirect: "/structures/42/notes",
       })
@@ -92,18 +80,17 @@ describe("<EditDomainForm />", () => {
   });
 
   it("invokes function when send button clicked with modified inheritance", async () => {
-    const { getByRole } = render(<EditDomainForm {...props} />, {
-      state: { domains },
-      messages,
-    });
+    const { getByRole, findByText } = render(
+      <EditDomainForm {...props} />,
+      renderOpts
+    );
 
     const button = getByRole("button", { name: /update/i });
     const checkbox = getByRole("checkbox");
-    const option = getByRole("option", { name: /Domain 1/i });
 
     expect(button).toBeDisabled();
     expect(checkbox).toBeChecked();
-    userEvent.click(option);
+    userEvent.click(await findByText("fooDomain"));
     userEvent.click(checkbox);
     await waitFor(() => {
       expect(button).not.toBeDisabled();
@@ -114,7 +101,7 @@ describe("<EditDomainForm />", () => {
     });
     expect(updateStructure).toHaveBeenCalledWith(
       expect.objectContaining({
-        data_structure: { domain_ids: [1], id: 42 },
+        data_structure: { domain_ids: ["1"], id: 42 },
         inherit: false,
         redirect: "/structures/42/notes",
       })
@@ -122,20 +109,18 @@ describe("<EditDomainForm />", () => {
   });
 
   it("send selected multiple domain ids when button clicked", async () => {
-    const { getByRole } = render(<EditDomainForm {...props} />, {
-      state: { domains },
-      messages,
-    });
+    const { getByRole, findByText } = render(
+      <EditDomainForm {...props} />,
+      renderOpts
+    );
 
     const button = getByRole("button", { name: /update/i });
     const checkbox = getByRole("checkbox");
-    const optionOne = getByRole("option", { name: /Domain 1/i });
-    const optionTwo = getByRole("option", { name: /Domain 2/i });
 
     expect(button).toBeDisabled();
     expect(checkbox).toBeChecked();
-    userEvent.click(optionTwo);
-    userEvent.click(optionOne);
+    userEvent.click(await findByText("barDomain"));
+    userEvent.click(await findByText("fooDomain"));
     await waitFor(() => {
       expect(button).not.toBeDisabled();
     });
@@ -145,7 +130,7 @@ describe("<EditDomainForm />", () => {
     });
     expect(updateStructure).toHaveBeenCalledWith(
       expect.objectContaining({
-        data_structure: { domain_ids: [2, 1], id: 42 },
+        data_structure: { domain_ids: ["2", "1"], id: 42 },
         inherit: true,
         redirect: "/structures/42/notes",
       })

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

@@ -1,25 +1,22 @@
-import React, { Suspense } from "react";
+import React from "react";
 import { waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { intl } from "@truedat/test/intl-stub";
 import { render } from "@truedat/test/render";
-import { createStore } from "redux";
-import { Provider } from "react-redux";
+import { domainsMock } from "@truedat/test/mocks";
 import { LineageForm } from "../LineageForm";
 
-// workaround for enzyme issue with React.useContext
-// see https://github.com/airbnb/enzyme/issues/2176#issuecomment-532361526
-jest.spyOn(React, "useContext").mockImplementation(() => intl);
+const mocks = [domainsMock({ action: "viewLineage" })];
+const renderOpts = { mocks };
 
 describe("<LineageForm />", () => {
   const fetchNodes = jest.fn();
   const groupOptions = [
     [
-      { key: "foo", text: "foo", value: "foo" },
-      { key: "bar", text: "bar", value: "bar" },
+      { key: "grp1", text: "grp1", value: "grp1" },
+      { key: "grp2", text: "grp2", value: "grp2" },
     ],
   ];
-  const resourceOptions = [{ key: "xyz", text: "xyz", value: "xyz" }];
+  const resourceOptions = [{ key: "res1", text: "res1", value: "res1" }];
   const props = {
     createGraph: jest.fn(),
     clearNodes: jest.fn(),
@@ -36,100 +33,62 @@ describe("<LineageForm />", () => {
   };
 
   it("matches the latest snapshot", () => {
-    const messages = {};
-    const store = createStore(() => ({ unitDomains: [] }));
-    const { container } = render(
-      <Provider store={store}>
-        <Suspense fallback={null}>
-          <LineageForm {...props} />
-        </Suspense>
-      </Provider>,
-      {
-        messages,
-      }
-    );
+    const { container } = render(<LineageForm {...props} />, renderOpts);
     expect(container).toMatchSnapshot();
   });
 
   it("selecting group will call selectGroup function", async () => {
     const selectGroup = jest.fn();
-    const messages = {};
-    const store = createStore(() => ({ unitDomains: [] }));
     const { getByRole } = render(
-      <Provider store={store}>
-        <Suspense fallback={null}>
-          <LineageForm {...props} selectGroup={selectGroup} />
-        </Suspense>
-      </Provider>,
-      {
-        messages,
-      }
+      <LineageForm {...props} selectGroup={selectGroup} />,
+      renderOpts
     );
     await waitFor(() => {
-      expect(getByRole("option", { name: /foo/i })).toBeTruthy();
+      expect(getByRole("option", { name: /grp1/i })).toBeInTheDocument();
     });
 
-    userEvent.click(getByRole("option", { name: /foo/i }));
+    userEvent.click(getByRole("option", { name: /grp1/i }));
 
     expect(selectGroup.mock.calls.length).toBe(1);
-    expect(selectGroup.mock.calls[0]).toEqual([{ id: "foo" }]);
+    expect(selectGroup.mock.calls[0]).toEqual([{ id: "grp1" }]);
   });
 
   it("selecting resources will call selectResources function", async () => {
     const selectResources = jest.fn();
-    const messages = {};
-    const store = createStore(() => ({ unitDomains: [] }));
     const { getByRole } = render(
-      <Provider store={store}>
-        <Suspense fallback={null}>
-          <LineageForm {...props} selectResources={selectResources} />
-        </Suspense>
-      </Provider>,
-      {
-        messages,
-      }
+      <LineageForm {...props} selectResources={selectResources} />,
+      renderOpts
     );
     await waitFor(() => {
-      expect(getByRole("option", { name: /foo/i })).toBeTruthy();
+      expect(getByRole("option", { name: /grp1/i })).toBeInTheDocument();
     });
 
-    userEvent.click(getByRole("option", { name: /foo/i }));
+    userEvent.click(getByRole("option", { name: /grp1/i }));
 
     await waitFor(() => {
-      expect(getByRole("option", { name: /xyz/i })).toBeTruthy();
+      expect(getByRole("option", { name: /res1/i })).toBeInTheDocument();
     });
 
-    userEvent.click(getByRole("option", { name: /xyz/i }));
+    userEvent.click(getByRole("option", { name: /res1/i }));
 
     expect(selectResources.mock.calls.length).toBe(1);
-    expect(selectResources.mock.calls[0]).toEqual([["xyz"]]);
+    expect(selectResources.mock.calls[0]).toEqual([["res1"]]);
   });
 
   it("handle submit action", async () => {
     const selectedResources = ["id1", "id2"];
     const createGraph = jest.fn();
-    const messages = {};
-    const store = createStore(() => ({ unitDomains: [] }));
-    const { getByRole } = render(
-      <Provider store={store}>
-        <Suspense fallback={null}>
-          <LineageForm
-            {...props}
-            createGraph={createGraph}
-            selectedResources={selectedResources}
-          />
-        </Suspense>
-      </Provider>,
-      {
-        messages,
-      }
+    const { findByText, findByRole } = render(
+      <LineageForm
+        {...props}
+        createGraph={createGraph}
+        selectedResources={selectedResources}
+      />,
+      renderOpts
     );
 
-    await waitFor(() => {
-      userEvent.click(
-        getByRole("button", { name: "navigation.lineage.lineage" })
-      );
-    });
+    userEvent.click(await findByText("fooDomain"));
+    userEvent.click(await findByRole("button", { name: "Lineage" }));
 
     expect(createGraph.mock.calls.length).toBe(1);
     expect(createGraph.mock.calls[0]).toEqual([
@@ -138,65 +97,21 @@ describe("<LineageForm />", () => {
   });
 
   it("calls clearNodes when component unmounts but not when it mounts", async () => {
-    const f = jest.fn();
-    const messages = {};
-    const store = createStore(() => ({ unitDomains: [] }));
+    const clearNodes = jest.fn();
     const { unmount } = render(
-      <Provider store={store}>
-        <Suspense fallback={null}>
-          <LineageForm {...props} resourceOptions={[]} clearNodes={f} />
-        </Suspense>
-      </Provider>,
-      {
-        messages,
-      }
+      <LineageForm {...props} resourceOptions={[]} clearNodes={clearNodes} />,
+      renderOpts
     );
-    expect(f).toHaveBeenCalledTimes(0);
+    expect(clearNodes).toHaveBeenCalledTimes(0);
     unmount();
-    expect(f).toHaveBeenCalledTimes(1);
+    expect(clearNodes).toHaveBeenCalledTimes(1);
   });
 
   it("handles domain selection", async () => {
-    const messages = {};
-    const domainOptions = [
-      {
-        id: 1,
-        name: "Domain 1",
-        level: 0,
-        ancestors: [],
-        children: [{ id: 2, name: "Domain 2", level: 1 }],
-        descendents: [{ id: 2, name: "Domain 2", level: 1 }],
-      },
-      {
-        id: 2,
-        name: "Domain 2",
-        level: 1,
-        children: [],
-        ancestors: [
-          {
-            id: 1,
-            name: "Domain 1",
-          },
-        ],
-      },
-      { id: 3, name: "Domain 3", level: 0, children: [], ancestors: [] },
-    ];
-    const store = createStore(() => ({
-      domains: [],
-    }));
-    const { getByRole } = render(
-      <Provider store={store}>
-        <Suspense fallback={null}>
-          <LineageForm {...props} domainOptions={domainOptions} />
-        </Suspense>
-      </Provider>,
-      {
-        messages,
-      }
-    );
+    const { getByRole } = render(<LineageForm {...props} />, renderOpts);
     await waitFor(() => {
-      userEvent.click(getByRole("option", { name: /Domain 1/i }));
+      userEvent.click(getByRole("option", { name: /fooDomain/i }));
     });
-    expect(fetchNodes).toHaveBeenCalledWith({ domain_id: 1 });
+    expect(fetchNodes).toHaveBeenCalledWith({ domain_id: "1" });
   });
 });

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

@@ -7,8 +7,8 @@ const props = {
   structureNote: {
     id: "7207",
     status: "draft",
-    data_structure: {
-      current_version: {
+    dataStructure: {
+      currentVersion: {
         name: "bar",
         path: ["bar rute"],
       },

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

@@ -1,13 +1,13 @@
 import React, { Suspense } from "react";
 import { waitFor } from "@testing-library/react";
 import { render } from "@truedat/test/render";
-import PendingStructureNotes, {
-  STRUCTURE_NOTES,
-} from "../PendingStructureNotes";
+import { domainsMock } from "@truedat/test/mocks";
+import { STRUCTURE_NOTES_QUERY } from "../../api/queries";
+import PendingStructureNotes from "../PendingStructureNotes";
 
 const domains = [
-  { id: 1, name: "Domain 1", level: 0 },
-  { id: 2, name: "Domain 2", level: 0 },
+  { id: "1", name: "Domain 1", level: 0 },
+  { id: "2", name: "Domain 2", level: 0 },
 ];
 const systems = [
   { external_id: "some_external_id", id: 10, name: "some system" },
@@ -19,8 +19,8 @@ const structureNotes = {
     {
       id: "7207",
       status: "draft",
-      data_structure: {
-        current_version: {
+      dataStructure: {
+        currentVersion: {
           name: "bar",
           path: ["bar rute"],
         },
@@ -31,8 +31,8 @@ const structureNotes = {
     {
       id: "665214",
       status: "rejected",
-      data_structure: {
-        current_version: {
+      dataStructure: {
+        currentVersion: {
           name: "foo",
           path: ["foo rute", "other route"],
         },
@@ -44,21 +44,19 @@ const structureNotes = {
 };
 
 const structureNotesMock = {
-  request: { query: STRUCTURE_NOTES },
+  request: { query: STRUCTURE_NOTES_QUERY },
   result: { data: { structureNotes } },
 };
 
 const renderOpts = {
-  mocks: [structureNotesMock],
+  mocks: [structureNotesMock, domainsMock({ action: "publishStructureNote" })],
   state: { domains, systems },
 };
 
 describe("<PendingStructureNotes />", () => {
   it("matches the latest snapshot", async () => {
     const { container, queryByText } = render(
-      <Suspense fallback={null}>
-        <PendingStructureNotes />
-      </Suspense>,
+      <PendingStructureNotes />,
       renderOpts
     );
     expect(container).toMatchSnapshot();
@@ -68,7 +66,7 @@ describe("<PendingStructureNotes />", () => {
     });
 
     await waitFor(() => {
-      expect(queryByText(/Domain 1/)).toBeTruthy();
+      expect(queryByText(/fooDomain/)).toBeTruthy();
     });
   });
 });

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

@@ -15,77 +15,8 @@ exports[`<EditDomainForm /> matches the latest snapshot 1`] = `
       class="ui form"
     >
       <div
-        class="ui segment"
-      >
-        <div
-          class="field"
-        >
-          <div
-            aria-expanded="false"
-            aria-multiselectable="true"
-            class="ui floating multiple dropdown"
-            role="listbox"
-            tabindex="0"
-          >
-            <label>
-              Select domains ...
-            </label>
-            <i
-              aria-hidden="true"
-              class="dropdown icon"
-            />
-            <div
-              class="menu transition"
-            >
-              <div
-                class="ui left icon input search"
-              >
-                <input
-                  type="text"
-                />
-                <i
-                  aria-hidden="true"
-                  class="search icon"
-                />
-              </div>
-              <div
-                class="scrolling menu transition"
-              >
-                <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>
+        class="ui loading segment"
+      />
       <div
         class="ui checked checkbox"
       >

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

@@ -4,7 +4,6 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
 <div>
   <div
     class="ui segment"
-    style="display: none;"
   >
     <div
       class="accordion ui"
@@ -19,7 +18,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
             aria-hidden="true"
             class="dropdown icon"
           />
-          lineage.form.header
+          Select Structures
         </h4>
       </div>
       <div
@@ -51,7 +50,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
                 class="divider default text"
                 role="alert"
               >
-                lineage.group.placeholder
+                Select Top Level Structure
               </div>
               <i
                 aria-hidden="true"
@@ -71,7 +70,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
                   <span
                     class="text"
                   >
-                    foo
+                    grp1
                   </span>
                 </div>
                 <div
@@ -84,7 +83,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
                   <span
                     class="text"
                   >
-                    bar
+                    grp2
                   </span>
                 </div>
               </div>
@@ -115,7 +114,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
                 class="divider default text"
                 role="alert"
               >
-                lineage.resources.placeholder
+                Select Child Structures
               </div>
               <i
                 aria-hidden="true"
@@ -136,7 +135,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
                   <span
                     class="text"
                   >
-                    xyz
+                    res1
                   </span>
                 </div>
               </div>
@@ -145,7 +144,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
           <h5
             class="ui header"
           >
-            lineage.form.levels.header
+            Levels
           </h5>
           <div
             class="fields"
@@ -169,7 +168,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
                     value="all"
                   />
                   <label>
-                    lineage.form.levels.all.label
+                    All
                   </label>
                 </div>
               </div>
@@ -194,7 +193,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
                     value="select"
                   />
                   <label>
-                    lineage.form.levels.select.label
+                    Depth
                   </label>
                 </div>
               </div>
@@ -209,7 +208,7 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
               <input
                 autocomplete="off"
                 min="1"
-                placeholder="lineage.form.levels.select.input"
+                placeholder="Select..."
                 type="number"
                 value="4"
               />
@@ -220,21 +219,21 @@ exports[`<LineageForm /> matches the latest snapshot 1`] = `
             disabled=""
             tabindex="-1"
           >
-            navigation.lineage.clean
+            Clean Selection
           </button>
           <button
             class="ui small primary disabled button"
             disabled=""
             tabindex="-1"
           >
-            navigation.lineage.impact
+            Impact
           </button>
           <button
             class="ui small primary disabled button"
             disabled=""
             tabindex="-1"
           >
-            navigation.lineage.lineage
+            Lineage
           </button>
           <span>
             <button