columnToFilterProperty() — supabase Function Reference

Architecture documentation for the columnToFilterProperty() function in FilterPopoverNew.utils.ts from the supabase codebase.

Function typescript ContentManagement Collections calls 1 called by 1

Entity Profile

ContentManagement→ Collections→ columnToFilterProperty() — supabase Function Reference

Dependency Diagram

graph TD
  3839e821_8542_886e_a7d8_2c415ba2c2df["columnToFilterProperty()"]
  96d51f59_7e49_0f5a_9f70_b1fb8b707a01["FilterPopoverNew()"]
  96d51f59_7e49_0f5a_9f70_b1fb8b707a01 -->|calls| 3839e821_8542_886e_a7d8_2c415ba2c2df
  8381f145_b450_89b6_451c_f8c818ded4c9["isDateLikeColumn()"]
  3839e821_8542_886e_a7d8_2c415ba2c2df -->|calls| 8381f145_b450_89b6_451c_f8c818ded4c9
  style 3839e821_8542_886e_a7d8_2c415ba2c2df fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/studio/components/grid/components/header/filter/FilterPopoverNew.utils.ts lines 45–99

export function columnToFilterProperty(column: SupaColumn): FilterProperty {
  // For enum columns, use the enum values as options
  if (isEnumColumn(column.dataType) && column.enum) {
    return {
      label: column.name,
      name: column.name,
      type: 'string' as const,
      options: column.enum.map((value) => ({ label: value, value })),
      operators: DEFAULT_OPERATORS,
    }
  }

  // For boolean columns
  if (isBoolColumn(column.dataType)) {
    return {
      label: column.name,
      name: column.name,
      type: 'boolean' as const,
      options: [
        { label: 'true', value: 'true' },
        { label: 'false', value: 'false' },
      ],
      operators: BOOLEAN_OPERATORS,
    }
  }

  // For date/datetime columns
  if (isDateLikeColumn(column)) {
    const today = new Date()
    const yesterday = new Date(Date.now() - 86400000)
    const lastWeek = new Date(Date.now() - 7 * 86400000)
    const lastMonth = new Date(Date.now() - 30 * 86400000)

    return {
      label: column.name,
      name: column.name,
      type: 'date' as const,
      options: [
        { label: 'Today', value: format(today, 'yyyy-MM-dd') },
        { label: 'Yesterday', value: format(yesterday, 'yyyy-MM-dd') },
        { label: 'Last 7 days', value: format(lastWeek, 'yyyy-MM-dd') },
        { label: 'Last 30 days', value: format(lastMonth, 'yyyy-MM-dd') },
      ],
      operators: DATE_OPERATORS,
    }
  }

  // For other columns, keep a simple text-based filter
  return {
    label: column.name,
    name: column.name,
    type: 'string' as const,
    operators: STRING_OPERATORS,
  }
}