@truedat/dd 6.8.2 → 6.8.3

package/src/components/__tests__/PendingStructureNotes.spec.js

@@ -1,58 +1,75 @@
-import React, { Suspense } from "react";
+import React from "react";
 import { waitFor } from "@testing-library/react";
 import { render } from "@truedat/test/render";
-import { domainsMock } from "@truedat/test/mocks";
-import { STRUCTURE_NOTES_QUERY } from "../../api/queries";
 import PendingStructureNotes from "../PendingStructureNotes";
 
-const domains = [
-  { id: "1", name: "Domain 1", level: 0 },
-  { id: "2", name: "Domain 2", level: 0 },
-];
-const systems = [
-  { external_id: "some_external_id", id: 10, name: "some system" },
-];
-
-const structureNotes = {
-  loading: false,
-  structureNotes: [
+const data = {
+  data: [
     {
       id: "7207",
-      status: "draft",
-      dataStructure: {
-        currentVersion: {
-          name: "bar",
-          path: ["bar rute"],
-        },
-        domains: [{ name: "bar domain" }],
-        system: { name: "bar system" },
-      },
+      note: { status: "draft" },
+      name: "bar",
+      path: ["bar rute"],
+      domains: [{ name: "bar domain" }],
+      system: { name: "bar system" },
+      non_published_note: { id: 1, status: "draft" },
     },
     {
       id: "665214",
-      status: "rejected",
-      dataStructure: {
-        currentVersion: {
-          name: "foo",
-          path: ["foo rute", "other route"],
-        },
-        domains: [{ name: "foo domain 1" }, { name: "foo domain 2" }],
-        system: { name: "foo system" },
-      },
+      note: { status: "rejected" },
+      name: "foo",
+      path: ["foo rute", "other route"],
+      domains: [{ name: "foo domain 1" }, { name: "foo domain 2" }],
+      system: { name: "foo system" },
+      non_published_note: { id: 2, status: "rejected" },
     },
   ],
 };
 
-const structureNotesMock = {
-  request: { query: STRUCTURE_NOTES_QUERY },
-  result: { data: { structureNotes } },
-};
+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,
+            headers: {},
+          }),
+      }),
+    }),
+  };
+});
 
