fix(tables): export select columns as option names, not ids

CSV/JSON export serialized the raw stored value for select cells — an option
id (or an array of ids for multi) — so downloads showed opaque `opt_…` ids.
Export now resolves ids to option names: CSV comma-joins multi names; JSON
resolves values before the id→name key translation. Ids with no matching
option (deleted) are dropped.

Author: TheodoreSpeaks

apps/sim/lib/table/export-format.test.ts

@@ -0,0 +1,65 @@
+/**
+ * @vitest-environment node
+ */
+import { describe, expect, it } from 'vitest'
+import { formatCsvCell, resolveSelectExportValue } from '@/lib/table/export-format'
+import type { ColumnDefinition } from '@/lib/table/types'
+
+const singleSelect: ColumnDefinition = {
+  id: 'col_status',
+  name: 'status',
+  type: 'select',
+  options: [
+    { id: 'opt_open', name: 'Open', color: 'green' },
+    { id: 'opt_closed', name: 'Closed', color: 'red' },
+  ],
+}
+
+const multiSelect: ColumnDefinition = {
+  id: 'col_tags',
+  name: 'tags',
+  type: 'select',
+  multiple: true,
+  options: [
+    { id: 'opt_a', name: 'Alpha', color: 'blue' },
+    { id: 'opt_b', name: 'Beta', color: 'purple' },
+  ],
+}
+
+describe('resolveSelectExportValue', () => {
+  it('maps a single option id to its name', () => {
+    expect(resolveSelectExportValue(singleSelect, 'opt_open')).toBe('Open')
+  })
+
+  it('maps multi option ids to a names array in order', () => {
+    expect(resolveSelectExportValue(multiSelect, ['opt_b', 'opt_a'])).toEqual(['Beta', 'Alpha'])
+  })
+
+  it('drops ids with no matching option', () => {
+    expect(resolveSelectExportValue(multiSelect, ['opt_a', 'gone'])).toEqual(['Alpha'])
+  })
+
+  it('returns null for an empty single value', () => {
+    expect(resolveSelectExportValue(singleSelect, null)).toBeNull()
+  })
+})
+
+describe('formatCsvCell', () => {
+  it('renders the option name, not the id', () => {
+    expect(formatCsvCell(singleSelect, 'opt_closed')).toBe('Closed')
+  })
+
+  it('comma-joins multi option names', () => {
+    expect(formatCsvCell(multiSelect, ['opt_a', 'opt_b'])).toBe('Alpha, Beta')
+  })
+
+  it('is empty when nothing is selected', () => {
+    expect(formatCsvCell(singleSelect, null)).toBe('')
+    expect(formatCsvCell(multiSelect, [])).toBe('')
+  })
+
+  it('falls through to the plain formatter for non-select columns', () => {
+    const num: ColumnDefinition = { id: 'c', name: 'n', type: 'number' }
+    expect(formatCsvCell(num, 42)).toBe('42')
+  })
+})

apps/sim/lib/table/export-format.ts

@@ -4,6 +4,30 @@
  * byte-identical files.
  */
 
+import type { ColumnDefinition } from '@/lib/table/types'
+
+/**
+ * Maps a `select` cell's stored option id(s) to their display names — exports
+ * should read the human-readable label, never the internal id. Single columns
+ * return the option name (or null); multi columns return an array of names.
+ * Ids with no matching option (deleted) are dropped.
+ */
+export function resolveSelectExportValue(
+  column: ColumnDefinition,
+  value: unknown
+): string | string[] | null {
+  const byId = new Map((column.options ?? []).map((o) => [o.id, o.name]))
+  const ids = Array.isArray(value)
+    ? value
+    : typeof value === 'string' && value !== ''
+      ? [value]
+      : []
+  const names = ids
+    .map((id) => (typeof id === 'string' ? byId.get(id) : undefined))
+    .filter((n): n is string => n != null)
+  return column.multiple ? names : (names[0] ?? null)
+}
+
 export function sanitizeExportFilename(name: string): string {
   const cleaned = name.replace(/[^a-zA-Z0-9_-]+/g, '_').replace(/^_+|_+$/g, '')
   return cleaned || 'table'
@@ -29,6 +53,19 @@ export function formatCsvValue(value: unknown): string {
   return String(value)
 }
 
+/**
+ * Serializes one cell for CSV, resolving `select` option ids to their names
+ * (comma-joined for multi) so the file shows the enum label, not the id.
+ */
+export function formatCsvCell(column: ColumnDefinition, value: unknown): string {
+  if (column.type === 'select') {
+    const resolved = resolveSelectExportValue(column, value)
+    const text = Array.isArray(resolved) ? resolved.join(', ') : (resolved ?? '')
+    return neutralizeCsvFormula(text)
+  }
+  return formatCsvValue(value)
+}
+
 export function toCsvRow(values: string[]): string {
   return values.map(escapeCsvField).join(',')
 }

apps/sim/lib/table/export-runner.ts

@@ -4,8 +4,9 @@ import { generateId } from '@sim/utils/id'
 import { buildNameById, getColumnId, rowDataIdToName } from '@/lib/table/column-keys'
 import { appendTableEvent } from '@/lib/table/events'
 import {
-  formatCsvValue,
+  formatCsvCell,
   neutralizeCsvFormula,
+  resolveSelectExportValue,
   sanitizeExportFilename,
   toCsvRow,
 } from '@/lib/table/export-format'
@@ -59,6 +60,8 @@ export async function runTableExport(payload: TableExportPayload): Promise<void>
     if (!table) throw new Error(`Export target table ${tableId} not found`)
 
     const columns = table.schema.columns
+    // Select cells store option ids; exports resolve them to option names below.
+    const selectColumns = columns.filter((c) => c.type === 'select')
     // Stored row data is id-keyed; CSV headers and JSON keys are display names, so translate
     // id → name on the way out (export is a name-friendly boundary).
     const nameById = buildNameById(table.schema)
@@ -91,12 +94,21 @@ export async function runTableExport(payload: TableExportPayload): Promise<void>
       for (const row of page) {
         if (format === 'csv') {
           pageChunks.push(
-            `${toCsvRow(columns.map((c) => formatCsvValue(row.data[getColumnId(c)])))}\n`
+            `${toCsvRow(columns.map((c) => formatCsvCell(c, row.data[getColumnId(c)])))}\n`
           )
         } else {
           const prefix = firstJsonRow ? '' : ','
           firstJsonRow = false
-          pageChunks.push(prefix + JSON.stringify(rowDataIdToName(row.data, nameById)))
+          // Resolve select ids → names before the id → name key translation.
+          let data = row.data
+          if (selectColumns.length > 0) {
+            data = { ...data }
+            for (const c of selectColumns) {
+              const key = getColumnId(c)
+              if (key in data) data[key] = resolveSelectExportValue(c, data[key])
+            }
+          }
+          pageChunks.push(prefix + JSON.stringify(rowDataIdToName(data, nameById)))
         }
       }
       await handle.write(pageChunks.join(''))