@truedat/dd 8.5.8 → 8.5.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truedat/dd",
-  "version": "8.5.8",
+  "version": "8.5.10",
   "description": "Truedat Web Data Dictionary",
   "sideEffects": false,
   "module": "src/index.js",
@@ -51,22 +51,22 @@
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
-    "@truedat/test": "8.5.8",
+    "@truedat/test": "8.5.10",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.7.0",
     "redux-saga-test-plan": "^4.0.6"
   },
   "dependencies": {
     "@apollo/client": "^3.13.8",
-    "axios": "^1.15.0",
+    "axios": "^1.15.2",
     "file-saver": "^2.0.5",
     "graphql": "^16.11.0",
     "is-hotkey": "^0.2.0",
     "is-url": "^1.2.4",
-    "lodash": "^4.17.21",
+    "lodash": "^4.18.1",
     "match-sorter": "^8.0.1",
     "moment": "^2.30.1",
-    "path-to-regexp": "^8.2.0",
+    "path-to-regexp": "^8.4.0",
     "prop-types": "^15.8.1",
     "query-string": "^7.1.3",
     "react": "^19.1.0",
@@ -86,5 +86,5 @@
     "svg-pan-zoom": "^3.6.2",
     "swr": "^2.3.3"
   },
-  "gitHead": "61ad9443b3d822d30dcfa977f5fad3494b3ed5b4"
+  "gitHead": "7f20176d7fdde8bc45181689840e2766e68036ba"
 }

package/src/api/queries.js

@@ -243,6 +243,7 @@ export const LEGACY_DATA_STRUCTURE_VERSION_QUERY = gql`
     $dataStructureId: ID!
     $version: String!
     $note_fields: [String]
+    $withoutGrants: Boolean!
   ) {
     dataStructureVersion(dataStructureId: $dataStructureId, version: $version) {
       id
@@ -324,7 +325,7 @@ export const LEGACY_DATA_STRUCTURE_VERSION_QUERY = gql`
       }
       ancestry
 