-const renderOpts = {
-  mocks: [structureNotesMock, domainsMock({ action: "publishStructureNote" })],
-  state: { domains, systems },
+const messages = {
+  en: {
+    "pendingStructureNotes.props.domain": "Domain",
+    "pendingStructureNotes.props.status": "Status",
+    "pendingStructureNotes.props.name": "Name",
+    "search.placeholder": "Search...",
+    "pendingStructureNotes.props.path": "Path",
+    "pendingStructureNotes.props.system": "System",
+    "pendingStructureNotes.search.results.empty": "Empty",
+    "structures.retrieved.results": "{count} structures found",
+    "pendingStructureNotes.subheader": "Subheader",
+    "pendingStructureNotes.header": "Header",
+    "pendingStructureNotes.status.rejected": "Rejected",
+    "pendingStructureNotes.status.draft": "Draft",
+  },
 };
 
+const renderOpts = { messages };
+
 describe("<PendingStructureNotes />", () => {
   it("matches the latest snapshot", async () => {
     const { container, queryByText } = render(
@@ -62,11 +79,7 @@ describe("<PendingStructureNotes />", () => {
     expect(container).toMatchSnapshot();
 
     await waitFor(() => {
-      expect(queryByText(/some system/)).toBeTruthy();
-    });
-
-    await waitFor(() => {
-      expect(queryByText(/fooDomain/)).toBeTruthy();
+      expect(queryByText(/foo system/)).toBeTruthy();
     });
   });
 });

package/src/components/__tests__/PendingStructureNotesLabelResults.spec.js

@@ -0,0 +1,44 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { SearchContextProvider } from "@truedat/core/search/SearchContext";
+import PendingStructureNotesLabelResults from "../PendingStructureNotesLabelResults";
+
+const useFilters = () => ({
+  trigger: () => ({
+    then: (callback) =>
+      callback({
+        data: { data: {} },
+      }),
+  }),
+});
+
+const useSearch = () => ({
+  trigger: () => ({
+    then: (callback) =>
+      callback({
+        data: { data: [] },
+        headers: { "x-total-count": 22 },
+      }),
+  }),
+});
+
+const searchProps = {
+  initialSortColumn: "name.raw",
+  initialSortDirection: "ascending",
+  useSearch: useSearch,
+  userFiltersType: "structures",
+  omitFilters: [],
+  useFilters: useFilters,
+  translations: jest.fn(),
+};
+
+describe("<PendingStructureNotesLabelResults />", () => {
+  it("matches the latest snapshot", () => {
+    const { container } = render(
+      <SearchContextProvider {...searchProps}>
+        <PendingStructureNotesLabelResults />
+      </SearchContextProvider>
+    );
+    expect(container).toMatchSnapshot();
+  });
+});

package/src/components/__tests__/PendingStructureNotesPagination.spec.js

@@ -0,0 +1,43 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { SearchContextProvider } from "@truedat/core/search/SearchContext";
+import PendingStructureNotesPagination from "../PendingStructureNotesPagination";
+
+const useFilters = () => ({
+  trigger: () => ({
+    then: (callback) =>
+      callback({
+        data: { data: {} },
+      }),
+  }),
+});
+
+const useSearch = () => ({
+  trigger: () => ({
+    then: (callback) =>
+      callback({
+        data: { data: [] },
+        headers: { "x-total-count": 22 },
+      }),
+  }),
+});
+
+const searchProps = {
+  useSearch: useSearch,
+  useFilters: useFilters,
+  count: 20,
+  size: 20,
+  page: 1,
+  selectPage: jest.fn(),
+};
+
+describe("<PendingStructureNotesPagination />", () => {
+  it("matches the latest snapshot", () => {
+    const { container } = render(
+      <SearchContextProvider {...searchProps}>
+        <PendingStructureNotesPagination />
+      </SearchContextProvider>
+    );
+    expect(container).toMatchSnapshot();
+  });
+});

package/src/components/__tests__/PendingStructureNotesTable.spec.js

@@ -1,8 +1,39 @@
 import React from "react";
 import { waitFor } from "@testing-library/react";
 import { render } from "@truedat/test/render";
+import SearchContext from "@truedat/core/search/SearchContext";
 import PendingStructureNotesTable from "../PendingStructureNotesTable";
 
+const structures = {
+  data: [
+    {
+      id: "7207",
+      note: { status: "draft" },
+      name: "bar",
+      path: ["bar rute"],
+      domains: [{ name: "bar domain" }],
+      system: { name: "bar system" },
+      non_published_note: { id: 1, status: "draft" },
+    },
+    {
+      id: "665214",
+      note: { status: "rejected" },
+      name: "foo",
+      path: ["foo rute", "other route"],
+      domains: [{ name: "foo domain 1" }, { name: "foo domain 2" }],
+      system: { name: "foo system" },
+      non_published_note: { id: 2, status: "rejected" },
+    },
+  ],
+};
+
+const searchProps = {
+  searchData: structures,
+  sortColumn: "name.raw",
+  sortDirection: "descending",
+  handleSortSelection: jest.fn(),
+};
+
 const renderOpts = {
   messages: {
     en: {
@@ -10,69 +41,52 @@ const renderOpts = {
       "pendingStructureNotes.props.structure": "Structure",
       "pendingStructureNotes.props.status": "Status",
       "pendingStructureNotes.props.system": "System",
-      "pendingStructureNotes.props.domains": "Domains",
+      "pendingStructureNotes.props.domain": "Domain",
       "structure.notes.status.draft": "Draft",
       "structure.notes.status.rejected": "Rejected",
       "pendingStructureNotes.props.path": "Path",
+      "pendingStructureNotes.props.name": "Name",
+      "pendingStructureNotes.status.rejected": "Rejected",
+      "pendingStructureNotes.status.draft": "Draft",
     },
   },
 };
 
-const props = {
-  loading: false,
-  structureNotes: [
-    {
-      id: "7207",
-      status: "draft",
-      data_structure: {
-        current_version: {
-          name: "bar",
-          path: ["bar rute"],
-        },
-        domains: [{ name: "bar domain" }],
-        system: { name: "bar system" },
-      },
-    },
-    {
-      id: "665214",
-      status: "rejected",
-      data_structure: {
-        current_version: {
-          name: "foo",
-          path: ["foo rute", "other route"],
-        },
-        domains: [{ name: "foo domain 1" }, { name: "foo domain 2" }],
-        system: { name: "foo system" },
-      },
-    },
-  ],
-};
-
 describe("<PendingStructureNotesTable />", () => {
+  const columns = [
+    { name: "foo", sort: { name: "name.raw" } },
+    { name: "bar", sort: { name: "bar.raw" } },
+  ];
+  const props = { columns };
+
   it("matches the latest snapshot", async () => {
     const { container, queryByText } = render(
-      <PendingStructureNotesTable {...props} />,
+      <SearchContext.Provider value={searchProps}>
+        <PendingStructureNotesTable {...props} />
+      </SearchContext.Provider>,
       renderOpts
     );
     expect(container).toMatchSnapshot();
 
     await waitFor(() => {
-      expect(queryByText(/Draft/)).toBeTruthy();
+      expect(queryByText(/bar system/)).toBeTruthy();
     });
 
     await waitFor(() => {
-      expect(queryByText(/Rejected/)).toBeTruthy();
+      expect(queryByText(/foo system/)).toBeTruthy();
     });
   });
 
   it("matches when StructureNotes are empty and not loading", async () => {
-    const props = {
-      loading: false,
-      structureNotes: [],
+    const newSearchProps = {
+      ...searchProps,
+      searchData: [],
     };
 
     const { container, queryByText } = render(
-      <PendingStructureNotesTable {...props} />,
+      <SearchContext.Provider value={newSearchProps}>
+        <PendingStructureNotesTable {...props} />
+      </SearchContext.Provider>,
       renderOpts
     );
     expect(container).toMatchSnapshot();

package/src/components/__tests__/__snapshots__/PendingStructureNoteRow.spec.js.snap

@@ -8,7 +8,8 @@ exports[`<PendingStructureNoteRow /> matches the latest snapshot 1`] = `
         class=""
       >
         <td
-          class=""
+          class="structure-cell-overflow"
+          title="bar"
         >
           bar
         </td>
@@ -25,12 +26,16 @@ exports[`<PendingStructureNoteRow /> matches the latest snapshot 1`] = `
         <td
           class=""
         >
-          bar domain
+          bar domain, baz domain
         </td>
         <td
           class=""
         >
-          bar rute
+          <span
+            title="bar rute"
+          >
+            bar rute
+          </span>
         </td>
       </tr>
     </tbody>

package/src/components/__tests__/__snapshots__/PendingStructureNotes.spec.js.snap

@@ -15,111 +15,193 @@ exports[`<PendingStructureNotes /> matches the latest snapshot 1`] = `
       <div
         class="content"
       >
-        Pending Notes
+        Header
         <div
           class="sub header"
         >
-          Structure notes pending some action
+          Subheader
         </div>
       </div>
     </h2>
-    <form
-      class="ui loading form"
+    <div
+      class="ui action left icon input"
     >
-      <h5
-        class="ui header"
-      >
-        Filters
-      </h5>
+      <i
+        aria-hidden="true"
+        class="search link icon"
+      />
+      <input
+        placeholder="Search..."
+        type="text"
+        value=""
+      />
       <div
-        class="field subscriptions-checkbox-filters"
+        aria-busy="false"
+        aria-disabled="false"
+        aria-expanded="false"
+        class="ui button floating labeled scrolling dropdown icon"
+        role="listbox"
+        tabindex="0"
       >
-        <label>
-          Status
-        </label>
         <div
-          class="ui checked checkbox"
+          aria-atomic="true"
+          aria-live="polite"
+          class="divider text"
+          role="alert"
         >
-          <input
-            checked=""
-            class="hidden"
-            readonly=""
-            tabindex="0"
-            type="checkbox"
-            value=""
-          />
-          <label>
-            Pending approval
-          </label>
+          Filters
         </div>
+        <i
+          aria-hidden="true"
+          class="filter icon"
+        />
         <div
-          class="ui checked checkbox"
+          class="menu transition"
         >
-          <input
-            checked=""
-            class="hidden"
-            readonly=""
-            tabindex="0"
-            type="checkbox"
-            value=""
-          />
-          <label>
-            Draft
-          </label>
+          <div
+            class="item"
+            role="option"
+          >
+            <em>
+              (reset filters)
+            </em>
+          </div>
         </div>
+      </div>
+    </div>
+    <div
+      class="selectedFilters"
+    />
+    <div
+      class="dimmable"
+    >
+      <div
+        class="ui inverted dimmer"
+        style=""
+      >
         <div
-          class="ui checked checkbox"
+          class="content"
         >
-          <input
-            checked=""
-            class="hidden"
-            readonly=""
-            tabindex="0"
-            type="checkbox"
-            value=""
+          <div
+            class="ui loader"
           />
-          <label>
-            Rejected
-          </label>
         </div>
       </div>
       <div
-        class="field"
+        class="ui label structures-notes-label-results"
       >
-        <label>
-          System
-        </label>
-        <div
-          aria-expanded="false"
-          aria-multiselectable="true"
-          class="ui multiple selection dropdown"
-          role="listbox"
-          tabindex="0"
+        0 structures found
+      </div>
+      <table
+        class="ui selectable sortable table"
+      >
+        <thead
+          class=""
         >
-          <i
-            aria-hidden="true"
-            class="dropdown icon"
-          />
-          <div
-            class="menu transition"
+          <tr
+            class=""
           >
-            <div
-              aria-checked="false"
-              aria-selected="true"
-              class="selected item"
-              role="option"
-              style="pointer-events: all;"
+            <th
+              class="two wide"
+            >
+              Name
+            </th>
+            <th
+              class="one wide"
+            >
+              Status
+            </th>
+            <th
+              class="one wide"
+            >
+              System
+            </th>
+            <th
+              class="one wide disabled"
+            >
+              Domain
+            </th>
+            <th
+              class="one wide disabled"
+            >
+              Path
+            </th>
+          </tr>
+        </thead>
+        <tbody
+          class=""
+        >
+          <tr
+            class=""
+          >
+            <td
+              class="structure-cell-overflow"
+              title="bar"
+            >
+              bar
+            </td>
+            <td
+              class=""
+            >
+              Draft
+            </td>
+            <td
+              class=""
+            >
+              bar system
+            </td>
+            <td
+              class=""
+            >
+              bar domain
+            </td>
+            <td
+              class=""
             >
               <span
-                class="text"
+                title="bar rute"
               >
-                some system
+                bar rute
               </span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </form>
+            </td>
+          </tr>
+          <tr
+            class=""
+          >
+            <td
+              class="structure-cell-overflow"
+              title="foo"
+            >
+              foo
+            </td>
+            <td
+              class=""
+            >
+              Rejected
+            </td>
+            <td
+              class=""
+            >
+              foo system
+            </td>
+            <td
+              class=""
+            >
+              foo domain 1, foo domain 2
+            </td>
+            <td
+              class=""
+            >
+              <span
+                title="foo rute › other route"
+              >
+                foo rute › other route
+              </span>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
   </div>
 </div>
 `;

package/src/components/__tests__/__snapshots__/PendingStructureNotesLabelResults.spec.js.snap

@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<PendingStructureNotesLabelResults /> matches the latest snapshot 1`] = `
+<div>
+  <div
+    class="ui label structures-notes-label-results"
+  >
+    22 structures found
+  </div>
+</div>
+`;