add ids to prevent duplicates on name edit (#163)

Co-authored-by: Philip Prinz <Philip.Prinz@sva.de>

src/app/configuration/vmtemplates/edit-vmtemplate/edit-vmtemplate.component.ts

@@ -8,6 +8,7 @@ import { ServerResponse } from 'src/app/data/serverresponse';
 import { vmServiceToJSON } from 'src/app/data/vm-template-service-configuration';
 import { VMTemplate } from 'src/app/data/vmtemplate';
 import { VmtemplateService } from 'src/app/data/vmtemplate.service';
+import * as uuid from 'uuid'
 
 @Component({
   selector: 'edit-vmtemplate-wizard',
@@ -87,7 +88,8 @@ export class EditVmtemplateComponent implements OnInit, OnChanges {
       let resultMap = new Map()
       temp.forEach(entry => {
         entry.cloudConfigMap = new Map(Object.entries(entry["cloudConfigMap"])); // Convert Object to map
-        resultMap.set(entry['name'], entry)
+        entry['id'] = entry['id'] ?? uuid.v4() //Catch old entries, that do not have an ID 
+        resultMap.set(entry['id'], entry)
       })
       return resultMap
     }

src/app/configuration/vmtemplates/edit-vmtemplate/vmtemplate-service-form/vmtemplate-service-form.component.ts

@@ -6,6 +6,7 @@ import {
   getCloudConfigString,
   VMTemplateServiceConfiguration,
 } from 'src/app/data/vm-template-service-configuration';
+import * as uuid from 'uuid'
 
 @Component({
   selector: 'app-vmtemplate-service-form',
@@ -76,6 +77,7 @@ export class VMTemplateServiceFormComponent implements OnInit {
   newVMServiceClose() {
     let newVMService: VMTemplateServiceConfiguration =
       new VMTemplateServiceConfiguration();
+    newVMService.id = this.editVMService?.id ?? uuid.v4()
     newVMService.name = this.newVMServiceFormGroup.get('name').value;
     newVMService.hasWebinterface =
       this.newVMServiceFormGroup.get('hasWebinterface').value;
@@ -124,6 +126,7 @@ export const PredefinedWebInterfaces: VMTemplateServiceConfiguration[] =
   //This has to be modeled into a CRD and retrieved over the Backend
   [
     {
+      id: uuid.v4(),
       name: 'VS Code IDE',
       port: 8080,
       path: '/?folder=/root',
@@ -141,6 +144,7 @@ export const PredefinedWebInterfaces: VMTemplateServiceConfiguration[] =
     `,
     },
     {
+      id: uuid.v4(),
       name: 'Test-Service without Webinterface',
       cloudConfigMap: new Map(),
       hasWebinterface: false,
@@ -150,6 +154,7 @@ export const PredefinedWebInterfaces: VMTemplateServiceConfiguration[] =
     `,
     },
     {
+      id: uuid.v4(),
       name: 'Test-Interface without Cloud Config',
       port: 8081,
       hasOwnTab: false,

src/app/data/cloud-init-config.ts

@@ -21,13 +21,13 @@ export class CloudInitConfig {
     }
 
 
-    removeVMService(name: string) {
-        this.vmServices.delete(name)
+    removeVMService(id: string) {
+        this.vmServices.delete(id)
         this.buildNewYAMLFile()
     }
 
     addVMService(newInterface: VMTemplateServiceConfiguration) {
-        this.vmServices.set(newInterface.name, newInterface)
+        this.vmServices.set(newInterface.id, newInterface)
         this.buildNewYAMLFile()
     }
 

src/app/data/vm-template-service-configuration.ts

@@ -1,5 +1,7 @@
 import YAML from 'yaml';
+import * as uuid from 'uuid'
 export class VMTemplateServiceConfiguration {
+  public id: string;
   public name: string;
   public hasWebinterface;
   public port?: number;
@@ -24,6 +26,7 @@ export class VMTemplateServiceConfiguration {
     disallowIFrame: boolean = false,
     cloudConfigString: string = ''
   ) {
+    this.id = uuid.v4()
     this.name = name;
     this.hasWebinterface = hasWebinterface;
     this.port = port;
@@ -56,7 +59,7 @@ export function getCloudConfigString(
 
 export function vmServiceToJSON(vmService: VMTemplateServiceConfiguration) {
   let result =
-    '{"name": "' +
+    '{"id" : "' + vmService.id + '" , "name": "' +
     vmService.name +
     '" ,"hasWebinterface": ' +
     vmService.hasWebinterface;