-      grants {
+      grants @skip(if: $withoutGrants) {
         data_structure {
           external_id
           id
@@ -355,7 +356,7 @@ export const LEGACY_DATA_STRUCTURE_VERSION_QUERY = gql`
         }
         user_id
       }
-      grant {
+      grant @skip(if: $withoutGrants) {
         data_structure {
           external_id
           id

package/src/components/ImplementationStructuresLoader.js

@@ -14,7 +14,7 @@ export const ImplementationStructuresLoader = ({
   const structures = _.flow(
     _.concat(structuresFields),
     _.map(_.toInteger),
-    _.uniq
+    _.uniq,
   )(structuresSiblings);
   const [structureIndex, setStructureIndex] = useState(0);
   const [requestedStructures, setRequestedStructures] = useState([]);
@@ -23,7 +23,7 @@ export const ImplementationStructuresLoader = ({
     // check structure_ids, will be undefined if structureIds is an empty Array
     if (structure_id && !_.includes(structure_id)(structures)) {
       if (!_.includes(structure_id)(requestedStructures)) {
-        legacyFetchStructure({ id: structure_id });
+        legacyFetchStructure({ id: structure_id, withoutGrants: true });
         setRequestedStructures([...requestedStructures, structure_id]);
       }
     } else if (structureIndex + 1 < _.size(structureIds)) {
@@ -57,6 +57,7 @@ export const mapStateToProps = ({ structuresFields, structuresSiblings }) => ({
   structuresSiblings: _.keys(structuresSiblings),
 });
 
-export default connect(mapStateToProps, { legacyFetchStructure, clearStructure })(
-  ImplementationStructuresLoader
-);
+export default connect(mapStateToProps, {
+  legacyFetchStructure,
+  clearStructure,
+})(ImplementationStructuresLoader);

package/src/components/LineageGraph.js

@@ -36,6 +36,11 @@ const enablePanZoom = (svg) => {
   svg && svg.enablePan();
   svg && svg.enableZoom();
 };
+const isInteractiveGraphElement = (target) =>
+  target &&
+  target.closest &&
+  target.closest("g.resource, g.group, path.link, a");
+
 const togglePanZoom = (svg) => (selectedNode) => {
   _.isEmpty(selectedNode) ? enablePanZoom(svg) : disablePanZoom(svg);
 };
@@ -93,6 +98,7 @@ export const LineageGraph = ({
         instance.resize();
         instance.fit();
         instance.zoomBy(initialScale);
+        instance.center();
         const currentPan = instance.getPan();
         instance.pan({ x: currentPan.x, y: topMargin });
       } catch (_error) {
@@ -168,15 +174,21 @@ export const LineageGraph = ({
   const onHover = (g) =>
     selectedNode ? undefined : () => dispatch(hoverNode.trigger(g));
   const onPointerDown = (event) => {
-    if (event.currentTarget.setPointerCapture && event.pointerId !== undefined) {
+    if (
+      !isInteractiveGraphElement(event.target) &&
+      event.currentTarget.setPointerCapture &&
+      event.pointerId !== undefined
+    ) {
       event.currentTarget.setPointerCapture(event.pointerId);
     }
   };
 
   const onPointerUp = (event) => {
     if (
+      event.pointerId !== undefined &&
       event.currentTarget.releasePointerCapture &&
-      event.pointerId !== undefined
+      event.currentTarget.hasPointerCapture &&
+      event.currentTarget.hasPointerCapture(event.pointerId)
     ) {
       event.currentTarget.releasePointerCapture(event.pointerId);
     }

package/src/components/LineageGroup.js

@@ -36,10 +36,8 @@ export const LineageGroup = ({
     </text>
   );
   const trigger =
-    z == 0 ? null : handleClick ? (
-      <a onContextMenu={handleClick} onClick={handleClick}>
-        {text}
-      </a>
+    z === 0 ? null : handleClick ? (
+      <a>{text}</a>
     ) : (
       text
     );
@@ -69,7 +67,12 @@ export const LineageGroup = ({
     active ? ["active"] : [],
   ]);
   return (
-    <g className={classNames} onMouseOver={onHover} onContextMenu={handleClick}>
+    <g
+      className={classNames}
+      onMouseOver={onHover}
+      onClick={z === 0 ? undefined : handleClick}
+      onContextMenu={handleClick}
+    >
       <title>{name}</title>
       <rect x={x} y={y} rx="6" ry="6" width={w} height={h} />
       {content}

package/src/components/LineageResource.js

@@ -54,6 +54,7 @@ export const LineageResource = ({
     <g
       className={`resource ${active ? "active" : ""}`}
       onMouseOver={onHover}
+      onClick={handleClick}
       onContextMenu={handleClick}
     >
       <title>{name}</title>

package/src/components/StructureSelectorInputField.js

@@ -25,7 +25,8 @@ export const StructureSelectorInputField = ({
 }) => {
   const { formatMessage } = useIntl();
   const handleSelectStructure = (value) => {
-    value && legacyFetchStructure({ id: _.prop("id")(value) });
+    value &&
+      legacyFetchStructure({ id: _.prop("id")(value), withoutGrants: true });
     value && onChange(value);
   };
 
@@ -40,7 +41,7 @@ export const StructureSelectorInputField = ({
   const aliasIsNeeded =
     _.flow(
       _.map(_.path("structure.id")),
-      _.filter((s) => s === selectedStructure?.structure?.id)
+      _.filter((s) => s === selectedStructure?.structure?.id),
     )(structures).length > 1;
 
   return (
@@ -140,5 +141,5 @@ StructureSelectorInputField.propTypes = {
 };
 
 export default connect(null, { legacyFetchStructure })(
-  StructureSelectorInputField
+  StructureSelectorInputField,
 );

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

@@ -28,6 +28,8 @@ jest.mock("@truedat/core/components/SystemsLoader", () => () => (
 jest.mock("@truedat/core/components/TemplatesLoader", () => () => (
   <div>TemplatesLoader</div>
 ));
+jest.mock("@truedat/core/components/UploadJobs", () => () => <div>UploadJobs</div>);
+jest.mock("@truedat/core/components/UploadJob", () => () => <div>UploadJob</div>);
 
 jest.mock("../CatalogViewConfigs", () => () => <div>CatalogViewConfigs</div>);
 jest.mock("../CatalogViewConfigForm", () => ({

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

@@ -11,7 +11,10 @@ describe("<ImplementationStructuresLoader/>", () => {
     const { unmount } = render(<ImplementationStructuresLoader {...props} />);
     expect(props.clearStructure).toHaveBeenCalledTimes(0);
     expect(props.legacyFetchStructure).toHaveBeenCalledTimes(1);
-    expect(props.legacyFetchStructure).toHaveBeenCalledWith({ id: 42 });
+    expect(props.legacyFetchStructure).toHaveBeenCalledWith({
+      id: 42,
+      withoutGrants: true,
+    });
 
     unmount();
     expect(props.clearStructure).toHaveBeenCalledTimes(1);

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

@@ -1,4 +1,5 @@
 import { render, waitForLoad } from "@truedat/test/render";
+import { fireEvent } from "@testing-library/react";
 import { LineageGroup } from "../LineageGroup";
 
 // Mock LineageContextMenu component
@@ -36,6 +37,10 @@ describe("<LineageGroup />", () => {
     onHover,
   };
 
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
   it("matches the latest snapshot", async () => {
     const rendered = render(
       <svg>
@@ -76,4 +81,30 @@ describe("<LineageGroup />", () => {
     await waitForLoad(rendered);
     expect(rendered.container.querySelector(".popup")).not.toBeInTheDocument();
   });
+
+  it("selects the group when clicking the node body", async () => {
+    const rendered = render(
+      <svg>
+        <LineageGroup {...props} />
+      </svg>
+    );
+    await waitForLoad(rendered);
+
+    fireEvent.click(rendered.container.querySelector("rect"));
+
+    expect(onClick).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not select the group when z is 0", async () => {
+    const rendered = render(
+      <svg>
+        <LineageGroup {...props} z={0} />
+      </svg>
+    );
+    await waitForLoad(rendered);
+
+    fireEvent.click(rendered.container.querySelector("rect"));
+
+    expect(onClick).not.toHaveBeenCalled();
+  });
 });

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

@@ -1,4 +1,5 @@
 import { render, waitForLoad } from "@truedat/test/render";
+import { fireEvent } from "@testing-library/react";
 import { LineageResource } from "../LineageResource";
 
 // Mock LineageContextMenu component
@@ -32,6 +33,10 @@ describe("<LineageResource />", () => {
     onHover,
   };
 
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
   it("matches the latest snapshot", async () => {
     const rendered = render(
       <svg>
@@ -72,4 +77,17 @@ describe("<LineageResource />", () => {
     await waitForLoad(rendered);
     expect(rendered.container.querySelector(".popup")).not.toBeInTheDocument();
   });
+
+  it("selects the resource when clicking the node body", async () => {
+    const rendered = render(
+      <svg>
+        <LineageResource {...props} />
+      </svg>
+    );
+    await waitForLoad(rendered);
+
+    fireEvent.click(rendered.container.querySelector("rect"));
+
+    expect(onClick).toHaveBeenCalledTimes(1);
+  });
 });

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

@@ -120,45 +120,8 @@ exports[`<DictionaryRoutes /> renders correctly with structures route 1`] = `
 
 exports[`<DictionaryRoutes /> renders correctly with structures upload events route 1`] = `
 <div>
-  <div
-    class="ui breadcrumb"
-  >
-    <a
-      class="section"
-      data-discover="true"
-      href="/structureNotes/uploadJobs"
-    >
-      uploadJobs.notes.header
-    </a>
-  </div>
-  <div
-    class="ui segment"
-  >
-    <h2
-      class="ui header"
-    >
-      <i
-        aria-hidden="true"
-        class="cogs circular icon"
-      />
-      <div
-        class="content"
-      >
-        uploadJobs.notes.header
-        <div
-          class="sub header"
-        >
-          uploadJobs.subheader
-        </div>
-      </div>
-    </h2>
-    <div
-      class="dimmable"
-    >
-      <div
-        class="ui bottom attached segment"
-      />
-    </div>
+  <div>
+    UploadJobs
   </div>
 </div>
 `;

package/src/sagas/__tests__/legacyFetchStructure.spec.js

@@ -37,6 +37,7 @@ describe("sagas: legacyFetchStructureSaga", () => {
     dataStructureId: id,
     version,
     note_fields: ["note_field"],
+    withoutGrants: false,
   };
 
   const structureFieldColumns = [{ name: "id" }, { name: "note.note_field" }];
@@ -94,6 +95,41 @@ describe("sagas: legacyFetchStructureSaga", () => {
       dataStructureId: id,
       version,
       note_fields: ["note_field"],
+      withoutGrants: false,
+    };
+
+    expect(() => {
+      testSaga(legacyFetchStructureSaga, { payload })
+        .next()
+        .select(getStructureFieldColumns)
+        .next(structureFieldColumns)
+        .getContext("client")
+        .next(client)
+        .put(legacyFetchStructure.request())
+        .next()
+        .call(client.query, {
+          fetchPolicy: "network-only",
+          query: LEGACY_DATA_STRUCTURE_VERSION_QUERY,
+          variables,
+        })
+        .next({ data: { dataStructureVersion } })
+        .put({ meta, ...legacyFetchStructure.success(data) })
+        .next()
+        .put(legacyFetchStructure.fulfill())
+        .next()
+        .isDone();
+    }).not.toThrow();
+  });
+
+  it("should forward withoutGrants when set in payload", () => {
+    const payload = { id, withoutGrants: true };
+    const meta = { version };
+
+    const variables = {
+      dataStructureId: id,
+      version,
+      note_fields: ["note_field"],
+      withoutGrants: true,
     };
 
     expect(() => {

package/src/sagas/legacyFetchStructure.js

@@ -9,14 +9,14 @@ export function* legacyFetchStructureSaga({ payload }) {
     const structureFieldColumns = yield select(getStructureFieldColumns);
     const note_fields = _.flow(
       _.filter(({ name }) => name.startsWith("note.")),
-      _.map(({ name }) => name.split(".")[1])
+      _.map(({ name }) => name.split(".")[1]),
     )(structureFieldColumns);
 
     const client = yield getContext("client");
 
     yield put(legacyFetchStructure.request());
 
-    const { id, version = "latest" } = payload;
+    const { id, version = "latest", withoutGrants = false } = payload;
     const {
       data: { dataStructureVersion },
     } = yield call(client.query, {
@@ -26,6 +26,7 @@ export function* legacyFetchStructureSaga({ payload }) {
         dataStructureId: id,
         version,
         note_fields,
+        withoutGrants,
       },
     });
 

package/src/styles/lineageGraph.less

@@ -52,17 +52,19 @@
 }
 
 .structure-lineage .dl {
+  height: 100%;
   padding: 0;
   margin: 0;
 }
 
 .structure-lineage .dl svg {
-  height: clamp(340px, 52vw, 640px) !important;
-  max-height: 640px;
+  width: 100%;
+  height: 100% !important;
+  min-height: 340px;
   background-color: #f7f8fa;
   padding: 0;
   margin: 0;
   display: block;
   margin-left: 0;
   margin-right: 0;
-}
+}