queueCellEditWithOptimisticUpdate() — supabase Function Reference

Architecture documentation for the queueCellEditWithOptimisticUpdate() function in queueOperationUtils.ts from the supabase codebase.

Function typescript ContentManagement MediaManagement calls 1

Entity Profile

ContentManagement→ MediaManagement→ queueCellEditWithOptimisticUpdate() — supabase Function Reference

Dependency Diagram

graph TD
  c32cfc02_8879_8621_1537_490ac2163083["queueCellEditWithOptimisticUpdate()"]
  2bcfeb05_2677_1569_194b_e5c28c769248["applyCellEdit()"]
  c32cfc02_8879_8621_1537_490ac2163083 -->|calls| 2bcfeb05_2677_1569_194b_e5c28c769248
  style c32cfc02_8879_8621_1537_490ac2163083 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/studio/components/grid/utils/queueOperationUtils.ts lines 136–178

export function queueCellEditWithOptimisticUpdate({
  queryClient,
  queueOperation,
  projectRef,
  tableId,
  table,
  row,
  rowIdentifiers: callerRowIdentifiers,
  columnName,
  oldValue,
  newValue,
  enumArrayColumns,
}: QueueCellEditParams) {
  // Updated row identifiers to include __tempId for pending add rows so edits merge into ADD_ROW operation
  const rowIdentifiers: Dictionary<unknown> = { ...callerRowIdentifiers }
  if (isPendingAddRow(row)) {
    rowIdentifiers.__tempId = row.__tempId
  }

  // Queue the operation
  queueOperation({
    type: QueuedOperationType.EDIT_CELL_CONTENT,
    tableId,
    payload: {
      rowIdentifiers,
      columnName,
      oldValue,
      newValue,
      table,
      enumArrayColumns,
    },
  })

  // Apply optimistic update to the UI
  const queryKey = tableRowKeys.tableRows(projectRef, { table: { id: tableId } })
  queryClient.setQueriesData<TableRowsData>({ queryKey }, (old) => {
    if (!old) return old
    return {
      ...old,
      rows: applyCellEdit(old.rows, columnName, rowIdentifiers, newValue),
    }
  })
}