diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/empty.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/empty.svelte
index 0ade7c31a..0ff85ccb3 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/empty.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/(suggestions)/empty.svelte
@@ -56,7 +56,7 @@
     } = $props();
 
     const tableId = page.params.table;
-    const supportedColumns = getSupportedColumns(page.data.database?.type as DatabaseType);
+    const supportedColumns = $derived(getSupportedColumns(page.data.database?.type as DatabaseType));
     const minimumUserColumnWidth = 168;
 
     function getUserColumnWidth(
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/createColumn.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/createColumn.svelte
index 68da6d887..25b41d204 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/createColumn.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/createColumn.svelte
@@ -55,7 +55,8 @@
 
     let availableOptions = $derived(getSupportedColumns(databaseType));
     let ColumnComponent = $derived(
-        availableOptions.find((option) => option.name === selectedOption).component
+        (availableOptions.find((option) => option.name === selectedOption) ?? availableOptions[0])
+            .component
     );
 
     function init() {