yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2025-11-14 18:03:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix #5926 Missing downstream in pipeline task view (#5950)

Browse Source 
* Fix #5926 Missing downstream in pipeline task view

* Addressing review comments

* Addressing comments
This commit is contained in:
Sachin Chaurasiya 2022-07-08 10:42:08 +05:30 committed by GitHub
parent dd97e849a5
commit 68165db61b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 31 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
openmetadata-ui/src/main/resources/ui/src/components/TasksDAGView/TaskNode.tsx
View File

@ -13,6 +13,7 @@
import React, { CSSProperties, Fragment } from 'react'; import React, { CSSProperties, Fragment } from 'react';
import { Handle, HandleType, NodeProps, Position } from 'react-flow-renderer'; import { Handle, HandleType, NodeProps, Position } from 'react-flow-renderer';
import { EntityLineageNodeType } from '../../enums/entity.enum';
const handleStyles = { const handleStyles = {
width: '8px', width: '8px',
@ -22,7 +23,7 @@ const handleStyles = {
top: 10, top: 10,
}; };
const renderHandle = (position: Position) => { const renderHandle = (position: Position, isConnectable: boolean) => {
const styles = { ...handleStyles } as CSSProperties; const styles = { ...handleStyles } as CSSProperties;
let type: HandleType; let type: HandleType;
if (position === Position.Left) { if (position === Position.Left) {
@ -32,32 +33,37 @@ const renderHandle = (position: Position) => {
} }
return ( return (
<Handle isConnectable position={position} style={styles} type={type} /> <Handle
isConnectable={isConnectable}
position={position}
style={styles}
type={type}
/>
); );
}; };
const getHandle = (nodeType: string) => { const getHandle = (nodeType: string, isConnectable: boolean) => {
if (nodeType === 'output') { if (nodeType === EntityLineageNodeType.OUTPUT) {
return renderHandle(Position.Left); return renderHandle(Position.Left, isConnectable);
} else if (nodeType === 'input') { } else if (nodeType === EntityLineageNodeType.INPUT) {
return renderHandle(Position.Right); return renderHandle(Position.Right, isConnectable);
} else { } else {
return ( return (
<Fragment> <Fragment>
{renderHandle(Position.Left)} {renderHandle(Position.Left, isConnectable)}
{renderHandle(Position.Right)} {renderHandle(Position.Right, isConnectable)}
</Fragment> </Fragment>
); );
} }
}; };
const TaskNode = (props: NodeProps) => { const TaskNode = (props: NodeProps) => {
const { data, type } = props; const { data, type, isConnectable } = props;
const { label } = data; const { label } = data;
return ( return (
<div className="task-node tw-relative nowheel tw-px-2 tw-bg-primary-lite tw-border tw-border-primary-hover tw-rounded-md"> <div className="task-node tw-relative nowheel tw-px-2 tw-bg-primary-lite tw-border tw-border-primary-hover tw-rounded-md">
{getHandle(type)} {getHandle(type, isConnectable)}
{/* Node label could be simple text or reactNode */} {/* Node label could be simple text or reactNode */}
<div className="tw-px-2 tw-py-3" data-testid="node-label"> <div className="tw-px-2 tw-py-3" data-testid="node-label">
{label} {label}

22
openmetadata-ui/src/main/resources/ui/src/components/TasksDAGView/TasksDAGView.tsx
View File

@ -19,6 +19,7 @@ import ReactFlow, {
useEdgesState, useEdgesState,
useNodesState, useNodesState,
} from 'react-flow-renderer'; } from 'react-flow-renderer';
import { EntityLineageNodeType } from '../../enums/entity.enum';
import { PipelineStatus, Task } from '../../generated/entity/data/pipeline'; import { PipelineStatus, Task } from '../../generated/entity/data/pipeline';
import { EntityReference } from '../../generated/type/entityReference'; import { EntityReference } from '../../generated/type/entityReference';
import { getEntityName, replaceSpaceWith_ } from '../../utils/CommonUtils'; import { getEntityName, replaceSpaceWith_ } from '../../utils/CommonUtils';
@ -36,12 +37,16 @@ const TasksDAGView = ({ tasks, selectedExec }: Props) => {
const [edgesData, setEdgesData, onEdgesChange] = useEdgesState([]); const [edgesData, setEdgesData, onEdgesChange] = useEdgesState([]);
const getNodeType = useCallback( const getNodeType = useCallback(
(index: number) => { (task: Task) => {
return index === 0 const isDownStreamTask = tasks.some((taskData) =>
? 'input' taskData.downstreamTasks?.includes(task.name)
: index === tasks.length - 1 );
? 'output'
: 'default'; if (isDownStreamTask) {
return EntityLineageNodeType.OUTPUT;
} else {
return EntityLineageNodeType.DEFAULT;
}
}, },
[tasks] [tasks]
); );
@ -56,7 +61,7 @@ const TasksDAGView = ({ tasks, selectedExec }: Props) => {
); );
useEffect(() => { useEffect(() => {
const nodes = tasks.map((task, index) => { const nodes = tasks.map((task) => {
const taskStatus = getTaskExecStatus( const taskStatus = getTaskExecStatus(
task.name, task.name,
selectedExec?.taskStatus || [] selectedExec?.taskStatus || []
@ -65,11 +70,12 @@ const TasksDAGView = ({ tasks, selectedExec }: Props) => {
return { return {
className: classNames('leaf-node', taskStatus), className: classNames('leaf-node', taskStatus),
id: replaceSpaceWith_(task.name), id: replaceSpaceWith_(task.name),
type: getNodeType(index), type: getNodeType(task),
data: { data: {
label: getEntityName(task as EntityReference), label: getEntityName(task as EntityReference),
}, },
position: { x: 0, y: 0 }, position: { x: 0, y: 0 },
isConnectable: false,
}; };
}); });