Home / Function/ useTableSort() — supabase Function Reference

useTableSort() — supabase Function Reference

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

Entity Profile

Dependency Diagram

graph TD
  c41253e2_92a8_75b4_b100_945052d97226["useTableSort()"]
  be97f35c_a68f_0a38_2fc8_b1e46b157381["SupabaseGrid()"]
  be97f35c_a68f_0a38_2fc8_b1e46b157381 -->|calls| c41253e2_92a8_75b4_b100_945052d97226
  style c41253e2_92a8_75b4_b100_945052d97226 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/studio/components/grid/hooks/useTableSort.ts lines 14–94

export function useTableSort() {
  const { sorts: urlSorts, setParams } = useTableEditorFiltersSort()
  const snap = useTableEditorTableStateSnapshot()

  const tableName = useMemo(() => snap.table?.name || '', [snap])

  const sorts = useMemo(() => {
    return formatSortURLParams(tableName, urlSorts)
  }, [tableName, urlSorts])

  const onApplySorts = useCallback(
    (appliedSorts: Sort[]) => {
      if (!tableName) {
        return console.warn(
          '[useTableSort] Table name missing in callback, cannot apply sort correctly.'
        )
      }

      const sortsWithTable = appliedSorts.map((sort) => ({ ...sort, table: tableName }))
      const newUrlSorts = sortsToUrlParams(sortsWithTable)

      setParams((prevParams) => ({ ...prevParams, sort: newUrlSorts }))
    },
    [snap, setParams]
  )

  /**
   * Adds a new sort for a column or updates the direction of an existing one.
   * New sorts are added to the beginning of the array (highest precedence).
   * If the column already exists, its `ascending` direction is updated.
   * Calls `onApplySorts` to update URL parameters and trigger side effects.
   *
   * @param columnKey The key/name of the column to sort.
   * @param ascending The sort direction (true for ascending, false for descending).
   */
  const addOrUpdateSort = useCallback(
    (columnKey: string, ascending: boolean) => {
      if (!tableName || !columnKey) return

      // Use the derived 'sorts' state from the hook
      const existingSortIndex = sorts.findIndex((s) => s.column === columnKey)
      let newSorts = [...sorts] // Create a mutable copy

      if (existingSortIndex !== -1) {
        // Column already exists in sorts: Update the existing sort (toggle handled by removeSort)
        newSorts[existingSortIndex] = { ...newSorts[existingSortIndex], ascending: ascending }
      } else {
        // Column doesn't exist in sorts: Add it to the beginning
        newSorts.unshift({ table: tableName, column: columnKey, ascending: ascending })
      }

      onApplySorts(newSorts)
    },
    [tableName, sorts, onApplySorts] // Depend on derived sorts and callback
  )

  /**
   * Removes a sort criterion for a specific column.
   * Calls `onApplySorts` with the filtered array to update URL parameters and trigger side effects.
   *
   * @param columnKey The key/name of the column to remove from sorting.
   */
  const removeSort = useCallback(
    (columnKey: string) => {
      if (!tableName || !columnKey) return

      // Use the derived 'sorts' state from the hook
      const newSorts = sorts.filter((s) => s.column !== columnKey)
      onApplySorts(newSorts)
    },
    [tableName, sorts, onApplySorts] // Depend on derived sorts and callback
  )

  return {
    sorts,
    urlSorts,
    onApplySorts,
    addOrUpdateSort,
    removeSort,
  }
}

Subdomains

Called By

Frequently Asked Questions

What does useTableSort() do?
useTableSort() is a function in the supabase codebase.
What calls useTableSort()?
useTableSort() is called by 1 function(s): SupabaseGrid.

Analyze Your Own Codebase

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

Try Supermodel Free