@truedat/qx 6.6.0 → 6.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/qx",
-  "version": "6.6.0",
+  "version": "6.6.2",
   "description": "Truedat Web Quality Experience package",
   "sideEffects": false,
   "jsnext:main": "src/index.js",
@@ -35,7 +35,7 @@
     "@testing-library/react": "^12.0.0",
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/user-event": "^13.2.1",
-    "@truedat/test": "6.6.0",
+    "@truedat/test": "6.6.2",
     "babel-jest": "^28.1.0",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-lodash": "^3.3.4",
@@ -84,7 +84,7 @@
     ]
   },
   "dependencies": {
-    "@truedat/core": "6.6.0",
+    "@truedat/core": "6.6.2",
     "prop-types": "^15.8.1",
     "react-hook-form": "^7.45.4",
     "react-intl": "^5.20.10",
@@ -97,5 +97,5 @@
     "react-dom": ">= 16.8.6 < 17",
     "semantic-ui-react": ">= 2.0.3 < 2.2"
   },
-  "gitHead": "84d52d5067ff09b8d9c9b8a9bc8018c53a8e700c"
+  "gitHead": "b5defab13b213876e57046dc7d9885c6adc4a64d"
 }

package/src/components/common/__tests__/ResourceSelector.spec.js

@@ -3,8 +3,35 @@ import { act } from "react-dom/test-utils";
 import userEvent from "@testing-library/user-event";
 import { render } from "@truedat/test/render";
 import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
+import SearchContext from "@truedat/core/search/SearchContext";
 import ResourceSelector from "../ResourceSelector";
 
