@truedat/bg 7.0.4 → 7.0.6

package/src/taxonomy/components/__tests__/DomainForm.spec.js

@@ -1,7 +1,112 @@
 import React from "react";
 import userEvent from "@testing-library/user-event";
+import { fireEvent } from "@testing-library/react";
+import { waitFor } from "@testing-library/react";
 import { render } from "@truedat/test/render";
 import { DomainForm } from "../DomainForm";
+import { useDomains } from "../../../hooks/useDomains";
+
+jest.mock("../../../hooks/useDomains", () => ({
+  ...jest.requireActual("../../../hooks/useDomains"),
+  useDomains: jest.fn(() => ({
+    data: [
+      {
+        description: "No tiene padre",
+        domain_group: null,
+        external_id: "1",
+        id: 1,
+        name: "domain_1",
+        parent_id: null,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "No tiene padre",
+        domain_group: null,
+        external_id: "2",
+        id: 2,
+        name: "domain_2",
+        parent_id: null,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "el padre es domain_2",
+        domain_group: null,
+        external_id: "3",
+        id: 3,
+        name: "domain_3",
+        parent_id: 2,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "el padre es domain_2",
+        domain_group: null,
+        external_id: "4",
+        id: 4,
+        name: "domain_4",
+        parent_id: 2,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "No tiene padre",
+        domain_group: null,
+        external_id: "5",
+        id: 5,
+        name: "domain_5",
+        parent_id: null,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "el padre es domain_5",
+        domain_group: null,
+        external_id: "6",
+        id: 6,
+        name: "domain_6",
+        parent_id: 5,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "el padre es domain_6",
+        domain_group: null,
+        external_id: "7",
+        id: 7,
+        name: "domain_7",
+        parent_id: 6,
+        parents: null,
+        type: null,
+      },
+    ],
+  })),
+}));
+
+const renderOpts = {
+  messages: {
+    en: {
+      "domain.label.domain_group": "New Group ",
+      "form.validation.required": "Prop is required",
+      "domain.props.parent": "Parent Domain",
+      "domain.selector.placeholder": "Select a domain...",
+      "domain.props.name": "Name",
+      "domain.props.name.placeholder": "Name-placeholder",
+      "domain.props.external_id": "External_id",
+      "domain.props.external_id.placeholder": "External_id-placeholder",
+      "domain.props.domain_group": "Domain_group",
+      "domain.props.domain_group.placeholder": "Domain_group-placeholder",
+      "domain.props.type": "Type",
+      "domain.props.type.placeholder": "Type-placeholder",
+      "domain.props.description.placeholder": "Description-placeholder",
+      "domain.props.description": "Description",
+      "actions.save": "Save",
+      "actions.cancel": "Cancel",
+    },
+  },
+  fallback: "lazy",
+};
 
 describe("<DomainForm />", () => {
   const onSubmit = jest.fn();
@@ -10,17 +115,97 @@ describe("<DomainForm />", () => {
   const props = { domain, onSubmit, isSubmitting };
 
   it("matches the latest snapshot", async () => {
-    const { container, findByRole } = render(<DomainForm {...props} />);
-    await findByRole("button", { name: "Save" });
+    const { container, queryByText } = render(
+      <DomainForm {...props} />,
+      renderOpts
+    );
+    await waitFor(() => expect(queryByText(/lazy/i)).not.toBeInTheDocument());
     expect(container).toMatchSnapshot();
   });
 
   it("enables submit when required fields have values", async () => {
     const props = { domain: {}, onSubmit: jest.fn() };
-    const { findByRole } = render(<DomainForm {...props} />);
+    const { findByRole } = render(<DomainForm {...props} />, renderOpts);
+
     expect(await findByRole("button", { name: "Save" })).toBeDisabled();
+
     userEvent.type(await findByRole("textbox", { name: "Name" }), "name");
-    userEvent.type(await findByRole("textbox", { name: "External Id" }), "id");
+    userEvent.type(await findByRole("textbox", { name: "External_id" }), "id");
+
     expect(await findByRole("button", { name: "Save" })).toBeEnabled();
   });
+
+  it("should generate unique domain group options", () => {
+    useDomains.mockImplementationOnce(() => ({
+      data: [
+        { domain_group: { name: "DomainGroup1" } },
+        { domain_group: { name: "DomainGroup2" } },
+        { domain_group: { name: "DomainGroup3" } },
+        { domain_group: null },
+        { domain_group: { name: "DomainGroup2" } },
+        { domain_group: { name: "DomainGroup3" } },
+        { domain_group: null },
+      ],
+    }));
+
+    const { getByText, getAllByRole } = render(
+      <DomainForm onSubmit={jest.fn()} />,
+      renderOpts
+    );
+
+    const domainGroupPlaceholder = getByText("Domain_group-placeholder");
+
+    fireEvent.click(domainGroupPlaceholder);
+
+    const options = getAllByRole("option").map((option) => option.textContent);
+
+    expect(options).toMatchObject([
+      "DomainGroup1",
+      "DomainGroup2",
+      "DomainGroup3",
+      "",
+    ]);
+  });
+
+  it("should generate unique type options", async () => {
+    useDomains.mockImplementationOnce(() => ({
+      data: [
+        { type: "Type1" },
+        { type: "Type2" },
+        { type: null },
+        { type: "Type3" },
+        { type: "Type1" },
+        { type: "Type4" },
+        { type: null },
+      ],
+    }));
+
+    const { getAllByRole } = render(
+      <DomainForm onSubmit={jest.fn()} />,
+      renderOpts
+    );
+
+    const options = getAllByRole("option").map((option) => option.textContent);
+
+    expect(options).toMatchObject(["", "Type1", "Type2", "Type3", "Type4"]);
+  });
+
+  it("should generate domain parent options", async () => {
+    const domain = { id: 2, parentable_ids: [1, 5, 6, 7] };
+
+    const { getAllByRole } = render(
+      <DomainForm domain={domain} onSubmit={jest.fn()} />,
+      renderOpts
+    );
+
+    const options = getAllByRole("option").map((option) => option.textContent);
+
+    expect(options).toMatchObject([
+      "domain_1",
+      "domain_5",
+      "domain_6",
+      "domain_7",
+      "",
+    ]);
+  });
 });

package/src/taxonomy/components/__tests__/DomainMembers.spec.js

@@ -12,9 +12,7 @@ jest.mock("react-router-dom", () => ({
 }));
 
 describe("<DomainMembers />", () => {
-  const props = {
-    type: "domain",
-  };
+  const props = { domainId: 1 };
 
   it("matches the latest snapshot", () => {
     const { container } = render(<DomainMembers {...props} />);

package/src/taxonomy/components/__tests__/DomainStructures.spec.js

@@ -68,13 +68,14 @@ describe("<DomainStructures />", () => {
           "No structures have been found matching these filters.",
       },
     },
-    state: { domain: { id: 1, name: "domain" } },
+    fallback: "lazy",
   };
 
   it("matches the latest snapshot", async () => {
+    const props = { domain: { id: 1, name: "domain" } };
     const { container, findByText } = render(
       <SearchContextWrapper>
-        <DomainStructures />
+        <DomainStructures {...props} />
       </SearchContextWrapper>,
       renderOpts
     );

package/src/taxonomy/components/__tests__/Domains.spec.js

@@ -1,14 +1,111 @@
 import React from "react";
 import { render } from "@truedat/test/render";
-import { Domains } from "../Domains";
+import Domains from "../Domains";
 
-describe("<Domains />", () => {
-  const createDomain = jest.fn();
-  const domainsLoading = false;
-  const props = { createDomain, domainsLoading };
+jest.mock("react-router-dom", () => ({
+  ...jest.requireActual("react-router-dom"),
+  useHistory: jest.fn(),
+  useParams: jest.fn(() => ({ id: 3 })),
+}));
+
+jest.mock("../../../hooks/useDomains", () => ({
+  ...jest.requireActual("../../../hooks/useDomains"),
+  useDomains: jest.fn(() => ({
+    data: [
+      {
+        description: "No tiene padre",
+        domain_group: null,
+        external_id: "1",
+        id: 1,
+        name: "element_1",
+        parent_id: null,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "No tiene padre",
+        domain_group: null,
+        external_id: "2",
+        id: 2,
+        name: "element_2",
+        parent_id: null,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "el padre es element_2",
+        domain_group: null,
+        external_id: "3",
+        id: 3,
+        name: "element_3",
+        parent_id: 2,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "el padre es element_2",
+        domain_group: null,
+        external_id: "4",
+        id: 4,
+        name: "element_4",
+        parent_id: 2,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "No tiene padre",
+        domain_group: null,
+        external_id: "5",
+        id: 5,
+        name: "element_5",
+        parent_id: null,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "el padre es element_5",
+        domain_group: null,
+        external_id: "6",
+        id: 6,
+        name: "element_6",
+        parent_id: 5,
+        parents: null,
+        type: null,
+      },
+      {
+        description: "el padre es element_6",
+        domain_group: null,
+        external_id: "7",
+        id: 7,
+        name: "element_7",
+        parent_id: 6,
+        parents: null,
+        type: null,
+      },
+    ],
+    actions: {
+      create: {
+        href: "/api/domains",
+        input: {},
+        method: "POST",
+      },
+      update: {
+        href: "/api/domains/:id",
+        input: {},
+        method: "PATCH",
+      },
+      index: {
+        href: "/api/domains",
+        input: {},
+        method: "GET",
+      },
+    },
+  })),
+}));
 
+describe("<Domains />", () => {
   it("matches the latest snapshot", () => {
-    const { container } = render(<Domains {...props} />);
+    const { container } = render(<Domains />);
     expect(container).toMatchSnapshot();
   });
 });

package/src/taxonomy/components/__tests__/EditDomain.spec.js

@@ -1,14 +1,65 @@
 import React from "react";
-import { shallow } from "enzyme";
+import { useHistory } from "react-router-dom";
+import { useQuery } from "@apollo/client";
+import { render } from "@truedat/test/render";
+import { useDomainUpdate } from "../../../hooks/useDomains";
 import { EditDomain } from "../EditDomain";
 
+jest.mock("react-router-dom", () => ({
+  ...jest.requireActual("react-router-dom"),
+  useHistory: jest.fn(),
+}));
+
+jest.mock("../../../hooks/useDomains", () => ({
+  ...jest.requireActual("../../../hooks/useDomains"),
+  useDomainUpdate: jest.fn(),
+}));
+
+jest.mock("@apollo/client", () => ({
+  ...jest.requireActual("@apollo/client"),
+  useQuery: jest.fn(),
+}));
+
+const renderOpts = {
+  messages: {
+    en: {
+      "actions.save": "Save",
+      "actions.cancel": "Cancel",
+      "domain.actions.edit.header": "Edit domain",
+      "domain.label.domain_group": "New Group ",
+      "domain.props.name": "Name",
+      "domain.props.name.placeholder": "Name-placeholder",
+      "domain.props.external_id": "External_id",
+      "domain.props.external_id.placeholder": "External_id-placeholder",
+      "domain.props.domain_group": "Domain_group",
+      "domain.props.domain_group.placeholder": "Domain_group-placeholder",
+      "domain.props.type": "Type",
+      "domain.props.type.placeholder": "Type-placeholder",
+      "domain.props.description.placeholder": "Description-placeholder",
+      "domain.props.description": "Description",
+      "form.validation.required": "{prop} is required",
+    },
+  },
+  fallback: "lazy",
+};
+
 describe("<EditDomain />", () => {
-  const updateDomain = jest.fn();
+  const mockHistoryPush = jest.fn();
+  const mockCreateDomain = jest.fn();
+  const mockClientResetStore = jest.fn();
+
   const domain = { id: 1, name: "nn", description: "dd" };
-  const props = { domain, updateDomain };
+
+  beforeEach(() => {
+    useHistory.mockReturnValue({ push: mockHistoryPush });
+    useDomainUpdate.mockReturnValue({ trigger: mockCreateDomain });
+    useQuery.mockReturnValue({
+      client: { resetStore: mockClientResetStore },
+    });
+  });
 
   it("matches the latest snapshot", () => {
-    const wrapper = shallow(<EditDomain {...props} />);
-    expect(wrapper).toMatchSnapshot();
+    const { container } = render(<EditDomain domain={domain} />, renderOpts);
+    expect(container).toMatchSnapshot();
   });
 });

package/src/taxonomy/components/__tests__/NewDomain.spec.js

@@ -1,14 +1,73 @@
 import React from "react";
-import { shallow } from "enzyme";
+import { useHistory } from "react-router-dom";
+import { useQuery } from "@apollo/client";
+import { render } from "@truedat/test/render";
+import { useDomainCreate } from "../../../hooks/useDomains";
 import { NewDomain } from "../NewDomain";
 
+jest.mock("react-router-dom", () => ({
+  ...jest.requireActual("react-router-dom"),
+  useHistory: jest.fn(),
+}));
+
+jest.mock("../../../hooks/useDomains", () => ({
+  ...jest.requireActual("../../../hooks/useDomains"),
+  useDomainCreate: jest.fn(),
+}));
+
+jest.mock("@apollo/client", () => ({
+  ...jest.requireActual("@apollo/client"),
+  useQuery: jest.fn(),
+}));
+
+const renderOpts = {
+  messages: {
+    en: {
+      "domains.actions.create": "New domain",
+      "domain.actions.create": "New subdomain",
+      "domain.props.name": "Name",
+      "domain.props.name.placeholder": "Name-placeholder",
+      "domain.props.external_id": "External_id",
+      "domain.props.external_id.placeholder": "External_id-placeholder",
+      "domain.props.domain_group": "Domain_group",
+      "domain.props.domain_group.placeholder": "Domain_group-placeholder",
+      "domain.props.type": "Type",
+      "domain.props.type.placeholder": "Type-placeholder",
+      "domain.props.description.placeholder": "Description-placeholder",
+      "domain.props.description": "Description",
+      "actions.save": "Save",
+      "actions.cancel": "Cancel",
+      "domain.label.domain_group": "New Group ",
+      "domain.props.external_id": "External Id",
+      "form.validation.required": "{prop} is required",
+      "navigation.glossary.taxonomy": "Taxonomy",
+    },
+  },
+  fallback: "lazy",
+};
+
 describe("<NewDomain />", () => {
-  const createDomain = jest.fn();
+  const mockHistoryPush = jest.fn();
+  const mockCreateDomain = jest.fn();
+  const mockClientResetStore = jest.fn();
+
   const domain = { id: 1, name: "nn", description: "dd" };
-  const props = { domain, createDomain };
 
-  it("matches the latest snapshot", () => {
-    const wrapper = shallow(<NewDomain {...props} />);
-    expect(wrapper).toMatchSnapshot();
+  beforeEach(() => {
+    useHistory.mockReturnValue({ push: mockHistoryPush });
+    useDomainCreate.mockReturnValue({ trigger: mockCreateDomain });
+    useQuery.mockReturnValue({
+      client: { resetStore: mockClientResetStore },
+    });
+  });
+
+  it("matches the latest snapshot main domain", () => {
+    const { container } = render(<NewDomain domain={null} />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+
+  it("matches the latest snapshot subdomain", () => {
+    const { container } = render(<NewDomain domain={domain} />, renderOpts);
+    expect(container).toMatchSnapshot();
   });
 });

package/src/taxonomy/components/__tests__/__snapshots__/AddDomainMember.spec.js.snap

@@ -2,16 +2,6 @@
 
 exports[`<AddDomainMember /> matches the latest snapshot 1`] = `
 <div>
-  <div
-    class="ui breadcrumb"
-  >
-    <a
-      class="active section"
-      href="/domains"
-    >
-      Taxonomy
-    </a>
-  </div>
   <div
     class="ui segment ui text container"
   >

package/src/taxonomy/components/__tests__/__snapshots__/Domain.spec.js.snap

@@ -2,25 +2,6 @@
 
 exports[`<Domain /> matches the latest snapshot 1`] = `
 <div>
-  <div
-    class="ui breadcrumb"
-  >
-    <a
-      class="section"
-      href="/domains"
-    >
-      Taxonomy
-    </a>
-    <i
-      aria-hidden="true"
-      class="right angle icon divider"
-    />
-    <div
-      class="active section"
-    >
-      DOMAIN NAME
-    </div>
-  </div>
   <div
     class="ui segment"
   >
@@ -28,47 +9,47 @@ exports[`<Domain /> matches the latest snapshot 1`] = `
       class="ui grid"
     >
       <div
-        class="eight wide column"
+        class="row"
       >
-        <h2
-          class="ui header"
+        <div
+          class="eight wide column"
         >
-          <i
-            aria-hidden="true"
-            class="cube icon"
-          />
-          <div
-            class="content"
+          <h2
+            class="ui header"
           >
-            DOMAIN NAME
+            <i
+              aria-hidden="true"
+              class="cube icon"
+            />
             <div
-              class="sub header"
+              class="content"
             >
-              Domain
+              DOMAIN NAME
+              <div
+                class="sub header"
+              >
+                Domain
+              </div>
             </div>
-          </div>
-        </h2>
+          </h2>
+        </div>
+        <div
+          class="right aligned eight wide column"
+        />
       </div>
       <div
-        class="right aligned eight wide column"
-      />
+        class="row"
+      >
+        <div
+          class="column"
+        >
+          DOMAIN DESCRIPTION
+        </div>
+      </div>
     </div>
-    <p />
     <div
       class="ui pointing secondary top attached tabular menu"
     >
-      <a
-        class="active item"
-        href="/domains/3"
-      >
-        Subdomains
-      </a>
-      <a
-        class="item"
-        href="/domains/3/members"
-      >
-        Members
-      </a>
       <a
         class="item"
         href="/domains/3/concepts"
@@ -87,6 +68,12 @@ exports[`<Domain /> matches the latest snapshot 1`] = `
       >
         Data Quality
       </a>
+      <a
+        class="item"
+        href="/domains/3/members"
+      >
+        Members
+      </a>
     </div>
     <div
       class="ui bottom attached segment"