Revert "[ui] Asset view support for column lineage metadata (#20525)"

This reverts commit 4d77c2a.

js_modules/dagster-ui/packages/ui-components/src/components/Icon.tsx

@@ -42,7 +42,6 @@ import chevron_right from '../icon-svgs/chevron_right.svg';
 import close from '../icon-svgs/close.svg';
 import code_location from '../icon-svgs/code_location.svg';
 import collapse_arrows from '../icon-svgs/collapse_arrows.svg';
-import column_lineage from '../icon-svgs/column_lineage.svg';
 import concept_book from '../icon-svgs/concept-book.svg';
 import console_icon from '../icon-svgs/console.svg';
 import content_copy from '../icon-svgs/content_copy.svg';
@@ -285,7 +284,6 @@ export const Icons = {
   console: console_icon,
   content_copy,
   collapse_arrows,
-  column_lineage,
   corporate_fare,
   delete: deleteSVG,
   done,

js_modules/dagster-ui/packages/ui-core/package.json

@@ -43,7 +43,7 @@
     "codemirror": "^5.65.2",
     "color": "^3.0.0",
     "cronstrue": "^1.84.0",
-    "dagre": "dagster-io/dagre#0.8.5",
+    "dagre": "^0.8.5",
     "date-fns": "^2.28.0",
     "dayjs": "^1.11.7",
     "deepmerge": "^4.2.2",

js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetGraphExplorer.tsx

@@ -16,7 +16,6 @@ import pickBy from 'lodash/pickBy';
 import uniq from 'lodash/uniq';
 import without from 'lodash/without';
 import * as React from 'react';
-import {useMemo} from 'react';
 import styled from 'styled-components';
 
 import {AssetEdges} from './AssetEdges';
@@ -270,11 +269,7 @@ const AssetGraphExplorerWithData = ({
   });
   const focusGroupIdAfterLayoutRef = React.useRef('');
 
-  const {layout, loading, async} = useAssetLayout(
-    assetGraphData,
-    expandedGroups,
-    useMemo(() => ({direction}), [direction]),
-  );
+  const {layout, loading, async} = useAssetLayout(assetGraphData, expandedGroups, direction);
 
   React.useEffect(() => {
     if (!loading) {

js_modules/dagster-ui/packages/ui-core/src/asset-graph/AssetNode.tsx

@@ -28,16 +28,14 @@ interface Props {
 }
 
 export const AssetNode = React.memo(({definition, selected}: Props) => {
+  const displayName = definition.assetKey.path[definition.assetKey.path.length - 1]!;
   const isSource = definition.isSource;
 
   const {liveData} = useAssetLiveData(definition.assetKey);
 
   return (
     <AssetInsetForHoverEffect>
-      <Box
-        flex={{direction: 'row', justifyContent: 'space-between', alignItems: 'center'}}
-        style={{minHeight: 24}}
-      >
+      <Box flex={{direction: 'row', justifyContent: 'space-between', alignItems: 'center'}}>
         <StaleReasonsTag liveData={liveData} assetKey={definition.assetKey} include="upstream" />
         <ChangedReasonsTag
           changedReasons={definition.changedReasons}
@@ -46,7 +44,21 @@ export const AssetNode = React.memo(({definition, selected}: Props) => {
       </Box>
       <AssetNodeContainer $selected={selected}>
         <AssetNodeBox $selected={selected} $isSource={isSource}>
-          <AssetNameRow definition={definition} />
+          <AssetName $isSource={isSource}>
+            <span style={{marginTop: 1}}>
+              <Icon name={isSource ? 'source_asset' : 'asset'} />
+            </span>
+            <div
+              data-tooltip={displayName}
+              data-tooltip-style={isSource ? NameTooltipStyleSource : NameTooltipStyle}
+              style={{overflow: 'hidden', textOverflow: 'ellipsis'}}
+            >
+              {withMiddleTruncation(displayName, {
+                maxLength: ASSET_NODE_NAME_MAX_LENGTH,
+              })}
+            </div>
+            <div style={{flex: 1}} />
+          </AssetName>
           <Box style={{padding: '6px 8px'}} flex={{direction: 'column', gap: 4}} border="top">
             {definition.description ? (
               <AssetDescription $color={Colors.textDefault()}>
@@ -71,28 +83,6 @@ export const AssetNode = React.memo(({definition, selected}: Props) => {
   );
 }, isEqual);
 
-export const AssetNameRow = ({definition}: {definition: AssetNodeFragment}) => {
-  const displayName = definition.assetKey.path[definition.assetKey.path.length - 1]!;
-
-  return (
-    <AssetName $isSource={definition.isSource}>
-      <span style={{marginTop: 1}}>
-        <Icon name={definition.isSource ? 'source_asset' : 'asset'} />
-      </span>
-      <div
-        data-tooltip={displayName}
-        data-tooltip-style={definition.isSource ? NameTooltipStyleSource : NameTooltipStyle}
-        style={{overflow: 'hidden', textOverflow: 'ellipsis'}}
-      >
-        {withMiddleTruncation(displayName, {
-          maxLength: ASSET_NODE_NAME_MAX_LENGTH,
-        })}
-      </div>
-      <div style={{flex: 1}} />
-    </AssetName>
-  );
-};
-
 const AssetNodeRowBox = styled(Box)`
   white-space: nowrap;
   line-height: 12px;
@@ -254,7 +244,7 @@ export const ASSET_NODE_FRAGMENT = gql`
   }
 `;
 
-export const AssetInsetForHoverEffect = styled.div`
+const AssetInsetForHoverEffect = styled.div`
   padding: 10px 4px 2px 4px;
   height: 100%;
 
@@ -263,7 +253,7 @@ export const AssetInsetForHoverEffect = styled.div`
   }
 `;
 
-export const AssetNodeContainer = styled.div<{$selected: boolean}>`
+const AssetNodeContainer = styled.div<{$selected: boolean}>`
   user-select: none;
   cursor: pointer;
   padding: 6px;
@@ -274,11 +264,7 @@ const AssetNodeShowOnHover = styled.span`
   display: none;
 `;
 
-export const AssetNodeBox = styled.div<{
-  $isSource: boolean;
-  $selected: boolean;
-  $noScale?: boolean;
-}>`
+const AssetNodeBox = styled.div<{$isSource: boolean; $selected: boolean}>`
   ${(p) =>
     p.$isSource
       ? `border: 2px dashed ${p.$selected ? Colors.accentGrayHover() : Colors.accentGray()}`
@@ -294,7 +280,7 @@ export const AssetNodeBox = styled.div<{
   &:hover {
     ${(p) => !p.$selected && `border: 2px solid ${Colors.lineageNodeBorderHover()};`};
     box-shadow: ${Colors.shadowDefault()} 0px 1px 4px 0px;
-    scale: ${(p) => (p.$noScale ? '1' : '1.03')};
+    scale: 1.03;
     ${AssetNodeShowOnHover} {
       display: initial;
     }

js_modules/dagster-ui/packages/ui-core/src/asset-graph/SidebarAssetInfo.tsx

@@ -32,7 +32,6 @@ import {
 import {DagsterTypeSummary} from '../dagstertype/DagsterType';
 import {DagsterTypeFragment} from '../dagstertype/types/DagsterType.types';
 import {METADATA_ENTRY_FRAGMENT} from '../metadata/MetadataEntry';
-import {TableSchemaLineageContext} from '../metadata/TableSchema';
 import {Description} from '../pipelines/Description';
 import {SidebarSection, SidebarTitle} from '../pipelines/SidebarComponents';
 import {ResourceContainer, ResourceHeader} from '../pipelines/SidebarOpHelpers';
@@ -160,12 +159,7 @@ export const SidebarAssetInfo = ({graphNode}: {graphNode: GraphNode}) => {
 
       {assetMetadata.length > 0 && (
         <SidebarSection title="Metadata">
-          <TableSchemaLineageContext.Provider value={{assetKey: asset.assetKey}}>
-            <AssetMetadataTable
-              assetMetadata={assetMetadata}
-              repoLocation={repoAddress?.location}
-            />
-          </TableSchemaLineageContext.Provider>
+          <AssetMetadataTable assetMetadata={assetMetadata} repoLocation={repoAddress?.location} />
         </SidebarSection>
       )}
 

js_modules/dagster-ui/packages/ui-core/src/asset-graph/Utils.tsx

@@ -44,7 +44,7 @@ export function isHiddenAssetGroupJob(jobName: string) {
 //
 export type GraphId = string;
 export const toGraphId = (key: {path: string[]}): GraphId => JSON.stringify(key.path);
-export const fromGraphId = (graphId: GraphId): AssetNodeKeyFragment => ({
+export const fromGraphID = (graphId: GraphId): AssetNodeKeyFragment => ({
   path: JSON.parse(graphId),
   __typename: 'AssetKey',
 });
@@ -266,7 +266,7 @@ export const itemWithAssetKey = (key: {path: string[]}) => {
   return (asset: {assetKey: {path: string[]}}) => tokenForAssetKey(asset.assetKey) === token;
 };
 
-export const isGroupId = (str: string) => /^[^@:]+@[^@:]+:.+$/.test(str);
+export const isGroupId = (str: string) => /^[^@:]+@[^@:]+:[^@:]+$/.test(str);
 
 export const groupIdForNode = (node: GraphNode) =>
   [
@@ -281,7 +281,7 @@ export const groupIdForNode = (node: GraphNode) =>
 export const getUpstreamNodes = memoize(
   (assetKey: AssetNodeKeyFragment, graphData: GraphData): AssetNodeKeyFragment[] => {
     const upstream = Object.keys(graphData.upstream[toGraphId(assetKey)] || {});
-    const currentUpstream = upstream.map((graphId) => fromGraphId(graphId));
+    const currentUpstream = upstream.map((graphId) => fromGraphID(graphId));
     return [
       assetKey,
       ...currentUpstream,