Function useTable

packages/react/src/DataTable/useTable.ts:45–211

({
  columns,
  data,
  initialSortColumn,
  initialSortDirection,
}: TableConfig<Data>)

type ColumnSortState = {id: string | number; direction: Exclude<SortDirection, 'NONE'>} | null

export function useTable<Data extends UniqueRow>({
  columns,
  data,
  initialSortColumn,
  initialSortDirection,
}: TableConfig<Data>): Table<Data> {
  const [rowOrder, setRowOrder] = useState(data)
  const [prevData, setPrevData] = useState(data)
  const [prevColumns, setPrevColumns] = useState(columns)
  const [sortByColumn, setSortByColumn] = useState<ColumnSortState>(() => {
    return getInitialSortState(columns, initialSortColumn, initialSortDirection)
  })
  const {gridTemplateColumns} = useTableLayout(columns)

  // Reset the `sortByColumn` state if the columns change and that column is no
  // longer provided
  if (columns !== prevColumns) {
    setPrevColumns(columns)
    if (sortByColumn) {
      const column = columns.find(column => {
        const id = column.id ?? column.field
        return sortByColumn.id === id
      })
      if (!column) {
        setSortByColumn(null)
      }
    }
  }

  const headers = columns.map(column => {
    const id = column.id ?? column.field
    if (id === undefined) {
      throw new Error(`Expected either an \`id\` or \`field\` to be defined for a Column`)
    }

    const sortable = column.sortBy !== undefined && column.sortBy !== false
    return {
      id,
      column,
      isSortable() {
        return sortable
      },
      getSortDirection() {
        if (sortByColumn && sortByColumn.id === id) {
          return sortByColumn.direction
        }
        return SortDirection.NONE
      },
    }
  })

  // Update the row order and apply the current sort column to the incoming data
  if (data !== prevData) {
    setPrevData(data)
    setRowOrder(data)
    if (sortByColumn) {
      sortRows(sortByColumn)
    }