From 7d8e4c099f93cae57fedf1e35ffa2422f93a7e66 Mon Sep 17 00:00:00 2001
From: Justin Blumencranz <96924014+j15z@users.noreply.github.com>
Date: Mon, 24 Aug 2026 13:35:37 -0700
Subject: [PATCH 1/2] improvement(tables): inline column creation and
 header-menu editing

---
 .../column-config-sidebar.tsx                 | 305 ++++++-----------
 .../column-config-sidebar/column-types.ts     |   8 +-
 .../new-column-dropdown.tsx                   |  33 +-
 .../table-grid/headers/column-header-menu.tsx |  43 ++-
 .../headers/draft-column-header.tsx           |  67 ++++
 .../components/table-grid/headers/index.ts    |   1 +
 .../headers/workflow-group-meta-cell.tsx      |  85 ++++-
 .../components/table-grid/table-grid.tsx      | 320 +++++++++++++++++-
 .../table-grid/table-primitives.tsx           |   7 +
 .../components/table-grid/utils.test.ts       |  21 ++
 .../[tableId]/components/table-grid/utils.ts  |  26 +-
 .../[workspaceId]/tables/[tableId]/table.tsx  |  50 ++-
 apps/sim/hooks/queries/tables.ts              |  13 +
 apps/sim/hooks/queries/utils/table-keys.ts    |   2 +
 .../__tests__/column-type-registry.test.ts    |  63 ++++
 apps/sim/lib/table/column-types/currency.ts   |   1 +
 apps/sim/lib/table/column-types/select.ts     |   2 +
 apps/sim/lib/table/column-types/types.ts      |  15 +
 apps/sim/lib/table/dates.ts                   |  23 +-
 19 files changed, 849 insertions(+), 236 deletions(-)
 create mode 100644 apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/draft-column-header.tsx

diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-config-sidebar.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-config-sidebar.tsx
index ffcef8ce465..b715a8a5ba6 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-config-sidebar.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-config-sidebar.tsx
@@ -1,28 +1,20 @@
 'use client'
 
 import { useState } from 'react'
-import { Button, ChipCombobox, ChipInput, cn, FieldDivider, Label, Switch, toast } from '@sim/emcn'
+import { Button, ChipCombobox, cn, FieldDivider, Label, Switch, toast } from '@sim/emcn'
 import { X } from '@sim/emcn/icons'
 import { toError } from '@sim/utils/errors'
-import { findValidationIssue, isValidationError } from '@/lib/api/client/errors'
+import { useIsMutating } from '@tanstack/react-query'
+import { isValidationError } from '@/lib/api/client/errors'
 import type { ColumnDefinition, SelectOption } from '@/lib/table'
-import {
-  DEFAULT_CURRENCY_CODE,
-  getCurrencyOptions,
-  resolveCurrencyCode,
-} from '@/lib/table/currency'
+import { getCurrencyOptions, resolveCurrencyCode } from '@/lib/table/currency'
 import {
   FieldError,
   RequiredLabel,
 } from '@/app/workspace/[workspaceId]/tables/[tableId]/components/sidebar-fields'
-import { useAddTableColumn, useUpdateColumn } from '@/hooks/queries/tables'
+import { useUpdateColumn } from '@/hooks/queries/tables'
+import { tableKeys } from '@/hooks/queries/utils/table-keys'
 import { SelectOptionsEditor } from '../select-field'
-import { PLAIN_COLUMN_TYPE_OPTIONS } from './column-types'
-
-/** Whether a column type carries an option set. */
-function isSelectType(type: ColumnDefinition['type']): boolean {
-  return type === 'select'
-}
 
 /**
  * Picker entries, built once at module load: the option list is derived from the
@@ -38,41 +30,55 @@ function optionsEqual(a: SelectOption[], b: SelectOption[]): boolean {
 }
 
 /**
- * Discriminates the two flows the column-config sidebar handles. Workflow
- * configuration is a separate component (`<WorkflowSidebar>`) so this surface
- * never has to branch on `isWorkflow`.
+ * Discriminates the flows the column-config sidebar handles. Name and type
+ * never appear here — renaming is inline in the header and type changes go
+ * through the header menu's "Change type" submenu. Workflow configuration is a
+ * separate component (`<WorkflowSidebar>`).
  */
 export type ColumnConfig =
