@truedat/dd 7.11.0 → 7.11.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/dd",
-  "version": "7.11.0",
+  "version": "7.11.2",
   "description": "Truedat Web Data Dictionary",
   "sideEffects": false,
   "module": "src/index.js",
@@ -48,7 +48,7 @@
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
-    "@truedat/test": "7.11.0",
+    "@truedat/test": "7.11.2",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.7.0",
     "redux-saga-test-plan": "^4.0.6"
@@ -83,5 +83,5 @@
     "svg-pan-zoom": "^3.6.2",
     "swr": "^2.3.3"
   },
-  "gitHead": "c8c0d3e62835df86440869c7b797bbe2fc12f3a6"
+  "gitHead": "c7c9de44c34d3105c78711fa63f6ee8cf7730eaf"
 }

package/src/api/queries.js

@@ -242,7 +242,6 @@ export const DATA_STRUCTURE_VERSION_QUERY = gql`
   query DataStructureVersion(
     $dataStructureId: ID!
     $version: String!
-    $note_fields: [String]
   ) {
     dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
       id
@@ -285,106 +284,33 @@ export const DATA_STRUCTURE_VERSION_QUERY = gql`
         alias
         classes
         data_structure_id
-        deleted_at
         id
-        metadata
         name
         type
-        has_note
         note
       }
       children {
         alias
         classes
         data_structure_id
-        deleted_at
         id
-        metadata
         name
         type
-        has_note
         note
       }
       siblings {
         alias
         classes
         data_structure_id
-        deleted_at
         id
-        metadata
         name
         type
       }
-      versions {
-        deleted_at
-        inserted_at
-        updated_at
-        version
-      }
+      version_count
+
       ancestry
 
-      grants {
-        data_structure {
-          external_id
-          id
-          system_id
-        }
-        data_structure_version {
-          ancestry
-          name
-        }
-        detail
-        end_date
-        external_ref
-        id
-        inserted_at
-        pending_removal
-        source_user_name
-        start_date
-        system {
-          external_id
-          id
-          name
-        }
-        updated_at
-        user {
-          email
-          full_name
-          user_name
-        }
-        user_id
-      }
-      grant {
-        data_structure {
-          external_id
-          id
-          system_id
-        }
-        data_structure_version {
-          ancestry
-          name
-        }
-        detail
-        end_date
-        external_ref
-        id
-        inserted_at
-        pending_removal
-        source_user_name
-        start_date
-        system {
-          external_id
-          id
-          name
-        }
-        updated_at
-        user {
-          email
-          full_name
-          user_name
-        }
-        user_id
-      }
+      grants_count
 
       classes
       implementation_count
@@ -419,33 +345,7 @@ export const DATA_STRUCTURE_VERSION_QUERY = gql`
         in
         out
       }
-      data_fields {
-        alias
-        classes
-        data_structure_id
-        deleted_at
-        description
-        degree {
-          in
-          out
-        }
-        links
-        id
-        metadata
-        name
-        type
-        profile {
-          max
-          min
-          most_frequent
-          null_count
-          patterns
-          total_count
-          unique_count
-        }
-        has_note
-        note(select_fields: $note_fields)
-      }
+      data_fields_count
       relations {
         parents {
           id
@@ -476,23 +376,136 @@ export const DATA_STRUCTURE_VERSION_QUERY = gql`
         }
       }
 
-      links
       _actions
       user_permissions
     }
   }
 `;
-
+ 
 export const DATA_STRUCTURE_VERSION_METADATA_QUERY = gql`
-query DataStructureVersion(
-  $dataStructureId: ID!
-  $version: String!
-) {
-  dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
-    metadata
+  query DataStructureVersion(
+    $dataStructureId: ID!
+    $version: String!
+  ) {
+    dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
+      metadata
+    }
+  }
+`;
+
+export const DATA_STRUCTURE_VERSION_LINKS_QUERY = gql`
+  query DataStructureVersion(
+    $dataStructureId: ID!
+    $version: String!
+  ) {
+    dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
+      links
+    }
+  }
+`;
+
+
+export const DATA_STRUCTURE_VERSION_VERSIONS_QUERY = gql`
+  query DataStructureVersion(
+    $dataStructureId: ID!
+    $version: String!
+  ) {
+    dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
+      versions {
+        deleted_at
+        inserted_at
+        updated_at
+        version
+      }
+    }
   }
