From de40b450a2381ddd0985544bf927d0a04c13f7d2 Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Fri, 15 Aug 2025 13:05:42 +0530
Subject: [PATCH] fix: column selector <> column swap edge case. Details -
 Hiding some columns via `columnSelector.svelte` and then swapping them would
 bring back the hidden columns.

---
 src/lib/components/columnSelector.svelte      |  5 +--
 src/lib/stores/preferences.ts                 |  6 +--
 .../table-[table]/spreadsheet.svelte          | 41 +++++++++----------
 3 files changed, 24 insertions(+), 28 deletions(-)

diff --git a/src/lib/components/columnSelector.svelte b/src/lib/components/columnSelector.svelte
index 6037717ce..17d43482f 100644
--- a/src/lib/components/columnSelector.svelte
+++ b/src/lib/components/columnSelector.svelte
@@ -62,9 +62,8 @@
         const shownColumns = $columns.filter((n) => n.hide === true).map((n) => n.id);
 
         if (isCustomTable) {
-            preferences.setCustomTableColumns(page.params.table, shownColumns).then(() => {
-                onPreferencesUpdated?.();
-            });
+            onPreferencesUpdated?.();
+            preferences.setCustomTableColumns(page.params.table, shownColumns);
         } else {
             preferences.setColumns(shownColumns);
         }
diff --git a/src/lib/stores/preferences.ts b/src/lib/stores/preferences.ts
index 1b15f23b0..ab0a2e37b 100644
--- a/src/lib/stores/preferences.ts
+++ b/src/lib/stores/preferences.ts
@@ -191,8 +191,6 @@ function createPreferences() {
                 n.tables ??= {};
 
                 n.tables[tableId] = Array.from(new Set(columns));
-                // let's not double save
-                // n.collections[tableId] = Array.from(new Set(columns));
                 return n;
             }),
 
@@ -238,8 +236,8 @@ function createPreferences() {
             });
         },
 
-        getColumnOrder(collectionId: string): TeamPreferences['order'] {
-            return teamPreferences?.columnOrder?.[collectionId] ?? [];
+        getColumnOrder(tableId: string): TeamPreferences['order'] {
+            return teamPreferences?.columnOrder?.[tableId] ?? [];
         },
 
         async saveColumnOrder(
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte
index e7f8bde93..e3f16ebcd 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte
@@ -96,7 +96,6 @@
 
     const minimumWidth = 168;
     const emptyCellsLimit = $isSmallViewport ? 12 : 18;
-    const selected = preferences.getCustomTableColumns(page.params.table);
     const SYSTEM_KEYS = new Set([
         '$tableId',
         '$databaseId'
@@ -133,6 +132,8 @@
     onDestroy(() => ($showCreateAttributeSheet.show = false));
 
     function makeTableColumns() {
+        const selected = preferences.getCustomTableColumns(page.params.table);
+
         const baseColumns = $table.columns.map((col) => ({
             id: col.key,
             title: col.key,
@@ -185,12 +186,13 @@
             {
                 id: 'actions',
                 title: '',
-                width: getColumnWidth('actions', 40),
+                width: 40,
                 isAction: true,
                 draggable: false,
                 type: 'string',
                 resizable: false,
-                isEditable: false
+                isEditable: false,
+                hide: false
             }
         ];
 
@@ -198,11 +200,12 @@
             staticColumns[0],
             ...baseColumns,
             staticColumns[1],
-            staticColumns[2],
-            staticColumns[3]
+            staticColumns[2]
         ];
 
-        const visibleNonAction = groupedColumns.filter((c) => !c.hide && !c.isAction);
+        const actionsColumn = staticColumns[3];
+
+        const visibleNonAction = groupedColumns.filter((c) => !c.hide);
         if (visibleNonAction.length === 1) {
             const only = visibleNonAction[0];
             if (typeof only.width === 'number') {
@@ -212,18 +215,10 @@
             }
         }
 
-        tableColumns.set(
-            reorderItems(
-                [
-                    staticColumns[0],
-                    ...baseColumns,
-                    staticColumns[1],
-                    staticColumns[2],
-                    staticColumns[3]
-                ],
-                $columnsOrder
-            )
-        );
+        const reorderedNonActions = reorderItems(groupedColumns, $columnsOrder);
+        const finalColumns = [...reorderedNonActions, actionsColumn];
+
+        tableColumns.set(finalColumns);
     }
 
     function getColumnWidth(
@@ -241,6 +236,8 @@
             columnsOrder.set(newOrder);
         }
 
+        makeTableColumns();
+
         saveColumnOrderToPreferences(newOrder);
     }
 
@@ -404,9 +401,11 @@
         showColumnDelete = false;
 
         try {
-            await sdk
-                .forProject(page.params.region, page.params.project)
-                .grids.deleteColumn(databaseId, tableId, $databaseColumnSheetOptions.column.key);
+            await sdk.forProject(page.params.region, page.params.project).grids.deleteColumn({
+                databaseId,
+                tableId,
+                key: $databaseColumnSheetOptions.column.key
+            });
 
             if ($columnsOrder.includes($databaseColumnSheetOptions.column.key)) {
                 const updatedOrder = $columnsOrder.filter(