From 89cb08b54451ed64a01445ad78ba1902f6888d30 Mon Sep 17 00:00:00 2001
From: mvdbeek <m.vandenbeek@gmail.com>
Date: Tue, 4 Oct 2022 02:33:00 +0200
Subject: [PATCH] Include step position in dom key

Thats needed to re-render node inputs and outputs when replacing the
entire steps array via monaco.
---
 client/src/components/Workflow/Editor/Node.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/client/src/components/Workflow/Editor/Node.vue b/client/src/components/Workflow/Editor/Node.vue
index 1aa44524139..daab73aca1e 100644
--- a/client/src/components/Workflow/Editor/Node.vue
+++ b/client/src/components/Workflow/Editor/Node.vue
@@ -65,7 +65,7 @@
             <loading-span v-if="showLoading" message="Loading details" />
             <node-input
                 v-for="input in inputs"
-                :key="input.name"
+                :key="nodeIOKey(input.name, step.position)"
                 :input="input"
                 :get-node="getNode"
                 :datatypes-mapper="datatypesMapper"
@@ -79,7 +79,7 @@
             <div v-if="showRule" class="rule" />
             <node-output
                 v-for="output in outputs"
-                :key="output.name"
+                :key="nodeIOKey(output.name, step.position)"
                 :output="output"
                 :post-job-actions="postJobActions"
                 :get-node="getNode"
@@ -114,10 +114,11 @@ Vue.use(BootstrapVue);
 
 export default {
     setup() {
+        const nodeIOKey = (key, position) => key + position?.left + position?.right;
         const el = ref(null);
         const position = reactive(useElementBounding(el, { windowResize: false }));
         const transform = inject("transform");
-        return { el, position, transform };
+        return { el, position, transform, nodeIOKey };
     },
     components: {
         DraggableWrapper,