Fix issue creating columns due to 'draft' concept when mutating table schemas

packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte

@@ -102,7 +102,7 @@
   // in the case of internal tables the sourceId will just be undefined
   $: tableOptions = $tables.list.filter(
     opt =>
-      opt._id !== $tables.draft._id &&
+      opt._id !== $tables.selected._id &&
       opt.type === table.type &&
       table.sourceId === opt.sourceId
   )
@@ -112,7 +112,7 @@
 
   async function saveColumn() {
     if (field.type === AUTO_TYPE) {
-      field = buildAutoColumn($tables.draft.name, field.name, field.subtype)
+      field = buildAutoColumn($tables.selected.name, field.name, field.subtype)
     }
     if (field.type !== LINK_TYPE) {
       delete field.fieldName
@@ -310,7 +310,7 @@
       newError.name = `${PROHIBITED_COLUMN_NAMES.join(
         ", "
       )} are not allowed as column names`
-    } else if (inUse($tables.draft, fieldInfo.name, originalName)) {
+    } else if (inUse($tables.selected, fieldInfo.name, originalName)) {
       newError.name = `Column name already in use.`
     }
     if (fieldInfo.fieldName && fieldInfo.tableId) {

packages/builder/src/stores/backend/tables.js

@@ -84,55 +84,43 @@ export function createTablesStore() {
     primaryDisplay = false,
     indexes,
   }) => {
-    let promise
-    store.update(state => {
-      // delete the original if renaming
-      // need to handle if the column had no name, empty string
-      if (originalName != null && originalName !== field.name) {
-        delete state.draft.schema[originalName]
-        state.draft._rename = {
-          old: originalName,
-          updated: field.name,
-        }
-      }
+    let draft = cloneDeep(get(derivedStore).selected)
 
-      // Optionally set display column
-      if (primaryDisplay) {
-        state.draft.primaryDisplay = field.name
-      } else if (state.draft.primaryDisplay === originalName) {
-        const fields = Object.keys(state.draft.schema)
-        // pick another display column randomly if unselecting
-        state.draft.primaryDisplay = fields.filter(
-          name => name !== originalName || name !== field
-        )[0]
+    // delete the original if renaming
+    // need to handle if the column had no name, empty string
+    if (originalName != null && originalName !== field.name) {
+      delete draft.schema[originalName]
+      draft._rename = {
+        old: originalName,
+        updated: field.name,
       }
-
-      if (indexes) {
-        state.draft.indexes = indexes
-      }
-
-      state.draft.schema = {
-        ...state.draft.schema,
-        [field.name]: cloneDeep(field),
-      }
-      promise = save(state.draft)
-      return state
-    })
-    if (promise) {
-      await promise
     }
+
+    // Optionally set display column
+    if (primaryDisplay) {
+      draft.primaryDisplay = field.name
+    } else if (draft.primaryDisplay === originalName) {
+      const fields = Object.keys(draft.schema)
+      // pick another display column randomly if unselecting
+      draft.primaryDisplay = fields.filter(
+        name => name !== originalName || name !== field
+      )[0]
+    }
+    if (indexes) {
+      draft.indexes = indexes
+    }
+    draft.schema = {
+      ...draft.schema,
+      [field.name]: cloneDeep(field),
+    }
+
+    await save(draft)
   }
 
   const deleteField = async field => {
-    let promise
-    store.update(state => {
-      delete state.draft.schema[field.name]
-      promise = save(state.draft)
-      return state
-    })
-    if (promise) {
-      await promise
-    }
+    let draft = cloneDeep(get(derivedStore).selected)
+    delete draft.schema[field.name]
+    await save(draft)
   }
 
   return {