queueRowAddWithOptimisticUpdate() — supabase Function Reference

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

Function typescript ContentManagement AccessControl calls 1

Entity Profile

ContentManagement→ AccessControl→ queueRowAddWithOptimisticUpdate() — supabase Function Reference

Dependency Diagram

graph TD
  de0df7eb_b455_d21d_8c6e_09349f59a52a["queueRowAddWithOptimisticUpdate()"]
  30aae06d_5d4f_f515_1e24_486146dfa430["applyRowAdd()"]
  de0df7eb_b455_d21d_8c6e_09349f59a52a -->|calls| 30aae06d_5d4f_f515_1e24_486146dfa430
  style de0df7eb_b455_d21d_8c6e_09349f59a52a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/studio/components/grid/utils/queueOperationUtils.ts lines 190–224

export function queueRowAddWithOptimisticUpdate({
  queryClient,
  queueOperation,
  projectRef,
  tableId,
  table,
  rowData,
  enumArrayColumns,
}: QueueRowAddParams) {
  // Generate unique idx and tempId for this pending row
  const idx = -Date.now()
  const tempId = String(idx)

  // Queue the operation
  queueOperation({
    type: QueuedOperationType.ADD_ROW,
    tableId,
    payload: {
      tempId,
      rowData,
      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: applyRowAdd(old.rows, tempId, idx, rowData),
    }
  })
}