fix lineage

Author: salazarm

Diff for: js_modules/dagster-ui/packages/ui-core/src/assets/AssetCatalogAssetGraph.tsx

@@ -2,6 +2,7 @@ import React, {useCallback, useMemo} from 'react';
 import {useHistory} from 'react-router';
 
 import {assetDetailsPathForKey} from './assetDetailsPathForKey';
+import {useStateWithStorage} from '../../../../../../../internal/dagster-cloud/js_modules/app-cloud/dagster/js_modules/dagster-ui/packages/ui-core/src/hooks/useStateWithStorage';
 import {AssetGraphExplorer} from '../asset-graph/AssetGraphExplorer';
 import {AssetGraphViewType} from '../asset-graph/Utils';
 import {AssetLocation} from '../asset-graph/useFindAssetLocation';
@@ -46,7 +47,23 @@ export const AssetCatalogAssetGraph = React.memo(
       [history, openInNewTab],
     );
 
-    const fetchOptions = React.useMemo(() => ({loading: false}), []);
+    const [hideEdgesToNodesOutsideQuery, setHideEdgesToNodesOutsideQuery] = useStateWithStorage(
+      'hideEdgesToNodesOutsideQuery',
+      (json) => {
+        if (json === 'false' || json === false) {
+          return false;
+        }
+        return true;
+      },
+    );
+
+    const fetchOptions = React.useMemo(
+      () => ({
+        loading: false,
+        hideEdgesToNodesOutsideQuery,
+      }),
+      [hideEdgesToNodesOutsideQuery],
+    );
 
     const lineageOptions = React.useMemo(
       () => ({preferAssetRendering: true, explodeComposites: true}),
@@ -73,6 +90,7 @@ export const AssetCatalogAssetGraph = React.memo(
         viewType={AssetGraphViewType.CATALOG}
         isFullScreen={isFullScreen}
         toggleFullScreen={toggleFullScreen}
+        setHideEdgesToNodesOutsideQuery={setHideEdgesToNodesOutsideQuery}
       />
     );
   },

Diff for: js_modules/dagster-ui/packages/ui-core/src/assets/AssetCatalogTableV2.tsx

@@ -144,8 +144,16 @@ export const AssetsCatalogTableV2Impl = React.memo(
       );
     }
 
+    const extraStyles =
+      selectedTab === 'lineage'
+        ? {
+            gridTemplateColumns: 'minmax(500px, 1fr)',
+            display: 'grid',
+            gridTemplateRows: 'repeat(2, auto) minmax(0, 1fr)',
+          }
+        : {};
     return (
-      <Box flex={{direction: 'column'}} style={{height: '100%', minHeight: 600}}>
+      <Box flex={{direction: 'column'}} style={{height: '100%', minHeight: 600, ...extraStyles}}>
         <Box
           flex={{direction: 'row', alignItems: 'center', gap: 8}}
           padding={{vertical: 12, horizontal: 24}}
@@ -196,7 +204,13 @@ const Table = React.memo(
     );
 
     return (
-      <div style={{display: 'grid', gridTemplateRows: 'minmax(0, 1fr)', height: '100%'}}>
+      <div
+        style={{
+          display: 'grid',
+          gridTemplateRows: 'minmax(0, 1fr)',
+          height: '100%',
+        }}
+      >
         <div
         // style={{
         //   display: 'grid',
@@ -205,7 +219,12 @@ const Table = React.memo(
         // }}
         >
           <div
-            style={{display: 'grid', gridTemplateRows: 'auto minmax(500px, 1fr)', height: '100%'}}
+            style={{
+              display: 'grid',
+              gridTemplateRows: 'auto minmax(500px, 1fr)',
+              height: '100%',
+              gridTemplateColumns: 'minmax(500px, 1fr)',
+            }}
           >
             <Box
               flex={{direction: 'row', alignItems: 'center', justifyContent: 'space-between'}}