Fix id and annotation prop types

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;

client/src/components/Workflow/Editor/Forms/FormSection.vue

@@ -38,7 +38,7 @@ export default {
     },
     props: {
         id: {
-            type: String,
+            type: Number,
             required: true,
         },
         nodeInputs: {

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;
         },

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,

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"