|
1 | 1 | import * as React from "react"; |
2 | 2 |
|
3 | 3 | import { EditMenuItem } from "./EditMenuItem"; |
4 | | -import { FlowElementReference } from "../model/FlowElement"; |
5 | | -import { addContentElement, addDivergingGateway } from "../model/action/addElement"; |
| 4 | +import { addStepElement, addDivergingGateway } from "../model/action/addElement"; |
6 | 5 | import { addBranch } from "../model/action/addBranch"; |
7 | 6 | import { isChangeNextElementAllowed } from "../model/action/changeNextElement"; |
8 | 7 | import { removeElement, isRemoveElementAllowed } from "../model/action/removeElement"; |
9 | 8 |
|
10 | | -import { SelectableElementType, EditActionResult, DraggableType } from "../types/EditAction"; |
11 | | -import { FlowModelerProps, MenuOptions } from "../types/FlowModelerProps"; |
12 | | -import { ElementType } from "../types/GridCellData"; |
| 9 | +import { StepNode, ConvergingGatewayNode, DivergingGatewayNode, DivergingGatewayBranch, ElementType, StartNode } from "../types/ModelElement"; |
| 10 | +import { EditActionResult, DraggableType, DraggedLinkContext } from "../types/EditAction"; |
| 11 | +import { FlowModelerProps } from "../types/FlowModelerProps"; |
13 | 12 |
|
14 | 13 | const onClickStopPropagation = (event: React.MouseEvent): void => event.stopPropagation(); |
15 | 14 |
|
16 | 15 | export class EditMenu extends React.Component<{ |
17 | | - targetType: SelectableElementType; |
18 | | - referenceElement?: FlowElementReference; |
19 | | - branchIndex?: number; |
20 | | - menuOptions?: FlowModelerProps["options"]["editActions"]; |
| 16 | + referenceElement: StartNode | StepNode | ConvergingGatewayNode | DivergingGatewayNode | DivergingGatewayBranch; |
| 17 | + editActions?: FlowModelerProps["editActions"]; |
21 | 18 | onChange: (change: (originalFlow: FlowModelerProps["flow"]) => EditActionResult) => void; |
22 | 19 | }> { |
23 | | - isNextElementReferencedByOthers = (): boolean => { |
24 | | - const { referenceElement, branchIndex } = this.props; |
25 | | - if (!referenceElement) { |
26 | | - return false; |
27 | | - } |
28 | | - return referenceElement.getFollowingElements()[branchIndex || 0].getPrecedingElements().length > 1; |
29 | | - }; |
30 | | - |
31 | 20 | renderMenuItem( |
32 | | - options: MenuOptions, |
| 21 | + options: |
| 22 | + | { |
| 23 | + className?: string; |
| 24 | + title?: string; |
| 25 | + } |
| 26 | + | undefined, |
33 | 27 | defaultClassName: string, |
34 | 28 | onClick?: (event: React.MouseEvent) => void, |
35 | 29 | dragType?: DraggableType |
36 | 30 | ): React.ReactNode { |
37 | | - const { targetType, referenceElement, branchIndex } = this.props; |
38 | | - if (options && options.isActionAllowed && !options.isActionAllowed(targetType, referenceElement, branchIndex)) { |
39 | | - return null; |
40 | | - } |
41 | | - const dragItem = |
| 31 | + const { referenceElement } = this.props; |
| 32 | + const dragItem: DraggedLinkContext = |
42 | 33 | dragType === DraggableType.LINK && |
43 | | - (targetType === ElementType.Content || targetType == ElementType.ConnectGatewayToElement) && |
44 | | - this.isNextElementReferencedByOthers() |
45 | | - ? { type: dragType, originType: targetType, originElement: referenceElement, originBranchIndex: branchIndex } |
| 34 | + (referenceElement.type === ElementType.StepNode || referenceElement.type === ElementType.DivergingGatewayBranch) && |
| 35 | + isChangeNextElementAllowed(referenceElement) |
| 36 | + ? { type: dragType, originElement: referenceElement } |
46 | 37 | : undefined; |
47 | 38 | return <EditMenuItem key={defaultClassName} options={options} defaultClassName={defaultClassName} onClick={onClick} dragItem={dragItem} />; |
48 | 39 | } |
49 | 40 |
|
50 | | - onAddContentElementClick = (): void => { |
51 | | - const { targetType, onChange, referenceElement, branchIndex } = this.props; |
52 | | - if (targetType !== ElementType.GatewayDiverging) { |
53 | | - onChange((originalFlow) => addContentElement(originalFlow, targetType, {}, referenceElement, branchIndex)); |
54 | | - } |
| 41 | + onAddStepElementClick = (): void => { |
| 42 | + const { onChange, referenceElement, editActions } = this.props; |
| 43 | + const leadingElement = (referenceElement as unknown) as StartNode | StepNode | ConvergingGatewayNode | DivergingGatewayBranch; |
| 44 | + const options = editActions && editActions.addFollowingStepElement; |
| 45 | + const stepData = (options && options.getStepData && options.getStepData(leadingElement)) || {}; |
| 46 | + onChange((originalFlow) => addStepElement(originalFlow, leadingElement, stepData)); |
55 | 47 | }; |
56 | 48 |
|
57 | | - renderAddContentElementItem(): React.ReactNode { |
58 | | - const { targetType, menuOptions } = this.props; |
59 | | - if (targetType === ElementType.GatewayDiverging) { |
| 49 | + renderAddStepElementItem(): React.ReactNode { |
| 50 | + const { referenceElement, editActions } = this.props; |
| 51 | + if (referenceElement.type === ElementType.DivergingGatewayNode) { |
60 | 52 | return null; |
61 | 53 | } |
62 | | - return this.renderMenuItem(menuOptions ? menuOptions.addFollowingContentElement : undefined, "add-content", this.onAddContentElementClick); |
| 54 | + const options = editActions ? editActions.addFollowingStepElement : undefined; |
| 55 | + if (options && options.isActionAllowed && !options.isActionAllowed(referenceElement)) { |
| 56 | + return null; |
| 57 | + } |
| 58 | + return this.renderMenuItem(options, "add-step", this.onAddStepElementClick); |
63 | 59 | } |
64 | 60 |
|
65 | 61 | onAddDivergingGatewayClick = (): void => { |
66 | | - const { targetType, onChange, referenceElement, branchIndex } = this.props; |
67 | | - if (targetType !== ElementType.GatewayDiverging) { |
68 | | - onChange((originalFlow) => addDivergingGateway(originalFlow, targetType, {}, referenceElement, branchIndex)); |
69 | | - } |
| 62 | + const { referenceElement, onChange, editActions } = this.props; |
| 63 | + const leadingElement = (referenceElement as unknown) as StartNode | StepNode | ConvergingGatewayNode | DivergingGatewayBranch; |
| 64 | + const options = editActions && editActions.addFollowingDivergingGateway; |
| 65 | + const gatewayData = (options && options.getGatewayData && options.getGatewayData(leadingElement)) || undefined; |
| 66 | + const branchConditionData = (options && options.getBranchConditionData && options.getBranchConditionData(leadingElement)) || undefined; |
| 67 | + onChange((originalFlow) => addDivergingGateway(originalFlow, leadingElement, gatewayData, branchConditionData)); |
70 | 68 | }; |
71 | 69 |
|
72 | 70 | renderAddDivergingGatewayItem(): React.ReactNode { |
73 | | - const { targetType, menuOptions } = this.props; |
74 | | - if (targetType === ElementType.GatewayDiverging) { |
| 71 | + const { referenceElement, editActions } = this.props; |
| 72 | + if (referenceElement && referenceElement.type === ElementType.DivergingGatewayNode) { |
75 | 73 | return null; |
76 | 74 | } |
77 | | - return this.renderMenuItem( |
78 | | - menuOptions ? menuOptions.addFollowingDivergingGateway : undefined, |
79 | | - "add-gateway", |
80 | | - this.onAddDivergingGatewayClick |
81 | | - ); |
| 75 | + const options = editActions ? editActions.addFollowingDivergingGateway : undefined; |
| 76 | + if ( |
| 77 | + options && |
| 78 | + options.isActionAllowed && |
| 79 | + !options.isActionAllowed((referenceElement as unknown) as undefined | StepNode | DivergingGatewayBranch | ConvergingGatewayNode) |
| 80 | + ) { |
| 81 | + return null; |
| 82 | + } |
| 83 | + return this.renderMenuItem(options, "add-gateway", this.onAddDivergingGatewayClick); |
82 | 84 | } |
83 | 85 |
|
84 | 86 | onAddDivergingBranchClick = (): void => { |
85 | | - const { targetType, onChange, referenceElement } = this.props; |
86 | | - if (targetType === ElementType.GatewayDiverging) { |
87 | | - onChange((originalFlow) => addBranch(originalFlow, {}, referenceElement)); |
88 | | - } |
| 87 | + const { referenceElement, onChange, editActions } = this.props; |
| 88 | + const gateway = (referenceElement as unknown) as DivergingGatewayNode; |
| 89 | + const options = editActions && editActions.addDivergingBranch; |
| 90 | + const branchConditionData = (options && options.getBranchConditionData && options.getBranchConditionData(gateway)) || undefined; |
| 91 | + onChange((originalFlow) => addBranch(originalFlow, gateway, branchConditionData)); |
89 | 92 | }; |
90 | 93 |
|
91 | 94 | renderAddDivergingBranchItem(): React.ReactNode { |
92 | | - const { targetType, menuOptions } = this.props; |
93 | | - if (targetType !== ElementType.GatewayDiverging) { |
| 95 | + const { referenceElement, editActions } = this.props; |
| 96 | + if (referenceElement.type !== ElementType.DivergingGatewayNode) { |
94 | 97 | return null; |
95 | 98 | } |
96 | | - return this.renderMenuItem(menuOptions ? menuOptions.addDivergingBranch : undefined, "add-branch", this.onAddDivergingBranchClick); |
| 99 | + const options = editActions ? editActions.addDivergingBranch : undefined; |
| 100 | + if (options && options.isActionAllowed && !options.isActionAllowed(referenceElement)) { |
| 101 | + return null; |
| 102 | + } |
| 103 | + return this.renderMenuItem(options, "add-branch", this.onAddDivergingBranchClick); |
97 | 104 | } |
98 | 105 |
|
99 | 106 | renderChangeNextElementItem(): React.ReactNode { |
100 | | - const { targetType, referenceElement, branchIndex, menuOptions } = this.props; |
101 | | - if (isChangeNextElementAllowed(targetType, referenceElement, branchIndex)) { |
102 | | - return this.renderMenuItem(menuOptions ? menuOptions.changeNextElement : undefined, "change-next", undefined, DraggableType.LINK); |
| 107 | + const { referenceElement, editActions } = this.props; |
| 108 | + if ( |
| 109 | + (referenceElement.type !== ElementType.StepNode && referenceElement.type !== ElementType.DivergingGatewayBranch) || |
| 110 | + !isChangeNextElementAllowed(referenceElement) |
| 111 | + ) { |
| 112 | + return null; |
103 | 113 | } |
104 | | - return null; |
| 114 | + const options = editActions ? editActions.changeNextElement : undefined; |
| 115 | + if (options && options.isActionAllowed && !options.isActionAllowed(referenceElement)) { |
| 116 | + return null; |
| 117 | + } |
| 118 | + return this.renderMenuItem(options, "change-next", undefined, DraggableType.LINK); |
105 | 119 | } |
106 | 120 |
|
107 | 121 | onRemoveClick = (): void => { |
108 | | - const { targetType, onChange, referenceElement, branchIndex } = this.props; |
109 | | - if (targetType === ElementType.Content || targetType === ElementType.ConnectGatewayToElement) { |
110 | | - onChange((originalFlow) => removeElement(originalFlow, targetType, referenceElement, branchIndex)); |
111 | | - } |
| 122 | + const { referenceElement, onChange } = this.props; |
| 123 | + onChange((originalFlow) => removeElement(originalFlow, (referenceElement as unknown) as StepNode | DivergingGatewayBranch)); |
112 | 124 | }; |
113 | 125 |
|
114 | 126 | renderRemoveItem(): React.ReactNode { |
115 | | - const { targetType, referenceElement, branchIndex, menuOptions } = this.props; |
116 | | - if (isRemoveElementAllowed(targetType, referenceElement, branchIndex)) { |
117 | | - return this.renderMenuItem(menuOptions ? menuOptions.removeElement : undefined, "remove", this.onRemoveClick); |
| 127 | + const { referenceElement, editActions } = this.props; |
| 128 | + if ( |
| 129 | + (referenceElement.type !== ElementType.StepNode && referenceElement.type !== ElementType.DivergingGatewayBranch) || |
| 130 | + !isRemoveElementAllowed(referenceElement) |
| 131 | + ) { |
| 132 | + return null; |
118 | 133 | } |
119 | | - return null; |
| 134 | + const options = editActions ? editActions.removeElement : undefined; |
| 135 | + if (options && options.isActionAllowed && !options.isActionAllowed(referenceElement)) { |
| 136 | + return null; |
| 137 | + } |
| 138 | + return this.renderMenuItem(editActions ? editActions.removeElement : undefined, "remove", this.onRemoveClick); |
120 | 139 | } |
121 | 140 |
|
122 | 141 | render(): React.ReactNode { |
123 | 142 | const menuItems = [ |
124 | | - this.renderAddContentElementItem(), |
| 143 | + this.renderAddStepElementItem(), |
125 | 144 | this.renderAddDivergingGatewayItem(), |
126 | 145 | this.renderAddDivergingBranchItem(), |
127 | 146 | this.renderChangeNextElementItem(), |
|
0 commit comments