From 8874589ed0187d1e321d5e522d8a7ba0eeb791e4 Mon Sep 17 00:00:00 2001
From: Jan Prochazka <jan.prochazka@gmail.com>
Date: Thu, 17 Jun 2021 08:22:41 +0200
Subject: [PATCH] column editor

---
 .../src/tableeditor/ColumnEditorModal.svelte  | 27 ++++++++++++++++---
 .../web/src/tableeditor/TableEditor.svelte    | 14 ++++++++--
 2 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/packages/web/src/tableeditor/ColumnEditorModal.svelte b/packages/web/src/tableeditor/ColumnEditorModal.svelte
index 4fda864a4..cb3ce17ad 100644
--- a/packages/web/src/tableeditor/ColumnEditorModal.svelte
+++ b/packages/web/src/tableeditor/ColumnEditorModal.svelte
@@ -14,15 +14,20 @@
 
   export let columnInfo;
   export let setTableInfo;
+  export let tableInfo;
+  export let onAddNext;
 
 </script>
 
 <FormProvider initialValues={columnInfo}>
   <ModalBase {...$$restProps}>
-    <svelte:fragment slot="header">{columnInfo ? 'Edit column' : 'Add new column'}</svelte:fragment>
+    <svelte:fragment slot="header"
+      >{columnInfo ? 'Edit column' : `Add column ${(tableInfo?.columns || []).length + 1}`}</svelte:fragment
+    >
 
-    <FormTextField name="columnName" label="Column name" />
+    <FormTextField name="columnName" label="Column name" focused />
     <FormTextField name="dataType" label="Data type" />
+    <!-- <FormSelectField name="dataType" label="Data type" /> -->
     <FormCheckboxField name="notNull" label="NOT NULL" />
     <!-- <FormCheckboxField name="isPrimaryKey" label="Is Primary Key" />  -->
     <FormCheckboxField name="autoIncrement" label="Is Autoincrement" />
@@ -31,7 +36,7 @@
 
     <svelte:fragment slot="footer">
       <FormSubmit
-        value="OK"
+        value={columnInfo ? 'Save' : 'Save and next'}
         on:click={e => {
           closeCurrentModal();
           if (columnInfo) {
@@ -44,10 +49,24 @@
               ...tbl,
               columns: [...tbl.columns, { ...e.detail, pairingId: uuidv1() }],
             }));
+            if (onAddNext) onAddNext();
           }
-          // onConfirm();
         }}
       />
+      {#if !columnInfo}
+        <FormStyledButton
+          type="button"
+          value="Save"
+          on:click={e => {
+            closeCurrentModal();
+            setTableInfo(tbl => ({
+              ...tbl,
+              columns: [...tbl.columns, { ...e.detail, pairingId: uuidv1() }],
+            }));
+          }}
+        />
+      {/if}
+
       <FormStyledButton type="button" value="Close" on:click={closeCurrentModal} />
       {#if columnInfo}
         <FormStyledButton
diff --git a/packages/web/src/tableeditor/TableEditor.svelte b/packages/web/src/tableeditor/TableEditor.svelte
index 210d9afea..fc3da5f8d 100644
--- a/packages/web/src/tableeditor/TableEditor.svelte
+++ b/packages/web/src/tableeditor/TableEditor.svelte
@@ -16,6 +16,7 @@
 
 <script lang="ts">
   import _ from 'lodash';
+  import { tick } from 'svelte';
   import registerCommand from '../commands/registerCommand';
 
   import ColumnLabel from '../elements/ColumnLabel.svelte';
@@ -40,7 +41,14 @@
   }
 
   export function addColumn() {
-    showModal(ColumnEditorModal, { setTableInfo });
+    showModal(ColumnEditorModal, {
+      setTableInfo,
+      tableInfo,
+      onAddNext: async () => {
+        await tick();
+        addColumn();
+      },
+    });
   }
 
   $: columns = tableInfo?.columns;
@@ -48,6 +56,8 @@
   $: foreignKeys = tableInfo?.foreignKeys;
   $: dependencies = tableInfo?.dependencies;
 
+  $: console.log('tableInfo', tableInfo);
+
 </script>
 
 <div class="wrapper">
@@ -55,7 +65,7 @@
     collection={columns?.map((x, index) => ({ ...x, ordinal: index + 1 }))}
     title="Columns"
     clickable={writable()}
-    on:clickrow={e => showModal(ColumnEditorModal, { columnInfo: e.detail, setTableInfo })}
+    on:clickrow={e => showModal(ColumnEditorModal, { columnInfo: e.detail, tableInfo, setTableInfo })}
     columns={[
       {
         fieldName: 'notNull',