@truedat/qx 7.0.8 → 7.1.0

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

@@ -0,0 +1,248 @@
+import { scoreData } from "@truedat/qx/components/scores/__tests__/__fixtures__/scoreHelper";
+
+import qualityByControlMode from "../qualityByControlMode";
+
+describe("qualityByControlMode", () => {
+  it("returns isFailed when score status is FAILED", () => {
+    const score = scoreData({ status: "FAILED" });
+    expect(qualityByControlMode(score)).toEqual({ isFailed: true });
+  });
+
+  it("returns isEmpty when scoreContent is null", () => {
+    const score = scoreData({ score_content: null });
+    expect(qualityByControlMode(score)).toEqual({ isEmpty: true });
+  });
+
+  it("returns correct object when controlMode is deviation with red", () => {
+    const score = scoreData();
+    const result = {
+      color: "red",
+      label1: "quality_control.score_criteria.deviation.goal",
+      label2: "quality_control.score_criteria.deviation.maximum",
+      text: "50%",
+      value1: 10,
+      value2: 30,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is deviation with yellow", () => {
+    const score = scoreData({
+      quality_control: {
+        control_mode: "deviation",
+        score_criteria: {
+          maximum: 80,
+          goal: 50,
+        },
+      },
+      score_content: {
+        total_count: 50,
+        validation_count: 30,
+      },
+    });
+    const result = {
+      color: "yellow",
+      label1: "quality_control.score_criteria.deviation.goal",
+      label2: "quality_control.score_criteria.deviation.maximum",
+      text: "60%",
+      value1: 50,
+      value2: 80,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is deviation with green", () => {
+    const score = scoreData({
+      quality_control: {
+        control_mode: "deviation",
+        score_criteria: {
+          maximum: 80,
+          goal: 70,
+        },
+      },
+      score_content: {
+        total_count: 50,
+        validation_count: 30,
+      },
+    });
+    const result = {
+      color: "green",
+      label1: "quality_control.score_criteria.deviation.goal",
+      label2: "quality_control.score_criteria.deviation.maximum",
+      text: "60%",
+      value1: 70,
+      value2: 80,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is percentage with yellow", () => {
+    const score = scoreData({
+      score_type: "ratio",
+      score_content: {
+        total_count: 100,
+        validation_count: 25,
+      },
+      quality_control: {
+        control_mode: "percentage",
+        score_criteria: {
+          goal: 30,
+          minimum: 20,
+        },
+      },
+    });
+    const result = {
+      color: "yellow",
+      label1: "quality_control.score_criteria.percentage.minimum",
+      label2: "quality_control.score_criteria.percentage.goal",
+      text: "25%",
+      value1: 20,
+      value2: 30,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is percentage with green", () => {
+    const score = scoreData({
+      score_type: "ratio",
+      score_content: {
+        total_count: 100,
+        validation_count: 25,
+      },
+      quality_control: {
+        control_mode: "percentage",
+        score_criteria: {
+          goal: 10,
+          minimum: 5,
+        },
+      },
+    });
+    const result = {
+      color: "green",
+      label1: "quality_control.score_criteria.percentage.minimum",
+      label2: "quality_control.score_criteria.percentage.goal",
+      text: "25%",
+      value1: 5,
+      value2: 10,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is percentage with red", () => {
+    const score = scoreData({
+      score_type: "ratio",
+      score_content: {
+        total_count: 100,
+        validation_count: 25,
+      },
+      quality_control: {
+        control_mode: "percentage",
+        score_criteria: {
+          goal: 50,
+          minimum: 30,
+        },
+      },
+    });
+    const result = {
+      color: "red",
+      label1: "quality_control.score_criteria.percentage.minimum",
+      label2: "quality_control.score_criteria.percentage.goal",
+      text: "25%",
+      value1: 30,
+      value2: 50,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is error_count with green", () => {
+    const score = scoreData({
+      score_content: {
+        error_count: 10,
+      },
+      quality_control: {
+        control_mode: "error_count",
+        score_criteria: {
+          maximum: 30,
+          goal: 20,
+        },
+      },
+    });
+    const result = {
+      color: "green",
+      label1: "quality_control.score_criteria.error_count.goal",
+      label2: "quality_control.score_criteria.error_count.maximum",
+      text: 10,
+      value1: 20,
+      value2: 30,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is error_count with yellow", () => {
+    const score = scoreData({
+      score_content: {
+        error_count: 20,
+      },
+      quality_control: {
+        control_mode: "error_count",
+
+        score_criteria: {
+          maximum: 30,
+          goal: 20,
+        },
+      },
+    });
+    const result = {
+      color: "yellow",
+      label1: "quality_control.score_criteria.error_count.goal",
+      label2: "quality_control.score_criteria.error_count.maximum",
+      text: 20,
+      value1: 20,
+      value2: 30,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is error_count with red", () => {
+    const score = scoreData({
+      score_content: {
+        error_count: 40,
+      },
+      quality_control: {
+        control_mode: "error_count",
+
+        score_criteria: {
+          maximum: 30,
+          goal: 20,
+        },
+      },
+    });
+    const result = {
+      color: "red",
+      label1: "quality_control.score_criteria.error_count.goal",
+      label2: "quality_control.score_criteria.error_count.maximum",
+      text: 40,
+      value1: 20,
+      value2: 30,
+    };
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+
+  it("returns correct object when controlMode is not defined", () => {
+    const score = scoreData({
+      score_content: {
+        error_count: 10,
+      },
+      quality_control: {
+        control_mode: "foo",
+
+        score_criteria: {
+          maximum: 30,
+          goal: 20,
+        },
+      },
+    });
+    const result = {};
+    expect(qualityByControlMode(score)).toEqual(result);
+  });
+});

package/src/components/qualityControls/controlProperties/ErrorCount.js

@@ -0,0 +1,56 @@
+import _ from "lodash/fp";
+import React, { useContext } from "react";
+import { useQuery } from "@apollo/client";
+import { useFormContext } from "react-hook-form";
+import { Loading } from "@truedat/core/components";
+import { lowerDeburrTrim } from "@truedat/core/services/sort";
+import { REFERENCE_DATASETS_HEADERS_QUERY } from "@truedat/dd/api/queries";
+import QxContext from "@truedat/qx/components/QxContext";
+import { useDataViews } from "@truedat/qx/hooks/useDataViews";
+import { useFunctions } from "@truedat/qx/hooks/useFunctions";
+import ResourceSelector from "@truedat/qx/components/common/ResourceSelector";
+
+export default function ErrorCount() {
+  const { field } = useContext(QxContext);
+  const { watch } = useFormContext();
+
+  const formData = watch();
+
+  const { source_id: sourceId } = formData;
+
+  const { data, loading: dataViewsLoading } = useDataViews();
+  const { data: functionsData, loading: functionsLoading } = useFunctions();
+  const { data: referenceDatasetsData, loading: referenceDatasetsLoading } =
+    useQuery(REFERENCE_DATASETS_HEADERS_QUERY);
+
+  const loading =
+    dataViewsLoading || functionsLoading || referenceDatasetsLoading;
+
+  const dataViews = _.orderBy(["id"], ["asc"])(data?.data);
+  const functions = functionsData?.data;
+  const referenceDatasets = _.flow(
+    _.getOr([], "referenceDatasets"),
+    _.sortBy([({ name }) => lowerDeburrTrim(name), "name"]),
+    _.map((row) => ({ ...row, id: Number(row?.id) }))
+  )(referenceDatasetsData);
+  const context = {
+    dataViews,
+    referenceDatasets,
+    functions,
+  };
+
+  return loading ? (
+    <Loading />
+  ) : (
+    <>
+      <QxContext.Provider
+        value={{ ...context, sourceId, field: `${field}.errors_resource` }}
+      >
+        <ResourceSelector
+          required
+          labelId="quality_control.form.control_properties.error_count.errors_resource"
+        />
+      </QxContext.Provider>
+    </>
+  );
+}

package/src/components/qualityControls/controlProperties/Ratio.js

@@ -0,0 +1,79 @@
+import _ from "lodash/fp";
+import React, { useContext } from "react";
+import { useQuery } from "@apollo/client";
+import { useFormContext } from "react-hook-form";
+import { Loading } from "@truedat/core/components";
+import { lowerDeburrTrim } from "@truedat/core/services/sort";
+import { REFERENCE_DATASETS_HEADERS_QUERY } from "@truedat/dd/api/queries";
+import QxContext from "@truedat/qx/components/QxContext";
+import { useDataViews } from "@truedat/qx/hooks/useDataViews";
+import { useFunctions } from "@truedat/qx/hooks/useFunctions";
+import { fieldsFromResource } from "@truedat/qx/components/dataViews/queryableFunctions";
+import ResourceSelector from "@truedat/qx/components/common/ResourceSelector";
+import { Clauses } from "@truedat/qx/components/common/expressions";
+
+export default function Ratio() {
+  const { field } = useContext(QxContext);
+  const { watch } = useFormContext();
+
+  const formData = watch();
+
+  const { control_properties: controlProperties, source_id: sourceId } =
+    formData;
+
+  const resource = _.prop("resource")(controlProperties);
+
+  const { data, loading: dataViewsLoading } = useDataViews();
+  const { data: functionsData, loading: functionsLoading } = useFunctions();
+  const { data: referenceDatasetsData, loading: referenceDatasetsLoading } =
+    useQuery(REFERENCE_DATASETS_HEADERS_QUERY);
+
+  const loading =
+    dataViewsLoading || functionsLoading || referenceDatasetsLoading;
+
+  const dataViews = _.orderBy(["id"], ["asc"])(data?.data);
+  const functions = functionsData?.data;
+  const referenceDatasets = _.flow(
+    _.getOr([], "referenceDatasets"),
+    _.sortBy([({ name }) => lowerDeburrTrim(name), "name"]),
+    _.map((row) => ({ ...row, id: Number(row?.id) }))
+  )(referenceDatasetsData);
+  const context = {
+    dataViews,
+    referenceDatasets,
+    functions,
+  };
+  const fields = fieldsFromResource(
+    _.prop("embedded.name")(resource),
+    0
+  )({ resource });
+
+  return loading ? (
+    <Loading />
+  ) : (
+    <>
+      <QxContext.Provider
+        value={{ ...context, sourceId, field: `${field}.resource` }}
+      >
+        <ResourceSelector
+          required
+          labelId="quality_control.form.control_properties.ratio.resource"
+        />
+      </QxContext.Provider>
+      {resource?.id ? (
+        <div className="vertical-space">
+          <QxContext.Provider
+            value={{
+              ...context,
+              sourceId,
+              fields,
+              field: `${field}.validation`,
+            }}
+          >
+            <Clauses labelId="quality_control.form.control_properties.ratio.validation" />
+          </QxContext.Provider>
+        </div>
+      ) : null}
+    </>
+  );
+}

package/src/components/qualityControls/controlProperties/__tests__/ErrorCount.spec.js

@@ -0,0 +1,82 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { waitFor } from "@testing-library/react";
+import { REFERENCE_DATASETS_HEADERS_QUERY } from "@truedat/dd/api/queries";
+import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
+import ErrorCount from "../ErrorCount";
+
+jest.mock("@truedat/qx/hooks/useDataViews", () => {
+  const originalModule = jest.requireActual("@truedat/qx/hooks/useDataViews");
+
+  return {
+    __esModule: true,
+    ...originalModule,
+    useDataViews: jest.fn(() => ({
+      data: {
+        data: [
+          {
+            id: 4,
+            description: "Description",
+            name: "StructureView",
+          },
+        ],
+      },
+      loading: false,
+    })),
+  };
+});
+
+const dataSet = {
+  id: "7",
+  name: "dataset1",
+  headers: ["campo1", "campo2"],
+};
+const referenceDatasetsMock = {
+  request: { query: REFERENCE_DATASETS_HEADERS_QUERY },
+  result: { data: { referenceDatasets: [dataSet], loading: false } },
+};
+
+const messages = {
+  en: {
+    "quality_control.form.control_properties.error_count.errors_resource":
+      "Dataset",
+    "queryables.resource.type": "Resource type",
+    "queryables.resource.type.data_structure": "Data structures",
+    "queryables.resource.type.reference_dataset": "Reference datasets",
+  },
+};
+
+const renderOpts = {
+  mocks: [referenceDatasetsMock],
+  fallback: "lazy",
+  messages,
+};
+
+const context = {
+  functions: [
+    {
+      name: "eq",
+      type: "boolean",
+      params: [
+        { name: "arg1", type: "any" },
+        { name: "arg2", type: "any" },
+      ],
+    },
+  ],
+};
+
+describe("<ErrorCount />", () => {
+  it("matches the latest snapshot", async () => {
+    const { container, queryByText } = render(
+      <TestFormWrapper context={context}>
+        <ErrorCount />
+      </TestFormWrapper>,
+      renderOpts
+    );
+    await waitFor(() => {
+      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
+      expect(container.querySelector(".loader")).not.toBeInTheDocument();
+    });
+    expect(container).toMatchSnapshot();
+  });
+});

package/src/components/qualityControls/controlProperties/__tests__/Ratio.spec.js

@@ -0,0 +1,115 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { waitFor } from "@testing-library/react";
+import { REFERENCE_DATASETS_HEADERS_QUERY } from "@truedat/dd/api/queries";
+import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
+import Ratio from "../Ratio";
+
+jest.mock("@truedat/qx/hooks/useDataViews", () => {
+  const originalModule = jest.requireActual("@truedat/qx/hooks/useDataViews");
+
+  return {
+    __esModule: true,
+    ...originalModule,
+    useDataViews: jest.fn(() => ({
+      data: {
+        data: [
+          {
+            id: 4,
+            description: "Description",
+            name: "StructureView",
+          },
+        ],
+      },
+      loading: false,
+    })),
+  };
+});
+
+const dataSet = {
+  id: "7",
+  name: "dataset1",
+  headers: ["campo1", "campo2"],
+};
+const referenceDatasetsMock = {
+  request: { query: REFERENCE_DATASETS_HEADERS_QUERY },
+  result: { data: { referenceDatasets: [dataSet], loading: false } },
+};
+
+const messages = {
+  en: {
+    "quality_control.form.control_properties.ratio.resource": "Dataset",
+    "queryables.resource.type": "Resource type",
+    "queryables.resource.type.data_structure": "Data structures",
+    "queryables.resource.type.reference_dataset": "Reference datasets",
+    "expression.clause.action.addGroup": "Add group",
+    "quality_control.form.control_properties.ratio.validation": "Validation",
+  },
+};
+
+const renderOpts = {
+  mocks: [referenceDatasetsMock],
+  fallback: "lazy",
+  messages,
+};
+
+const defaultValues = {
+  source_id: "181",
+  control_properties: {
+    resource: {
+      id: 11859650,
+      embedded: { fields: [{ id: 11859651 }] },
+    },
+  },
+};
+
+const context = {
+  functions: [
+    {
+      name: "eq",
+      type: "boolean",
+      params: [
+        { name: "arg1", type: "any" },
+        { name: "arg2", type: "any" },
+      ],
+    },
+  ],
+};
+
+describe("<Ratio />", () => {
+  it("matches the latest snapshot", async () => {
+    const { container, queryByText } = render(
+      <TestFormWrapper context={context} defaultValues={defaultValues}>
+        <Ratio />
+      </TestFormWrapper>,
+      renderOpts
+    );
+    await waitFor(() => {
+      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
+      expect(container.querySelector(".loader")).not.toBeInTheDocument();
+    });
+
+    expect(container).toMatchSnapshot();
+  });
+
+  it("matches the latest snapshot when there is not resource", async () => {
+    const newDefaultValues = {
+      ...defaultValues,
+      control_properties: {
+        resource: {},
+      },
+    };
+    const { container, queryByText } = render(
+      <TestFormWrapper context={context} defaultValues={newDefaultValues}>
+        <Ratio />
+      </TestFormWrapper>,
+      renderOpts
+    );
+    await waitFor(() => {
+      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
+      expect(container.querySelector(".loader")).not.toBeInTheDocument();
+    });
+
+    expect(container).toMatchSnapshot();
+  });
+});

package/src/components/qualityControls/controlProperties/__tests__/__snapshots__/ErrorCount.spec.js.snap

@@ -0,0 +1,62 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<ErrorCount /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    class="required field"
+  >
+    <label>
+      Dataset
+    </label>
+    <div
+      aria-expanded="false"
+      class="ui selection dropdown"
+      role="listbox"
+      tabindex="0"
+    >
+      <div
+        aria-atomic="true"
+        aria-live="polite"
+        class="divider default text"
+        role="alert"
+      >
+        Resource type
+      </div>
+      <i
+        aria-hidden="true"
+        class="dropdown icon"
+      />
+      <div
+        class="menu transition"
+      >
+        <div
+          aria-checked="false"
+          aria-selected="true"
+          class="selected item"
+          role="option"
+          style="pointer-events: all;"
+        >
+          <span
+            class="text"
+          >
+            Data structures
+          </span>
+        </div>
+        <div
+          aria-checked="false"
+          aria-selected="false"
+          class="item"
+          role="option"
+          style="pointer-events: all;"
+        >
+          <span
+            class="text"
+          >
+            Reference datasets
+          </span>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;