-  | { mode: 'create'; proposedName: string; type: ColumnDefinition['type'] }
-  | { mode: 'edit'; columnName: string }
+  /**
+   * A select column being created: its name has been committed in the grid
+   * header, but it exists only as a draft there until Save hands the option
+   * set to the creator, which persists name and options in one create.
+   * Dismissing discards the draft.
+   */
+  | { mode: 'draft-select' }
+  /**
+   * Convert an existing column to select: Save applies the type change
+   * together with the configured options; dismissing leaves the column's
+   * current type untouched.
+   */
+  | { mode: 'convert-select'; columnName: string }
+  /** Edit the configuration of an existing select or currency column. */
+  | { mode: 'configure'; columnName: string }
 
 interface ColumnConfigSidebarProps {
   /** When non-null the sidebar is open. */
   config: ColumnConfig | null
   onClose: () => void
-  /** Existing column record for `mode: 'edit'`; ignored otherwise. */
+  /**
+   * `draft-select` Save: hands the validated option set to the draft's owner,
+   * which persists the column. Resolves `true` once created (the parent then
+   * closes the sidebar) or `false` to stay open — the draft's name was refused
+   * or the create failed, and the owner has already surfaced why.
+   */
+  onDraftSave: (options: SelectOption[], multiple: boolean) => Promise<boolean>
+  /** Existing column record for modes that carry a `columnName`; otherwise null. */
   existingColumn: ColumnDefinition | null
   workspaceId: string
   tableId: string
-  /** Notify parent of a rename so it can rewrite local `columnOrder` /
-   *  `columnWidths` keys that reference the old name. */
-  onColumnRename?: (oldName: string, newName: string) => void
 }
 
 /**
- * Right-edge sidebar for plain (non-workflow) column configuration. Handles
- * create (with type pre-chosen by the parent's "+ New column" dropdown) and
- * edit. No `isWorkflow` branches — workflow-output columns route through
- * `<WorkflowSidebar>` instead.
+ * Right-edge sidebar for per-type column configuration: a select's option set
+ * and a currency's display code. Everything else about a column — name, type,
+ * unique — is edited in the grid header and its menu.
  *
- * Form state seeds from props via lazy `useState` initializers; the parent
- * uses `key={config?.columnName ?? 'closed'}` to remount when switching
- * columns, eliminating the prop-mirroring `useEffect` the previous combined
- * sidebar relied on.
+ * Form state seeds from props via lazy `useState` initializers; the body is
+ * keyed on the config identity so opening a different column or mode remounts
+ * and re-seeds.
  */
 export function ColumnConfigSidebar(props: ColumnConfigSidebarProps) {
-  // Mount the form body with `key` keyed on the config identity so opening a
-  // different column / mode remounts and re-seeds state from props.
   const open = props.config !== null
   return (
     <aside
@@ -91,7 +97,7 @@ export function ColumnConfigSidebar(props: ColumnConfigSidebarProps) {
 }
 
 function configKey(config: ColumnConfig): string {
-  return config.mode === 'edit' ? `edit:${config.columnName}` : `create:${config.proposedName}`
+  return config.mode === 'draft-select' ? 'draft-select' : `${config.mode}:${config.columnName}`
 }
 
 interface ColumnConfigBodyProps extends Omit<ColumnConfigSidebarProps, 'config'> {
@@ -101,47 +107,34 @@ interface ColumnConfigBodyProps extends Omit<ColumnConfigSidebarProps, 'config'>
 function ColumnConfigBody({
   config,
   onClose,
+  onDraftSave,
   existingColumn,
   workspaceId,
   tableId,
-  onColumnRename,
 }: ColumnConfigBodyProps) {
   const updateColumn = useUpdateColumn({ workspaceId, tableId })
-  const addColumn = useAddTableColumn({ workspaceId, tableId })
+  const draftSaving = useIsMutating({ mutationKey: tableKeys.columnWrites(tableId) }) > 0
 
-  const [nameInput, setNameInput] = useState<string>(() =>
-    config.mode === 'edit' ? (existingColumn?.name ?? config.columnName) : config.proposedName
-  )
-  const [typeInput, setTypeInput] = useState<ColumnDefinition['type']>(() =>
-    config.mode === 'edit' ? (existingColumn?.type ?? 'string') : config.type
-  )
-  const [uniqueInput, setUniqueInput] = useState<boolean>(() =>
-    config.mode === 'edit' ? !!existingColumn?.unique : false
-  )
-  const [optionsInput, setOptionsInput] = useState<SelectOption[]>(() =>
-    config.mode === 'edit' ? (existingColumn?.options ?? []) : []
-  )
-  const [multipleInput, setMultipleInput] = useState<boolean>(() =>
-    config.mode === 'edit' ? !!existingColumn?.multiple : false
+  // draft-select and convert-select always edit an option set; configure
+  // shows whichever configuration the column's type carries.
+  const isSelectTarget = config.mode !== 'configure' || existingColumn?.type === 'select'
+  const isCurrencyTarget = config.mode === 'configure' && existingColumn?.type === 'currency'
+
+  const [optionsInput, setOptionsInput] = useState<SelectOption[]>(
+    () => existingColumn?.options ?? []
   )
+  const [multipleInput, setMultipleInput] = useState<boolean>(() => !!existingColumn?.multiple)
   const [currencyInput, setCurrencyInput] = useState<string>(() =>
-    config.mode === 'edit'
-      ? resolveCurrencyCode(existingColumn?.currencyCode)
-      : DEFAULT_CURRENCY_CODE
+    resolveCurrencyCode(existingColumn?.currencyCode)
   )
-  const [showValidation, setShowValidation] = useState(false)
-  const [nameError, setNameError] = useState<string | null>(null)
   const [optionsError, setOptionsError] = useState<string | null>(null)
 
-  const saveDisabled = updateColumn.isPending || addColumn.isPending
-  const trimmedName = nameInput.trim()
-  const wantsOptions = isSelectType(typeInput)
-  const wantsCurrency = typeInput === 'currency'
+  const saveDisabled = updateColumn.isPending || draftSaving
   const trimmedOptions = optionsInput.map((o) => ({ ...o, name: o.name.trim() }))
 
   /** Client-side option validation mirroring the server rules; returns an error message or null. */
   function validateOptions(): string | null {
-    if (!wantsOptions) return null
+    if (!isSelectTarget) return null
     if (trimmedOptions.length === 0) return 'Add at least one option'
     if (trimmedOptions.some((o) => !o.name)) return 'Option names cannot be empty'
     const names = trimmedOptions.map((o) => o.name.toLowerCase())
@@ -150,85 +143,70 @@ function ColumnConfigBody({
   }
 
   async function handleSave() {
-    if (!trimmedName) {
-      setShowValidation(true)
-      return
-    }
-
     const optionsIssue = validateOptions()
     if (optionsIssue) {
       setOptionsError(optionsIssue)
       return
     }
 
+    if (config.mode === 'draft-select') {
+      // The draft's owner persists name + options together and reports back;
+      // the parent closes the sidebar on success, so nothing to do here.
+      await onDraftSave(trimmedOptions, multipleInput)
+      return
+    }
+
+    const columnLabel = existingColumn?.name ?? config.columnName
+
     try {
-      if (config.mode === 'create') {
-        await addColumn.mutateAsync({
-          name: trimmedName,
-          type: typeInput,
-          // Select columns don't expose a unique constraint.
-          ...(!wantsOptions && uniqueInput ? { unique: true } : {}),
-          ...(wantsOptions ? { options: trimmedOptions } : {}),
-          ...(wantsOptions && multipleInput ? { multiple: true } : {}),
-          ...(wantsCurrency ? { currencyCode: currencyInput } : {}),
+      if (config.mode === 'convert-select') {
+        await updateColumn.mutateAsync({
+          columnName: config.columnName,
+          updates: {
+            type: 'select',
+            options: trimmedOptions,
+            ...(multipleInput ? { multiple: true } : {}),
+            // Select columns can't carry a unique constraint (the header-menu
+            // toggle is hidden for them), so converting a unique column would
+            // strand the constraint with no way to clear it.
+            ...(existingColumn?.unique ? { unique: false } : {}),
+          },
         })
-        toast.success(`Added "${trimmedName}"`)
+        toast.success(`Saved "${columnLabel}"`)
         onClose()
         return
       }
 
-      // `config.columnName` is the column id; compare against the current display
-      // name to detect an actual rename.
-      const renamed = trimmedName !== (existingColumn?.name ?? config.columnName)
-      const typeChanged = !!existingColumn && existingColumn.type !== typeInput
-      const uniqueChanged =
-        !wantsOptions && !!existingColumn && !!existingColumn.unique !== uniqueInput
-      // Select columns don't offer a Unique control, so converting a unique
-      // column to select would strand the constraint with no way to clear it.
-      const uniqueCleared = wantsOptions && !!existingColumn?.unique
-      const optionsChanged =
-        wantsOptions && !optionsEqual(existingColumn?.options ?? [], trimmedOptions)
-      const multipleChanged = wantsOptions && !!existingColumn?.multiple !== multipleInput
-      const currencyChanged =
-        wantsCurrency && resolveCurrencyCode(existingColumn?.currencyCode) !== currencyInput
-
-      const updates: {
-        name?: string
-        type?: ColumnDefinition['type']
-        unique?: boolean
-        options?: SelectOption[]
-        multiple?: boolean
-        currencyCode?: string
-      } = {
-        ...(renamed ? { name: trimmedName } : {}),
-        ...(typeChanged ? { type: typeInput } : {}),
-        ...(uniqueChanged ? { unique: uniqueInput } : {}),
-        ...(uniqueCleared ? { unique: false } : {}),
-        ...(wantsOptions && (typeChanged || optionsChanged) ? { options: trimmedOptions } : {}),
-        ...(wantsOptions && (typeChanged || multipleChanged) ? { multiple: multipleInput } : {}),
-        ...(wantsCurrency && (typeChanged || currencyChanged)
-          ? { currencyCode: currencyInput }
-          : {}),
-      }
-      if (Object.keys(updates).length === 0) {
+      if (isCurrencyTarget) {
+        const currencyChanged = resolveCurrencyCode(existingColumn?.currencyCode) !== currencyInput
+        if (currencyChanged) {
+          await updateColumn.mutateAsync({
+            columnName: config.columnName,
+            updates: { currencyCode: currencyInput },
+          })
+          toast.success(`Saved "${columnLabel}"`)
+        }
         onClose()
         return
       }
 
-      await updateColumn.mutateAsync({ columnName: config.columnName, updates })
-      if (renamed) onColumnRename?.(config.columnName, trimmedName)
-      toast.success(`Saved "${trimmedName}"`)
+      const optionsChanged = !optionsEqual(existingColumn?.options ?? [], trimmedOptions)
+      const multipleChanged = !!existingColumn?.multiple !== multipleInput
+      if (!optionsChanged && !multipleChanged) {
+        onClose()
+        return
+      }
+      await updateColumn.mutateAsync({
+        columnName: config.columnName,
+        updates: {
+          ...(optionsChanged ? { options: trimmedOptions } : {}),
+          ...(multipleChanged ? { multiple: multipleInput } : {}),
+        },
+      })
+      toast.success(`Saved "${columnLabel}"`)
       onClose()
     } catch (err) {
       if (isValidationError(err)) {
-        const nameIssue =
-          findValidationIssue(err, ['updates', 'name']) ??
-          findValidationIssue(err, ['name']) ??
-          findValidationIssue(err, ['columnName'])
-        if (nameIssue) {
-          setNameError(nameIssue.message)
-          return
-        }
         toast.error(toError(err).message)
       }
     }
@@ -250,65 +228,23 @@ function ColumnConfigBody({
       </div>
 
       <div className='flex-1 overflow-y-auto overflow-x-hidden px-2 pt-3 pb-2 [overflow-anchor:none]'>
-        <div className='flex flex-col gap-[9.5px]'>
-          <RequiredLabel htmlFor='column-sidebar-name'>Column name</RequiredLabel>
-          <ChipInput
-            id='column-sidebar-name'
-            value={nameInput}
-            onChange={(e) => {
-              setNameInput(e.target.value)
-              if (nameError) setNameError(null)
-            }}
-            spellCheck={false}
-            autoComplete='off'
-            error={Boolean((showValidation && !trimmedName) || nameError)}
-            aria-invalid={(showValidation && !trimmedName) || nameError ? true : undefined}
-          />
-          {showValidation && !trimmedName && <FieldError message='Column name is required' />}
-          {nameError && !(showValidation && !trimmedName) && <FieldError message={nameError} />}
-        </div>
-
-        {config.mode === 'edit' && (
-          <>
-            <FieldDivider />
-            <div className='flex flex-col gap-[9.5px]'>
-              <RequiredLabel>Type</RequiredLabel>
-              <ChipCombobox
-                options={PLAIN_COLUMN_TYPE_OPTIONS.map((o) => ({
-                  label: o.label,
-                  value: o.type,
-                  icon: o.icon,
-                }))}
-                value={typeInput}
-                onChange={(v) => setTypeInput(v as ColumnDefinition['type'])}
-                placeholder='Select type'
-                maxHeight={300}
-              />
-            </div>
-          </>
-        )}
-
-        {wantsCurrency && (
-          <>
-            <FieldDivider />
-            <div className='flex flex-col gap-[9.5px]'>
-              <RequiredLabel>Currency</RequiredLabel>
-              <ChipCombobox
-                options={CURRENCY_COMBOBOX_OPTIONS}
-                value={currencyInput}
-                onChange={setCurrencyInput}
-                placeholder='Select currency'
-                searchable
-                searchPlaceholder='Search currencies'
-                maxHeight={260}
-              />
-            </div>
-          </>
+        {isCurrencyTarget && (
+          <div className='flex flex-col gap-[9.5px]'>
+            <RequiredLabel>Currency</RequiredLabel>
+            <ChipCombobox
+              options={CURRENCY_COMBOBOX_OPTIONS}
+              value={currencyInput}
+              onChange={setCurrencyInput}
+              placeholder='Select currency'
+              searchable
+              searchPlaceholder='Search currencies'
+              maxHeight={260}
+            />
+          </div>
         )}
 
-        {wantsOptions && (
+        {isSelectTarget && (
           <>
-            <FieldDivider />
             <div className='flex flex-col gap-[9.5px]'>
               <RequiredLabel>Options</RequiredLabel>
               <SelectOptionsEditor
@@ -331,23 +267,6 @@ function ColumnConfigBody({
             </div>
           </>
         )}
-
-        {/* Select columns don't expose a unique constraint. */}
-        {!wantsOptions && (
-          <>
-            <FieldDivider />
-            <div className='flex flex-col gap-[9.5px]'>
-              <div className='flex items-center justify-between pl-0.5'>
-                <Label htmlFor='column-sidebar-unique'>Unique</Label>
-                <Switch
-                  id='column-sidebar-unique'
-                  checked={uniqueInput}
-                  onCheckedChange={(v) => setUniqueInput(!!v)}
-                />
-              </div>
-            </div>
-          </>
-        )}
       </div>
 
       <div className='flex items-center justify-end gap-2 border-[var(--border)] border-t px-2 py-3'>
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-types.ts b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-types.ts
index 2f235137f17..b41831ec2fc 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-types.ts
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-types.ts
@@ -30,5 +30,9 @@ export const COLUMN_TYPE_OPTIONS: ColumnTypeOption[] = [
   { type: 'workflow', label: 'Workflow', icon: PlayOutline },
 ]
 
-/** Plain column types (no workflow). Used by `<ColumnConfigSidebar>`'s type combobox in edit mode. */
-export const PLAIN_COLUMN_TYPE_OPTIONS = COLUMN_TYPE_OPTIONS.filter((o) => o.type !== 'workflow')
+/** Plain column types (no workflow). Used by the column header menu's "Change type" submenu. */
+export const PLAIN_COLUMN_TYPE_OPTIONS: (ColumnTypeOption & {
+  type: ColumnDefinition['type']
+})[] = COLUMN_TYPE_OPTIONS.filter(
+  (o): o is ColumnTypeOption & { type: ColumnDefinition['type'] } => o.type !== 'workflow'
+)
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/new-column-dropdown/new-column-dropdown.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/new-column-dropdown/new-column-dropdown.tsx
index 2e9b21332dc..8322eade167 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/new-column-dropdown/new-column-dropdown.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/new-column-dropdown/new-column-dropdown.tsx
@@ -1,5 +1,6 @@
 'use client'
 
+import { useRef } from 'react'
 import {
   ChipChevronDown,
   chipContentIconClass,
@@ -39,8 +40,10 @@ interface NewColumnDropdownProps {
 
 /**
  * "+ New column" dropdown — the single entry point for creating a column.
- * Lists every column type plus "Workflow" and "Enrichments"; picking a type
- * opens the right sidebar pre-seeded.
+ * Lists every column type plus "Workflow" and "Enrichments". Picking a scalar
+ * type adds a draft header cell for naming — nothing persists until the name
+ * commits (committing a select's name opens its options sidebar, and it
+ * persists from there). Workflow and Enrichments open their own sidebars.
  */
 export function NewColumnDropdown({
   trigger,
@@ -51,6 +54,8 @@ export function NewColumnDropdown({
   blocked,
   onBlocked,
 }: NewColumnDropdownProps) {
+  const pendingTypeRef = useRef<ColumnDefinition['type'] | null>(null)
+
   const triggerButton =
     trigger === 'header' ? (
       <button
@@ -90,7 +95,25 @@ export function NewColumnDropdown({
           (295px with its separator and padding), so the default cut the last
           two off behind a scrollbar. Sized here rather than in the shared
           component, which every other dropdown in the app relies on. */}
-      <DropdownMenuContent align='start' side='bottom' sideOffset={4} className='max-h-[320px]'>
+      {/* A type pick is deferred to here, the moment the menu has fully
+          unmounted. Started from `onSelect`, the draft header's name input
+          would mount while this menu is still playing its exit animation —
+          and as the content zooms away from under the pointer, Radix's
+          item-leave handler focuses the closing menu, stealing the input's
+          focus mid-keystroke. The default close behavior (refocusing the
+          trigger) is prevented for the same reason. */}
+      <DropdownMenuContent
+        align='start'
+        side='bottom'
+        sideOffset={4}
+        className='max-h-[320px]'
+        onCloseAutoFocus={(e) => {
+          e.preventDefault()
+          const type = pendingTypeRef.current
+          pendingTypeRef.current = null
+          if (type) onPickType(type)
+        }}
+      >
         <>
           <DropdownMenuItem onSelect={onPickEnrichment}>
             <Sparkles className='size-[14px] text-[var(--text-icon)]' />
@@ -103,7 +126,9 @@ export function NewColumnDropdown({
           const onSelect =
             option.type === 'workflow'
               ? onPickWorkflow
-              : () => onPickType(option.type as ColumnDefinition['type'])
+              : () => {
+                  pendingTypeRef.current = option.type as ColumnDefinition['type']
+                }
           return (
             <DropdownMenuItem key={option.type} onSelect={onSelect}>
               <Icon className='size-[14px] text-[var(--text-icon)]' />
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-header-menu.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-header-menu.tsx
index 04025f40920..694a96252cc 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-header-menu.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-header-menu.tsx
@@ -3,7 +3,8 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react'
 import { cn } from '@sim/emcn'
 import { ChevronDown } from '@sim/emcn/icons'
-import type { SortDirection, WorkflowGroup } from '@/lib/table'
+import type { ColumnDefinition, SortDirection, WorkflowGroup } from '@/lib/table'
+import { columnTypeOf } from '@/lib/table/column-types'
 import { HeaderLabel } from '@/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/header-label'
 import type { WorkflowMetadata } from '@/stores/workflows/registry/types'
 import { COL_WIDTH, SELECTION_TINT_BG } from '../constants'
@@ -18,12 +19,25 @@ interface ColumnHeaderMenuProps {
   isRenaming: boolean
   isColumnSelected: boolean
   renameValue: string
+  /** True after a refused rename — paints the name red until it's edited. */
+  renameError?: boolean
   onRenameValueChange: (value: string) => void
   onRenameSubmit: () => void
   onRenameCancel: () => void
   onColumnSelect: (colIndex: number, shiftKey: boolean) => void
   onInsertLeft: (columnName: string) => void
   onInsertRight: (columnName: string) => void
+  /** Flip the column's `unique` constraint. Only forwarded to the menu for
+   *  columns whose type supports it (registry `supportsUnique`) and that are
+   *  not workflow outputs. */
+  onToggleUnique?: (columnName: string) => void
+  /** Starts the inline header rename. Forwarded for plain/enrichment columns;
+   *  workflow outputs rename through the workflow sidebar. */
+  onRenameColumn?: (columnName: string) => void
+  /** Converts the column to another type. Plain/enrichment columns only. */
+  onChangeType?: (columnName: string, type: ColumnDefinition['type']) => void
+  /** Opens the config sidebar for types with per-column configuration. */
+  onConfigure?: (columnName: string) => void
   onDeleteColumn: (columnName: string) => void
   onResizeStart: (columnKey: string) => void
   onResize: (columnKey: string, width: number) => void
@@ -68,12 +82,17 @@ export const ColumnHeaderMenu = React.memo(function ColumnHeaderMenu({
   isRenaming,
   isColumnSelected,
   renameValue,
+  renameError,
   onRenameValueChange,
   onRenameSubmit,
   onRenameCancel,
   onColumnSelect,
   onInsertLeft,
   onInsertRight,
+  onToggleUnique,
+  onRenameColumn,
+  onChangeType,
+  onConfigure,
   onDeleteColumn,
   onResizeStart,
   onResize,
@@ -115,6 +134,11 @@ export const ColumnHeaderMenu = React.memo(function ColumnHeaderMenu({
       ? 'Hide column'
       : 'Delete column'
     : undefined
+  // Workflow outputs never take a unique constraint; enrichment outputs behave
+  // like plain columns (matching `handleConfigureColumn`'s routing). The type's
+  // own say-so comes from the registry, never a per-type check here.
+  const isWorkflowOutput = !!column.workflowGroupId && ownGroup?.type !== 'enrichment'
+  const supportsUnique = !isWorkflowOutput && columnTypeOf(column).supportsUnique
   useEffect(() => {
     if (isRenaming && renameInputRef.current) {
       renameInputRef.current.focus()
@@ -225,7 +249,10 @@ export const ColumnHeaderMenu = React.memo(function ColumnHeaderMenu({
     }
     if (isRenaming) return
     onColumnSelect(colIndex, e.shiftKey)
-    if (!e.shiftKey) {
+    // Only workflow-output columns still have a config surface behind a plain
+    // click (the workflow sidebar). Plain columns edit inline / via the menu,
+    // so clicking their header just selects the column.
+    if (!e.shiftKey && isWorkflowOutput) {
       onOpenConfig(column.key)
     }
   }
@@ -295,7 +322,11 @@ export const ColumnHeaderMenu = React.memo(function ColumnHeaderMenu({
               if (e.key === 'Escape') onRenameCancel()
             }}
             onBlur={onRenameSubmit}
-            className='ml-1.5 min-w-0 flex-1 border-0 bg-transparent p-0 text-[var(--text-primary)] text-small outline-none focus:outline-none focus:ring-0'
+            aria-invalid={renameError || undefined}
+            className={cn(
+              'ml-1.5 min-w-0 flex-1 border-0 bg-transparent p-0 text-small outline-none focus:outline-none focus:ring-0',
+              renameError ? 'text-[var(--text-error)]' : 'text-[var(--text-primary)]'
+            )}
           />
         </div>
       ) : readOnly ? (
@@ -345,9 +376,13 @@ export const ColumnHeaderMenu = React.memo(function ColumnHeaderMenu({
             position={menuPosition}
             column={column}
             deleteLabel={deleteLabel}
-            onOpenConfig={onOpenConfig}
+            onOpenConfig={isWorkflowOutput ? onOpenConfig : undefined}
+            onRenameColumn={isWorkflowOutput ? undefined : onRenameColumn}
+            onChangeType={isWorkflowOutput ? undefined : onChangeType}
+            onConfigure={isWorkflowOutput ? undefined : onConfigure}
             onInsertLeft={onInsertLeft}
             onInsertRight={onInsertRight}
+            onToggleUnique={supportsUnique ? onToggleUnique : undefined}
             onDeleteColumn={onDeleteColumn}
             onViewWorkflow={
               onViewWorkflow && ownGroup ? () => onViewWorkflow(ownGroup.workflowId) : undefined
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/draft-column-header.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/draft-column-header.tsx
new file mode 100644
index 00000000000..709358a1133
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/draft-column-header.tsx
@@ -0,0 +1,67 @@
+'use client'
+
+import React, { useEffect, useRef } from 'react'
+import { cn } from '@sim/emcn'
+import type { ColumnDefinition } from '@/lib/table'
+import { ColumnTypeIcon } from './column-type-icon'
+
+interface DraftColumnHeaderProps {
+  type: ColumnDefinition['type']
+  name: string
+  /** True after a refused commit — paints the name red until it's edited. */
+  invalid: boolean
+  onNameChange: (name: string) => void
+  /** Enter or blur. The grid decides whether this persists the column. */
+  onCommit: () => void
+  /** Escape. Discards the draft — nothing was ever persisted. */
+  onCancel: () => void
+}
+
+/**
+ * Header cell for a column that exists only in this browser: the user picked
+ * a type and is naming it, but nothing is persisted until the name commits
+ * (or, for a type with configuration, until the sidebar saves). Renders like
+ * the rename state of a real header so the draft reads as "the column, being
+ * named" rather than a form. Like the "+ New column" cell it has no body
+ * cells beneath it.
+ */
+export const DraftColumnHeader = React.memo(function DraftColumnHeader({
+  type,
+  name,
+  invalid,
+  onNameChange,
+  onCommit,
+  onCancel,
+}: DraftColumnHeaderProps) {
+  const inputRef = useRef<HTMLInputElement>(null)
+
+  useEffect(() => {
+    inputRef.current?.focus()
+    inputRef.current?.select()
+  }, [])
+
+  return (
+    <th className='relative border-[var(--border)] border-r border-b bg-[var(--bg)] p-0 text-left align-middle'>
+      <div className='flex h-full w-full min-w-0 items-center px-2 py-[7px]'>
+        <ColumnTypeIcon type={type} />
+        <input
+          ref={inputRef}
+          type='text'
+          value={name}
+          aria-label='New column name'
+          aria-invalid={invalid || undefined}
+          onChange={(e) => onNameChange(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === 'Enter') onCommit()
+            if (e.key === 'Escape') onCancel()
+          }}
+          onBlur={onCommit}
+          className={cn(
+            'ml-1.5 min-w-0 flex-1 border-0 bg-transparent p-0 text-small outline-none focus:outline-none focus:ring-0',
+            invalid ? 'text-[var(--text-error)]' : 'text-[var(--text-primary)]'
+          )}
+        />
+      </div>
+    </th>
+  )
+})
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/index.ts b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/index.ts
index 17ba6d7c7d2..65f3fd608a5 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/index.ts
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/index.ts
@@ -1,3 +1,4 @@
 export { ColumnHeaderMenu } from './column-header-menu'
 export { ColumnTypeIcon, columnTypeIcon } from './column-type-icon'
+export { DraftColumnHeader } from './draft-column-header'
 export { ColumnOptionsMenu, WorkflowGroupMetaCell } from './workflow-group-meta-cell'
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/workflow-group-meta-cell.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/workflow-group-meta-cell.tsx
index e9f4e435e11..cbea335dd5d 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/workflow-group-meta-cell.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/workflow-group-meta-cell.tsx
@@ -20,16 +20,20 @@ import {
   ArrowUp,
   Eye,
   EyeOff,
+  Fingerprint,
   Pencil,
   Pin,
   PinOff,
   PlayOutline,
+  Settings,
   Trash,
   Workflow,
   X,
 } from '@sim/emcn/icons'
 import type { RunLimit, RunMode } from '@/lib/api/contracts/tables'
-import type { SortDirection, WorkflowGroupType } from '@/lib/table'
+import type { ColumnDefinition, SortDirection, WorkflowGroupType } from '@/lib/table'
+import { columnTypeOf } from '@/lib/table/column-types'
+import { PLAIN_COLUMN_TYPE_OPTIONS } from '@/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar'
 import { HeaderLabel } from '@/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/header-label'
 import { getEnrichment } from '@/enrichments/registry'
 import type { WorkflowMetadata } from '@/stores/workflows/registry/types'
@@ -69,9 +73,24 @@ interface ColumnOptionsMenuProps {
    *  destructive action is non-lossy (workflow-output column where removing
    *  it leaves the group with siblings). */
   deleteLabel?: string
-  onOpenConfig: (columnName: string) => void
+  /** Renders the "Edit column" item. Only workflow-owned columns still have a
+   *  config surface behind it (the workflow sidebar); plain columns edit
+   *  name/type/unique from this menu directly and omit it. */
+  onOpenConfig?: (columnName: string) => void
+  /** Starts the inline header rename. Plain and enrichment columns only. */
+  onRenameColumn?: (columnName: string) => void
+  /** Converts the column to `type`. Callers route `select` conversions through
+   *  the config sidebar (the option set must be collected first). */
+  onChangeType?: (columnName: string, type: ColumnDefinition['type']) => void
+  /** Opens the config sidebar for a type with per-column configuration
+   *  (registry `hasConfiguration`) — a select's options, a currency's code. */
+  onConfigure?: (columnName: string) => void
   onInsertLeft: (columnName: string) => void
   onInsertRight: (columnName: string) => void
+  /** Flip the column's `unique` constraint. Callers pass it only for columns
+   *  that can carry one (plain/enrichment columns of a `supportsUnique` type),
+   *  so the item's presence is the capability check. */
+  onToggleUnique?: (columnName: string) => void
   onDeleteColumn: (columnName: string) => void
   /** When provided (i.e. menu opened from a workflow-group meta header), the
    *  "Delete" item deletes the entire workflow group rather than the single
@@ -112,8 +131,9 @@ interface ColumnOptionsMenuProps {
  * Shared column-options dropdown rendered next to the column header chevron
  * AND on right-click of the workflow group meta cell. Anchors to a fixed
  * position passed in (so callers can place it under the chevron, or at the
- * cursor for context-menu use). Rename / change type / unique live in the
- * column sidebar (opened by Edit column).
+ * cursor for context-menu use). Rename, change type, and the unique
+ * constraint are handled from here; per-type configuration and workflow
+ * outputs open their sidebars.
  */
 export function ColumnOptionsMenu({
   open,
@@ -122,8 +142,12 @@ export function ColumnOptionsMenu({
   column,
   deleteLabel,
   onOpenConfig,
+  onRenameColumn,
+  onChangeType,
+  onConfigure,
   onInsertLeft,
   onInsertRight,
+  onToggleUnique,
   onDeleteColumn,
   onDeleteGroup,
   onRunColumnAll,
@@ -142,6 +166,8 @@ export function ColumnOptionsMenu({
   const showRunActions = Boolean(onRunColumnAll && onRunColumnIncomplete)
   const showRunSelected = Boolean(onRunColumnSelected) && selectedRowCount > 0
   const runLabels = runMenuLabels(hasActiveFilter)
+  const typeDefinition = columnTypeOf(column)
+  const CurrentTypeIcon = typeDefinition.icon
   return (
     <DropdownMenu open={open} onOpenChange={onOpenChange}>
       <DropdownMenuTrigger asChild>
@@ -228,10 +254,53 @@ export function ColumnOptionsMenu({
             View workflow
           </DropdownMenuItem>
         )}
-        <DropdownMenuItem onSelect={() => onOpenConfig(column.key)}>
-          <Pencil />
-          Edit column
-        </DropdownMenuItem>
+        {onOpenConfig && (
+          <DropdownMenuItem onSelect={() => onOpenConfig(column.key)}>
+            <Pencil />
+            Edit column
+          </DropdownMenuItem>
+        )}
+        {onRenameColumn && (
+          <DropdownMenuItem onSelect={() => onRenameColumn(column.key)}>
+            <Pencil />
+            Rename column
+          </DropdownMenuItem>
+        )}
+        {onChangeType && (
+          <DropdownMenuSub>
+            <DropdownMenuSubTrigger>
+              <CurrentTypeIcon />
+              Change type
+            </DropdownMenuSubTrigger>
+            <DropdownMenuSubContent>
+              {PLAIN_COLUMN_TYPE_OPTIONS.map((option) => {
+                const Icon = option.icon
+                return (
+                  <DropdownMenuItem
+                    key={option.type}
+                    active={column.type === option.type}
+                    onSelect={() => onChangeType(column.key, option.type)}
+                  >
+                    <Icon />
+                    {option.label}
+                  </DropdownMenuItem>
+                )
+              })}
+            </DropdownMenuSubContent>
+          </DropdownMenuSub>
+        )}
+        {onConfigure && typeDefinition.hasConfiguration && (
+          <DropdownMenuItem onSelect={() => onConfigure(column.key)}>
+            <Settings />
+            {`Configure ${typeDefinition.label.toLowerCase()}`}
+          </DropdownMenuItem>
+        )}
+        {onToggleUnique && (
+          <DropdownMenuItem onSelect={() => onToggleUnique(column.key)}>
+            <Fingerprint />
+            {column.unique ? 'Remove unique' : 'Set unique'}
+          </DropdownMenuItem>
+        )}
         {onPinToggle && (
           <DropdownMenuItem onSelect={() => onPinToggle(column.key)}>
             {isPinned ? <PinOff /> : <Pin />}
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-grid.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-grid.tsx
index 379f94465c4..9822cde8153 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-grid.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-grid.tsx
@@ -10,12 +10,14 @@ import { getErrorMessage } from '@sim/utils/errors'
 import { useVirtualizer } from '@tanstack/react-virtual'
 import { useParams } from 'next/navigation'
 import { usePostHog } from 'posthog-js/react'
+import { extractValidationIssues, isValidationError } from '@/lib/api/client/errors'
 import type { RunLimit, RunMode, TableFindMatch } from '@/lib/api/contracts/tables'
 import { attachSelectionContextToClipboard } from '@/lib/copilot/chat/selection-clipboard'
 import { captureEvent } from '@/lib/posthog/client'
 import type {
   ColumnDefinition,
   Predicate,
+  SelectOption,
   SortDirection,
   TableLocks,
   TableMetadata,
@@ -24,7 +26,7 @@ import type {
   WorkflowGroup,
 } from '@/lib/table'
 import { getColumnId } from '@/lib/table/column-keys'
-import { columnTypeOf } from '@/lib/table/column-types'
+import { columnTypeById, columnTypeOf } from '@/lib/table/column-types'
 import { TABLE_LIMITS } from '@/lib/table/constants'
 import { cellValueFilterConditions } from '@/lib/table/query-builder/cell-filter'
 import { SEARCH_DEBOUNCE_MS } from '@/lib/url-state'
@@ -62,7 +64,7 @@ import type { WorkflowConfig } from '../workflow-sidebar'
 import { ExpandedCellPopover } from './cells'
 import { ADD_COL_WIDTH, COL_WIDTH, SELECTION_TINT_BG } from './constants'
 import { DataRow } from './data-row'
-import { ColumnHeaderMenu, WorkflowGroupMetaCell } from './headers'
+import { ColumnHeaderMenu, DraftColumnHeader, WorkflowGroupMetaCell } from './headers'
 import { RemoteSelectionOverlay } from './remote-selection-overlay'
 import { AddRowButton, SelectAllCheckbox, TableColGroup } from './table-primitives'
 import type { DisplayColumn } from './types'
@@ -75,6 +77,7 @@ import {
   chipRowCount,
   classifyExecStatusMix,
   collectRowSnapshots,
+  columnNameIssue,
   computeNormalizedSelection,
   drainTargetForChip,
   type ExecStatusMix,
@@ -194,6 +197,16 @@ interface TableGridProps {
    * and enforces mutual-exclusion (only one slideout open at a time).
    */
   onOpenColumnConfig: (cfg: ColumnConfig) => void
+  /** Close the column-config slideout — used when a select draft is discarded
+   *  from its header input while its options sidebar is open. */
+  onCloseColumnConfig: () => void
+  /**
+   * Whether the column-config slideout is showing the `draft-select` options
+   * sidebar for the grid's current draft. Read by the draft handlers instead
+   * of a grid-local "named" flag, so the wrapper's slideout state is the only
+   * record of which panel is open.
+   */
+  draftSelectOpen: boolean
   onOpenWorkflowConfig: (cfg: WorkflowConfig) => void
   /** Open the enrichments list (Clay-style catalog) slideout. */
   onOpenEnrichments: () => void
@@ -282,6 +295,27 @@ interface TableGridProps {
    * `columnWidths` / `columnOrder` keys). The wrapper just forwards the call.
    */
   columnRenameSinkRef: React.MutableRefObject<((oldName: string, newName: string) => void) | null>
+  /**
+   * Ref the grid populates with its `handleAddColumnOfType` so the wrapper's
+   * page-header "+ New column" dropdown starts a draft through the same path
+   * as the in-grid trigger.
+   */
+  addColumnOfTypeSinkRef: React.MutableRefObject<((type: ColumnDefinition['type']) => void) | null>
+  /**
+   * Ref the grid populates with the `draft-select` sidebar's Save handler: it
+   * persists the draft column (name from the header input, options from the
+   * sidebar) in one create and resolves whether it succeeded.
+   */
+  draftSelectSaveSinkRef: React.MutableRefObject<
+    ((options: SelectOption[], multiple: boolean) => Promise<boolean>) | null
+  >
+  /**
+   * Ref the grid populates with its draft discard. The wrapper fires it from
+   * every slideout transition other than entering `draft-select`, so
+   * dismissing the options sidebar (or replacing it with another panel) also
+   * drops the header draft. Idempotent.
+   */
+  abortColumnDraftSinkRef: React.MutableRefObject<(() => void) | null>
   /**
    * Ref the grid populates with a reader for its CURRENT column layout. The grid
    * owns this state, so the wrapper asks for it when creating a view rather than
@@ -438,6 +472,8 @@ export function TableGrid({
   onBlockedAction,
   sidebarReservedPx,
   onOpenColumnConfig,
+  onCloseColumnConfig,
+  draftSelectOpen,
   onOpenWorkflowConfig,
   onOpenEnrichments,
   onOpenEnrichmentConfig,
@@ -463,6 +499,9 @@ export function TableGrid({
   viewLayoutKey = null,
   onPersistLayout,
   columnRenameSinkRef,
+  addColumnOfTypeSinkRef,
+  draftSelectSaveSinkRef,
+  abortColumnDraftSinkRef,
   layoutSnapshotSinkRef,
   afterDeleteRowsSinkRef,
   afterDeleteAllSinkRef,
@@ -974,13 +1013,34 @@ export function TableGrid({
     [selectionAnchor, selectionFocus]
   )
 
+  /**
+   * A column being created. It lives only here until its name commits (or,
+   * for a type with configuration, until the options sidebar saves), so a
+   * reload or an Escape before that leaves nothing behind — the column was
+   * never persisted. Name-only types persist on Enter/blur. A select's commit
+   * instead opens the options sidebar (the wrapper's `draftSelectOpen` records
+   * that); it persists from there together with its options.
+   */
+  const [columnDraft, setColumnDraft] = useState<{
+    type: ColumnDefinition['type']
+    name: string
+    invalid: boolean
+  } | null>(null)
+  const columnDraftRef = useRef(columnDraft)
+  columnDraftRef.current = columnDraft
+
+  // The draft column occupies a real slot: it needs its own `<col>` and its
+  // width in the table's explicit width, or the fixed layout collapses the
+  // "+ New column" cell to make room for it.
+  const draftColumnWidth = columnDraft ? COL_WIDTH : undefined
+
   const tableWidth = useMemo(() => {
     const colsWidth = displayColumns.reduce(
       (sum, col) => sum + (columnWidths[col.key] ?? COL_WIDTH),
       0
     )
-    return checkboxColWidth + colsWidth + ADD_COL_WIDTH
-  }, [displayColumns, columnWidths, checkboxColWidth])
+    return checkboxColWidth + colsWidth + (draftColumnWidth ?? 0) + ADD_COL_WIDTH
+  }, [displayColumns, columnWidths, checkboxColWidth, draftColumnWidth])
 
   const resizeIndicatorLeft = useMemo(() => {
     if (!resizingColumn) return 0
@@ -1480,6 +1540,9 @@ export function TableGrid({
   const handleFindCloseRef = useRef(handleFindClose)
   handleFindCloseRef.current = handleFindClose
 
+  /** True after a refused rename — paints the header input red until it's edited. */
+  const [renameError, setRenameError] = useState(false)
+
   const columnRename = useInlineRename({
     // `columnName` is the column id; record the prior display name + id so undo
     // restores the label (not the id) and targets the right column.
@@ -1487,9 +1550,55 @@ export function TableGrid({
       const oldName = columnsRef.current.find((c) => c.key === columnName)?.name ?? columnName
       pushUndoRef.current({ type: 'rename-column', oldName, newName, columnId: columnName })
       handleColumnRename(columnName, newName)
-      return updateColumnMutation.mutateAsync({ columnName, updates: { name: newName } })
+      return updateColumnMutation
+        .mutateAsync({ columnName, updates: { name: newName } })
+        .catch((err: unknown) => {
+          // The mutation hook toasts non-validation failures; a server-side
+          // name rejection (e.g. a race on uniqueness) is ours to surface.
+          if (isValidationError(err)) {
+            toast.error(extractValidationIssues(err)[0]?.message ?? getErrorMessage(err))
+          }
+          setRenameError(true)
+          throw err
+        })
     },
   })
+  const columnRenameRef = useRef(columnRename)
+  columnRenameRef.current = columnRename
+
+  const handleRenameValueChange = useCallback((value: string) => {
+    setRenameError(false)
+    columnRenameRef.current.setEditValue(value)
+  }, [])
+
+  /**
+   * Refuse an unsaveable name in place — toast, red text, session kept — so
+   * it never reaches the contract as a raw `ZodError`. An unchanged or empty
+   * value falls through to the hook, which ends the session without saving.
+   */
+  const handleRenameSubmit = useCallback(() => {
+    const { editingId, editValue, submitRename } = columnRenameRef.current
+    const trimmed = editValue.trim()
+    const current = columnsRef.current.find((c) => c.key === editingId)
+    if (trimmed && current && trimmed !== current.name) {
+      const issue = columnNameIssue(
+        trimmed,
+        schemaColumnsRef.current.filter((c) => getColumnId(c) !== editingId).map((c) => c.name)
+      )
+      if (issue) {
+        toast.error(issue)
+        setRenameError(true)
+        return
+      }
+    }
+    setRenameError(false)
+    void submitRename()
+  }, [])
+
+  const handleRenameCancel = useCallback(() => {
+    setRenameError(false)
+    columnRenameRef.current.cancelRename()
+  }, [])
 
   const toggleBooleanCell = useCallback(
     (rowId: string, columnName: string, currentValue: unknown) => {
@@ -3877,35 +3986,192 @@ export function TableGrid({
     [generateColumnName, insertColumnInOrder]
   )
 
+  const draftPersistingRef = useRef(false)
+  const onCloseColumnConfigRef = useRef(onCloseColumnConfig)
+  onCloseColumnConfigRef.current = onCloseColumnConfig
+  const draftSelectOpenRef = useRef(draftSelectOpen)
+  draftSelectOpenRef.current = draftSelectOpen
+
   /**
-   * Open the column-config sidebar pre-seeded with the chosen scalar type.
-   * Nothing is persisted until the user fills in the name and hits Save.
+   * Start a draft of the chosen type with a generated name, focused for
+   * naming. Every type starts the same way; a select's options sidebar only
+   * opens once its name commits (see {@link handleDraftCommit}).
    */
   function handleAddColumnOfType(type: ColumnDefinition['type']) {
-    onOpenColumnConfig({ mode: 'create', proposedName: generateColumnName(), type })
+    if (columnDraftRef.current) return
+    setColumnDraft({ type, name: generateColumnName(), invalid: false })
   }
+  addColumnOfTypeSinkRef.current = handleAddColumnOfType
+
+  const handleDraftNameChange = useCallback((name: string) => {
+    setColumnDraft((draft) => (draft ? { ...draft, name, invalid: false } : draft))
+  }, [])
+
+  /**
+   * The draft's name if it can be saved; otherwise toasts why, paints the
+   * name red, and returns null. Checked here, before a request is built, so a
+   * bad name never surfaces as a raw contract error.
+   */
+  const acceptDraftName = useCallback((): string | null => {
+    const draft = columnDraftRef.current
+    if (!draft) return null
+    const trimmed = draft.name.trim()
+    const issue = trimmed
+      ? columnNameIssue(
+          trimmed,
+          schemaColumnsRef.current.map((c) => c.name)
+        )
+      : 'Column name is required'
+    if (issue) {
+      toast.error(issue)
+      setColumnDraft({ ...draft, invalid: true })
+      return null
+    }
+    return trimmed
+  }, [])
+
+  /** Persist the draft (plus any type metadata). Resolves whether it was created. */
+  const persistDraft = useCallback(
+    async (metadata: { options?: SelectOption[]; multiple?: boolean } = {}): Promise<boolean> => {
+      const draft = columnDraftRef.current
+      if (!draft || draftPersistingRef.current) return false
+      const name = acceptDraftName()
+      if (!name) return false
+      const position = schemaColumnsRef.current.length
+      const owner = viewLayoutKeyRef.current
+      draftPersistingRef.current = true
+      try {
+        const result = await addColumnMutation.mutateAsync({ name, type: draft.type, ...metadata })
+        const newId = result.data.columns.find((c) => c.name === name)?.id ?? name
+        pushUndoRef.current(
+          { type: 'create-column', columnName: name, columnId: newId, position },
+          owner
+        )
+        setColumnDraft(null)
+        return true
+      } catch (err) {
+        // The mutation hook already toasts non-validation failures; a
+        // server-side name rejection is ours to surface.
+        if (isValidationError(err)) {
+          toast.error(extractValidationIssues(err)[0]?.message ?? getErrorMessage(err))
+        }
+        setColumnDraft((current) => (current ? { ...current, invalid: true } : current))
+        return false
+      } finally {
+        draftPersistingRef.current = false
+      }
+    },
+    [acceptDraftName]
+  )
+
+  const handleDraftCommit = useCallback(() => {
+    const draft = columnDraftRef.current
+    if (!draft) return
+    // A select can't persist until it has options: committing its name opens
+    // the options sidebar (once), and Save there persists name + options. A
+    // later edit of the name only re-validates, so a bad one is flagged.
+    if (columnTypeById(draft.type).requiresConfigurationOnCreate) {
+      const name = acceptDraftName()
+      if (!name || draftSelectOpenRef.current) return
+      onOpenColumnConfig({ mode: 'draft-select' })
+      return
+    }
+    void persistDraft()
+  }, [acceptDraftName, persistDraft, onOpenColumnConfig])
+
+  const handleDraftCancel = useCallback(() => {
+    if (!columnDraftRef.current) return
+    setColumnDraft(null)
+    if (draftSelectOpenRef.current) onCloseColumnConfigRef.current()
+  }, [])
+
+  draftSelectSaveSinkRef.current = (options, multiple) =>
+    persistDraft({ options, ...(multiple ? { multiple: true } : {}) })
+  abortColumnDraftSinkRef.current = () => setColumnDraft(null)
+
+  /** Toggle the `unique` constraint on a plain column, recording the flip for undo. */
+  const handleToggleUnique = useCallback((columnKey: string) => {
+    const column = columnsRef.current.find((c) => c.key === columnKey)
+    if (!column) return
+    const previousValue = !!column.unique
+    pushUndoRef.current({
+      type: 'toggle-column-constraint',
+      columnName: columnKey,
+      constraint: 'unique',
+      previousValue,
+      newValue: !previousValue,
+    })
+    updateColumnMutation.mutate({ columnName: columnKey, updates: { unique: !previousValue } })
+  }, [])
 
   /** Open the workflow-config sidebar to spawn a brand-new workflow group. */
   function handleAddWorkflowColumn() {
     onOpenWorkflowConfig({ mode: 'create', kind: 'manual', proposedName: generateColumnName() })
   }
 
+  /**
+   * "Edit column" exists only for workflow-output columns, whose config
+   * surface is the workflow sidebar. Plain and enrichment columns edit name,
+   * type, and unique from the header and its menu — the callers gate on that,
+   * so the guard here is just belt-and-braces.
+   */
   const handleConfigureColumn = useCallback(
     (columnName: string) => {
       const column = columnsRef.current.find((c) => c.key === columnName)
       const group = column?.workflowGroupId
         ? workflowGroupById.get(column.workflowGroupId)
         : undefined
-      // Enrichment output columns behave like plain columns (rename / type /
-      // unique) — route them to the normal column editor, not the workflow
-      // "Configure output column" panel.
       if (column?.workflowGroupId && group?.type !== 'enrichment') {
         onOpenWorkflowConfig({ mode: 'edit-output', columnName })
-      } else {
-        onOpenColumnConfig({ mode: 'edit', columnName })
       }
     },
-    [onOpenColumnConfig, onOpenWorkflowConfig, workflowGroupById]
+    [onOpenWorkflowConfig, workflowGroupById]
+  )
+
+  /** Starts the inline header rename from the menu's "Rename column" item. */
+  const handleRenameColumn = useCallback(
+    (columnName: string) => {
+      const column = columnsRef.current.find((c) => c.key === columnName)
+      columnRename.startRename(columnName, column?.name ?? columnName)
+    },
+    [columnRename.startRename]
+  )
+
+  /**
+   * Converts a column's type from the menu's "Change type" submenu. Converting
+   * to select routes through the config sidebar instead — the option set has
+   * to be collected before the conversion can be applied.
+   */
+  const handleChangeType = useCallback(
+    (columnName: string, newType: ColumnDefinition['type']) => {
+      const column = columnsRef.current.find((c) => c.key === columnName)
+      if (!column || column.type === newType) return
+      if (columnTypeById(newType).requiresConfigurationOnCreate) {
+        onOpenColumnConfig({ mode: 'convert-select', columnName })
+        return
+      }
+      const previousType = column.type
+      // Recorded on success only: the server refuses a retype whose existing
+      // values can't convert (the hook toasts why), and an entry for a change
+      // that never landed would make undo "restore" the type it already has.
+      updateColumnMutation.mutate(
+        { columnName, updates: { type: newType } },
+        {
+          onSuccess: () => {
+            pushUndoRef.current({ type: 'update-column-type', columnName, previousType, newType })
+          },
+        }
+      )
+    },
+    [onOpenColumnConfig]
+  )
+
+  /** Opens the config sidebar for a select's options / a currency's code. */
+  const handleOpenConfigure = useCallback(
+    (columnName: string) => {
+      onOpenColumnConfig({ mode: 'configure', columnName })
+    },
+    [onOpenColumnConfig]
   )
 
   const handleConfigureWorkflowGroup = useCallback(
@@ -4638,6 +4904,7 @@ export function TableGrid({
                 columns={displayColumns}
                 columnWidths={columnWidths}
                 checkboxColWidth={checkboxColWidth}
+                draftColumnWidth={draftColumnWidth}
               />
               <thead ref={theadRef} className='sticky top-0 z-10'>
                 {isLoadingTable ? null : (
@@ -4791,9 +5058,10 @@ export function TableGrid({
                             renameValue={
                               columnRename.editingId === column.key ? columnRename.editValue : ''
                             }
-                            onRenameValueChange={columnRename.setEditValue}
-                            onRenameSubmit={columnRename.submitRename}
-                            onRenameCancel={columnRename.cancelRename}
+                            renameError={renameError && columnRename.editingId === column.key}
+                            onRenameValueChange={handleRenameValueChange}
+                            onRenameSubmit={handleRenameSubmit}
+                            onRenameCancel={handleRenameCancel}
                             onColumnSelect={handleColumnSelect}
                             // Required props here, and the menu is already
                             // suppressed for non-editors by `readOnly`.
@@ -4818,6 +5086,14 @@ export function TableGrid({
                             workflowGroups={tableWorkflowGroups}
                             sourceInfo={columnSourceInfo.get(column.key)}
                             onOpenConfig={handleConfigureColumn}
+                            onToggleUnique={
+                              userPermissions.canEdit ? handleToggleUnique : undefined
+                            }
+                            onRenameColumn={
+                              userPermissions.canEdit ? handleRenameColumn : undefined
+                            }
+                            onChangeType={userPermissions.canEdit ? handleChangeType : undefined}
+                            onConfigure={userPermissions.canEdit ? handleOpenConfigure : undefined}
                             onViewWorkflow={handleViewWorkflow}
                             onSortColumn={onSortColumn}
                             onClearSort={onClearSort}
@@ -4831,6 +5107,16 @@ export function TableGrid({
                           />
                         )
                       })}
+                      {columnDraft && (
+                        <DraftColumnHeader
+                          type={columnDraft.type}
+                          name={columnDraft.name}
+                          invalid={columnDraft.invalid}
+                          onNameChange={handleDraftNameChange}
+                          onCommit={handleDraftCommit}
+                          onCancel={handleDraftCancel}
+                        />
+                      )}
                       {userPermissions.canEdit && (
                         <NewColumnDropdown
                           trigger='inline-header'
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-primitives.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-primitives.tsx
index f05d7332524..70baf8e7575 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-primitives.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-primitives.tsx
@@ -10,10 +10,16 @@ export const TableColGroup = React.memo(function TableColGroup({
   columns,
   columnWidths,
   checkboxColWidth,
+  draftColumnWidth,
 }: {
   columns: DisplayColumn[]
   columnWidths: Record<string, number>
   checkboxColWidth: number
+  /** Width of the draft (being-named) column's cell, when one is mounted
+   *  between the real columns and the "+ New column" cell. The table is
+   *  `table-fixed` with an explicit width, so a cell without its own `<col>`
+   *  would take the add-column slot and collapse that cell instead. */
+  draftColumnWidth?: number
 }) {
   return (
     <colgroup>
@@ -21,6 +27,7 @@ export const TableColGroup = React.memo(function TableColGroup({
       {columns.map((col) => (
         <col key={col.key} style={{ width: columnWidths[col.key] ?? COL_WIDTH }} />
       ))}
+      {draftColumnWidth !== undefined && <col style={{ width: draftColumnWidth }} />}
       <col style={{ width: ADD_COL_WIDTH }} />
     </colgroup>
   )
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/utils.test.ts b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/utils.test.ts
index 80534939ca4..48dfd84f630 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/utils.test.ts
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/utils.test.ts
@@ -12,6 +12,7 @@ import {
   buildTableSelectionContext,
   canWriteRowsWithChip,
   chipRowCount,
+  columnNameIssue,
   drainTargetForChip,
   horizontalEdgeScrollVelocity,
   selectedColumnIds,
@@ -197,3 +198,23 @@ describe('drainTargetForChip', () => {
     expect(drainTargetForChip(0)).toBe(MAX_TABLE_SELECTION_ROWS)
   })
 })
+
+describe('columnNameIssue', () => {
+  it('accepts a pattern-safe, unused name', () => {
+    expect(columnNameIssue('email_address', ['name', 'status'])).toBeNull()
+  })
+
+  it('refuses spaces and leading digits, naming the rule', () => {
+    expect(columnNameIssue('New Text', [])).toMatch(/letter or underscore/)
+    expect(columnNameIssue('1st', [])).toMatch(/letter or underscore/)
+  })
+
+  it('refuses a name longer than the column-name limit', () => {
+    const long = 'a'.repeat(TABLE_LIMITS.MAX_COLUMN_NAME_LENGTH + 1)
+    expect(columnNameIssue(long, [])).toMatch(/characters or less/)
+  })
+
+  it('refuses a name already taken, case-insensitively, quoting the existing one', () => {
+    expect(columnNameIssue('EMAIL', ['email'])).toBe('A column named "email" already exists')
+  })
+})
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/utils.ts b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/utils.ts
index 4f3e9282d17..b976b6705fa 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/utils.ts
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/utils.ts
@@ -12,7 +12,7 @@ import type {
   WorkflowGroup,
 } from '@/lib/table'
 import { getColumnId } from '@/lib/table/column-keys'
-import { TABLE_LIMITS } from '@/lib/table/constants'
+import { NAME_PATTERN, TABLE_LIMITS } from '@/lib/table/constants'
 import { areGroupDepsSatisfied, areOutputsFilled } from '@/lib/table/deps'
 import type { ChatContext } from '@/stores/panel'
 import type { DeletedRowSnapshot } from '@/stores/table/types'
@@ -486,3 +486,27 @@ export function canWriteRowsWithChip(opts: {
   if (!opts.hasContext || !opts.complete) return false
   return opts.rowCount > 0 && opts.rowCount <= TABLE_LIMITS.MAX_COPY_ROWS
 }
+
+/**
+ * Why a proposed column name can't be saved, phrased for a toast, or `null`
+ * when it can. Mirrors the contract's `columnNameSchema` (length and
+ * `NAME_PATTERN`) plus the server's case-insensitive uniqueness check, so the
+ * header input can refuse a name in place instead of surfacing a raw
+ * `ZodError` after the request has already been built.
+ *
+ * @param takenNames - Names of the other columns in the table (the column
+ * being renamed must be excluded by the caller).
+ */
+export function columnNameIssue(name: string, takenNames: Iterable<string>): string | null {
+  if (name.length > TABLE_LIMITS.MAX_COLUMN_NAME_LENGTH) {
+    return `Column names must be ${TABLE_LIMITS.MAX_COLUMN_NAME_LENGTH} characters or less`
+  }
+  if (!NAME_PATTERN.test(name)) {
+    return 'Column names must start with a letter or underscore and use only letters, numbers, and underscores'
+  }
+  const lower = name.toLowerCase()
+  for (const taken of takenNames) {
+    if (taken.toLowerCase() === lower) return `A column named "${taken}" already exists`
+  }
+  return null
+}
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/table.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/table.tsx
index df6ef1ce369..4a087c7e71b 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/table.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/table.tsx
@@ -14,6 +14,7 @@ import { captureEvent } from '@/lib/posthog/client'
 import type {
   ColumnDefinition,
   Predicate,
+  SelectOption,
   SortDirection,
   SortSpec,
   TableMetadata,
@@ -229,7 +230,21 @@ export function Table({
   // for free — matching the panel's own-chrome layout.
   const { otherUsers: presenceUsers, remoteSelections, emitCellSelection } = useTableRoom(tableId)
 
-  const [slideout, dispatch] = useReducer(slideoutReducer, { kind: 'none' })
+  const [slideout, dispatchSlideout] = useReducer(slideoutReducer, { kind: 'none' })
+  /**
+   * Sink the grid populates with its column-draft discard. A select draft
+   * exists only while its options sidebar is open, so every slideout
+   * transition other than entering `draft-select` (Cancel, X, another panel)
+   * drops it — in the same batch as the transition, from the handler that
+   * causes it. Idempotent: after a successful save the draft is already gone.
+   */
+  const abortColumnDraftSinkRef = useRef<(() => void) | null>(null)
+  const dispatch = useCallback((action: SlideoutAction) => {
+    dispatchSlideout(action)
+    if (action.type !== 'OPEN_COLUMN' || action.config.mode !== 'draft-select') {
+      abortColumnDraftSinkRef.current?.()
+    }
+  }, [])
   const [showDeleteTableConfirm, setShowDeleteTableConfirm] = useState(false)
   const [showLockSettings, setShowLockSettings] = useState(false)
   // Id of the last blocked-action toast, so a user who keeps typing into a
@@ -335,6 +350,28 @@ export function Table({
     columnRenameSinkRef.current?.(oldName, newName)
   }
 
+  /**
+   * Sink populated by the grid: starts a header draft of the given type,
+   * focused for naming. Lets the page-header "+ New column" dropdown share
+   * the in-grid trigger's create path.
+   */
+  const addColumnOfTypeSinkRef = useRef<((type: ColumnDefinition['type']) => void) | null>(null)
+
+  /**
+   * Sink for the select-draft handshake with the grid, which owns the draft
+   * column: Save in the `draft-select` sidebar persists it through here, and
+   * the slideout leaving `draft-select` discards it through
+   * `abortColumnDraftSinkRef` (see `dispatch`).
+   */
+  const draftSelectSaveSinkRef = useRef<
+    ((options: SelectOption[], multiple: boolean) => Promise<boolean>) | null
+  >(null)
+  const onDraftSelectSave = async (options: SelectOption[], multiple: boolean) => {
+    const created = (await draftSelectSaveSinkRef.current?.(options, multiple)) ?? false
+    if (created) dispatch({ type: 'CLOSE' })
+    return created
+  }
+
   /**
    * Sink the grid populates with its post-row-delete cleanup (push undo,
    * clear selection). The wrapper invokes after the row-delete modal's
@@ -1105,7 +1142,7 @@ export function Table({
   }, [tableHeaderRename.startRename, tableId])
 
   const handleAddColumnOfType = (type: ColumnDefinition['type']) => {
-    onOpenColumnConfig({ mode: 'create', proposedName: generateColumnName(columns), type })
+    addColumnOfTypeSinkRef.current?.(type)
   }
 
   const handleAddWorkflowColumn = () => {
@@ -1575,6 +1612,8 @@ export function Table({
         remoteSelections={remoteSelections}
         emitCellSelection={emitCellSelection}
         onOpenColumnConfig={onOpenColumnConfig}
+        onCloseColumnConfig={onCloseSlideout}
+        draftSelectOpen={columnConfig?.mode === 'draft-select'}
         onOpenWorkflowConfig={onOpenWorkflowConfig}
         onOpenEnrichments={onOpenEnrichments}
         onOpenEnrichmentConfig={onOpenEnrichmentConfig}
@@ -1603,6 +1642,9 @@ export function Table({
         // write to the wrong place between settle and adoption.
         onPersistLayout={viewsEnabled ? handlePersistLayout : undefined}
         columnRenameSinkRef={columnRenameSinkRef}
+        addColumnOfTypeSinkRef={addColumnOfTypeSinkRef}
+        draftSelectSaveSinkRef={draftSelectSaveSinkRef}
+        abortColumnDraftSinkRef={abortColumnDraftSinkRef}
         layoutSnapshotSinkRef={layoutSnapshotRef}
         afterDeleteRowsSinkRef={afterDeleteRowsSinkRef}
         afterDeleteAllSinkRef={afterDeleteAllSinkRef}
@@ -1675,14 +1717,14 @@ export function Table({
       <ColumnConfigSidebar
         config={columnConfig}
         onClose={onCloseSlideout}
+        onDraftSave={onDraftSelectSave}
         existingColumn={
-          columnConfig?.mode === 'edit'
+          columnConfig && columnConfig.mode !== 'draft-select'
             ? (columns.find((c) => getColumnId(c) === columnConfig.columnName) ?? null)
             : null
         }
         workspaceId={workspaceId}
         tableId={tableId}
-        onColumnRename={onColumnRename}
       />
       <EnrichmentsSidebar
         open={slideout.kind === 'enrichments'}
diff --git a/apps/sim/hooks/queries/tables.ts b/apps/sim/hooks/queries/tables.ts
index 6ee390af926..5ca4732dd57 100644
--- a/apps/sim/hooks/queries/tables.ts
+++ b/apps/sim/hooks/queries/tables.ts
@@ -622,12 +622,25 @@ export function useAddTableColumn({ workspaceId, tableId }: RowMutationContext)
   const queryClient = useQueryClient()
 
   return useMutation({
+    mutationKey: tableKeys.columnWrites(tableId),
     mutationFn: async (column: CreateTableColumnBodyInput['column']) => {
       return requestJson(addTableColumnContract, {
         params: { tableId },
         body: { workspaceId, column },
       })
     },
+    onSuccess: (result) => {
+      // The response carries the full post-insert schema; write it straight
+      // into the detail cache so the new column renders in the same commit the
+      // caller reacts in. Waiting for the settle-time refetch leaves a gap in
+      // which a header draft has already unmounted but the column it became
+      // has not arrived — the grid visibly loses and regains the column.
+      queryClient.setQueryData<TableDefinition>(tableKeys.detail(tableId), (previous) =>
+        previous
+          ? { ...previous, schema: { ...previous.schema, columns: result.data.columns } }
+          : previous
+      )
+    },
     onError: (error) => {
       if (handleTableLockRejection(error, queryClient, tableId)) return
       if (isValidationError(error)) return
diff --git a/apps/sim/hooks/queries/utils/table-keys.ts b/apps/sim/hooks/queries/utils/table-keys.ts
index 5ccf7f34457..5d4c39d2e6e 100644
--- a/apps/sim/hooks/queries/utils/table-keys.ts
+++ b/apps/sim/hooks/queries/utils/table-keys.ts
@@ -34,6 +34,8 @@ export const tableKeys = {
   infiniteRows: (tableId: string, paramsKey: string) =>
     [...tableKeys.infiniteRowsRoot(tableId), paramsKey] as const,
   rowWrites: (tableId: string) => [...tableKeys.rowsRoot(tableId), 'write'] as const,
+  /** Mutation key for column creates, so a surface that does not own the mutation can read its pending state. */
+  columnWrites: (tableId: string) => [...tableKeys.detail(tableId), 'column-write'] as const,
   /** Bounded single-page row read for chart files (`.chart` previews). */
   sample: (tableId: string, paramsKey: string) =>
     [...tableKeys.rowsRoot(tableId), 'sample', paramsKey] as const,
diff --git a/apps/sim/lib/table/__tests__/column-type-registry.test.ts b/apps/sim/lib/table/__tests__/column-type-registry.test.ts
index 91ec369e31e..881ab8c79bf 100644
--- a/apps/sim/lib/table/__tests__/column-type-registry.test.ts
+++ b/apps/sim/lib/table/__tests__/column-type-registry.test.ts
@@ -259,3 +259,66 @@ describe('salvage — the machine-path reading', () => {
     expect(COLUMN_TYPE_REGISTRY.select.salvage?.('ghost', column)).toEqual({ ok: false })
   })
 })
+
+describe('formatters are total', () => {
+  // The grid renders through `formatForDisplay` / `formatForInput` with
+  // whatever a cell currently holds — and during a retype the optimistic
+  // schema update flips the column's type one render before the server has
+  // converted (or refused) the values, so every formatter sees every other
+  // type's values. One that throws takes the whole table route down.
+  const foreign: unknown[] = [
+    100,
+    12.5,
+    1999.99,
+    0,
+    -3,
+    1e21,
+    '100',
+    '12.50',
+    '$1,234.56',
+    'hello',
+    'true',
+    true,
+    false,
+    '2024-01-01',
+    '2024-01-01T10:00:00Z',
+    '2024-01-01T10:00:00+02:00',
+    'Jan 5 2024',
+    '1700000000000',
+    '[]',
+    [],
+    {},
+    ['a'],
+    { a: 1 },
+    null,
+    undefined,
+    '',
+    ' ',
+    'opt_x',
+    'NaN',
+  ]
+
+  for (const definition of ALL_COLUMN_TYPES) {
+    it(`${definition.id} never throws on a foreign value`, () => {
+      const column = {
+        id: 'c',
+        name: 'c',
+        type: definition.id,
+        options: [{ id: 'opt_x', name: 'X' }],
+      } as ColumnDefinition
+      for (const value of foreign) {
+        expect(() => definition.formatForDisplay(value, column)).not.toThrow()
+        expect(() => definition.formatForInput(value, column)).not.toThrow()
+      }
+    })
+  }
+
+  it('renders a number retyped to date verbatim instead of recursing', () => {
+    // `100` parses as year 100 and normalizes to a three-digit-year string
+    // that matches no canonical shape — the input that used to recurse
+    // until the stack overflowed.
+    const column: ColumnDefinition = { name: 'd', type: 'date' }
+    expect(COLUMN_TYPE_REGISTRY.date.formatForDisplay(100, column)).toBe('100')
+    expect(COLUMN_TYPE_REGISTRY.date.formatForDisplay('2024-01-05', column)).toBe('01/05/2024')
+  })
+})
diff --git a/apps/sim/lib/table/column-types/currency.ts b/apps/sim/lib/table/column-types/currency.ts
index 86485a265d3..124864c53b8 100644
--- a/apps/sim/lib/table/column-types/currency.ts
+++ b/apps/sim/lib/table/column-types/currency.ts
@@ -15,6 +15,7 @@ export const currencyColumnType: ColumnTypeDefinition = {
   jsonbCast: 'numeric',
   storesOpaqueIds: false,
   supportsUnique: true,
+  hasConfiguration: true,
   sampleValue: 123,
   ownedMetadata: ['currencyCode'],
   workflowInputType: 'number',
diff --git a/apps/sim/lib/table/column-types/select.ts b/apps/sim/lib/table/column-types/select.ts
index c282d681638..d94493dd9d6 100644
--- a/apps/sim/lib/table/column-types/select.ts
+++ b/apps/sim/lib/table/column-types/select.ts
@@ -39,6 +39,8 @@ export const selectColumnType: ColumnTypeDefinition = {
   jsonbCast: null,
   storesOpaqueIds: true,
   supportsUnique: false,
+  requiresConfigurationOnCreate: true,
+  hasConfiguration: true,
   sampleValue: 'Option',
   ownedMetadata: ['options', 'multiple'],
   workflowInputType: 'string',
diff --git a/apps/sim/lib/table/column-types/types.ts b/apps/sim/lib/table/column-types/types.ts
index f481cea0a28..3844f639c68 100644
--- a/apps/sim/lib/table/column-types/types.ts
+++ b/apps/sim/lib/table/column-types/types.ts
@@ -103,6 +103,21 @@ export interface ColumnTypeDefinition {
    */
   readonly supportsUnique: boolean
 
+  /**
+   * Whether a column of this type needs configuration before it can exist (a
+   * `select` is invalid without options). The create flow keeps such a column
+   * as a local draft, opens the config sidebar once its name is committed, and
+   * persists name and configuration in one create when that sidebar saves.
+   */
+  readonly requiresConfigurationOnCreate?: boolean
+
+  /**
+   * Whether the type has per-column configuration (a `select`'s options, a
+   * `currency`'s display code) edited in the column config sidebar. Drives the
+   * header menu's "Configure …" item.
+   */
+  readonly hasConfiguration?: boolean
+
   /**
    * A representative value, used to show an LLM what this column's cells look
    * like. Keeps prompt examples from restating per-type knowledge.
diff --git a/apps/sim/lib/table/dates.ts b/apps/sim/lib/table/dates.ts
index a38eca7f21e..9a0bd04d8c8 100644
--- a/apps/sim/lib/table/dates.ts
+++ b/apps/sim/lib/table/dates.ts
@@ -285,11 +285,30 @@ function formatWallForDisplay(
  * viewer, no timezone conversion. Legacy strings that predate
  * canonicalization render via a runtime-local normalization; unparseable
  * ones are returned as-is.
+ *
+ * Total by construction: the normalization is attempted exactly once, and a
+ * canonical form that still matches no shape renders verbatim. Recursing on
+ * the canonical form instead looped forever on inputs like `100` — which
+ * parses as year 100 and normalizes to a three-digit-year string that matches
+ * nothing and normalizes to itself — taking the whole table route down with a
+ * stack overflow the moment a number column was retyped to date.
  */
 export function formatDateCellDisplay(
   stored: string,
   options?: FormatDateCellDisplayOptions
 ): string {
+  const direct = formatCanonicalDateCell(stored, options)
+  if (direct !== null) return direct
+  const canonical = normalizeDateCellValue(stored)
+  if (!canonical) return stored
+  return formatCanonicalDateCell(canonical, options) ?? stored
+}
+
+/** Renders a value already in one of the canonical stored shapes, or `null` when it is not. */
+function formatCanonicalDateCell(
+  stored: string,
+  options?: FormatDateCellDisplayOptions
+): string | null {
   const calendar = stored.match(/^(\d{4})-(\d{2})-(\d{2})$/)
   if (calendar) return `${calendar[2]}/${calendar[3]}/${calendar[1]}`
   if (UTC_MIDNIGHT_PATTERN.test(stored)) {
@@ -309,7 +328,5 @@ export function formatDateCellDisplay(
       options?.seconds
     )
   }
-  const canonical = normalizeDateCellValue(stored)
-  if (!canonical) return stored
-  return formatDateCellDisplay(canonical, options)
+  return null
 }

From 6ece7360bd32d528b33befa7182323bfde40603f Mon Sep 17 00:00:00 2001
From: Justin Blumencranz <96924014+j15z@users.noreply.github.com>
Date: Mon, 24 Aug 2026 14:32:43 -0700
Subject: [PATCH 2/2] fix(tables): preserve column actions across undo

---
 .../column-config-sidebar.tsx                 | 27 +++++-
 .../table-grid/headers/column-header-menu.tsx |  1 -
 .../headers/draft-column-header.tsx           |  4 +-
 .../headers/workflow-group-meta-cell.tsx      |  1 -
 .../components/table-grid/table-grid.tsx      | 96 ++++++++++++-------
 .../[workspaceId]/tables/[tableId]/table.tsx  | 29 +++++-
 apps/sim/hooks/queries/tables.ts              |  2 +-
 apps/sim/hooks/use-table-undo.test.ts         | 82 ++++++++++++++++
 apps/sim/hooks/use-table-undo.ts              | 26 +++--
 apps/sim/lib/table/dates.ts                   |  1 -
 apps/sim/stores/table/types.ts                |  8 +-
 11 files changed, 217 insertions(+), 60 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-config-sidebar.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-config-sidebar.tsx
index b715a8a5ba6..3ce3768cd13 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-config-sidebar.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/column-config-sidebar/column-config-sidebar.tsx
@@ -7,6 +7,7 @@ import { toError } from '@sim/utils/errors'
 import { useIsMutating } from '@tanstack/react-query'
 import { isValidationError } from '@/lib/api/client/errors'
 import type { ColumnDefinition, SelectOption } from '@/lib/table'
+import { getColumnId } from '@/lib/table/column-keys'
 import { getCurrencyOptions, resolveCurrencyCode } from '@/lib/table/currency'
 import {
   FieldError,
@@ -63,6 +64,11 @@ interface ColumnConfigSidebarProps {
    * or the create failed, and the owner has already surfaced why.
    */
   onDraftSave: (options: SelectOption[], multiple: boolean) => Promise<boolean>
+  onColumnTypeChange: (
+    columnName: string,
+    previousColumn: ColumnDefinition,
+    newColumn: ColumnDefinition
+  ) => void
   /** Existing column record for modes that carry a `columnName`; otherwise null. */
   existingColumn: ColumnDefinition | null
   workspaceId: string
@@ -108,6 +114,7 @@ function ColumnConfigBody({
   config,
   onClose,
   onDraftSave,
+  onColumnTypeChange,
   existingColumn,
   workspaceId,
   tableId,
@@ -115,8 +122,6 @@ function ColumnConfigBody({
   const updateColumn = useUpdateColumn({ workspaceId, tableId })
   const draftSaving = useIsMutating({ mutationKey: tableKeys.columnWrites(tableId) }) > 0
 
-  // draft-select and convert-select always edit an option set; configure
-  // shows whichever configuration the column's type carries.
   const isSelectTarget = config.mode !== 'configure' || existingColumn?.type === 'select'
   const isCurrencyTarget = config.mode === 'configure' && existingColumn?.type === 'currency'
 
@@ -148,7 +153,6 @@ function ColumnConfigBody({
       setOptionsError(optionsIssue)
       return
     }
-
     if (config.mode === 'draft-select') {
       // The draft's owner persists name + options together and reports back;
       // the parent closes the sidebar on success, so nothing to do here.
@@ -160,7 +164,7 @@ function ColumnConfigBody({
 
     try {
       if (config.mode === 'convert-select') {
-        await updateColumn.mutateAsync({
+        const result = await updateColumn.mutateAsync({
           columnName: config.columnName,
           updates: {
             type: 'select',
@@ -172,6 +176,18 @@ function ColumnConfigBody({
             ...(existingColumn?.unique ? { unique: false } : {}),
           },
         })
+        if (existingColumn) {
+          const updatedColumn = result.data.columns.find(
+            (candidate) => getColumnId(candidate) === config.columnName
+          ) ?? {
+            ...existingColumn,
+            type: 'select',
+            options: trimmedOptions,
+            unique: false,
+            ...(multipleInput ? { multiple: true } : {}),
+          }
+          onColumnTypeChange(config.columnName, existingColumn, updatedColumn)
+        }
         toast.success(`Saved "${columnLabel}"`)
         onClose()
         return
@@ -220,6 +236,7 @@ function ColumnConfigBody({
           variant='ghost'
           size='sm'
           onClick={onClose}
+          disabled={saveDisabled}
           className='!p-1 size-7'
           aria-label='Close'
         >
@@ -270,7 +287,7 @@ function ColumnConfigBody({
       </div>
 
       <div className='flex items-center justify-end gap-2 border-[var(--border)] border-t px-2 py-3'>
-        <Button variant='default' size='sm' onClick={onClose}>
+        <Button variant='default' size='sm' onClick={onClose} disabled={saveDisabled}>
           Cancel
         </Button>
         <Button variant='primary' size='sm' onClick={handleSave} disabled={saveDisabled}>
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-header-menu.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-header-menu.tsx
index 694a96252cc..ca2e38d8421 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-header-menu.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-header-menu.tsx
@@ -19,7 +19,6 @@ interface ColumnHeaderMenuProps {
   isRenaming: boolean
   isColumnSelected: boolean
   renameValue: string
-  /** True after a refused rename — paints the name red until it's edited. */
   renameError?: boolean
   onRenameValueChange: (value: string) => void
   onRenameSubmit: () => void
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/draft-column-header.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/draft-column-header.tsx
index 709358a1133..aca3c24fca5 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/draft-column-header.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/draft-column-header.tsx
@@ -3,7 +3,7 @@
 import React, { useEffect, useRef } from 'react'
 import { cn } from '@sim/emcn'
 import type { ColumnDefinition } from '@/lib/table'
-import { ColumnTypeIcon } from './column-type-icon'
+import { ColumnTypeIcon } from '@/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/column-type-icon'
 
 interface DraftColumnHeaderProps {
   type: ColumnDefinition['type']
@@ -11,9 +11,7 @@ interface DraftColumnHeaderProps {
   /** True after a refused commit — paints the name red until it's edited. */
   invalid: boolean
   onNameChange: (name: string) => void
-  /** Enter or blur. The grid decides whether this persists the column. */
   onCommit: () => void
-  /** Escape. Discards the draft — nothing was ever persisted. */
   onCancel: () => void
 }
 
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/workflow-group-meta-cell.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/workflow-group-meta-cell.tsx
index cbea335dd5d..b103b5d210d 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/workflow-group-meta-cell.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/headers/workflow-group-meta-cell.tsx
@@ -77,7 +77,6 @@ interface ColumnOptionsMenuProps {
    *  config surface behind it (the workflow sidebar); plain columns edit
    *  name/type/unique from this menu directly and omit it. */
   onOpenConfig?: (columnName: string) => void
-  /** Starts the inline header rename. Plain and enrichment columns only. */
   onRenameColumn?: (columnName: string) => void
   /** Converts the column to `type`. Callers route `select` conversions through
    *  the config sidebar (the option set must be collected first). */
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-grid.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-grid.tsx
index 9822cde8153..922a8a15310 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-grid.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-grid/table-grid.tsx
@@ -309,6 +309,14 @@ interface TableGridProps {
   draftSelectSaveSinkRef: React.MutableRefObject<
     ((options: SelectOption[], multiple: boolean) => Promise<boolean>) | null
   >
+  /**
+   * Ref the grid populates with the sidebar's successful type-conversion undo
+   * recorder, keeping the undo stack owned by the grid.
+   */
+  recordColumnTypeChangeSinkRef: React.MutableRefObject<
+    | ((columnName: string, previousColumn: ColumnDefinition, newColumn: ColumnDefinition) => void)
+    | null
+  >
   /**
    * Ref the grid populates with its draft discard. The wrapper fires it from
    * every slideout transition other than entering `draft-select`, so
@@ -501,6 +509,7 @@ export function TableGrid({
   columnRenameSinkRef,
   addColumnOfTypeSinkRef,
   draftSelectSaveSinkRef,
+  recordColumnTypeChangeSinkRef,
   abortColumnDraftSinkRef,
   layoutSnapshotSinkRef,
   afterDeleteRowsSinkRef,
@@ -1540,7 +1549,6 @@ export function TableGrid({
   const handleFindCloseRef = useRef(handleFindClose)
   handleFindCloseRef.current = handleFindClose
 
-  /** True after a refused rename — paints the header input red until it's edited. */
   const [renameError, setRenameError] = useState(false)
 
   const columnRename = useInlineRename({
@@ -3946,9 +3954,13 @@ export function TableGrid({
         { name, type: 'string', position: index },
         {
           onSuccess: (result) => {
-            const newId = result.data.columns.find((c) => c.name === name)?.id ?? name
+            const createdColumn = result.data.columns.find((c) => c.name === name) ?? {
+              name,
+              type: 'string' as const,
+            }
+            const newId = getColumnId(createdColumn)
             pushUndoRef.current(
-              { type: 'create-column', columnName: name, columnId: newId, position: index },
+              { type: 'create-column', column: createdColumn, position: index },
               owner
             )
             // Skipped after a mid-flight view switch: the destination re-seeded
@@ -3973,11 +3985,12 @@ export function TableGrid({
         { name, type: 'string', position },
         {
           onSuccess: (result) => {
-            const newId = result.data.columns.find((c) => c.name === name)?.id ?? name
-            pushUndoRef.current(
-              { type: 'create-column', columnName: name, columnId: newId, position },
-              owner
-            )
+            const createdColumn = result.data.columns.find((c) => c.name === name) ?? {
+              name,
+              type: 'string' as const,
+            }
+            const newId = getColumnId(createdColumn)
+            pushUndoRef.current({ type: 'create-column', column: createdColumn, position }, owner)
             if (owner === viewLayoutKeyRef.current) insertColumnInOrder(columnId, newId, 'right')
           },
         }
@@ -4042,11 +4055,12 @@ export function TableGrid({
       draftPersistingRef.current = true
       try {
         const result = await addColumnMutation.mutateAsync({ name, type: draft.type, ...metadata })
-        const newId = result.data.columns.find((c) => c.name === name)?.id ?? name
-        pushUndoRef.current(
-          { type: 'create-column', columnName: name, columnId: newId, position },
-          owner
-        )
+        const createdColumn = result.data.columns.find((c) => c.name === name) ?? {
+          name,
+          type: draft.type,
+          ...metadata,
+        }
+        pushUndoRef.current({ type: 'create-column', column: createdColumn, position }, owner)
         setColumnDraft(null)
         return true
       } catch (err) {
@@ -4089,19 +4103,25 @@ export function TableGrid({
     persistDraft({ options, ...(multiple ? { multiple: true } : {}) })
   abortColumnDraftSinkRef.current = () => setColumnDraft(null)
 
-  /** Toggle the `unique` constraint on a plain column, recording the flip for undo. */
+  /** Toggle the `unique` constraint on a plain column, recording successful flips for undo. */
   const handleToggleUnique = useCallback((columnKey: string) => {
     const column = columnsRef.current.find((c) => c.key === columnKey)
     if (!column) return
     const previousValue = !!column.unique
-    pushUndoRef.current({
-      type: 'toggle-column-constraint',
-      columnName: columnKey,
-      constraint: 'unique',
-      previousValue,
-      newValue: !previousValue,
-    })
-    updateColumnMutation.mutate({ columnName: columnKey, updates: { unique: !previousValue } })
+    updateColumnMutation.mutate(
+      { columnName: columnKey, updates: { unique: !previousValue } },
+      {
+        onSuccess: () => {
+          pushUndoRef.current({
+            type: 'toggle-column-constraint',
+            columnName: columnKey,
+            constraint: 'unique',
+            previousValue,
+            newValue: !previousValue,
+          })
+        },
+      }
+    )
   }, [])
 
   /** Open the workflow-config sidebar to spawn a brand-new workflow group. */
@@ -4128,7 +4148,6 @@ export function TableGrid({
     [onOpenWorkflowConfig, workflowGroupById]
   )
 
-  /** Starts the inline header rename from the menu's "Rename column" item. */
   const handleRenameColumn = useCallback(
     (columnName: string) => {
       const column = columnsRef.current.find((c) => c.key === columnName)
@@ -4150,15 +4169,25 @@ export function TableGrid({
         onOpenColumnConfig({ mode: 'convert-select', columnName })
         return
       }
-      const previousType = column.type
       // Recorded on success only: the server refuses a retype whose existing
       // values can't convert (the hook toasts why), and an entry for a change
       // that never landed would make undo "restore" the type it already has.
       updateColumnMutation.mutate(
         { columnName, updates: { type: newType } },
         {
-          onSuccess: () => {
-            pushUndoRef.current({ type: 'update-column-type', columnName, previousType, newType })
+          onSuccess: (result) => {
+            const updatedColumn = result.data.columns.find(
+              (candidate) => getColumnId(candidate) === columnName
+            ) ?? {
+              ...column,
+              type: newType,
+            }
+            pushUndoRef.current({
+              type: 'update-column-type',
+              columnName,
+              previousColumn: column,
+              newColumn: updatedColumn,
+            })
           },
         }
       )
@@ -4166,6 +4195,15 @@ export function TableGrid({
     [onOpenColumnConfig]
   )
 
+  recordColumnTypeChangeSinkRef.current = (columnName, previousColumn, newColumn) => {
+    pushUndoRef.current({
+      type: 'update-column-type',
+      columnName,
+      previousColumn,
+      newColumn,
+    })
+  }
+
   /** Opens the config sidebar for a select's options / a currency's code. */
   const handleOpenConfigure = useCallback(
     (columnName: string) => {
@@ -4192,12 +4230,6 @@ export function TableGrid({
     deleteWorkflowGroupRef.current({ groupId })
   }, [])
 
-  /**
-   * Computes the names slated for deletion given a click on `columnName` and
-   * the current column selection. If the click landed inside a multi-column
-   * selection, the entire selection is the target; otherwise it's just the
-   * clicked column.
-   */
   const resolveDeletionNames = useCallback((columnName: string): string[] => {
     const cols = columnsRef.current
     if (isColumnSelectionRef.current && selectionAnchorRef.current) {
diff --git a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/table.tsx b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/table.tsx
index 4a087c7e71b..f2e361333a8 100644
--- a/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/table.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/tables/[tableId]/table.tsx
@@ -231,6 +231,7 @@ export function Table({
   const { otherUsers: presenceUsers, remoteSelections, emitCellSelection } = useTableRoom(tableId)
 
   const [slideout, dispatchSlideout] = useReducer(slideoutReducer, { kind: 'none' })
+  const draftSelectSavingRef = useRef(false)
   /**
    * Sink the grid populates with its column-draft discard. A select draft
    * exists only while its options sidebar is open, so every slideout
@@ -240,6 +241,7 @@ export function Table({
    */
   const abortColumnDraftSinkRef = useRef<(() => void) | null>(null)
   const dispatch = useCallback((action: SlideoutAction) => {
+    if (draftSelectSavingRef.current) return
     dispatchSlideout(action)
     if (action.type !== 'OPEN_COLUMN' || action.config.mode !== 'draft-select') {
       abortColumnDraftSinkRef.current?.()
@@ -367,9 +369,28 @@ export function Table({
     ((options: SelectOption[], multiple: boolean) => Promise<boolean>) | null
   >(null)
   const onDraftSelectSave = async (options: SelectOption[], multiple: boolean) => {
-    const created = (await draftSelectSaveSinkRef.current?.(options, multiple)) ?? false
-    if (created) dispatch({ type: 'CLOSE' })
-    return created
+    if (draftSelectSavingRef.current) return false
+    draftSelectSavingRef.current = true
+    let created = false
+    try {
+      created = (await draftSelectSaveSinkRef.current?.(options, multiple)) ?? false
+      return created
+    } finally {
+      draftSelectSavingRef.current = false
+      if (created) dispatch({ type: 'CLOSE' })
+    }
+  }
+
+  const recordColumnTypeChangeSinkRef = useRef<
+    | ((columnName: string, previousColumn: ColumnDefinition, newColumn: ColumnDefinition) => void)
+    | null
+  >(null)
+  const onColumnTypeChange = (
+    columnName: string,
+    previousColumn: ColumnDefinition,
+    newColumn: ColumnDefinition
+  ) => {
+    recordColumnTypeChangeSinkRef.current?.(columnName, previousColumn, newColumn)
   }
 
   /**
@@ -1644,6 +1665,7 @@ export function Table({
         columnRenameSinkRef={columnRenameSinkRef}
         addColumnOfTypeSinkRef={addColumnOfTypeSinkRef}
         draftSelectSaveSinkRef={draftSelectSaveSinkRef}
+        recordColumnTypeChangeSinkRef={recordColumnTypeChangeSinkRef}
         abortColumnDraftSinkRef={abortColumnDraftSinkRef}
         layoutSnapshotSinkRef={layoutSnapshotRef}
         afterDeleteRowsSinkRef={afterDeleteRowsSinkRef}
@@ -1718,6 +1740,7 @@ export function Table({
         config={columnConfig}
         onClose={onCloseSlideout}
         onDraftSave={onDraftSelectSave}
+        onColumnTypeChange={onColumnTypeChange}
         existingColumn={
           columnConfig && columnConfig.mode !== 'draft-select'
             ? (columns.find((c) => getColumnId(c) === columnConfig.columnName) ?? null)
diff --git a/apps/sim/hooks/queries/tables.ts b/apps/sim/hooks/queries/tables.ts
index 5ca4732dd57..544f8265150 100644
--- a/apps/sim/hooks/queries/tables.ts
+++ b/apps/sim/hooks/queries/tables.ts
@@ -647,7 +647,7 @@ export function useAddTableColumn({ workspaceId, tableId }: RowMutationContext)
       toast.error(error.message, { duration: 5000 })
     },
     onSettled: () => {
-      invalidateTableSchemaOnly(queryClient, tableId)
+      queryClient.invalidateQueries({ queryKey: tableKeys.lists() })
     },
   })
 }
diff --git a/apps/sim/hooks/use-table-undo.test.ts b/apps/sim/hooks/use-table-undo.test.ts
index 0456f76c087..d9dd426ccba 100644
--- a/apps/sim/hooks/use-table-undo.test.ts
+++ b/apps/sim/hooks/use-table-undo.test.ts
@@ -272,3 +272,85 @@ describe('useTableUndo – restoring a deleted select column', () => {
     expect(payload.id).toBe('col_status')
   })
 })
+
+describe('useTableUndo – typed column replay', () => {
+  it('recreates a typed column with its type metadata on redo', async () => {
+    mockPopRedo.mockReturnValueOnce(
+      makeEntry({
+        type: 'create-column',
+        column: {
+          id: 'col_status',
+          name: 'status',
+          type: 'select',
+          options: [{ id: 'opt_open', name: 'Open' }],
+          multiple: true,
+        },
+        position: 2,
+      })
+    )
+
+    const { redo } = TestHook()
+    ;(redo as () => void)()
+    await flush()
+
+    expect(mockMutate.mock.calls[0][0]).toEqual({
+      id: 'col_status',
+      name: 'status',
+      type: 'select',
+      options: [{ id: 'opt_open', name: 'Open' }],
+      multiple: true,
+      position: 2,
+    })
+  })
+
+  const typeChangeAction: TableUndoAction = {
+    type: 'update-column-type',
+    columnName: 'col_value',
+    previousColumn: {
+      id: 'col_value',
+      name: 'value',
+      type: 'currency',
+      unique: true,
+      currencyCode: 'EUR',
+    },
+    newColumn: {
+      id: 'col_value',
+      name: 'value',
+      type: 'select',
+      unique: false,
+      options: [{ id: 'opt_high', name: 'High' }],
+      multiple: true,
+    },
+  }
+
+  it('restores the previous type, constraints, and metadata on undo', async () => {
+    mockPopUndo.mockReturnValueOnce(makeEntry(typeChangeAction))
+
+    const { undo } = TestHook()
+    ;(undo as () => void)()
+    await flush()
+
+    expect(mockMutate.mock.calls[0][0]).toEqual({
+      columnName: 'col_value',
+      updates: { type: 'currency', unique: true, currencyCode: 'EUR' },
+    })
+  })
+
+  it('restores the new type, constraints, and metadata on redo', async () => {
+    mockPopRedo.mockReturnValueOnce(makeEntry(typeChangeAction))
+
+    const { redo } = TestHook()
+    ;(redo as () => void)()
+    await flush()
+
+    expect(mockMutate.mock.calls[0][0]).toEqual({
+      columnName: 'col_value',
+      updates: {
+        type: 'select',
+        unique: false,
+        options: [{ id: 'opt_high', name: 'High' }],
+        multiple: true,
+      },
+    })
+  })
+})
diff --git a/apps/sim/hooks/use-table-undo.ts b/apps/sim/hooks/use-table-undo.ts
index 205e52b8b53..fd36aa43a5d 100644
--- a/apps/sim/hooks/use-table-undo.ts
+++ b/apps/sim/hooks/use-table-undo.ts
@@ -1,6 +1,8 @@
 import { useCallback, useEffect, useRef } from 'react'
 import { toast } from '@sim/emcn'
 import { createLogger } from '@sim/logger'
+import { getColumnId } from '@/lib/table/column-keys'
+import { typeMetadataOf } from '@/lib/table/column-types'
 import { TABLE_LIMITS } from '@/lib/table/constants'
 import {
   TABLE_LOCK_FLAGS,
@@ -333,9 +335,7 @@ export function useTableUndo({
           }
 
           case 'create-column': {
-            // Identity (delete lookup + id-keyed metadata) uses the stable id;
-            // re-create uses the display name.
-            const colKey = action.columnId ?? action.columnName
+            const colKey = getColumnId(action.column)
             if (direction === 'undo') {
               deleteColumnMutation.mutate(colKey, {
                 onSuccess: () => {
@@ -363,9 +363,14 @@ export function useTableUndo({
               })
             } else {
               addColumnMutation.mutate({
-                ...(action.columnId ? { id: action.columnId } : {}),
-                name: action.columnName,
-                type: 'string',
+                ...(action.column.id ? { id: action.column.id } : {}),
+                name: action.column.name,
+                type: action.column.type,
+                ...(action.column.required !== undefined
+                  ? { required: action.column.required }
+                  : {}),
+                ...(action.column.unique !== undefined ? { unique: action.column.unique } : {}),
+                ...typeMetadataOf(action.column),
                 position: action.position,
               })
             }
@@ -504,10 +509,15 @@ export function useTableUndo({
           }
 
           case 'update-column-type': {
-            const type = direction === 'undo' ? action.previousType : action.newType
+            const column = direction === 'undo' ? action.previousColumn : action.newColumn
             updateColumnMutation.mutate({
               columnName: action.columnName,
-              updates: { type },
+              updates: {
+                type: column.type,
+                ...(column.required !== undefined ? { required: column.required } : {}),
+                ...(column.unique !== undefined ? { unique: column.unique } : {}),
+                ...typeMetadataOf(column),
+              },
             })
             break
           }
diff --git a/apps/sim/lib/table/dates.ts b/apps/sim/lib/table/dates.ts
index 9a0bd04d8c8..54a03a0cb45 100644
--- a/apps/sim/lib/table/dates.ts
+++ b/apps/sim/lib/table/dates.ts
@@ -304,7 +304,6 @@ export function formatDateCellDisplay(
   return formatCanonicalDateCell(canonical, options) ?? stored
 }
 
-/** Renders a value already in one of the canonical stored shapes, or `null` when it is not. */
 function formatCanonicalDateCell(
   stored: string,
   options?: FormatDateCellDisplayOptions
diff --git a/apps/sim/stores/table/types.ts b/apps/sim/stores/table/types.ts
index 1da15ace218..78f88f24850 100644
--- a/apps/sim/stores/table/types.ts
+++ b/apps/sim/stores/table/types.ts
@@ -44,9 +44,7 @@ export type TableUndoAction =
       }>
     }
   | { type: 'delete-rows'; rows: DeletedRowSnapshot[] }
-  // `columnName` is the display name (for re-create); `columnId` is the stable
-  // storage key used for the delete/update lookup and id-keyed metadata cleanup.
-  | { type: 'create-column'; columnName: string; columnId?: string; position: number }
+  | { type: 'create-column'; column: ColumnDefinition; position: number }
   | {
       type: 'delete-column'
       columnName: string
@@ -73,8 +71,8 @@ export type TableUndoAction =
   | {
       type: 'update-column-type'
       columnName: string
-      previousType: ColumnDefinition['type']
-      newType: ColumnDefinition['type']
+      previousColumn: ColumnDefinition
+      newColumn: ColumnDefinition
     }
   | {
       type: 'toggle-column-constraint'