@truedat/qx 8.5.1 → 8.5.2

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

@@ -1,11 +1,24 @@
-import userEvent from "@testing-library/user-event";
-import { waitFor } from "@testing-library/react";
+import { fireEvent } from "@testing-library/react";
 import { render, waitForLoad } from "@truedat/test/render";
 import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
 import { REFERENCE_DATASETS_HEADERS_QUERY } from "@truedat/dd/api/queries";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import ControlProperties, { defaultForMode } from "../ControlProperties";
 
+jest.mock("@truedat/cx/sources/components/SourceSelector", () => ({
+  __esModule: true,
+  default: ({ onChange, value, disabled }) => (
+    <button
+      data-testid="mock-source-selector"
+      disabled={disabled}
+      onClick={() => onChange(null, { value: "999" })}
+      type="button"
+    >
+      {value}
+    </button>
+  ),
+}));
+
 const dataSet = {
   id: "7",
   name: "dataset1",
@@ -39,43 +52,61 @@ describe("<ControlProperties />", () => {
       <TestFormWrapper defaultValues={defaultValues}>
         <ControlProperties />
       </TestFormWrapper>,
-      renderOpts
+      renderOpts,
     );
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
-  it("matches the latest snapshot with count", async () => {
-    const countDefaultValues = {
+  it("matches the latest snapshot with error_count", async () => {
+    const errorCountDefaultValues = {
       ...defaultValues,
-      control_mode: "count",
+      control_mode: "error_count",
     };
     const rendered = render(
-      <TestFormWrapper defaultValues={countDefaultValues}>
+      <TestFormWrapper defaultValues={errorCountDefaultValues}>
         <ControlProperties />
       </TestFormWrapper>,
-      renderOpts
+      renderOpts,
     );
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
+
+  it("updates source field when source selector changes", async () => {
+    const rendered = render(
+      <TestFormWrapper defaultValues={defaultValues}>
+        <ControlProperties />
+      </TestFormWrapper>,
+      renderOpts,
+    );
+    await waitForLoad(rendered);
+    expect(rendered.getByTestId("mock-source-selector")).toHaveTextContent("181");
+    fireEvent.click(rendered.getByTestId("mock-source-selector"));
+    expect(rendered.getByTestId("mock-source-selector")).toHaveTextContent("999");
+  });
 });
 
+const defaultValidation = [
+  {
+    expressions: [{ shape: "function", value: { isCondition: true } }],
+  },
+];
+
 describe("defaultForMode", () => {
-  it("returns correct default for 'count' control mode", () => {
-    const result = defaultForMode("count");
-    expect(result).toEqual({ errors_resource: null });
+  it("returns correct default for 'error_count' control mode", () => {
+    const result = defaultForMode("error_count");
+    expect(result).toEqual({
+      errors_resource: null,
+      validation: defaultValidation,
+    });
   });
 
   it("returns correct default for other control modes", () => {
     const result = defaultForMode("some_other_mode");
     expect(result).toEqual({
       resource: null,
-      validation: [
-        {
-          expressions: [{ shape: "function", value: { isCondition: true } }],
-        },
-      ],
+      validation: defaultValidation,
     });
   });
 });

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

@@ -0,0 +1,100 @@
+import { useFormContext } from "react-hook-form";
+import { render } from "@truedat/test/render";
+import ControlPropertiesForm from "../ControlPropertiesForm";
+
+jest.mock("react-hook-form", () => ({
+  useFormContext: jest.fn(),
+}));
+
+jest.mock("../ControlProperties", () => {
+  const MockControlProperties = ({ isModification }) => (
+    <div>{`control-properties-${isModification}`}</div>
+  );
+
+  return MockControlProperties;
+});
+
+const fieldNames = [
+  "source_id",
+  "control_properties.resource",
+  "control_properties.errors_resource",
+  "control_properties.validation",
+];
+
+describe("<ControlPropertiesForm />", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it("renders control properties when control mode exists", () => {
+    useFormContext.mockReturnValue({
+      watch: () => ({ control_mode: "error_count" }),
+    });
+
+    const rendered = render(
+      <ControlPropertiesForm
+        isModification
+        setStepInformation={jest.fn()}
+        stepInformation={{}}
+      />
+    );
+
+    expect(
+      rendered.queryByText(/control-properties-true/i)
+    ).toBeInTheDocument();
+  });
+
+  it("does not render control properties when control mode is missing", () => {
+    useFormContext.mockReturnValue({
+      watch: () => ({ control_mode: null }),
+    });
+
+    const rendered = render(
+      <ControlPropertiesForm
+        isModification={false}
+        setStepInformation={jest.fn()}
+        stepInformation={{}}
+      />
+    );
+
+    expect(
+      rendered.queryByText(/control-properties-false/i)
+    ).not.toBeInTheDocument();
+  });
+
+  it("updates step information when field names differ", () => {
+    const setStepInformation = jest.fn();
+    useFormContext.mockReturnValue({
+      watch: () => ({ control_mode: "deviation" }),
+    });
+
+    render(
+      <ControlPropertiesForm
+        isModification={false}
+        setStepInformation={setStepInformation}
+        stepInformation={{ fieldNames: ["source_id"] }}
+      />
+    );
+
+    expect(setStepInformation).toHaveBeenCalledWith(1, {
+      fieldNames,
+    });
+  });
+
+  it("does not update step information when field names are equal", () => {
+    const setStepInformation = jest.fn();
+    useFormContext.mockReturnValue({
+      watch: () => ({ control_mode: "percentage" }),
+    });
+
+    render(
+      <ControlPropertiesForm
+        isModification
+        setStepInformation={setStepInformation}
+        stepInformation={{ fieldNames }}
+      />
+    );
+
+    expect(setStepInformation).not.toHaveBeenCalled();
+  });
+});

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

@@ -0,0 +1,141 @@
+import { render } from "@truedat/test/render";
+import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
+import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+import ControlPropertiesSummary from "../ControlPropertiesSummary";
+import { qualityControlData } from "./__fixtures__/qualityControlHelper";
+
+jest.mock("@truedat/qx/components/common/ClauseViewer", () =>
+  jest.fn(({ clause }) => (
+    <div>{`clause-viewer-${Array.isArray(clause) ? clause.length : 0}`}</div>
+  ))
+);
+
+const renderOpts = { messages };
+
+describe("<ControlPropertiesSummary />", () => {
+  it("does not render summary when there are no resources ids", () => {
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesSummary
+          qualityControl={{
+            ...qualityControlData(),
+            control_properties: { resource: null, errors_resource: null },
+          }}
+        />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    expect(rendered.queryByText(/implementation/i)).not.toBeInTheDocument();
+  });
+
+  it("renders ratio summary for percentage mode", () => {
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesSummary
+          qualityControl={qualityControlData({ control_mode: "percentage" })}
+        />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    expect(rendered.getByText(/implementation/i)).toBeInTheDocument();
+    expect(rendered.getByText(/data structure/i)).toBeInTheDocument();
+    expect(rendered.getByText(/dataset/i)).toBeInTheDocument();
+    expect(rendered.getByText(/accounting_rules/i)).toBeInTheDocument();
+    expect(rendered.getByText(/validation/i)).toBeInTheDocument();
+    expect(rendered.getByText(/clause-viewer-1/i)).toBeInTheDocument();
+  });
+
+  it("renders count summary for error_count mode", () => {
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesSummary
+          qualityControl={qualityControlData({
+            control_mode: "error_count",
+            control_properties: {
+              errors_resource: {
+                id: 999,
+                type: "data_structure",
+                embedded: { name: "ERRORS_DS" },
+              },
+              validation: [{ expressions: [] }],
+            },
+          })}
+        />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    expect(rendered.getByText(/dataset/i)).toBeInTheDocument();
+    expect(rendered.getByText(/data structure/i)).toBeInTheDocument();
+    expect(rendered.getByText(/errors_ds/i)).toBeInTheDocument();
+    expect(rendered.getByText(/validation/i)).toBeInTheDocument();
+    expect(rendered.getByText(/clause-viewer-1/i)).toBeInTheDocument();
+  });
+
+  it("renders empty ratio labels when resource and validation are missing", () => {
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesSummary
+          qualityControl={qualityControlData({
+            control_mode: "percentage",
+            control_properties: {
+              resource: null,
+              errors_resource: {
+                id: 123,
+                type: "data_structure",
+                embedded: { name: "FALLBACK_DS" },
+              },
+              validation: null,
+            },
+          })}
+        />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    expect(rendered.getByText(/empty resource/i)).toBeInTheDocument();
+    expect(rendered.getByText(/empty validation/i)).toBeInTheDocument();
+  });
+
+  it("renders empty count labels when errors resource and validation are missing", () => {
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesSummary
+          qualityControl={qualityControlData({
+            control_mode: "error_count",
+            control_properties: {
+              resource: {
+                id: 321,
+                type: "data_structure",
+                embedded: { name: "FALLBACK_DS" },
+              },
+              errors_resource: null,
+              validation: null,
+            },
+          })}
+        />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    expect(rendered.getByText(/empty dataset/i)).toBeInTheDocument();
+    expect(rendered.getByText(/empty validation/i)).toBeInTheDocument();
+  });
+
+  it("renders empty content when mode is unsupported", () => {
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesSummary
+          qualityControl={qualityControlData({
+            control_mode: "unsupported_mode",
+          })}
+        />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    expect(rendered.getByText(/empty control properties/i)).toBeInTheDocument();
+  });
+});

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

@@ -1,28 +1,43 @@
-import { render } from "@truedat/test/render";
+import { render, waitForLoad } from "@truedat/test/render";
+import { Loading } from "@truedat/core/components";
 import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+import * as dataViewsHooks from "@truedat/qx/hooks/useDataViews";
 import ControlPropertiesView from "../ControlPropertiesView";
 import { qualityControlData } from "./__fixtures__/qualityControlHelper";
 
+jest.mock("@truedat/core/components", () => ({
+  Loading: jest.fn(() => <div>loading-mock</div>),
+}));
+
+jest.mock("@truedat/qx/components/dataViews/DataViewSummary", () =>
+  jest.fn(() => <div>data-view-summary-mock</div>),
+);
+
 const renderOpts = { messages };
 
 const qualityControl = qualityControlData();
+const useDataViewFetchMock = jest.spyOn(dataViewsHooks, "useDataViewFetch");
 
 describe("<ControlPropertiesView />", () => {
+  beforeEach(() => {
+    useDataViewFetchMock.mockReturnValue({ dataView: null, loading: false });
+  });
+
   it("matches the latest snapshot for ratio", async () => {
     const { container } = render(
       <TestFormWrapper>
         <ControlPropertiesView qualityControl={qualityControl} />
       </TestFormWrapper>,
-      renderOpts
+      renderOpts,
     );
     expect(container).toMatchSnapshot();
   });
 
-  it("matches the latest snapshot for count", async () => {
-    const countQualityControl = {
+  it("matches the latest snapshot for error_count", async () => {
+    const errorCountQualityControl = {
       ...qualityControl,
-      control_mode: "count",
+      control_mode: "error_count",
       control_properties: {
         errors_resource: {
           id: 11859650,
@@ -32,9 +47,9 @@ describe("<ControlPropertiesView />", () => {
     };
     const { container } = render(
       <TestFormWrapper>
-        <ControlPropertiesView qualityControl={countQualityControl} />
+        <ControlPropertiesView qualityControl={errorCountQualityControl} />
       </TestFormWrapper>,
-      renderOpts
+      renderOpts,
     );
     expect(container).toMatchSnapshot();
   });
@@ -46,7 +61,7 @@ describe("<ControlPropertiesView />", () => {
           qualityControl={{ ...qualityControl, control_properties: null }}
         />
       </TestFormWrapper>,
-      renderOpts
+      renderOpts,
     );
     expect(container).toMatchSnapshot();
   });
@@ -57,12 +72,12 @@ describe("<ControlPropertiesView />", () => {
         <ControlPropertiesView
           qualityControl={{
             ...qualityControl,
-            control_mode: "count",
+            control_mode: "error_count",
             control_properties: { errors_resource: null },
           }}
         />
       </TestFormWrapper>,
-      renderOpts
+      renderOpts,
     );
     expect(container).toMatchSnapshot();
   });
@@ -78,8 +93,84 @@ describe("<ControlPropertiesView />", () => {
           }}
         />
       </TestFormWrapper>,
-      renderOpts
+      renderOpts,
     );
     expect(container).toMatchSnapshot();
   });
+
+  it("renders loading while data view is being fetched", async () => {
+    useDataViewFetchMock.mockReturnValueOnce({ dataView: null, loading: true });
+    const dataViewQualityControl = qualityControlData({
+      control_properties: {
+        ...qualityControl.control_properties,
+        resource: {
+          id: 123,
+          type: "data_view",
+          embedded: { name: "MY_DV" },
+        },
+      },
+    });
+
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesView qualityControl={dataViewQualityControl} />
+      </TestFormWrapper>,
+      renderOpts,
+    );
+
+    expect(Loading).toHaveBeenCalled();
+    expect(rendered.getByText(/loading-mock/i)).toBeInTheDocument();
+  });
+
+  it("renders data view summary when fetch returns data", async () => {
+    useDataViewFetchMock.mockReturnValueOnce({
+      dataView: { queryables: [] },
+      loading: false,
+    });
+    const dataViewQualityControl = qualityControlData({
+      control_properties: {
+        ...qualityControl.control_properties,
+        resource: {
+          id: 456,
+          type: "data_view",
+          embedded: { name: "MY_DV" },
+        },
+      },
+    });
+
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesView qualityControl={dataViewQualityControl} />
+      </TestFormWrapper>,
+      renderOpts,
+    );
+    await waitForLoad(rendered);
+
+    expect(rendered.getByText(/data-view-summary-mock/i)).toBeInTheDocument();
+  });
+
+  it("does not render loading or summary when fetch returns no data", async () => {
+    useDataViewFetchMock.mockReturnValueOnce({ dataView: null, loading: false });
+    const dataViewQualityControl = qualityControlData({
+      control_properties: {
+        ...qualityControl.control_properties,
+        resource: {
+          id: 789,
+          type: "data_view",
+          embedded: { name: "MY_DV" },
+        },
+      },
+    });
+
+    const rendered = render(
+      <TestFormWrapper>
+        <ControlPropertiesView qualityControl={dataViewQualityControl} />
+      </TestFormWrapper>,
+      renderOpts,
+    );
+    await waitForLoad(rendered);
+
+    expect(rendered.queryByText(/loading-mock/i)).not.toBeInTheDocument();
+    expect(rendered.queryByText(/data-view-summary-mock/i)).not.toBeInTheDocument();
+  });
 });

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

@@ -3,6 +3,7 @@ import { waitFor } from "@testing-library/react";
 import { render, waitForLoad } from "@truedat/test/render";
 import { singleTemplateMock, templateByNameMock } from "@truedat/test/mocks";
 import { DOMAINS_QUERY } from "@truedat/core/api/queries";
+import { linkTo } from "@truedat/core/routes";
 import { SOURCE_OPTIONS_QUERY } from "@truedat/cx/sources/api/queries";
 import { REFERENCE_DATASETS_HEADERS_QUERY } from "@truedat/dd/api/queries";
 import {
@@ -174,7 +175,9 @@ describe("<EditQualityControl />", () => {
     });
 
     // Save button only appears on step 2 (last step)
-    expect(rendered.queryByRole("button", { name: /save/i })).not.toBeInTheDocument();
+    expect(
+      rendered.queryByRole("button", { name: /save/i })
+    ).not.toBeInTheDocument();
 
     const user = userEvent.setup({ delay: null });
     // Fill step 0 (Information) - make a change to enable save later
@@ -183,13 +186,17 @@ describe("<EditQualityControl />", () => {
     // Navigate to step 1
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /back/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /back/i })
+      ).toBeInTheDocument()
     );
 
     // Navigate to step 2
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /save/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /save/i })
+      ).toBeInTheDocument()
     );
 
     await waitFor(() =>
@@ -205,5 +212,22 @@ describe("<EditQualityControl />", () => {
     await waitFor(() =>
       expect(trigger).toHaveBeenCalledWith({ quality_control: qualityControl })
     );
+    expect(mockNavigate).toHaveBeenCalledWith(
+      linkTo.QUALITY_CONTROL({ id: "9", version: "1" })
+    );
+  });
+
+  it("shows loading state while update is mutating", async () => {
+    useQualityControlUpdateDraft.mockImplementationOnce(() => ({
+      trigger: jest.fn(() => Promise.resolve({ data: { data: {} } })),
+      isMutating: true,
+    }));
+
+    const rendered = render(<EditQualityControl />, renderOpts);
+    await waitFor(() =>
+      expect(
+        rendered.container.querySelector(".ui.loading.segment")
+      ).toBeInTheDocument()
+    );
   });
 });