From cfacc76b770960ec0016b2a2f2649483a131a08c Mon Sep 17 00:00:00 2001
From: Mutasem <mutdmour@gmail.com>
Date: Mon, 25 Oct 2021 12:10:06 +0200
Subject: [PATCH] only one action at a time

---
 packages/editor-ui/src/views/NodeView.vue | 21 +++++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

diff --git a/packages/editor-ui/src/views/NodeView.vue b/packages/editor-ui/src/views/NodeView.vue
index 39f330c1e6..65d1f868f1 100644
--- a/packages/editor-ui/src/views/NodeView.vue
+++ b/packages/editor-ui/src/views/NodeView.vue
@@ -1479,6 +1479,9 @@ export default mixins(
 					eventSource: 'node_connection_drop',
 				}));
 
+				// only one set of visible actions should be visible at the same time
+				let hideVisibleActions: null | Function = null;
+
 				this.instance.bind('connection', (info: OnConnectionBindInfo) => {
 					info.connection.setConnector(CONNECTOR_TYPE_FLOWCHART);
 					info.connection.setPaintStyle(CONNECTOR_PAINT_STYLE_DEFAULT);
@@ -1504,13 +1507,16 @@ export default mixins(
 					info.connection.removeOverlay(OVERLAY_DROP_NODE_ID);
 
 					if (this.isReadOnly === false) {
-						// Display the connection-delete button only on hover
 						let timer: NodeJS.Timeout | undefined;
 						info.connection.bind('mouseover', (connection: IConnection) => {
 							if (timer !== undefined) {
 								clearTimeout(timer);
 							}
 
+							if (hideVisibleActions) {
+								hideVisibleActions();
+							}
+
 							showOverlay(info.connection, OVERLAY_CONNECTION_ACTIONS_ID);
 							hideOverlay(info.connection, OVERLAY_RUN_ITEMS_ID);
 							if (!info.connection.getOverlay(OVERLAY_RUN_ITEMS_ID)) {
@@ -1519,15 +1525,22 @@ export default mixins(
 						});
 
 						info.connection.bind('mouseout', (connection: IConnection) => {
+							hideVisibleActions = () => {
+								hideVisibleActions = null;
+								hideOverlay(info.connection, OVERLAY_CONNECTION_ACTIONS_ID);
+								showOrHideItemsLabel(info.connection);
+								showOrHideMidpointArrow(info.connection);
+							};
+
 							timer = setTimeout(() => {
 								if (!info.connection) {
 									return;
 								}
 								timer = undefined;
 
-								hideOverlay(info.connection, OVERLAY_CONNECTION_ACTIONS_ID);
-								showOrHideItemsLabel(info.connection);
-								showOrHideMidpointArrow(info.connection);
+								if (hideVisibleActions) {
+									hideVisibleActions();
+								}
 							}, 500);
 						});