@truedat/qx 7.5.7 → 7.5.9

package/src/components/qualityControls/qualityByControlMode.js

@@ -9,19 +9,19 @@ export default function qualityByControlMode(score) {
   if (!scoreContent) return { isEmpty: true };
 
   switch (controlMode) {
-    case "error_count":
+    case "count":
       return {
         color:
-          scoreContent.error_count < scoreCriteria.goal
+          scoreContent.count < scoreCriteria.goal
             ? "green"
-            : scoreContent.error_count < scoreCriteria.maximum
+            : scoreContent.count < scoreCriteria.maximum
             ? "yellow"
             : "red",
-        label1: "quality_control.score_criteria.error_count.goal",
+        label1: "quality_control.score_criteria.count.goal",
         value1: scoreCriteria.goal,
-        label2: "quality_control.score_criteria.error_count.maximum",
+        label2: "quality_control.score_criteria.count.maximum",
         value2: scoreCriteria.maximum,
-        text: scoreContent.error_count,
+        text: scoreContent.count,
       };
     case "deviation":
       const deviationRatio =
@@ -72,7 +72,30 @@ export default function qualityByControlMode(score) {
         value2: scoreCriteria.goal,
         text: percentageResult,
       };
+    case "error_count":
+      const errorCount =
+        scoreContent.total_count == 0 ? null : scoreContent.validation_count;
+
+      const errorCountResult =
+        scoreContent.total_count == 0
+          ? noResultsMessage
+          : scoreContent.validation_count;
 
+      return {
+        color:
+          scoreContent.total_count == 0
+            ? "grey"
+            : errorCount > scoreCriteria.goal
+            ? "green"
+            : errorCount > scoreCriteria.maximum
+            ? "yellow"
+            : "red",
+        label1: "quality_control.score_criteria.error_count.goal",
+        value1: scoreCriteria.goal,
+        label2: "quality_control.score_criteria.error_count.maximum",
+        value2: scoreCriteria.maximum,
+        text: errorCountResult,
+      };
     default:
       return {};
   }

package/src/components/qualityControls/scoreCriterias/Count.js

@@ -0,0 +1,88 @@
+import React, { useContext } from "react";
+import { useIntl } from "react-intl";
+import { Controller, useFormContext } from "react-hook-form";
+import { Form } from "semantic-ui-react";
+import QxContext from "@truedat/qx/components/QxContext";
+import { FieldLabel } from "@truedat/core/components";
+import { numberRules } from "@truedat/core/services/formRules";
+
+export default function Count() {
+  const { formatMessage } = useIntl();
+  const { field } = useContext(QxContext);
+  const { control, watch } = useFormContext();
+
+  const maximumField = `${field}.maximum`;
+  const goalField = `${field}.goal`;
+  const maximum = watch(maximumField);
+  const goal = watch(goalField);
+
+  return (
+    <>
+      <Controller
+        name={goalField}
+        control={control}
+        rules={numberRules({
+          formatMessage,
+          minValue: 0,
+          maxValue: maximum,
+          required: true,
+        })}
+        render={({
+          field: { onBlur, onChange, value },
+          fieldState: { error },
+        }) => (
+          <FieldLabel
+            label={formatMessage({
+              id: "quality_control.score_criteria.count.goal",
+            })}
+            required
+            error={error?.message}
+          >
+            <Form.Input
+              autoComplete="off"
+              placeholder={formatMessage({
+                id: "quality_control.score_criteria.count.goal",
+              })}
+              error={!!error}
+              onBlur={onBlur}
+              onChange={(_e, { value }) => onChange(value)}
+              value={value || ""}
+            />
+          </FieldLabel>
+        )}
+      />
+      <Controller
+        name={maximumField}
+        control={control}
+        rules={numberRules({
+          formatMessage,
+          minValue: goal,
+          required: true,
+        })}
+        render={({
+          field: { onBlur, onChange, value },
+          fieldState: { error },
+        }) => (
+          <FieldLabel
+            label={formatMessage({
+              id: "quality_control.score_criteria.count.maximum",
+            })}
+            required
+            error={error?.message}
+          >
+            <Form.Input
+              autoComplete="off"
+              placeholder={formatMessage({
+                id: "quality_control.score_criteria.count.maximum",
+              })}
+              error={!!error}
+              onBlur={onBlur}
+              onChange={(_e, { value }) => onChange(value)}
+              value={value || ""}
+            />
+          </FieldLabel>
+        )}
+      />
+    </>
+  );
+}

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

@@ -57,6 +57,7 @@ export default function ErrorCount() {
         rules={numberRules({
           formatMessage,
           minValue: goal,
+          maxValue: 100,
           required: true,
         })}
         render={({

package/src/components/qualityControls/scoreCriterias/__tests__/Count.spec.js

@@ -0,0 +1,62 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { waitFor } from "@testing-library/react";
+import { fireEvent } from "@testing-library/react";
+import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
+import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+import Count from "../Count";
+
+const renderOpts = { messages };
+
+describe("<Count />", () => {
+  it("matches the latest snapshot", async () => {
+    const { container } = render(
+      <TestFormWrapper>
+        <Count />
+      </TestFormWrapper>,
+      renderOpts
+    );
+    expect(container).toMatchSnapshot();
+  });
+
+  it("should update the goal and maximum fields correctly", async () => {
+    const defaultValues = { "testField.goal": "", "testField.maximum": "" };
+
+    const { getByPlaceholderText, queryByText } = render(
+      <TestFormWrapper defaultValues={defaultValues}>
+        <Count />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    const goalInput = getByPlaceholderText("Goal");
+
+    const thresholdInput = getByPlaceholderText("Threshold");
+
+    fireEvent.change(goalInput, { target: { value: "10" } });
+    fireEvent.change(thresholdInput, { target: { value: "20" } });
+
+    await waitFor(() =>
+      expect(queryByText(/Must be greater than y/i)).not.toBeInTheDocument()
+    );
+  });
+
+  it("Show alert if thresholdInput is less than goal", async () => {
+    const { getByPlaceholderText, queryByText } = render(
+      <TestFormWrapper>
+        <Count />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    const goalInput = getByPlaceholderText("Goal");
+    const thresholdInput = getByPlaceholderText("Threshold");
+
+    fireEvent.change(goalInput, { target: { value: "10" } });
+    fireEvent.change(thresholdInput, { target: { value: "1" } });
+
+    await waitFor(() =>
+      expect(queryByText(/Must be greater than 10/i)).toBeInTheDocument()
+    );
+  });
+});

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

@@ -3,10 +3,22 @@ import { render } from "@truedat/test/render";
 import { waitFor } from "@testing-library/react";
 import { fireEvent } from "@testing-library/react";
 import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
-import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import ErrorCount from "../ErrorCount";
 
-const renderOpts = { messages };
+const messages = {
+  en: {
+    "form.validation.must_be_a_number": "Must be a number",
+    "form.validation.must_be_less_than_or_equal": "Must be less than x",
+    "form.validation.must_be_greater_than_or_equal": "Must be greater than y",
+    "form.validation.empty_required": "Required field is empty",
+    "quality_control.score_criteria.error_count.goal": "Goal",
+    "quality_control.score_criteria.error_count.maximum": "Threshold",
+  },
+};
+
+const renderOpts = {
+  messages,
+};
 
 describe("<ErrorCount />", () => {
   it("matches the latest snapshot", async () => {
@@ -16,6 +28,7 @@ describe("<ErrorCount />", () => {
       </TestFormWrapper>,
       renderOpts
     );
+
     expect(container).toMatchSnapshot();
   });
 
@@ -35,7 +48,6 @@ describe("<ErrorCount />", () => {
 
     fireEvent.change(goalInput, { target: { value: "10" } });
     fireEvent.change(thresholdInput, { target: { value: "20" } });
-
     await waitFor(() =>
       expect(queryByText(/Must be greater than y/i)).not.toBeInTheDocument()
     );
@@ -57,7 +69,7 @@ describe("<ErrorCount />", () => {
     fireEvent.change(thresholdInput, { target: { value: "1" } });
 
     await waitFor(() =>
-      expect(queryByText(/Must be greater than 10/i)).toBeInTheDocument()
+      expect(queryByText(/Must be greater than y/i)).toBeInTheDocument()
     );
   });
 });

package/src/components/qualityControls/scoreCriterias/__tests__/__snapshots__/Count.spec.js.snap

@@ -0,0 +1,58 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Count /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    class="field"
+  >
+    <label
+      class="field-label"
+    >
+      Goal
+      <span>
+        *
+      </span>
+    </label>
+    <div
+      class="field"
+    >
+      <div
+        class="ui input"
+      >
+        <input
+          autocomplete="off"
+          placeholder="Goal"
+          type="text"
+          value=""
+        />
+      </div>
+    </div>
+  </div>
+  <div
+    class="field"
+  >
+    <label
+      class="field-label"
+    >
+      Threshold
+      <span>
+        *
+      </span>
+    </label>
+    <div
+      class="field"
+    >
+      <div
+        class="ui input"
+      >
+        <input
+          autocomplete="off"
+          placeholder="Threshold"
+          type="text"
+          value=""
+        />
+      </div>
+    </div>
+  </div>
+</div>
+`;

package/src/components/scores/__tests__/MyScoreGroups.spec.js

@@ -51,7 +51,7 @@ describe("<MyScoreGroups />", () => {
     const { container } = render(<MyScoreGroups />, renderOpts);
 
     await waitFor(() => {
-      expect(container.querySelector(".loading")).toBeNull();
+      expect(container.querySelector(".loading")).not.toBeInTheDocument();
     });
 
     expect(container).toMatchSnapshot();
@@ -63,7 +63,7 @@ describe("<MyScoreGroups />", () => {
     const { container, queryByText } = render(<MyScoreGroups />, renderOpts);
 
     await waitFor(() => {
-      expect(container.querySelector(".loading")).toBeNull();
+      expect(container.querySelector(".loading")).not.toBeInTheDocument();
     });
 
     expect(queryByText("Filters")).not.toBeInTheDocument();