Home / Function/ getGridColumns() — supabase Function Reference

getGridColumns() — supabase Function Reference

Architecture documentation for the getGridColumns() function in gridColumns.tsx from the supabase codebase.

Function tsx ContentManagement Collections calls 4

Entity Profile

Dependency Diagram

graph TD
  68372542_2f36_da50_23ab_dbe74b8156c6["getGridColumns()"]
  8b569225_6cd6_9d1c_0356_7e06bb83c474["getColumnType()"]
  68372542_2f36_da50_23ab_dbe74b8156c6 -->|calls| 8b569225_6cd6_9d1c_0356_7e06bb83c474
  a16fbb66_b2e0_6fab_7672_ca749c2f2307["getColumnDefaultWidth()"]
  68372542_2f36_da50_23ab_dbe74b8156c6 -->|calls| a16fbb66_b2e0_6fab_7672_ca749c2f2307
  2c945c79_d5b1_c927_1673_28ab2f987c8d["getCellEditor()"]
  68372542_2f36_da50_23ab_dbe74b8156c6 -->|calls| 2c945c79_d5b1_c927_1673_28ab2f987c8d
  2ed5107f_c0f9_3268_cc9e_fbe41b586c43["getCellRenderer()"]
  68372542_2f36_da50_23ab_dbe74b8156c6 -->|calls| 2ed5107f_c0f9_3268_cc9e_fbe41b586c43
  style 68372542_2f36_da50_23ab_dbe74b8156c6 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/studio/components/grid/utils/gridColumns.tsx lines 45–117

export function getGridColumns(
  table: SupaTable,
  options?: {
    tableId?: number
    editable?: boolean
    defaultWidth?: string | number
    onAddColumn?: () => void
    onExpandJSONEditor: (column: string, row: SupaRow) => void
    onExpandTextEditor: (column: string, row: SupaRow) => void
  }
): any[] {
  const columns = table.columns.map((x, idx) => {
    const columnType = getColumnType(x)
    const columnDefaultWidth = getColumnDefaultWidth(x)
    const columnWidthBasedOnName =
      (x.name.length + x.format.length) * ESTIMATED_CHARACTER_PIXEL_WIDTH
    const columnWidth = options?.defaultWidth
      ? options.defaultWidth
      : columnDefaultWidth < columnWidthBasedOnName
        ? columnWidthBasedOnName
        : columnDefaultWidth

    const columnDefinition: CalculatedColumn<SupaRow> = {
      key: x.name,
      name: x.name,
      idx: idx + 1,
      resizable: true,
      sortable: true,
      width: columnWidth,
      minWidth: COLUMN_MIN_WIDTH,
      frozen: false,
      isLastFrozenColumn: false,
      renderHeaderCell: (props) => (
        <ColumnHeader
          {...props}
          columnType={columnType}
          isPrimaryKey={x.isPrimaryKey}
          isEncrypted={x.isEncrypted}
          format={x.format}
          foreignKey={x.foreignKey}
          comment={x.comment}
        />
      ),
      renderEditCell: options
        ? getCellEditor(
            x,
            columnType,
            options?.editable ?? false,
            options.onExpandJSONEditor,
            options.onExpandTextEditor
          )
        : undefined,
      renderCell: getCellRenderer(x, columnType, {
        tableId: options?.tableId,
      }),

      // [Next 18 Refactor] Double check if this is correct
      parent: undefined,
      level: 0,
      maxWidth: undefined,
      draggable: false,
    }

    return columnDefinition
  })

  const gridColumns = [SelectColumn, ...columns]
  if (options?.onAddColumn) {
    gridColumns.push(AddColumn)
  }

  return gridColumns
}

Domain

Subdomains

Calls

Source

Frequently Asked Questions

What does getGridColumns() do?
getGridColumns() is a function in the supabase codebase.
What does getGridColumns() call?
getGridColumns() calls 4 function(s): getCellEditor, getCellRenderer, getColumnDefaultWidth, getColumnType.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free