From 528509c093eb99385e567fdb6d508b33f7c16905 Mon Sep 17 00:00:00 2001
From: mvdbeek <m.vandenbeek@gmail.com>
Date: Fri, 18 Nov 2022 13:08:04 +0100
Subject: [PATCH] Fix id and annotation prop types

---
 .../src/components/Workflow/Editor/Forms/FormDefault.vue | 8 ++++----
 .../src/components/Workflow/Editor/Forms/FormSection.vue | 2 +-
 client/src/components/Workflow/Editor/Forms/FormTool.vue | 9 ++++++---
 client/src/components/Workflow/Editor/Node.vue           | 8 ++++----
 client/src/components/Workflow/Editor/WorkflowGraph.vue  | 2 +-
 5 files changed, 16 insertions(+), 13 deletions(-)

diff --git a/client/src/components/Workflow/Editor/Forms/FormDefault.vue b/client/src/components/Workflow/Editor/Forms/FormDefault.vue
index 3412a285fe9..e03357de7a7 100644
--- a/client/src/components/Workflow/Editor/Forms/FormDefault.vue
+++ b/client/src/components/Workflow/Editor/Forms/FormDefault.vue
@@ -39,7 +39,7 @@
                 :area="true"
                 help="Add an annotation or notes to this step. Annotations are available when a workflow is viewed."
                 @input="onAnnotation" />
-            <FormDisplay :id="id" :inputs="inputs" @onChange="onChange" />
+            <FormDisplay :id="formDisplayId" :inputs="inputs" @onChange="onChange" />
             <div v-if="isSubworkflow">
                 <FormOutputLabel
                     v-for="(output, index) in nodeOutputs"
@@ -73,7 +73,7 @@ export default {
             required: true,
         },
         nodeId: {
-            type: String,
+            type: Number,
             required: true,
         },
         nodeContentId: {
@@ -120,8 +120,8 @@ export default {
         workflow() {
             return this.getManager();
         },
-        id() {
-            return this.nodeId;
+        formDisplayId() {
+            return this.nodeId.toString();
         },
         inputs() {
             return this.configForm.inputs;
diff --git a/client/src/components/Workflow/Editor/Forms/FormSection.vue b/client/src/components/Workflow/Editor/Forms/FormSection.vue
index dea08a501db..4ed4f5ac14e 100644
--- a/client/src/components/Workflow/Editor/Forms/FormSection.vue
+++ b/client/src/components/Workflow/Editor/Forms/FormSection.vue
@@ -38,7 +38,7 @@ export default {
     },
     props: {
         id: {
-            type: String,
+            type: Number,
             required: true,
         },
         nodeInputs: {
diff --git a/client/src/components/Workflow/Editor/Forms/FormTool.vue b/client/src/components/Workflow/Editor/Forms/FormTool.vue
index 40ab90861fc..2ae2c045906 100644
--- a/client/src/components/Workflow/Editor/Forms/FormTool.vue
+++ b/client/src/components/Workflow/Editor/Forms/FormTool.vue
@@ -75,16 +75,16 @@ export default {
     },
     props: {
         nodeId: {
-            type: String,
+            type: Number,
             required: true,
         },
         nodeAnnotation: {
             type: String,
-            required: true,
+            required: false,
         },
         nodeLabel: {
             type: String,
-            default: null,
+            required: false,
         },
         nodeInputs: {
             type: Array,
@@ -129,6 +129,9 @@ export default {
         id() {
             return `${this.nodeId}:${this.configForm.id}`;
         },
+        toolCardId() {
+            return `${this.nodeId}`;
+        },
         hasData() {
             return !!this.configForm;
         },
diff --git a/client/src/components/Workflow/Editor/Node.vue b/client/src/components/Workflow/Editor/Node.vue
index daab73aca1e..df2a7cd0708 100644
--- a/client/src/components/Workflow/Editor/Node.vue
+++ b/client/src/components/Workflow/Editor/Node.vue
@@ -129,8 +129,8 @@ export default {
     },
     props: {
         id: {
-            type: String,
-            default: "",
+            type: Number,
+            required: true,
         },
         contentId: {
             type: String,
@@ -157,8 +157,8 @@ export default {
             default: null,
         },
         activeNodeId: {
-            type: String,
-            default: null,
+            type: Number,
+            required: false,
         },
         rootOffset: {
             type: Object,
diff --git a/client/src/components/Workflow/Editor/WorkflowGraph.vue b/client/src/components/Workflow/Editor/WorkflowGraph.vue
index 2c75c268f88..837001ab4ea 100644
--- a/client/src/components/Workflow/Editor/WorkflowGraph.vue
+++ b/client/src/components/Workflow/Editor/WorkflowGraph.vue
@@ -12,7 +12,7 @@
                     <WorkflowEdges :steps="steps" :dragging-connection="draggingConnection" />
                     <WorkflowNode
                         v-for="(step, key) in steps"
-                        :id="key"
+                        :id="step.id"
                         :key="key"
                         :name="step.name"
                         :type="step.type"