@truedat/qx 7.0.7 → 7.1.0

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

@@ -0,0 +1,20 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+import ScoreGroupMessage from "../ScoreGroupMessage";
+
+const renderOpts = { messages };
+
+describe("<ScoreGroupMessage />", () => {
+  it("matches the latest snapshot for pending", () => {
+    const { container } = render(
+      <ScoreGroupMessage pending={10} />,
+      renderOpts
+    );
+    expect(container).toMatchSnapshot();
+  });
+  it("matches the latest snapshot for count", () => {
+    const { container } = render(<ScoreGroupMessage count={8} />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+});

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

@@ -0,0 +1,59 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { singleTemplateMock } from "@truedat/test/mocks";
+import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+import ScoreGroupPopup from "../ScoreGroupPopup";
+
+const renderOpts = {
+  mocks: [singleTemplateMock({ scope: "qe" })],
+  messages,
+  fallback: "lazy",
+};
+
+describe("<ScoreGroupPopup />", () => {
+  const onSubmit = jest.fn();
+  const props = { count: 1, onSubmit, loading: false };
+
+  it("matches the latest snapshot", () => {
+    const { container } = render(<ScoreGroupPopup {...props} />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+
+  it("should render button with correct text when count is not 1", () => {
+    const { getByRole } = render(<ScoreGroupPopup count={2} />, renderOpts);
+    expect(getByRole("button")).toHaveTextContent("Execute quality controls");
+  });
+
+  it("should disable the button when disabled is true", () => {
+    const { getByRole } = render(
+      <ScoreGroupPopup disabled={true} />,
+      renderOpts
+    );
+    expect(getByRole("button")).toBeDisabled();
+  });
+
+  it("should show loading state when loading is true", () => {
+    const { getByRole } = render(
+      <ScoreGroupPopup loading={true} />,
+      renderOpts
+    );
+    expect(getByRole("button")).toHaveClass("loading");
+  });
+
+  it("should display execution form on button click", async () => {
+    const onSubmit = jest.fn();
+    const props = { count: 1, onSubmit, loading: false };
+    const { getByRole } = render(<ScoreGroupPopup {...props} />, renderOpts);
+    userEvent.click(getByRole("button"));
+
+    await waitFor(() => {
+      expect(getByRole("button", { name: /Create/i })).toBeEnabled();
+    });
+
+    userEvent.click(getByRole("button", { name: /Create/i }));
+
+    await waitFor(() => expect(onSubmit).toHaveBeenCalledTimes(1));
+  });
+});

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

@@ -0,0 +1,40 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+import ScoreGroupsTable from "../ScoreGroupsTable";
+import { useMyScoreGroupsIndex } from "../../../hooks/useScoreGroups";
+
+jest.mock("@truedat/qx/hooks/useScoreGroups", () => {
+  const { scoreGroupData } = jest.requireActual(
+    "@truedat/qx/components/scores/__tests__/__fixtures__/scoreHelper"
+  );
+
+  return {
+    useMyScoreGroupsIndex: jest.fn(() => ({
+      data: {
+        data: [
+          scoreGroupData({ status_summary: { PENDING: 1, QUEUED: 2 } }),
+          scoreGroupData({ status_summary: { SUCCEEDED: 1, FAILED: 3 } }),
+        ],
+      },
+      loading: false,
+    })),
+  };
+});
+
+const renderOpts = { messages };
+
+describe("<ScoreGroupsTable />", () => {
+  it("matches the latest snapshot", () => {
+    const { container } = render(<ScoreGroupsTable />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+  it("matches the latest snapshot for empty list", () => {
+    useMyScoreGroupsIndex.mockImplementation(() => ({
+      data: { data: [] },
+      loading: false,
+    }));
+    const { container } = render(<ScoreGroupsTable />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+});

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

@@ -0,0 +1,21 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+
+import ScoreStatusDecorator from "../ScoreStatusDecorator";
+
+const renderOpts = {
+  messages,
+};
+
+describe("<ScoreStatusDecorator />", () => {
+  ["PENDING", "QUEUED", "STARTED", "SUCCEEDED", "FAILED"].forEach((status) =>
+    it(`matches the latest snapshot for status ${status}`, () => {
+      const { container } = render(
+        <ScoreStatusDecorator id={8} status={status} />,
+        renderOpts
+      );
+      expect(container).toMatchSnapshot();
+    })
+  );
+});

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

@@ -0,0 +1,27 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+import ScoreTabs from "../ScoreTabs";
+
+jest.mock("react-router-dom", () => ({
+  ...jest.requireActual("react-router-dom"),
+  useParams: () => ({ id: "15" }),
+  useLocation: () => ({ pathname: "/scores/15" }),
+}));
+
+const renderOpts = { messages };
+
+describe("<ScoreTabs />", () => {
+  it("matches the latest snapshot for details", () => {
+    const { container } = render(<ScoreTabs />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+
+  it("matches the latest snapshot for events", () => {
+    jest.spyOn(require("react-router-dom"), "useLocation").mockReturnValue({
+      pathname: "/scores/15/events",
+    });
+    const { container } = render(<ScoreTabs />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+});

package/src/components/scores/__tests__/__fixtures__/scoreHelper.js

@@ -0,0 +1,182 @@
+export const score = {
+  id: 15,
+  status: "SUCCEEDED",
+  details: { foo: "bar" },
+  quality_control_version_id: 1,
+  score_type: "ratio",
+  quality_control_status: "published",
+  execution_timestamp: "2024-11-19T16:34:21.438113Z",
+  score_content: {
+    total_count: 100,
+    validation_count: 50,
+  },
+  quality_control: {
+    id: 8,
+    name: "test",
+    status: "published",
+    version: 1,
+    updated_at: "2024-11-20T16:29:57.571985Z",
+    df_type: "template1",
+    queries: null,
+    control_properties: {
+      resource: {
+        id: 11463387,
+        type: "data_structure",
+      },
+      validation: [
+        {
+          expressions: [
+            {
+              value: {
+                args: {
+                  arg1: {
+                    value: {
+                      id: 11463389,
+                      name: "VARIABLE_VALUE",
+                      type: "string",
+                      parent_id: 0,
+                    },
+                    shape: "field",
+                  },
+                  arg2: {
+                    value: {
+                      id: 11463388,
+                      name: "VARIABLE_NAME",
+                      type: "string",
+                      parent_id: 0,
+                    },
+                    shape: "field",
+                  },
+                },
+                name: "gt",
+                type: "boolean",
+              },
+              shape: "function",
+            },
+          ],
+        },
+      ],
+    },
+    control_mode: "deviation",
+    dynamic_content: {},
+    score_criteria: {
+      maximum: 30,
+      goal: 10,
+    },
+    version_id: 1,
+  },
+  firstInVersion: true,
+  events: [
+    {
+      id: 6,
+      message: null,
+      type: "PENDING",
+      inserted_at: "2024-11-20T10:07:37.089731Z",
+      score_id: 6,
+    },
+    {
+      id: 7,
+      message: null,
+      type: "QUEUED",
+      inserted_at: "2024-11-20T10:09:10.812863Z",
+      score_id: 6,
+    },
+    {
+      id: 16,
+      message: null,
+      type: "STARTED",
+      inserted_at: "2024-11-20T11:00:25.249758Z",
+      score_id: 6,
+    },
+    {
+      id: 17,
+      message: "Info message",
+      type: "INFO",
+      inserted_at: "2024-11-20T11:05:10.824495Z",
+      score_id: 6,
+    },
+    {
+      id: 18,
+      message: "Warning message",
+      type: "WARNING",
+      inserted_at: "2024-11-20T11:07:07.771213Z",
+      score_id: 6,
+    },
+    {
+      id: 19,
+      message: null,
+      type: "SUCCEEDED",
+      inserted_at: "2024-11-20T11:09:46.741442Z",
+      score_id: 6,
+    },
+  ],
+};
+
+export const scoreGroup = {
+  id: 36,
+  updated_at: "2025-01-20T13:50:58.260194Z",
+  df_type: "Quality Execution",
+  inserted_at: "2025-01-20T13:50:58.260194Z",
+  created_by: 1,
+  scores: [
+    {
+      id: 15,
+      status: "PENDING",
+      details: {},
+      quality_control: {
+        active: true,
+        id: 8,
+        name: "test",
+        status: "published",
+        version: 1,
+        versions: null,
+        domain_ids: [2],
+        domains: null,
+        updated_at: "2024-11-28T17:03:22.037798Z",
+        df_type: "template1",
+        queries: null,
+        source_id: 181,
+        dynamic_content: {
+          control_de_calidad: {
+            origin: "user",
+            value: "CONGROL",
+          },
+        },
+        control_mode: "percentage",
+        control_properties: {
+          errors_resource: {
+            id: 11859650,
+            type: "data_structure",
+          },
+        },
+        version_id: 2,
+        score_criteria: {
+          maximum: 20,
+          goal: 10,
+        },
+      },
+      quality_control_version_id: 13,
+      score_type: null,
+      quality_control_status: null,
+      execution_timestamp: null,
+      score_content: null,
+    },
+  ],
+  status_summary: null,
+  dynamic_content: {
+    scheduled: {
+      origin: "user",
+      value: "No",
+    },
+  },
+};
+
+export const scoreData = (props = {}) => ({
+  ...score,
+  ...props,
+});
+
+export const scoreGroupData = (props = {}) => ({
+  ...scoreGroup,
+  ...props,
+});

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

@@ -0,0 +1,154 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<MyScoreGroups /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    class="ui segment"
+  >
+    <div
+      class="ui grid"
+    >
+      <div
+        class="eight wide column"
+      >
+        <h2
+          class="ui header"
+        >
+          <i
+            aria-hidden="true"
+            class="tasks circular icon"
+          />
+          <div
+            class="content"
+          >
+            My score Groups
+          </div>
+        </h2>
+      </div>
+    </div>
+    <table
+      class="ui celled collapsing striped table"
+    >
+      <thead
+        class=""
+      >
+        <tr
+          class=""
+        >
+          <th
+            class=""
+          >
+            Created
+          </th>
+          <th
+            class="center aligned"
+          >
+            Pending
+          </th>
+          <th
+            class="center aligned"
+          >
+            Queued
+          </th>
+          <th
+            class="center aligned"
+          >
+            Succeeded
+          </th>
+          <th
+            class="center aligned"
+          >
+            Failed
+          </th>
+        </tr>
+      </thead>
+      <tbody
+        class=""
+      >
+        <tr
+          class=""
+        >
+          <td
+            class=""
+          >
+            <a
+              href="/scoreGroups/36"
+            >
+              <time
+                datetime="1737381058260"
+              >
+                2025-01-20 13:50
+              </time>
+            </a>
+          </td>
+          <td
+            class="center aligned"
+          >
+            <div
+              class="ui yellow circular label"
+            >
+              1
+            </div>
+          </td>
+          <td
+            class="center aligned"
+          >
+            <div
+              class="ui yellow circular label"
+            >
+              2
+            </div>
+          </td>
+          <td
+            class="center aligned"
+          />
+          <td
+            class="center aligned"
+          />
+        </tr>
+        <tr
+          class=""
+        >
+          <td
+            class=""
+          >
+            <a
+              href="/scoreGroups/36"
+            >
+              <time
+                datetime="1737381058260"
+              >
+                2025-01-20 13:50
+              </time>
+            </a>
+          </td>
+          <td
+            class="center aligned"
+          />
+          <td
+            class="center aligned"
+          />
+          <td
+            class="center aligned"
+          >
+            <div
+              class="ui green circular label"
+            >
+              1
+            </div>
+          </td>
+          <td
+            class="center aligned"
+          >
+            <div
+              class="ui red circular label"
+            >
+              3
+            </div>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div>
+`;

package/src/components/scores/__tests__/__snapshots__/QualityBar.spec.js.snap

@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<QualityBar /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    class="quality-bar-wrapper"
+  >
+    <div
+      class="quality-bar"
+    >
+      <span
+        class="under-minimum-color"
+        style="width: 100%;"
+      >
+        <span
+          class="value"
+        >
+          50%
+        </span>
+      </span>
+    </div>
+  </div>
+</div>
+`;

package/src/components/scores/__tests__/__snapshots__/Score.spec.js.snap

@@ -0,0 +1,92 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Score /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    class="ui breadcrumb"
+  >
+    <a
+      class="section"
+      href="/qualityControls"
+    >
+      Quality Controls
+    </a>
+    <i
+      aria-hidden="true"
+      class="right angle icon divider"
+    />
+    <a
+      class="section"
+      href="/qualityControls/8/scores"
+    >
+      test
+    </a>
+    <i
+      aria-hidden="true"
+      class="right angle icon divider"
+    />
+    <div
+      class="active section"
+    >
+      <time
+        datetime="1732034061438"
+      >
+        2024-11-19 16:34
+      </time>
+    </div>
+  </div>
+  <div
+    class="ui segment"
+  >
+    <h2
+      class="ui header"
+    >
+      <i
+        aria-hidden="true"
+        class="line graph circular icon"
+      />
+      <div
+        class="content"
+      >
+        Score view
+        <div
+          class="quality-bar-wrapper"
+        >
+          <div
+            class="quality-bar"
+          >
+            <span
+              class="under-minimum-color"
+              style="width: 100%;"
+            >
+              <span
+                class="value"
+              >
+                50%
+              </span>
+            </span>
+          </div>
+        </div>
+      </div>
+    </h2>
+    <div
+      class="ui pointing secondary top attached tabular menu"
+    >
+      <a
+        class="item"
+        href="/scores/8"
+      >
+        Details
+      </a>
+      <a
+        class="item"
+        href="/scores/8/events"
+      >
+        Events
+      </a>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`<Score /> matches the latest snapshot when has no score 1`] = `<div />`;

package/src/components/scores/__tests__/__snapshots__/ScoreCrumbs.spec.js.snap

@@ -0,0 +1,39 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<ScoreCrumbs /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    class="ui breadcrumb"
+  >
+    <a
+      class="section"
+      href="/qualityControls"
+    >
+      Quality Controls
+    </a>
+    <i
+      aria-hidden="true"
+      class="right angle icon divider"
+    />
+    <a
+      class="section"
+      href="/qualityControls/8/scores"
+    >
+      test
+    </a>
+    <i
+      aria-hidden="true"
+      class="right angle icon divider"
+    />
+    <div
+      class="active section"
+    >
+      <time
+        datetime="1732034061438"
+      >
+        2024-11-19 16:34
+      </time>
+    </div>
+  </div>
+</div>
+`;