-}
 `;
+
+export const DATA_STRUCTURE_VERSION_GRANTS_QUERY = gql`
+  query DataStructureVersion(
+    $dataStructureId: ID!
+    $version: String!
+  ) {
+    dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
+      grants {
+        data_structure {
+          external_id
+          id
+          system_id
+        }
+        data_structure_version {
+          ancestry
+          name
+        }
+        detail
+        end_date
+        external_ref
+        id
+        inserted_at
+        pending_removal
+        source_user_name
+        start_date
+        system {
+          external_id
+          id
+          name
+        }
+        updated_at
+        user {
+          email
+          full_name
+          user_name
+        }
+        user_id
+      }
+    }
+  }
+`;
+
+export const DATA_STRUCTURE_PARENTS_QUERY = gql`
+  query DataStructureVersion(
+    $dataStructureId: ID!
+    $version: String!
+  ) {
+    dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
+      parents {
+        alias
+        classes
+        data_structure_id
+        deleted_at
+        id
+        metadata
+        name
+        type
+        has_note
+        note
+      }
+    }
+  }
+`;
+ 
+export const DATA_STRUCTURE_CHILDREN_QUERY = gql`
+  query DataStructureVersion(
+    $dataStructureId: ID!
+    $version: String!
+  ) {
+    dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
+      children {
+        alias
+        classes
+        data_structure_id
+        deleted_at
+        id
+        metadata
+        name
+        type
+        has_note
+        note
+      }
+    }
+  }
+`;
+
 export const TASKS_QUERY = gql`
   query Tasks {
     tasks {

package/src/components/StructureGrants.js

@@ -8,23 +8,23 @@ import { columnDecorator } from "@truedat/core/services";
 import { linkTo } from "@truedat/core/routes";
 import { getGrantsColumns } from "../selectors";
 import GrantRemoval from "./GrantRemoval";
+import { useQuery } from "@apollo/client";
+import { DATA_STRUCTURE_VERSION_GRANTS_QUERY } from "../api/queries";
 
 const matchesStructure = ({ id }) => _.pathEq("data_structure.id", id);
 
-export const StructureGrants = ({
+const StructureGrantsContent = ({
   columns,
-  grants,
   grantsActions,
   structure,
   userPermissions,
+  grants,
+  canUpdateRemoval,
 }) => {
   const { formatMessage } = useIntl();
   const navigate = useNavigate();
-  const canUpdateRemoval =
-    userPermissions?.update_grant_removal &&
-    _.any(matchesStructure(structure))(grants);
 
-  return grants ? (
+  return (
     <Table basic="very">
       <Table.Header>
         <Table.Row>
@@ -76,7 +76,50 @@ export const StructureGrants = ({
         ))}
       </Table.Body>
     </Table>
-  ) : null;
+  );
+};
+
+StructureGrantsContent.propTypes = {
+  columns: PropTypes.array,
+  grantsActions: PropTypes.object,
+  structure: PropTypes.object,
+  userPermissions: PropTypes.object,
+  grants: PropTypes.array,
+  canUpdateRemoval: PropTypes.bool,
+};
+
+export const StructureGrants = ({
+  columns,
+  grantsActions,
+  structure,
+  userPermissions,
+}) => {
+  const { data } = useQuery(DATA_STRUCTURE_VERSION_GRANTS_QUERY, {
+    fetchPolicy: "network-only",
+    variables: { dataStructureId: structure.id, version: "latest" },
+    skip: !structure?.id,
+  });
+  const grants = data?.dataStructureVersion.grants;
+
+  const canUpdateRemoval =
+    userPermissions?.update_grant_removal &&
+    grants &&
+    _.any(matchesStructure(structure))(grants);
+
+  if (!grants) {
+    return null;
+  }
+
+  return (
+    <StructureGrantsContent
+      columns={columns}
+      grantsActions={grantsActions}
+      structure={structure}
+      userPermissions={userPermissions}
+      grants={grants}
+      canUpdateRemoval={canUpdateRemoval}
+    />
+  );
 };
 
 StructureGrants.propTypes = {

package/src/components/StructureTabPane.js

@@ -41,21 +41,30 @@ const StructureSuggestionLinkForm = lazy(
 );
 
 const RuleImplementationsTable = lazy(
-  () => import("@truedat/dq/components/RuleImplementationsTable")
+  () => import("@truedat/dq/components/SimpleRuleImplementationsTable")
 );
 
 const CustomTab = ({ tabs, activeTab }) => {
   if (_.isEmpty(tabs)) return null;
-  const tab = _.find((tab) => (tab.name === activeTab))(tabs);
+  const tab = _.find((tab) => tab.name === activeTab)(tabs);
   return tab?.content;
-}
+};
 
 export const StructureTabPane = ({ path }) => {
   const customTabs = useStructureCustomTabs();
   const tabVisibility = useSelector(getTabVisibility);
-  const structureTabsOrder = useSelector(state => state.structureTabsOrder);
-  const columns = useSelector(state => getLinkedImplementationsToStructuresColumns(state));
-  const activeTab = getActiveTab({ tabVisibility, path, structureTabsOrder, customTabs });
+  const structureTabsOrder = useSelector((state) => state.structureTabsOrder);
+  const columns = useSelector((state) =>
+    getLinkedImplementationsToStructuresColumns(state)
+  );
+  const ruleImplementations = useSelector((state) => state.ruleImplementations);
+
+  const activeTab = getActiveTab({
+    tabVisibility,
+    path,
+    structureTabsOrder,
+    customTabs,
+  });
 
   return (
     <ErrorBoundary>
@@ -90,7 +99,10 @@ export const StructureTabPane = ({ path }) => {
       {activeTab === "events" && <StructureEvents />}
       {activeTab === "roles" && <StructureRoles />}
       {activeTab === "rules" && tabVisibility.rules && (
-        <RuleImplementationsTable columns={columns} />
+        <RuleImplementationsTable
+          columns={columns}
+          ruleImplementations={ruleImplementations}
+        />
       )}
       {activeTab === "metadata" && tabVisibility.metadata && (
         <StructureMetadata />
@@ -102,6 +114,6 @@ export const StructureTabPane = ({ path }) => {
   );
 };
 
-StructureTabPane.propTypes = { path: PropTypes.string, };
+StructureTabPane.propTypes = { path: PropTypes.string };
 
 export default StructureTabPane;

package/src/components/StructureVersions.js

@@ -1,17 +1,30 @@
 import _ from "lodash/fp";
 import PropTypes from "prop-types";
 import { connect } from "react-redux";
+import { useParams } from "react-router";
 import { List } from "semantic-ui-react";
 import StructureVersionListItem from "./StructureVersionListItem";
+import { useQuery } from "@apollo/client";
+import { DATA_STRUCTURE_VERSION_VERSIONS_QUERY } from "../api/queries";
 
-export const StructureVersions = ({ id, versions }) =>
+export const StructureVersions = () =>{
+  const { id } = useParams();
+  
+  const { data } = useQuery(DATA_STRUCTURE_VERSION_VERSIONS_QUERY, {
+    fetchPolicy: "network-only", 
+    variables: { dataStructureId: id, version: "latest" },
+  });
+
+  const versions = data?.dataStructureVersion.versions;
+  return (
   !_.isEmpty(versions) && (
     <List selection>
       {versions.map((v, i) => (
         <StructureVersionListItem key={i} id={id} {...v} />
       ))}
     </List>
-  );
+  ));
+}
 
 StructureVersions.propTypes = {
   id: PropTypes.number,

package/src/components/StructuresEditableDownloadOption.js

@@ -12,11 +12,13 @@ export const StructuresEditableDownloadOption = ({
   pendingStructureNotes,
 }) => {
   const { formatMessage, locale } = useIntl();
+
   const {
     searchData,
     loading: structuresLoading,
     filterParams: searchParams,
   } = useSearchContext();
+
   const { trigger: triggerDownload, isMutating: structuresDownloading } =
     useDataStructureDownload();
 

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

@@ -2,6 +2,32 @@ import _ from "lodash/fp";
 import { render } from "@truedat/test/render";
 import { StructureGrants } from "../StructureGrants";
 
+jest.mock("@apollo/client", () => ({
+  gql: jest.fn((query) => query),
+  useQuery: jest.fn(() => ({
+    data: {
+      dataStructureVersion: {
+        grants: [
+          {
+            id: 1,
+            user: { id: 1, full_name: "foo user" },
+            data_structure: { id: 99, external_id: "foo_strucutre" },
+            end_date: "2021/08/02",
+            pending_removal: false,
+          },
+          {
+            id: 2,
+            user: { id: 2, full_name: "bar user" },
+            data_structure: { name: "bar structure" },
+            end_date: "2021/09/02",
+            pending_removal: false,
+          },
+        ],
+      },
+    },
+  })),
+}));
+
 describe("<StructureGrants />", () => {
   const idDecorator = ({ id }) => <p>{id}</p>;
   const userDecorator = ({ user }) => <p>{user.full_name}</p>;

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

@@ -56,7 +56,7 @@ jest.mock("@truedat/lm/components/StructureRelationForm", () => () => (
   <div>StructureRelationForm</div>
 ));
 jest.mock("@truedat/profile", () => () => <div>StructureProfile</div>);
-jest.mock("@truedat/dq/components/RuleImplementationsTable", () => () => (
+jest.mock("@truedat/dq/components/SimpleRuleImplementationsTable", () => () => (
   <div>RuleImplementationsTable</div>
 ));
 
@@ -73,132 +73,193 @@ describe("<StructureTabPane />", () => {
   };
 
   it("renders correctly with fields tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_FIELDS} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_FIELDS} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with notes edit route", async () => {
-    const rendered = render(
-      <StructureTabPane path={STRUCTURE_NOTES_EDIT} />,
-      { routes: [STRUCTURE_NOTES_EDIT], state }
-    );
+    const rendered = render(<StructureTabPane path={STRUCTURE_NOTES_EDIT} />, {
+      routes: [STRUCTURE_NOTES_EDIT],
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with notes default route", async () => {
-    const rendered = render(
-      <StructureTabPane path={STRUCTURE_NOTES} />, { state }
-    );
+    const rendered = render(<StructureTabPane path={STRUCTURE_NOTES} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with grants tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_GRANTS} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_GRANTS} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with profile tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(
-      <StructureTabPane path={STRUCTURE_PROFILE} />, { state }
-    );
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_PROFILE} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with metadata tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_METADATA} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_METADATA} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with rules tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_RULES} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_RULES} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with links tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_LINKS} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_LINKS} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with structure links tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_STRUCTURE_LINKS} />, { state }
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(
+      <StructureTabPane path={STRUCTURE_STRUCTURE_LINKS} />,
+      { state }
     );
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with parents tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_PARENTS} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_PARENTS} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with children tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_CHILDREN} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_CHILDREN} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with versions tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_VERSIONS} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_VERSIONS} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with events tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_EVENTS} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_EVENTS} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with roles tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(<StructureTabPane path={STRUCTURE_MEMBERS} />, { state });
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_MEMBERS} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with lineage tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(
-      <StructureTabPane path={STRUCTURE_LINEAGE} />, { state }
-    );
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_LINEAGE} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with impact tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    const rendered = render(
-      <StructureTabPane path={STRUCTURE_IMPACT} />, { state }
-    );
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    const rendered = render(<StructureTabPane path={STRUCTURE_IMPACT} />, {
+      state,
+    });
     await waitForLoad(rendered);
     expect(rendered.container).toMatchSnapshot();
   });
 
   it("renders correctly with custom tab", async () => {
-    jest.spyOn(getTabVisibilityModule, "getTabVisibility").mockReturnValue(tabVisibility);
-    jest.spyOn(useCustomTabsModule, "useStructureCustomTabs").mockReturnValue([{ name: "custom", route: "/structures/:id/custom", content: <p>Custom</p> },]);
+    jest
+      .spyOn(getTabVisibilityModule, "getTabVisibility")
+      .mockReturnValue(tabVisibility);
+    jest
+      .spyOn(useCustomTabsModule, "useStructureCustomTabs")
+      .mockReturnValue([
+        {
+          name: "custom",
+          route: "/structures/:id/custom",
+          content: <p>Custom</p>,
+        },
+      ]);
     const rendered = render(
-      <StructureTabPane path={"/structures/:id/custom"} />, { state }
+      <StructureTabPane path={"/structures/:id/custom"} />,
+      { state }
     );
     await waitForLoad(rendered);
     await waitFor(() => {

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

@@ -1,6 +1,32 @@
 import { render, waitForLoad } from "@truedat/test/render";
 import { StructureVersions } from "../StructureVersions";
 
+jest.mock("react-router", () => ({
+  ...jest.requireActual("react-router"),
+  useParams: jest.fn(() => ({ id: "1" })),
+}));
+
+jest.mock("@apollo/client", () => ({
+  gql: jest.fn((query) => query),
+  useQuery: jest.fn(() => ({
+    data: {
+      dataStructureVersion: {
+        versions: [
+          {
+            version: "0",
+            inserted_at: "2018-01-01T01:01:01.123456Z",
+          },
+          {
+            version: "1",
+            inserted_at: "2018-02-01T01:01:01.123456Z",
+          },
+        ],
+      },
+    },
+  })),
+}));
+
+
 describe("<StructureVersions />", () => {
   it("matches the latest snapshot", async () => {
     const versions = [

package/src/reducers/__tests__/structureRelations.spec.js

@@ -1,4 +1,4 @@
-import { clearStructure, fetchStructure } from "../../routines";
+import { clearStructure, fetchStructure, fetchStructureChildrens, fetchStructureParents } from "../../routines";
 import { childrenRelations, parentRelations } from "..";
 
 const fooState = { foo: "bar" };
@@ -48,7 +48,7 @@ describe("reducers: childrenRelations", () => {
   it("should handle the fetchStructures.SUCCESS action", () => {
     expect(
       childrenRelations(fooState, {
-        type: fetchStructure.SUCCESS,
+        type: fetchStructureChildrens.SUCCESS,
         payload: { data }
       })
     ).toMatchObject(children);
@@ -77,7 +77,7 @@ describe("reducers: parentRelations", () => {
   it("should handle the fetchStructures.SUCCESS action", () => {
     expect(
       parentRelations(fooState, {
-        type: fetchStructure.SUCCESS,
+        type: fetchStructureParents.SUCCESS,
         payload: { data }
       })
     ).toMatchObject(parents);

package/src/reducers/__tests__/structureVersions.spec.js

@@ -1,4 +1,4 @@
-import { clearStructure, fetchStructure } from "../../routines";
+import { clearStructure, fetchStructure, fetchStructureVersions } from "../../routines";
 import { structureVersions } from "..";
 
 const fooState = { foo: "bar" };
@@ -19,7 +19,7 @@ describe("reducers: structureVersions", () => {
   it("should handle the fetchStructure.TRIGGER action", () => {
     expect(
       structureVersions(fooState, { type: fetchStructure.TRIGGER })
-    ).toEqual(initialState);
+    ).toEqual(fooState);
   });
 
   it("should handle the fetchStructure.SUCCESS action", () => {
@@ -28,7 +28,7 @@ describe("reducers: structureVersions", () => {
 
     expect(
       structureVersions(fooState, {
-        type: fetchStructure.SUCCESS,
+        type: fetchStructureVersions.SUCCESS,
         payload: { data }
       })
     ).toMatchObject(versions);

package/src/reducers/structure.js

@@ -29,9 +29,10 @@ const structureVersionFields = _.pick([
   "deleted_at",
   "description",
   "grant",
-  "grants",
+  "grants_count",
   "group",
   "implementation_count",
+  "data_fields_count",
   "metadata",
   "name",
   "note",
@@ -42,6 +43,7 @@ const structureVersionFields = _.pick([
   "system",
   "type",
   "_actions",
+  "version_count",
 ]);
 
 const structure = (state = initialState, { type, payload }) => {

package/src/reducers/structureRelations.js

@@ -1,5 +1,5 @@
 import _ from "lodash/fp";
-import { clearStructure, fetchStructure } from "../routines";
+import { clearStructure, fetchStructureChildrens, fetchStructureParents } from "../routines";
 
 export const initialState = [];
 
@@ -7,9 +7,9 @@ export const childrenRelations = (state = initialState, { type, payload }) => {
   switch (type) {
     case clearStructure.TRIGGER:
       return initialState;
-    case fetchStructure.TRIGGER:
+    case fetchStructureChildrens.TRIGGER:
       return initialState;
-    case fetchStructure.SUCCESS:
+    case fetchStructureChildrens.SUCCESS:
       return _.pathOr([], "data.relations.children")(payload);
     default:
       return state;
@@ -20,7 +20,7 @@ export const parentRelations = (state = initialState, { type, payload }) => {
   switch (type) {
     case clearStructure.TRIGGER:
       return initialState;
-    case fetchStructure.SUCCESS:
+    case fetchStructureParents.SUCCESS:
       return _.pathOr([], "data.relations.parents")(payload);
     default:
       return state;

package/src/reducers/structureVersions.js

@@ -1,19 +1,20 @@
 import _ from "lodash/fp";
-import { clearStructure, fetchStructure } from "../routines";
+import { clearStructure, fetchStructureVersions } from "../routines";
 
 const initialState = [];
 
-const structureVersions = (state = initialState, { type, payload }) => {
+const structureVersions  = (state = initialState, { type, payload }) => {
   switch (type) {
     case clearStructure.TRIGGER:
       return initialState;
-    case fetchStructure.TRIGGER:
+    case fetchStructureVersions.TRIGGER:
       return initialState;
-    case fetchStructure.SUCCESS:
+    case fetchStructureVersions.SUCCESS:
+      console.log("payload", payload);
       return _.pathOr([], "data.versions")(payload);
     default:
       return state;
   }
 };
 
-export { structureVersions };
+export { structureVersions  };

package/src/routines.js

@@ -89,6 +89,9 @@ export const fetchNodes = createRoutine("FETCH_NODES");
 export const fetchProfileExecution = createRoutine("FETCH_EXECUTION_PROFILE");
 export const fetchProfileGroup = createRoutine("FETCH_PROFILE_GROUP");
 export const fetchStructure = createRoutine("FETCH_STRUCTURE");
+export const fetchStructureParents = createRoutine("FETCH_STRUCTURE_PARENTS");
+export const fetchStructureChildrens = createRoutine("FETCH_STRUCTURE_CHILDREN");
+export const fetchStructureVersions = createRoutine("FETCH_STRUCTURE_VERSIONS");
 export const fetchStructureGraph = createRoutine("FETCH_STRUCTURE_GRAPH");
 export const fetchStructureNotes = createRoutine("FETCH_STRUCTURE_NOTES");
 export const fetchStructures = createRoutine("FETCH_STRUCTURES");

package/src/sagas/fetchStructureChildrens.js

@@ -0,0 +1,48 @@
+import _ from "lodash/fp";
+import { call, put, takeLatest, select, getContext } from "redux-saga/effects";
+import { fetchStructureChildrens } from "../routines";
+import { DATA_STRUCTURE_CHILDREN_QUERY } from "../api/queries";
+import { getStructureFieldColumns } from "../selectors";
+
+export function* fetchStructureChildrenSaga({ payload }) {
+  try {
+    const client = yield getContext("client");
+
+    yield put(fetchStructureChildrens.request());
+
+    const { id, version = "latest" } = payload;
+    const {
+      data: { dataStructureVersion },
+    } = yield call(client.query, {
+      fetchPolicy: "network-only",
+      query: DATA_STRUCTURE_CHILDREN_QUERY,
+      variables: {
+        dataStructureId: id,
+        version,
+      },
+    });
+
+    const data = {
+      data: dataStructureVersion,
+      _actions: dataStructureVersion._actions,
+      user_permissions: dataStructureVersion.user_permissions,
+    };
+
+    const meta = { version };
+
+    yield put({ meta, ...fetchStructureChildrens.success(data) });
+  } catch (error) {
+    if (error.response) {
+      const { status, data } = error.response;
+      yield put(fetchStructureChildrens.failure({ status, data }));
+    } else {
+      yield put(fetchStructureChildrens.failure(error.message));
+    }
+  } finally {
+    yield put(fetchStructureChildrens.fulfill());
+  }
+}
+
+export function* fetchStructureChildrensRequestSaga() {
+  yield takeLatest(fetchStructureChildrens.TRIGGER, fetchStructureChildrensSaga);
+}

package/src/sagas/fetchStructureParents.js

@@ -0,0 +1,48 @@
+import _ from "lodash/fp";
+import { call, put, takeLatest, select, getContext } from "redux-saga/effects";
+import { fetchStructureParents } from "../routines";
+import { DATA_STRUCTURE_PARENTS_QUERY } from "../api/queries";
+import { getStructureFieldColumns } from "../selectors";
+
+export function* fetchStructureParentsSaga({ payload }) {
+  try {
+    const client = yield getContext("client");
+
+    yield put(fetchStructureParents.request());
+
+    const { id, version = "latest" } = payload;
+    const {
+      data: { dataStructureVersion },
+    } = yield call(client.query, {
+      fetchPolicy: "network-only",
+      query: DATA_STRUCTURE_PARENTS_QUERY,
+      variables: {
+        dataStructureId: id,
+        version, 
+      },
+    });
+
+    const data = {
+      data: dataStructureVersion,
+      _actions: dataStructureVersion._actions,
+      user_permissions: dataStructureVersion.user_permissions,
+    };
+
+    const meta = { version };
+
+    yield put({ meta, ...fetchStructureParents.success(data) });
+  } catch (error) {
+    if (error.response) {
+      const { status, data } = error.response;
+      yield put(fetchStructureParents.failure({ status, data }));
+    } else {
+      yield put(fetchStructureParents.failure(error.message));
+    }
+  } finally {
+    yield put(fetchStructureParents.fulfill());
+  }
+}
+
+export function* fetchStructureParentsRequestSaga() {
+  yield takeLatest(fetchStructureParents.TRIGGER, fetchStructureParentsSaga);
+}

package/src/sagas/fetchStructureVersions.js

@@ -0,0 +1,46 @@
+import { call, put, takeLatest, getContext } from "redux-saga/effects";
+import { fetchStructureVersions } from "../routines";
+import { DATA_STRUCTURE_VERSION_VERSIONS_QUERY } from "../api/queries";
+
+export function* fetchStructureVersionsSaga({ payload }) {
+  try {
+    const client = yield getContext("client");
+
+    yield put(fetchStructureVersions.request());
+
+    const { id, version = "latest" } = payload;
+    const {
+      data: { dataStructureVersion },
+    } = yield call(client.query, {
+      fetchPolicy: "network-only",
+      query: DATA_STRUCTURE_VERSION_VERSIONS_QUERY,
+      variables: {
+        dataStructureId: id,
+        version,
+      },
+    });
+
+    const data = {
+      data: dataStructureVersion,
+      _actions: dataStructureVersion._actions,
+      user_permissions: dataStructureVersion.user_permissions,
+    };
+
+    const meta = { version };
+
+    yield put({ meta, ...fetchStructureVersions.success(data) });
+  } catch (error) {
+    if (error.response) {
+      const { status, data } = error.response;
+      yield put(fetchStructureVersions.failure({ status, data }));
+    } else {
+      yield put(fetchStructureVersions.failure(error.message));
+    }
+  } finally {
+    yield put(fetchStructureVersions.fulfill());
+  }
+}
+
+export function* fetchStructureVersionsRequestSaga() {
+  yield takeLatest(fetchStructureVersions.TRIGGER, fetchStructureVersionsSaga);
+}

package/src/sagas/index.js

@@ -32,6 +32,8 @@ import { fetchProfileGroupRequestSaga } from "./fetchProfileGroup";
 import { fetchStructureGraphRequestSaga } from "./fetchStructureGraph";
 import { fetchStructureNotesRequestSaga } from "./fetchStructureNotes";
 import { fetchStructureRequestSaga } from "./fetchStructure";
+import { fetchStructureParentsRequestSaga } from "./fetchStructureParents";
+import { fetchStructureChildrensRequestSaga } from "./fetchStructureChildrens";
 import { fetchStructureTypeRequestSaga } from "./fetchStructureType";
 import { fetchStructureTypesRequestSaga } from "./fetchStructureTypes";
 import { fetchStructuresRequestSaga } from "./fetchStructures";

package/src/selectors/__tests__/getTabVisibility.spec.js

@@ -2,10 +2,10 @@ import { getTabVisibility } from "../getTabVisibility";
 
 describe("selectors: getTabVisibility", () => {
   it("should include fields iff structureFields is not empty", () => {
-    expect(getTabVisibility({ structureFields: [1] })).toMatchObject({
+    expect(getTabVisibility({ structure: { data_fields_count: 1 } })).toMatchObject({
       fields: true,
     });
-    expect(getTabVisibility({ structureFields: [] })).toMatchObject({
+    expect(getTabVisibility({ structure: { data_fields_count: 0 } })).toMatchObject({
       fields: false,
     });
   });
@@ -122,10 +122,10 @@ describe("selectors: getTabVisibility", () => {
 
   it("should include versions iff structureVersions is not empty", () => {
     expect(getTabVisibility({})).toMatchObject({ versions: false });
-    expect(getTabVisibility({ structureVersions: [] })).toMatchObject({
+    expect(getTabVisibility({ structure: { version_count: 0 } })).toMatchObject({
       versions: false,
     });
-    expect(getTabVisibility({ structureVersions: [{}] })).toMatchObject({
+    expect(getTabVisibility({ structure: { version_count: 1 } })).toMatchObject({
       versions: true,
     });
   });
@@ -224,10 +224,10 @@ describe("selectors: getTabVisibility", () => {
     expect(getTabVisibility({ structure: {} })).toMatchObject({
       grants: false,
     });
-    expect(getTabVisibility({ structure: { grants: [] } })).toMatchObject({
+    expect(getTabVisibility({ structure: { grants_count: 0 } })).toMatchObject({
       grants: false,
     });
-    expect(getTabVisibility({ structure: { grants: [{}] } })).toMatchObject({
+    expect(getTabVisibility({ structure: { grants_count: 1 } })).toMatchObject({
       grants: true,
     });
   });

package/src/selectors/getTabVisibility.js

@@ -6,7 +6,7 @@ const notEmpty = _.negate(_.isEmpty);
 const notEmptyPath = (path) => _.flow(_.path(path), notEmpty);
 const hasProfile = notEmptyPath("profile");
 
-const fieldsTabVisible = _.conformsTo({ structureFields: notEmpty });
+const fieldsTabVisible = (state) => state?.structure?.data_fields_count > 0;
 
 const profileTabVisible = ({
   userPermissions,
@@ -36,7 +36,8 @@ const notesTabVisible = ({ templatesLoading, templates, structure }) =>
     _.negate(_.isNil)
   )(templates);
 
-const versionsTabVisible = notEmptyPath("structureVersions");
+// const versionsTabVisible = notEmptyPath("structureVersions");
+const versionsTabVisible = (state) => state?.structure?.version_count > 0;
 
 const structureLinksTabVisible = (state) =>
   _.has("create_struct_to_struct_link", state?.structureActions) ||
@@ -56,7 +57,8 @@ const eventsTabVisible = _.flow(
   _.prop("structureVersion"),
   _.isEqual("latest")
 );
-const grantsTabVisible = _.flow(_.path("structure.grants"), notEmpty);
+const grantsTabVisible = (state) => state?.structure?.grants_count > 0;
+
 const metatadaVisible = (state) => !_.isEmpty(_.path(["structure", "structure_type", "metadata_views"])(state))
 
 export const getTabVisibility = createSelector([state => state], (state) => ({