table editor

packages/tools/src/schemaEditorTools.ts

@@ -1,8 +1,41 @@
 import uuidv1 from 'uuid/v1';
 import { ColumnInfo, ConstraintInfo, PrimaryKeyInfo, TableInfo } from 'dbgate-types';
 
-function processPrimaryKey(table: TableInfo, oldColumn: ColumnInfo, newColumn: ColumnInfo) {
+export interface EditorColumnInfo extends ColumnInfo {
+  isPrimaryKey?: boolean;
+}
+
+export function fillEditorColumnInfo(column: ColumnInfo, table: TableInfo): EditorColumnInfo {
+  return {
+    isPrimaryKey: !!(table.primaryKey && table.primaryKey.columns.find(x => x.columnName == column.columnName)),
+    ...column,
+  };
+}
+
+function processPrimaryKey(table: TableInfo, oldColumn: EditorColumnInfo, newColumn: EditorColumnInfo) {
   if (!oldColumn?.isPrimaryKey && newColumn?.isPrimaryKey) {
+    //   let primaryKey = table.primaryKey
+    //   if (!primaryKey) {
+    //     primaryKey = {
+    //         constraintType: 'primaryKey',
+    //         pureName: table.pureName,
+    //         schemaName: table.schemaName,
+    //         columns: [],
+    //       };
+    //   }
+    //   return {
+    //       ...table,
+    //       primaryKey: {
+    //           ...primaryKey,
+    //           columns:[
+    //               ...primaryKey.columns,
+    //               {
+    //                 columnName: newColumn.columnName,
+    //               },
+
+    //           ]
+    //        }
+    //   }
     if (!table.primaryKey) {
       table.primaryKey = {
         constraintType: 'primaryKey',
@@ -34,7 +67,7 @@ function processPrimaryKey(table: TableInfo, oldColumn: ColumnInfo, newColumn: C
   }
 }
 
-export function editorAddColumn(table: TableInfo, column: ColumnInfo): TableInfo {
+export function editorAddColumn(table: TableInfo, column: EditorColumnInfo): TableInfo {
   const res = {
     ...table,
     columns: [...table.columns, { ...column, pairingId: uuidv1() }],
@@ -45,7 +78,7 @@ export function editorAddColumn(table: TableInfo, column: ColumnInfo): TableInfo
   return res;
 }
 
-export function editorModifyColumn(table: TableInfo, column: ColumnInfo): TableInfo {
+export function editorModifyColumn(table: TableInfo, column: EditorColumnInfo): TableInfo {
   const oldColumn = table?.columns?.find(x => x.pairingId == column.pairingId);
 
   const res = {
@@ -57,7 +90,7 @@ export function editorModifyColumn(table: TableInfo, column: ColumnInfo): TableI
   return res;
 }
 
-export function editorDeleteColumn(table: TableInfo, column: ColumnInfo): TableInfo {
+export function editorDeleteColumn(table: TableInfo, column: EditorColumnInfo): TableInfo {
   const res = {
     ...table,
     columns: table.columns.filter(col => col.pairingId != column.pairingId),

packages/tools/src/structureTools.ts

@@ -21,7 +21,6 @@ function fillTableExtendedInfo(db: DatabaseInfo): DatabaseInfo {
       columns: (obj.columns || []).map(column => ({
         pureName: obj.pureName,
         schemaName: obj.schemaName,
-        isPrimaryKey: !!(obj.primaryKey && obj.primaryKey.columns.find(x => x.columnName == column.columnName)),
         ...column,
       })),
       primaryKey: obj.primaryKey

packages/types/dbinfo.d.ts

@@ -52,7 +52,6 @@ export interface ColumnInfo extends NamedObjectInfo {
   isSparse: boolean;
   defaultValue: string;
   defaultConstraint: string;
-  isPrimaryKey?: boolean; // only used in editor
 }
 
 export interface DatabaseObjectInfo extends NamedObjectInfo {

packages/web/src/tableeditor/ColumnEditorModal.svelte

@@ -13,7 +13,7 @@
   import ElectronFilesInput from '../impexp/ElectronFilesInput.svelte';
   import DropDownButton from '../elements/DropDownButton.svelte';
   import DataTypeEditor from './DataTypeEditor.svelte';
-  import { editorAddColumn, editorDeleteColumn, editorModifyColumn } from 'dbgate-tools';
+  import { editorAddColumn, editorDeleteColumn, editorModifyColumn, fillEditorColumnInfo } from 'dbgate-tools';
 
   export let columnInfo;
   export let setTableInfo;
@@ -22,7 +22,7 @@
 
 </script>
 
-<FormProvider initialValues={columnInfo}>
+<FormProvider initialValues={fillEditorColumnInfo(columnInfo, tableInfo)}>
   <ModalBase {...$$restProps}>
     <svelte:fragment slot="header"
       >{columnInfo ? 'Edit column' : `Add column ${(tableInfo?.columns || []).length + 1}`}</svelte:fragment

packages/web/src/tableeditor/ColumnsConstraintEditorModal.svelte

@@ -30,6 +30,7 @@
     return {
       pairingId: uuidv1(),
       ...constraintInfo,
+      columns,
       pureName: tableInfo.pureName,
       schemaName: tableInfo.schemaName,
       constraintName,
@@ -56,14 +57,21 @@
       <div class="row">
         <div class="label col-3">Column {index + 1}</div>
         <div class="col-6">
-          <SelectField
+          {#key column.columnName}
-            value={column.columnName}
+            <SelectField
-            isNative
+              value={column.columnName}
-            options={tableInfo.columns.map(col => ({
+              isNative
-              label: col.columnName,
+              options={tableInfo.columns.map(col => ({
-              value: col.columnName,
+                label: col.columnName,
-            }))}
+                value: col.columnName,
-          />
+              }))}
+              on:change={e => {
+                if (e.detail) {
+                  columns = columns.map((col, i) => (i == index ? { columnName: e.detail } : col));
+                }
+              }}
+            />
+          {/key}
         </div>
         <div class="col-3 button">
           <FormStyledButton