@truedat/qx 7.5.7 → 7.5.10

package/src/components/qualityControls/__tests__/QualityControlRow.spec.js

@@ -1,22 +1,18 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import { columns } from "../QualityControlsTable";
 import QualityControlRow from "../QualityControlRow";
 import { qualityControlData } from "./__fixtures__/qualityControlHelper";
 
-const mockHistory = {
-  push: jest.fn(),
-};
+const mockNavigate = jest.fn();
 
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
-  useHistory: () => mockHistory,
+jest.mock("react-router", () => ({
+  ...jest.requireActual("react-router"),
+  useNavigate: () => mockNavigate,
 }));
 
 const renderOpts = {
   messages,
-  fallback: "lazy",
 };
 
 const props = {

package/src/components/qualityControls/__tests__/QualityControlScores.spec.js

@@ -1,8 +1,6 @@
-import _ from "lodash/fp";
-import React from "react";
-import { render } from "@truedat/test/render";
 import { waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import { render, waitForLoad } from "@truedat/test/render";
 import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import {
@@ -12,8 +10,8 @@ import {
 import QualityControlScores from "../QualityControlScores";
 import { qualityControlData } from "./__fixtures__/qualityControlHelper";
 
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
+jest.mock("react-router", () => ({
+  ...jest.requireActual("react-router"),
   useParams: () => ({ id: "8", version: "1" }),
 }));
 
@@ -51,18 +49,18 @@ const context = {
 };
 
 describe("<QualityControlScores />", () => {
-  it("matches the latest snapshot", () => {
-    const { container } = render(
+  it("matches the latest snapshot", async () => {
+    const rendered = render(
       <TestFormWrapper context={context}>
         <QualityControlScores />
       </TestFormWrapper>,
       renderOpts
     );
-
-    expect(container).toMatchSnapshot();
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("shows a message when there are no scores", () => {
+  it("shows a message when there are no scores", async () => {
     useQualityControlScores.mockReturnValueOnce({
       data: { data: [] },
       loading: false,
@@ -76,17 +74,18 @@ describe("<QualityControlScores />", () => {
       mutate,
     };
 
-    const { getByText } = render(
+    const rendered = render(
       <TestFormWrapper context={context}>
         <QualityControlScores />
       </TestFormWrapper>,
       renderOpts
     );
+    await waitForLoad(rendered);
 
-    expect(getByText("No scores found")).toBeInTheDocument();
+    expect(rendered.getByText(/no scores found/i)).toBeInTheDocument();
   });
 
-  it("does not show delete button when user does not have delete_score action", () => {
+  it("does not show delete button when user does not have delete_score action", async () => {
     const context = {
       qualityControl: qualityControlData(),
       loading: false,
@@ -94,14 +93,15 @@ describe("<QualityControlScores />", () => {
       mutate,
     };
 
-    const { container } = render(
+    const rendered = render(
       <TestFormWrapper context={context}>
         <QualityControlScores />
       </TestFormWrapper>,
       renderOpts
     );
+    await waitForLoad(rendered);
 
-    const deleteButtons = container.querySelectorAll(
+    const deleteButtons = rendered.container.querySelectorAll(
       ".ui.red.basic.icon.button"
     );
 
@@ -119,19 +119,23 @@ describe("<QualityControlScores />", () => {
       trigger,
     }));
 
-    const { container, getByText } = render(
+    const user = userEvent.setup({ delay: null });
+
+    const rendered = render(
       <TestFormWrapper context={context}>
         <QualityControlScores />
       </TestFormWrapper>,
       renderOpts
     );
+    await waitForLoad(rendered);
 
-    const deleteButtons = container.querySelectorAll(
+    const deleteButtons = rendered.container.querySelectorAll(
       ".ui.red.basic.icon.button"
     );
 
-    userEvent.click(deleteButtons[0]);
-    userEvent.click(getByText(/confirm_yes/));
+    await user.click(deleteButtons[0]);
+    await user.click(rendered.getByText(/confirm_yes/i));
+
     await waitFor(() => {
       expect(trigger).toHaveBeenCalled();
     });

package/src/components/qualityControls/__tests__/QualityControlTabs.spec.js

@@ -1,10 +1,9 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import QualityControlTabs from "../QualityControlTabs";
 
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
+jest.mock("react-router", () => ({
+  ...jest.requireActual("react-router"),
   useParams: () => ({ id: "8", version: "1" }),
   useLocation: () => ({ pathname: "/qualityControls/8/version/1" }),
 }));

package/src/components/qualityControls/__tests__/QualityControls.spec.js

@@ -1,14 +1,12 @@
-import React from "react";
-import { render } from "@truedat/test/render";
-import { waitFor } from "@testing-library/react";
-import { within } from "@testing-library/dom";
 import userEvent from "@testing-library/user-event";
+import { within } from "@testing-library/dom";
+import { render, waitForLoad } from "@truedat/test/render";
+import { act } from "@testing-library/react";
 import { singleTemplateMock } from "@truedat/test/mocks";
 import SearchContext from "@truedat/core/search/SearchContext";
 import { useScoreGroupCreate } from "@truedat/qx/hooks/useScoreGroups";
-import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
-import QualityControls from "../QualityControls";
 import { qualityControlData } from "./__fixtures__/qualityControlHelper";
+import QualityControls from "../QualityControls";
 
 jest.mock("@truedat/core/hooks/useAuthorizedAction", () => ({
   ...jest.requireActual("@truedat/core/hooks/useAuthorizedAction"),
@@ -24,8 +22,6 @@ jest.mock("@truedat/qx/hooks/useScoreGroups", () => ({
 
 const renderOpts = {
   mocks: [singleTemplateMock({ scope: "qxe", domainIds: undefined })],
-  messages,
-  fallback: "loading",
 };
 
 const searchProps = {
@@ -43,18 +39,19 @@ const searchProps = {
 };
 
 describe("<QualityControls />", () => {
-  it("matches the latest snapshot", () => {
-    const { container } = render(
-      <SearchContext.Provider value={searchProps}>
+  it("matches the latest snapshot", async () => {
+    const rendered = render(
+      <SearchContext value={searchProps}>
         <QualityControls />
-      </SearchContext.Provider>,
+      </SearchContext>,
       renderOpts
     );
-
-    expect(container).toMatchSnapshot();
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
   it("activate/desactivate execution", async () => {
+    const user = userEvent.setup({ delay: null });
     const toggleHiddenFilterValue = jest.fn();
     const removeHiddenFilter = jest.fn();
 
@@ -63,53 +60,57 @@ describe("<QualityControls />", () => {
       toggleHiddenFilterValue,
       removeHiddenFilter,
     };
-    const { container, getByRole } = render(
-      <SearchContext.Provider value={thisSearchProps}>
+    const rendered = render(
+      <SearchContext value={thisSearchProps}>
         <QualityControls />
-      </SearchContext.Provider>,
+      </SearchContext>,
       renderOpts
     );
+    await waitForLoad(rendered);
 
     expect(
-      getByRole("button", { name: /Execute quality control/i })
+      rendered.getByRole("button", { name: /actions.do_execution/i })
     ).toBeDisabled();
 
-    userEvent.click(container.querySelector("#execute_checkbox"));
+    await user.click(rendered.container.querySelector("#execute_checkbox"));
 
     expect(toggleHiddenFilterValue).toHaveBeenCalledWith({
       filter: "for_execution",
       value: true,
     });
     expect(
-      getByRole("button", { name: /Execute quality control/i })
+      rendered.getByRole("button", { name: /actions.do_execution/i })
     ).toBeEnabled();
 
     expect(
-      container.querySelector("#row-checkbox-1").parentElement
+      rendered.container.querySelector("#row-checkbox-1").parentElement
     ).not.toHaveClass("checked");
 
-    userEvent.click(container.querySelector("#selectQualityControl"));
+    await user.click(rendered.container.querySelector("#selectQualityControl"));
 
     expect(
-      container.querySelector("#row-checkbox-1").parentElement
+      rendered.container.querySelector("#row-checkbox-1").parentElement
     ).toHaveClass("checked");
 
-    userEvent.click(container.querySelector("#row-checkbox-1"));
+    await user.click(rendered.container.querySelector("#row-checkbox-1"));
 
     expect(
-      container.querySelector("#row-checkbox-1").parentElement
+      rendered.container.querySelector("#row-checkbox-1").parentElement
     ).not.toHaveClass("checked");
 
-    userEvent.click(container.querySelector("#execute_checkbox"));
+    await user.click(rendered.container.querySelector("#execute_checkbox"));
 
     expect(removeHiddenFilter).toHaveBeenCalledWith({
       filter: "for_execution",
     });
 
-    expect(container.querySelector("#row-checkbox-1")).not.toBeInTheDocument();
+    expect(
+      rendered.container.querySelector("#row-checkbox-1")
+    ).not.toBeInTheDocument();
   });
 
   it("submit execution with search", async () => {
+    const user = userEvent.setup({ delay: null });
     const trigger = jest.fn(() =>
       Promise.resolve({ data: { data: { id: "9" } } })
     );
@@ -118,28 +119,32 @@ describe("<QualityControls />", () => {
       loading: false,
     }));
 
-    const { container, getByRole, queryByText } = render(
-      <SearchContext.Provider value={searchProps}>
+    const rendered = render(
+      <SearchContext value={searchProps}>
         <QualityControls />
-      </SearchContext.Provider>,
+      </SearchContext>,
       renderOpts
     );
+    await waitForLoad(rendered);
 
-    userEvent.click(container.querySelector("#execute_checkbox"));
+    await user.click(rendered.container.querySelector("#execute_checkbox"));
 
     expect(
-      getByRole("button", { name: /Execute quality control/i })
+      rendered.getByRole("button", { name: /actions.do_execution/i })
     ).toBeEnabled();
 
-    userEvent.click(getByRole("button", { name: /Execute quality control/i }));
+    await act(async () => {
+      await user.click(
+        rendered.getByRole("button", { name: /actions.do_execution/i })
+      );
+    });
 
-    await waitFor(() =>
-      expect(queryByText(/loading/i)).not.toBeInTheDocument()
-    );
-    await waitFor(() => expect(queryByText(/loader/i)).not.toBeInTheDocument());
+    await waitForLoad(rendered);
 
-    const modal = queryByText(/Quality controls execution/i).parentElement;
-    userEvent.click(within(modal).getByRole("button", { name: /Create/i }));
+    const modal = rendered.getByText(
+      /execution.confirmation.header/i
+    ).parentElement;
+    await user.click(within(modal).getByRole("button", { name: /create/i }));
 
     expect(trigger).toHaveBeenCalledWith({
       score_group: {
@@ -153,6 +158,8 @@ describe("<QualityControls />", () => {
   });
 
   it("submit execution with select", async () => {
+    const user = userEvent.setup({ delay: null });
+
     const trigger = jest.fn(() =>
       Promise.resolve({ data: { data: { id: "9" } } })
     );
@@ -161,34 +168,43 @@ describe("<QualityControls />", () => {
       loading: false,
     }));
 
-    const { container, getByRole, queryByText } = render(
-      <SearchContext.Provider value={searchProps}>
+    const rendered = render(
+      <SearchContext value={searchProps}>
         <QualityControls />
-      </SearchContext.Provider>,
+      </SearchContext>,
       renderOpts
     );
+    await waitForLoad(rendered);
 
-    userEvent.click(container.querySelector("#execute_checkbox"));
+    await user.click(rendered.container.querySelector("#execute_checkbox"));
 
     expect(
-      getByRole("button", { name: /Execute quality control/i })
+      rendered.getByRole("button", { name: /actions.do_execution/i })
     ).toBeEnabled();
 
-    userEvent.click(container.querySelector("#selectQualityControl"));
+    await user.click(rendered.container.querySelector("#selectQualityControl"));
 
     expect(
-      container.querySelector("#row-checkbox-1").parentElement
+      rendered.container.querySelector("#row-checkbox-1").parentElement
     ).toHaveClass("checked");
 
-    userEvent.click(getByRole("button", { name: /Execute quality control/i }));
+    await act(async () => {
+      await user.click(
+        rendered.getByRole("button", { name: /actions.do_execution/i })
+      );
+    });
+
+    await waitForLoad(rendered);
 
-    await waitFor(() =>
-      expect(queryByText(/loading/i)).not.toBeInTheDocument()
-    );
-    await waitFor(() => expect(queryByText(/loader/i)).not.toBeInTheDocument());
+    const modal = rendered.getByText(
+      /execution.confirmation.header/i
+    ).parentElement;
 
-    const modal = queryByText(/Quality controls execution/i).parentElement;
-    userEvent.click(within(modal).getByRole("button", { name: /Create/i }));
+    await user.click(
+      within(modal).getByRole("button", {
+        name: "actions.create",
+      })
+    );
 
     expect(trigger).toHaveBeenCalledWith({
       score_group: {

package/src/components/qualityControls/__tests__/QualityControlsLabelResults.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { SearchContextProvider } from "@truedat/core/search/SearchContext";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";

package/src/components/qualityControls/__tests__/QualityControlsPagination.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { SearchContextProvider } from "@truedat/core/search/SearchContext";
 import QualityControlsPagination from "../QualityControlsPagination";

package/src/components/qualityControls/__tests__/QualityControlsTable.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import SearchContext from "@truedat/core/search/SearchContext";
@@ -30,9 +29,9 @@ const props = {
 describe("<QualityControlsTable />", () => {
   it("matches the latest snapshot", () => {
     const { container } = render(
-      <SearchContext.Provider value={searchProps}>
+      <SearchContext value={searchProps}>
         <QualityControlsTable {...props} />
-      </SearchContext.Provider>,
+      </SearchContext>,
       renderOpts
     );
 

package/src/components/qualityControls/__tests__/ScoreCriteria.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
@@ -21,9 +20,9 @@ describe("<ScoreCriteria />", () => {
     expect(container).toMatchSnapshot();
   });
 
-  it("matches the latest snapshot for error_count", () => {
+  it("matches the latest snapshot for count", () => {
     const defaultValues = {
-      control_mode: "error_count",
+      control_mode: "count",
     };
     const { container } = render(
       <TestFormWrapper defaultValues={defaultValues}>
@@ -63,7 +62,7 @@ describe("<ScoreCriteria />", () => {
   [
     { controlMode: "deviation", expectedValue: { goal: null, maximum: null } },
     {
-      controlMode: "error_count",
+      controlMode: "count",
       expectedValue: { goal: null, maximum: null },
     },
     { controlMode: "percentage", expectedValue: { goal: null, minimum: null } },

package/src/components/qualityControls/__tests__/ScoreCriteriaView.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import ScoreCriteriaView from "../ScoreCriteriaView";
@@ -32,9 +31,25 @@ describe("<ScoreCriteriaView />", () => {
     expect(queryByText(/5/i)).toBeInTheDocument();
   });
 
-  it("view for error count", () => {
+  it("view for error_count", () => {
     const qc = qualityControlData({
       control_mode: "error_count",
+      score_criteria: {
+        goal: 5,
+        maximum: 30,
+      },
+    });
+    const { queryByText } = render(
+      <ScoreCriteriaView qualityControl={qc} />,
+      renderOpts
+    );
+
+    expect(queryByText(/5/i)).toBeInTheDocument();
+  });
+
+  it("view for count", () => {
+    const qc = qualityControlData({
+      control_mode: "count",
       score_criteria: {
         goal: 15,
         maximum: 40,
@@ -49,7 +64,7 @@ describe("<ScoreCriteriaView />", () => {
 
   it("view for empty score_criteria", () => {
     const qc = qualityControlData({
-      control_mode: "error_count",
+      control_mode: "count",
       score_criteria: undefined,
     });
     const { queryByText } = render(

package/src/components/qualityControls/__tests__/__fixtures__/qualityControlHelper.js

@@ -20,7 +20,7 @@ export const domains = [
 
 const qualityControl = {
   active: true,
-  id: 8,
+  id: "8",
   name: "test",
   updated_at: "2024-11-28T12:14:57.004822Z",
   status: "draft",
@@ -156,7 +156,7 @@ const qualityControl = {
           type: "data_structure",
         },
       },
-      control_mode: "error_count",
+      control_mode: "count",
       dynamic_content: {
         control_de_calidad: {
           origin: "user",

package/src/components/qualityControls/__tests__/__snapshots__/ControlProperties.spec.js.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<ControlProperties /> matches the latest snapshot with error count 1`] = `
+exports[`<ControlProperties /> matches the latest snapshot with count 1`] = `
 <div>
   <div
     class="ui segment"

package/src/components/qualityControls/__tests__/__snapshots__/ControlPropertiesView.spec.js.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<ControlPropertiesView /> matches the latest snapshot for empty control properties 1`] = `
+exports[`<ControlPropertiesView /> matches the latest snapshot for count 1`] = `
 <div>
   <h3
     class="ui header"
@@ -18,12 +18,42 @@ exports[`<ControlPropertiesView /> matches the latest snapshot for empty control
   <div
     class="ui segment"
   >
-    Empty control properties
+    <div
+      class="ui list"
+      role="list"
+    >
+      <div
+        class="item"
+        role="listitem"
+      >
+        <div
+          class="header"
+        >
+          Dataset
+        </div>
+        <div
+          class="content"
+        >
+          <div
+            class="description"
+          >
+            <div
+              class="ui horizontal label"
+            >
+              Data Structure
+            </div>
+            <div
+              class="ui blue label"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
   </div>
 </div>
 `;
 
-exports[`<ControlPropertiesView /> matches the latest snapshot for empty errors_resource 1`] = `
+exports[`<ControlPropertiesView /> matches the latest snapshot for empty control properties 1`] = `
 <div>
   <h3
     class="ui header"
@@ -41,31 +71,12 @@ exports[`<ControlPropertiesView /> matches the latest snapshot for empty errors_
   <div
     class="ui segment"
   >
-    <div
-      class="ui list"
-      role="list"
-    >
-      <div
-        class="item"
-        role="listitem"
-      >
-        <div
-          class="header"
-        >
-          Dataset
-        </div>
-        <div
-          class="content"
-        >
-          Empty Dataset
-        </div>
-      </div>
-    </div>
+    Empty control properties
   </div>
 </div>
 `;
 
-exports[`<ControlPropertiesView /> matches the latest snapshot for empty ratio validation and resource 1`] = `
+exports[`<ControlPropertiesView /> matches the latest snapshot for empty errors_resource 1`] = `
 <div>
   <h3
     class="ui header"
@@ -99,22 +110,7 @@ exports[`<ControlPropertiesView /> matches the latest snapshot for empty ratio v
         <div
           class="content"
         >
-          Empty resource
-        </div>
-      </div>
-      <div
-        class="item"
-        role="listitem"
-      >
-        <div
-          class="header"
-        >
-          Validation
-        </div>
-        <div
-          class="content"
-        >
-          Empty validation
+          Empty Dataset
         </div>
       </div>
     </div>
@@ -122,7 +118,7 @@ exports[`<ControlPropertiesView /> matches the latest snapshot for empty ratio v
 </div>
 `;
 
-exports[`<ControlPropertiesView /> matches the latest snapshot for error count 1`] = `
+exports[`<ControlPropertiesView /> matches the latest snapshot for empty ratio validation and resource 1`] = `
 <div>
   <h3
     class="ui header"
@@ -156,18 +152,22 @@ exports[`<ControlPropertiesView /> matches the latest snapshot for error count 1
         <div
           class="content"
         >
-          <div
-            class="description"
-          >
-            <div
-              class="ui horizontal label"
-            >
-              Data Structure
-            </div>
-            <div
-              class="ui blue label"
-            />
-          </div>
+          Empty resource
+        </div>
+      </div>
+      <div
+        class="item"
+        role="listitem"
+      >
+        <div
+          class="header"
+        >
+          Validation
+        </div>
+        <div
+          class="content"
+        >
+          Empty validation
         </div>
       </div>
     </div>