1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
| import Add from './add'
| import Item from './item'
| import type {
| CommonNodeType,
| Node,
| } from '@/app/components/workflow/types'
| import cn from '@/utils/classnames'
|
| type ContainerProps = {
| nodeId: string
| nodeData: CommonNodeType
| sourceHandle: string
| nextNodes: Node[]
| branchName?: string
| isFailBranch?: boolean
| }
|
| const Container = ({
| nodeId,
| nodeData,
| sourceHandle,
| nextNodes,
| branchName,
| isFailBranch,
| }: ContainerProps) => {
| return (
| <div className={cn(
| 'p-0.5 space-y-0.5 rounded-[10px] bg-background-section-burn',
| isFailBranch && 'border-[0.5px] border-state-warning-hover-alt bg-state-warning-hover',
| )}>
| {
| branchName && (
| <div
| className={cn(
| 'flex items-center px-2 system-2xs-semibold-uppercase text-text-tertiary truncate',
| isFailBranch && 'text-text-warning',
| )}
| title={branchName}
| >
| {branchName}
| </div>
| )
| }
| {
| nextNodes.map(nextNode => (
| <Item
| key={nextNode.id}
| nodeId={nextNode.id}
| data={nextNode.data}
| sourceHandle='source'
| />
| ))
| }
| <Add
| isParallel={!!nextNodes.length}
| isFailBranch={isFailBranch}
| nodeId={nodeId}
| nodeData={nodeData}
| sourceHandle={sourceHandle}
| />
| </div>
| )
| }
|
| export default Container
|
|