+jest.mock("@truedat/dd/hooks/useStructures", () => {
+  const originalModule = jest.requireActual("@truedat/dd/hooks/useStructures");
+
+  return {
+    __esModule: true,
+    ...originalModule,
+    useDataStructureFilters: () => ({
+      trigger: () => ({
+        then: (callback) =>
+          callback({
+            data: {},
+          }),
+      }),
+    }),
+    useDataStructureSearch: () => ({
+      trigger: () => ({
+        then: (callback) =>
+          callback({
+            data: { data: [] },
+            headers: {},
+          }),
+      }),
+    }),
+  };
+});
+
 const renderOpts = {
   messages: {
     en: {
@@ -15,27 +42,40 @@ const renderOpts = {
       "queryables.resource.type.data_view": "data_view",
       "queryables.resource.selector.data_view": "data_view",
       "queryables.resource.selector.reference_dataset": "reference_dataset",
+      "search.placeholder": "placeholder",
       "structures.not_found.body": "body",
       "structures.not_found.header": "header",
       "structures.search.placeholder": "placeholder",
+      "structures.loading.header": "loading",
     },
   },
 };
 
+const searchProps = {
+  userFiltersType: "foo",
+  useFilters: jest.fn(),
+  useSearch: jest.fn(),
+  loadingFilters: false,
+  query: "",
+  setQuery: jest.fn(),
+};
+
 describe("<ResourceSelector />", () => {
   it("matches the latest snapshot", () => {
     const { container } = render(
       <TestFormWrapper>
-        <ResourceSelector />
+        <SearchContext.Provider value={searchProps}>
+          <ResourceSelector />
+        </SearchContext.Provider>
       </TestFormWrapper>,
       renderOpts
     );
-
     expect(container).toMatchSnapshot();
   });
 
   it("select data_view", async () => {
     const watcher = jest.fn();
+
     const { container, getByRole } = render(
       <TestFormWrapper
         context={{
@@ -43,7 +83,9 @@ describe("<ResourceSelector />", () => {
         }}
         watcher={watcher}
       >
-        <ResourceSelector />
+        <SearchContext.Provider value={searchProps}>
+          <ResourceSelector />
+        </SearchContext.Provider>
       </TestFormWrapper>,
       renderOpts
     );
@@ -51,6 +93,7 @@ describe("<ResourceSelector />", () => {
     await act(async () => {
       userEvent.click(getByRole("option", { name: /data_view/i }));
     });
+
     await act(async () => {
       userEvent.click(getByRole("option", { name: /UserDataView/i }));
     });
@@ -73,14 +116,16 @@ describe("<ResourceSelector />", () => {
   it("select data_structure", async () => {
     const watcher = jest.fn();
     const { container, getByRole } = render(
-      <TestFormWrapper>
-        <ResourceSelector />
+      <TestFormWrapper watcher={watcher}>
+        <SearchContext.Provider value={searchProps}>
+          <ResourceSelector />
+        </SearchContext.Provider>
       </TestFormWrapper>,
       renderOpts
     );
 
     await act(async () => {
-      userEvent.click(getByRole("option", { name: /data_structure/i }));
+      userEvent.click(await getByRole("option", { name: /data_structure/i }));
     });
 
     expect(container).toMatchSnapshot();
@@ -95,16 +140,23 @@ describe("<ResourceSelector />", () => {
         }}
         watcher={watcher}
       >
-        <ResourceSelector />
+        <SearchContext.Provider value={searchProps}>
+          <ResourceSelector />
+        </SearchContext.Provider>
       </TestFormWrapper>,
       renderOpts
     );
 
     await act(async () => {
-      userEvent.click(getByRole("option", { name: /reference_dataset/i }));
+      userEvent.click(
+        await getByRole("option", { name: /reference_dataset/i })
+      );
     });
+
     await act(async () => {
-      userEvent.click(getByRole("option", { name: /UserReferenceDataset/i }));
+      userEvent.click(
+        await getByRole("option", { name: /UserReferenceDataset/i })
+      );
     });
 
     expect(watcher).lastCalledWith({
@@ -118,7 +170,6 @@ describe("<ResourceSelector />", () => {
         type: "reference_dataset",
       },
     });
-
     expect(container).toMatchSnapshot();
   });
 });

package/src/components/common/__tests__/__snapshots__/ResourceSelector.spec.js.snap

@@ -83,8 +83,8 @@ exports[`<ResourceSelector /> select data_structure 1`] = `
       resource
     </label>
     <div
-      aria-expanded="true"
-      class="ui active visible selection dropdown"
+      aria-expanded="false"
+      class="ui selection dropdown"
       role="listbox"
       tabindex="0"
     >
@@ -101,7 +101,7 @@ exports[`<ResourceSelector /> select data_structure 1`] = `
         class="dropdown icon"
       />
       <div
-        class="visible menu transition"
+        class="menu transition"
       >
         <div
           aria-checked="true"
@@ -176,6 +176,8 @@ exports[`<ResourceSelector /> select data_structure 1`] = `
         />
       </button>
       <div
+        aria-busy="false"
+        aria-disabled="false"
         aria-expanded="false"
         class="ui button floating labeled scrolling dropdown icon"
         role="listbox"
@@ -215,6 +217,7 @@ exports[`<ResourceSelector /> select data_structure 1`] = `
     >
       <div
         class="ui inverted dimmer"
+        style=""
       >
         <div
           class="content"

package/src/components/common/expressions/__tests__/Expression.spec.js

@@ -54,8 +54,8 @@ describe("<Expression />", () => {
       </TestFormWrapper>,
       renderOpts
     );
-    userEvent.click(getAllByRole("listbox")[1]);
-    userEvent.click(getByRole("option", { name: /eq/i }));
+    userEvent.click(await getAllByRole("listbox")[1]);
+    userEvent.click(await getByRole("option", { name: /eq/i }));
 
     expect(watcher).lastCalledWith({
       test: {

package/src/components/common/expressions/__tests__/FunctionArgs.spec.js

@@ -5,6 +5,32 @@ import userEvent from "@testing-library/user-event";
 import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
 import FunctionArgs from "../FunctionArgs";
 
+jest.mock("@truedat/dd/hooks/useStructures", () => {
+  const originalModule = jest.requireActual("@truedat/dd/hooks/useStructures");
+
+  return {
+    __esModule: true,
+    ...originalModule,
+    useDataStructureFilters: () => ({
+      trigger: () => ({
+        then: (callback) =>
+          callback({
+            data: {},
+          }),
+      }),
+    }),
+    useDataStructureSearch: () => ({
+      trigger: () => ({
+        then: (callback) =>
+          callback({
+            data: { data: [] },
+            headers: {},
+          }),
+      }),
+    }),
+  };
+});
+
 const renderOpts = {
   messages: {
     en: {
@@ -72,8 +98,8 @@ describe("<FunctionArgs />", () => {
     );
     await waitFor(() => expect(queryByText(/lazy/i)).not.toBeInTheDocument());
 
-    userEvent.click(getAllByRole("listbox")[0]);
-    userEvent.click(getAllByRole("option", { name: /constant/i })[0]);
+    userEvent.click(await getAllByRole("listbox")[0]);
+    userEvent.click(await getAllByRole("option", { name: /constant/i })[0]);
 
     expect(watcher).lastCalledWith({
       test: {

package/src/components/common/resourceSelectors/DataStructureSelector.js

@@ -53,6 +53,7 @@ export default function DataStructureSelector({ onChange }) {
       {active && (
         <StructureSelector
           withDataFields
+          pageSize={20}
           defaultFilters={{ "class.raw": ["table"] }}
           selectedStructure={selectedStructure}
           onSelect={handleSelect}

package/src/components/common/resourceSelectors/__tests__/DataStructureSelector.spec.js

@@ -4,13 +4,42 @@ import { render } from "@truedat/test/render";
 import TestFormWrapper from "@truedat/qx/components/common/TestFormWrapper";
 import DataStructureSelector from "../DataStructureSelector";
 
+jest.mock("@truedat/dd/hooks/useStructures", () => {
+  const originalModule = jest.requireActual("@truedat/dd/hooks/useStructures");
+
+  return {
+    __esModule: true,
+    ...originalModule,
+    useDataStructureFilters: () => ({
+      trigger: () => ({
+        then: (callback) =>
+          callback({
+            data: {},
+          }),
+      }),
+    }),
+    useDataStructureSearch: () => ({
+      trigger: () => ({
+        then: (callback) =>
+          callback({
+            data: { data: [] },
+            headers: {},
+          }),
+      }),
+    }),
+  };
+});
+
 const renderOpts = {
   messages: {
     en: {
       "queryables.resource.selector.data_structure": "data_structure",
+      "search.placeholder": "search placeholder",
       "structures.not_found.body": "body",
+      "structures.loading.header": "loading",
       "structures.search.placeholder": "placeholder",
       "structures.not_found.header": "header",
+      "structures.loading.header": "loading",
     },
   },
 };

package/src/components/common/resourceSelectors/__tests__/ReferenceDatasetSelector.spec.js

@@ -54,7 +54,7 @@ describe("<ReferenceDatasetSelector />", () => {
 
     await act(async () => {
       userEvent.click(
-        getByRole("option", { name: /SelectedReferenceDataset/i })
+        await getByRole("option", { name: /SelectedReferenceDataset/i })
       );
     });
 

package/src/components/common/resourceSelectors/__tests__/__snapshots__/DataStructureSelector.spec.js.snap

@@ -20,7 +20,7 @@ exports[`<DataStructureSelector /> matches the latest snapshot 1`] = `
         class="search link icon"
       />
       <input
-        placeholder="placeholder"
+        placeholder="search placeholder"
         type="text"
         value=""
       />
@@ -33,6 +33,8 @@ exports[`<DataStructureSelector /> matches the latest snapshot 1`] = `
         />
       </button>
       <div
+        aria-busy="false"
+        aria-disabled="false"
         aria-expanded="false"
         class="ui button floating labeled scrolling dropdown icon"
         role="listbox"
@@ -72,6 +74,7 @@ exports[`<DataStructureSelector /> matches the latest snapshot 1`] = `
     >
       <div
         class="ui inverted dimmer"
+        style=""
       >
         <div
           class="content"

package/src/components/dataViews/queryableProperties/__tests__/GroupBy.spec.js

@@ -26,7 +26,7 @@ const renderOpts = {
 
 describe("<GroupBy />", () => {
   it("matches the latest snapshot", async () => {
-    const { container, debug, getByRole, getAllByRole } = render(
+    const { container, getByRole, getAllByRole } = render(
       <TestFormWrapper
         context={{
           field: "queryables[0].properties",