Associate database column data by UUID, not header name (#31)

src/app/components/editor/database/columns/columns.component.ts

@@ -1,5 +1,6 @@
 import {Component, Input, OnInit} from '@angular/core';
 import {ModalController} from '@ionic/angular';
+import {uuid_v4} from '../../../../utility';
 
 @Component({
   selector: 'editor-database-columns',
@@ -16,7 +17,7 @@ export class ColumnsComponent implements OnInit {
   ngOnInit() {}
 
   onAddColumnClick() {
-    this.columnSets.push({headerName: '', field: '', Type: '', additionalData: {}});
+    this.columnSets.push({headerName: '', field: uuid_v4(), Type: '', additionalData: {}});
   }
 
   onAddOption(i) {
@@ -36,7 +37,9 @@ export class ColumnsComponent implements OnInit {
   dismissModal(doSave = true) {
     if ( doSave ) {
       this.columnSets = this.columnSets.map(x => {
-        x.field = x.headerName;
+        if ( !x.field ) {
+          x.field = uuid_v4();
+        }
         return x;
       });
 

src/app/components/editor/database/database.component.ts

@@ -33,6 +33,10 @@ export class DatabaseComponent extends EditorNodeContract implements OnInit {
   public notAvailableOffline = false;
   protected dbId!: string;
 
+  title = 'app';
+  columnDefs = [];
+  rowData = [];
+
   public isDark() {
     return document.body.classList.contains('dark');
   }
@@ -49,10 +53,6 @@ export class DatabaseComponent extends EditorNodeContract implements OnInit {
       public editorService: EditorService,
   ) { super(); }
 
-  title = 'app';
-  columnDefs = [];
-  rowData = [];
-
   public isDirty(): boolean | Promise<boolean> {
     return this.dirty;
   }