From 7613692379bb9f67c0879d51d73fc573bbc60e62 Mon Sep 17 00:00:00 2001
From: mike12345567 <me@michaeldrury.co.uk>
Date: Wed, 14 Oct 2020 18:04:21 +0100
Subject: [PATCH] Fixing a bug where if you created a column without a name
 editting it would create another column and also adding an option to remove
 sorting from your table.

---
 packages/builder/src/builderStore/store/backend.js   |  3 ++-
 .../backend/DataTable/popovers/ColumnPopover.svelte  | 12 +++++++++++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/builder/src/builderStore/store/backend.js b/packages/builder/src/builderStore/store/backend.js
index d89796f9cc..6500febb2d 100644
--- a/packages/builder/src/builderStore/store/backend.js
+++ b/packages/builder/src/builderStore/store/backend.js
@@ -94,7 +94,8 @@ export const getBackendUiStore = () => {
       saveField: ({ originalName, field }) => {
         store.update(state => {
           // delete the original if renaming
-          if (originalName) {
+          // need to handle if the column had no name, empty string
+          if (originalName || originalName === "") {
             delete state.draftTable.schema[originalName]
             state.draftTable._rename = {
               old: originalName,
diff --git a/packages/builder/src/components/backend/DataTable/popovers/ColumnPopover.svelte b/packages/builder/src/components/backend/DataTable/popovers/ColumnPopover.svelte
index e4db32d900..071d8038bf 100644
--- a/packages/builder/src/components/backend/DataTable/popovers/ColumnPopover.svelte
+++ b/packages/builder/src/components/backend/DataTable/popovers/ColumnPopover.svelte
@@ -43,7 +43,11 @@
 
   function sort(direction, column) {
     backendUiStore.update(state => {
-      state.sort = { direction, column }
+      if (direction !== "none") {
+        state.sort = {direction, column}
+      } else {
+        state.sort = undefined
+      }
       return state
     })
     hideEditor()
@@ -70,6 +74,12 @@
         <Icon name="delete" />
         Delete
       </li>
+      {#if sortDirection === 'desc' || sortDirection === 'asc'}
+        <li on:click={() => sort('none', field.name)}>
+          <Icon name="close" />
+          Remove sort
+        </li>
+      {/if}
       {#if sortDirection === 'desc' || sortColumn !== field.name}
         <li on:click={() => sort('asc', field.name)}>
           <Icon name="sortascending" />