@truedat/qx 7.5.9 → 7.5.10

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";

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";

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",

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

@@ -4,7 +4,6 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
 <div>
   <div
     class="ui left floated segment"
-    style=""
   >
     <div
       class="ui text container"
@@ -19,11 +18,11 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
         <div
           class="content"
         >
-          Quality control
+          quality_controls.new.header
           <div
             class="sub header"
           >
-            Edit quality control
+            quality_controls.edit.subheader
           </div>
         </div>
       </h2>
@@ -44,10 +43,9 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
               readonly=""
               tabindex="-1"
               type="radio"
-              value=""
             />
             <label>
-              Enable
+              quality_control.form.active
             </label>
           </div>
         </div>
@@ -57,7 +55,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
           <label
             class="field-label"
           >
-            Domains
+            quality_control.form.domain_ids
             <span>
               *
             </span>
@@ -127,7 +125,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
           <label
             class="field-label"
           >
-            Name
+            quality_control.form.name
             <span>
               *
             </span>
@@ -140,7 +138,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
             >
               <input
                 autocomplete="off"
-                placeholder="Name"
+                placeholder="dataViews.form.name"
                 type="text"
                 value="test"
               />
@@ -182,7 +180,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
           class="required field"
         >
           <label>
-            Source
+            dataViews.form.source
           </label>
           <div
             class="disabled field"
@@ -208,7 +206,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                 class="divider text"
                 role="alert"
               >
-                Select source
+                source.search.placeholder
               </div>
               <i
                 aria-hidden="true"
@@ -239,7 +237,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
           class="required field"
         >
           <label>
-            Control mode
+            quality_control.control_mode
           </label>
           <div
             aria-expanded="false"
@@ -253,7 +251,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
               class="divider text"
               role="alert"
             >
-              Percentage
+              quality_control.control_mode.percentage
             </div>
             <i
               aria-hidden="true"
@@ -272,7 +270,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                 <span
                   class="text"
                 >
-                  Percentage
+                  quality_control.control_mode.percentage
                 </span>
               </div>
               <div
@@ -285,7 +283,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                 <span
                   class="text"
                 >
-                  Deviation
+                  quality_control.control_mode.deviation
                 </span>
               </div>
               <div
@@ -311,7 +309,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                 <span
                   class="text"
                 >
-                  count
+                  quality_control.control_mode.count
                 </span>
               </div>
             </div>
@@ -326,7 +324,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
             <label
               class="field-label"
             >
-              Threshold
+              quality_control.score_criteria.percentage.minimum
               <span>
                 *
               </span>
@@ -339,7 +337,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
               >
                 <input
                   autocomplete="off"
-                  placeholder="Threshold"
+                  placeholder="quality_control.score_criteria.percentage.minimum"
                   type="text"
                   value="10"
                 />
@@ -352,7 +350,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
             <label
               class="field-label"
             >
-              Goal
+              quality_control.score_criteria.percentage.goal
               <span>
                 *
               </span>
@@ -365,7 +363,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
               >
                 <input
                   autocomplete="off"
-                  placeholder="Goal"
+                  placeholder="quality_control.score_criteria.percentage.goal"
                   type="text"
                   value="20"
                 />
@@ -380,7 +378,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
             class="required field"
           >
             <label>
-              Dataset
+              quality_control.form.control_properties.ratio.resource
             </label>
             <div
               aria-expanded="false"
@@ -394,7 +392,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                 class="divider text"
                 role="alert"
               >
-                Data structures
+                queryables.resource.type.data_structure
               </div>
               <i
                 aria-hidden="true"
@@ -413,7 +411,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                   <span
                     class="text"
                   >
-                    Data structures
+                    queryables.resource.type.data_structure
                   </span>
                 </div>
                 <div
@@ -426,7 +424,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                   <span
                     class="text"
                   >
-                    Reference datasets
+                    queryables.resource.type.reference_dataset
                   </span>
                 </div>
               </div>
@@ -440,7 +438,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
             >
               <input
                 class="action-pointer"
-                placeholder="Data Structure"
+                placeholder="queryables.resource.selector.data_structure"
                 required=""
                 type="text"
                 value="ACCOUNTING_RULES"
@@ -454,7 +452,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
               class="field"
             >
               <label>
-                Validation
+                quality_control.form.control_properties.ratio.validation
               </label>
               <div>
                 <div
@@ -507,7 +505,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                                         </code>
                                       </b>
                                     </small>
-                                    Constant
+                                    functions.expression.shape.constant
                                   </div>
                                 </div>
                                 <div
@@ -529,7 +527,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                                         </code>
                                       </b>
                                     </small>
-                                    Function
+                                    functions.expression.shape.function
                                   </div>
                                 </div>
                               </div>
@@ -566,7 +564,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                                       class="divider text"
                                       role="alert"
                                     >
-                                      Select a function of type boolean
+                                      functions.form.expression.function.placeholder
                                     </div>
                                     <i
                                       aria-hidden="true"
@@ -606,7 +604,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                     <button
                       class="ui mini button"
                     >
-                      Add expression
+                      expression.clause.action.addExpression
                     </button>
                   </div>
                 </div>
@@ -620,7 +618,7 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
                 <button
                   class="ui mini button"
                 >
-                  Add group
+                  expression.clause.action.addGroup
                 </button>
               </div>
             </div>
@@ -637,12 +635,12 @@ exports[`<EditQualityControl /> matches the latest snapshot 1`] = `
             disabled=""
             tabindex="-1"
           >
-            Save
+            actions.save
           </button>
           <button
             class="ui button"
           >
-            Cancel
+            actions.cancel
           </button>
         </div>
       </form>
@@ -669,11 +667,11 @@ exports[`<EditQualityControl /> matches the latest snapshot with empty qualityCo
         <div
           class="content"
         >
-          Quality control
+          quality_controls.new.header
           <div
             class="sub header"
           >
-            Edit quality control
+            quality_controls.edit.subheader
           </div>
         </div>
       </h2>