[airavata-django-portal] 20/28: AIRAVATA-2876 Add synthetic key to InputDataObjectType

[ma...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

machristie pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git

commit 033bac34532aac899112783fe3902b9fd2eb592b
Author: Marcus Christie <ma...@iu.edu>
AuthorDate: Thu Sep 6 11:02:29 2018 -0400

    AIRAVATA-2876 Add synthetic key to InputDataObjectType
---
 .../applications/ApplicationInputFieldEditor.vue      |  6 +++---
 .../applications/ApplicationInterfaceEditor.vue       | 19 ++++++++++++-------
 .../js/models/InputDataObjectType.js                  |  6 ++++++
 3 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/applications/ApplicationInputFieldEditor.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/applications/ApplicationInputFieldEditor.vue
index a03afa1..5388879 100644
--- a/django_airavata/apps/admin/static/django_airavata_admin/src/components/applications/ApplicationInputFieldEditor.vue
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/applications/ApplicationInputFieldEditor.vue
@@ -66,9 +66,6 @@ export default {
     value: {
       type: models.InputDataObjectType
     },
-    id: {
-      required: true
-    },
     // Whether to put focus on the name field when mounting component
     focus: {
       type: Boolean
@@ -88,6 +85,9 @@ export default {
     },
     trueFalseOptions() {
       return [{ text: "True", value: true }, { text: "False", value: false }];
+    },
+    id() {
+      return "id-" + this.data.key;
     }
   },
   methods: {
diff --git a/django_airavata/apps/admin/static/django_airavata_admin/src/components/applications/ApplicationInterfaceEditor.vue b/django_airavata/apps/admin/static/django_airavata_admin/src/components/applications/ApplicationInterfaceEditor.vue
index 5074313..417a9f8 100644
--- a/django_airavata/apps/admin/static/django_airavata_admin/src/components/applications/ApplicationInterfaceEditor.vue
+++ b/django_airavata/apps/admin/static/django_airavata_admin/src/components/applications/ApplicationInterfaceEditor.vue
@@ -27,9 +27,8 @@
           Input Fields
         </h1>
         <draggable v-model="data.applicationInputs" :options="dragOptions" @start="onDragStart" @end="onDragEnd">
-          <application-input-field-editor v-for="(input, index) in data.applicationInputs" :value="input" :key="index" :id="'app-input-'+index"
-            :focus="index === focusApplicationInputIndex" :collapse="collapseApplicationInputs" @input="updatedInput($event, index)"
-            @delete="deleteInput($event, index)" />
+          <application-input-field-editor v-for="input in data.applicationInputs" :value="input" :key="input.key" :focus="input.key === focusApplicationInputKey"
+            :collapse="collapseApplicationInputs" @input="updatedInput" @delete="deleteInput(input)" />
         </draggable>
       </div>
     </div>
@@ -112,15 +111,21 @@ export default {
     cancel() {
       this.$emit("cancel");
     },
-    updatedInput(newValue, index) {
-      Object.assign(this.data.applicationInputs[index], newValue);
+    updatedInput(newValue) {
+      const input = this.data.applicationInputs.find(
+        input => input.key === newValue.key
+      );
+      Object.assign(input, newValue);
     },
     addApplicationInput() {
       this.data.applicationInputs.push(new models.InputDataObjectType());
       this.focusApplicationInputIndex = this.data.applicationInputs.length - 1;
     },
-    deleteInput(e, index) {
-      this.data.applicationInputs.splice(index, 1);
+    deleteInput(input) {
+      const inputIndex = this.data.applicationInputs.findIndex(
+        inp => inp.key === input.key
+      );
+      this.data.applicationInputs.splice(inputIndex, 1);
     },
     updatedOutput(newValue) {
       const output = this.data.applicationOutputs.find(
diff --git a/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js b/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
index 83bb1c7..07ce6ef 100644
--- a/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
+++ b/django_airavata/apps/api/static/django_airavata_api/js/models/InputDataObjectType.js
@@ -2,6 +2,7 @@
 import BaseModel from './BaseModel';
 import DataType from './DataType';
 import ValidatorFactory from './validators/ValidatorFactory';
+import uuidv4 from 'uuid/v4';
 
 const FIELDS = [
   'name',
@@ -46,6 +47,11 @@ const FIELDS = [
 export default class InputDataObjectType extends BaseModel {
   constructor(data = {}) {
     super(FIELDS, data);
+    this._key = data.key ? data.key : uuidv4();
+  }
+
+  get key() {
+    return this._key;
   }
 
   /**