fix(lineage): fixing lineage layout bugs (#2337)

datahub-project · Apr 5, 2021 · 17f7c9e · 17f7c9e
1 parent 7592881
commit 17f7c9e
Show file tree

Hide file tree

Showing 4 changed files with 2,046 additions and 20 deletions.
diff --git a/datahub-web-react/src/Mocks.tsx b/datahub-web-react/src/Mocks.tsx
@@ -256,10 +256,26 @@ export const dataset6 = {
     urn: 'urn:li:dataset:6',
 };
 
+export const dataset7 = {
+    ...dataset3,
+    name: 'Seventh Test Dataset',
+    urn: 'urn:li:dataset:7',
+};
+
 export const dataset3WithLineage = {
     ...dataset3,
     upstreamLineage: {
         upstreams: [
+            {
+                created: {
+                    time: 0,
+                },
+                lastModified: {
+                    time: 0,
+                },
+                type: DatasetLineageType.Transformed,
+                dataset: dataset7,
+            },
             {
                 created: {
                     time: 0,
@@ -326,6 +342,16 @@ export const dataset5WithLineage = {
     },
     downstreamLineage: {
         downstreams: [
+            {
+                created: {
+                    time: 0,
+                },
+                lastModified: {
+                    time: 0,
+                },
+                type: DatasetLineageType.Transformed,
+                dataset: dataset7,
+            },
             {
                 created: {
                     time: 0,
@@ -382,6 +408,38 @@ export const dataset6WithLineage = {
     },
 };
 
+export const dataset7WithLineage = {
+    ...dataset7,
+    upstreamLineage: {
+        upstreams: [
+            {
+                created: {
+                    time: 0,
+                },
+                lastModified: {
+                    time: 0,
+                },
+                type: DatasetLineageType.Transformed,
+                dataset: dataset5,
+            },
+        ],
+    },
+    downstreamLineage: {
+        downstreams: [
+            {
+                created: {
+                    time: 0,
+                },
+                lastModified: {
+                    time: 0,
+                },
+                type: DatasetLineageType.Transformed,
+                dataset: dataset3,
+            },
+        ],
+    },
+};
+
 const sampleTag = {
     urn: 'urn:li:tag:abc-sample-tag',
     name: 'abc-sample-tag',

diff --git a/datahub-web-react/src/app/lineage/__tests__/adjustVXTreeLayout.test.tsx b/datahub-web-react/src/app/lineage/__tests__/adjustVXTreeLayout.test.tsx
@@ -2,7 +2,13 @@ import React from 'react';
 import { Tree, hierarchy } from '@vx/hierarchy';
 import { render } from '@testing-library/react';
 
-import { dataset3WithLineage, dataset4WithLineage, dataset5WithLineage, dataset6WithLineage } from '../../../Mocks';
+import {
+    dataset3WithLineage,
+    dataset4WithLineage,
+    dataset5WithLineage,
+    dataset6WithLineage,
+    dataset7WithLineage,
+} from '../../../Mocks';
 import constructTree from '../utils/constructTree';
 import extendAsyncEntities from '../utils/extendAsyncEntities';
 import adjustVXTreeLayout from '../utils/adjustVXTreeLayout';
@@ -35,6 +41,47 @@ describe('adjustVXTreeLayout', () => {
                     expect(adjustedTree.nodesToRender[1].x).not.toEqual(adjustedTree.nodesToRender[3].x);
                     expect(adjustedTree.nodesToRender[0].x).not.toEqual(adjustedTree.nodesToRender[3].x);
 
+                    expect(adjustedTree.nodesToRender.length).toEqual(5);
+
+                    return <div />;
+                }}
+            </Tree>,
+        );
+    });
+
+    it('handles multiple instances of lineage jumping over layers while upstream', () => {
+        const fetchedEntities = [
+            { entity: dataset4WithLineage, direction: Direction.Upstream, fullyFetched: true },
+            { entity: dataset5WithLineage, direction: Direction.Upstream, fullyFetched: true },
+            { entity: dataset6WithLineage, direction: Direction.Upstream, fullyFetched: true },
+            { entity: dataset7WithLineage, direction: Direction.Upstream, fullyFetched: true },
+        ];
+        const mockFetchedEntities = fetchedEntities.reduce(
+            (acc, entry) => extendAsyncEntities(acc, entry.entity, entry.fullyFetched),
+            {} as FetchedEntities,
+        );
+
+        const upstreamData = hierarchy(constructTree(dataset3WithLineage, mockFetchedEntities, Direction.Upstream));
+
+        render(
+            <Tree<NodeData> root={upstreamData} size={[1000, 1000]}>
+                {(tree) => {
+                    const adjustedTree = adjustVXTreeLayout({ tree, direction: Direction.Upstream });
+
+                    expect(adjustedTree.nodesToRender[5].x).toEqual(adjustedTree.nodesToRender[6].x);
+                    expect(adjustedTree.nodesToRender[5].y).toEqual(adjustedTree.nodesToRender[6].y);
+                    expect(adjustedTree.nodesToRender[5].data.name).toEqual(adjustedTree.nodesToRender[6].data.name);
+
+                    expect(adjustedTree.nodesToRender[5].x).toEqual(adjustedTree.nodesToRender[3].x);
+                    expect(adjustedTree.nodesToRender[5].y).toEqual(adjustedTree.nodesToRender[3].y);
+                    expect(adjustedTree.nodesToRender[5].data.name).toEqual(adjustedTree.nodesToRender[3].data.name);
+
+                    expect(adjustedTree.nodesToRender.length).toEqual(7);
+
+                    adjustedTree.nodesToRender.forEach((node) => {
+                        expect(node.y).toBeLessThanOrEqual(0);
+                    });
+
                     return <div />;
                 }}
             </Tree>,