Set default sort in react-table

[TheMikeyRoss]

I have this table using react-table

export const DataTable: React.FC<DataTableProps> = ({
  columns,
  data,
  ...props
}) => {
  const [sorting, setSorting] = React.useState<SortingState>([])
  const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>(
    []
  )
  const [globalFilter, setGlobalFilter] = React.useState("")

  const [expanded, setExpanded] = React.useState<ExpandedState>({})

  const [columnVisibility, setColumnVisibility] =
    React.useState<VisibilityState>({})
  const [rowSelection, setRowSelection] = React.useState({})

  const table = useReactTable({
    data,
    columns,
    onExpandedChange: setExpanded,
    getExpandedRowModel: getExpandedRowModel(),
    onGlobalFilterChange: setGlobalFilter,

    onSortingChange: setSorting,
    onColumnFiltersChange: setColumnFilters,
    getCoreRowModel: getCoreRowModel(),
    getPaginationRowModel: getPaginationRowModel(),
    getSortedRowModel: getSortedRowModel(),
    getFilteredRowModel: getFilteredRowModel(),
    onColumnVisibilityChange: setColumnVisibility,
    onRowSelectionChange: setRowSelection,
    state: {
      sorting,
      columnFilters,
      columnVisibility,
      globalFilter,
      rowSelection,
      expanded,
    },
  })

And I'm trying to set the default sorting column but couldn't figure it out. For example the column I'm not allowing the user to click on the column head to sort, I'm just gonna present the table to the user with the column "username" sorted by default

[zaaakher]

You'll have to pass the default sorting options as an initial state of the SortingState

  const [sorting, setSorting] = React.useState<SortingState>([
    {
      id: "email", // Must be equal to the accessorKey of the coulmn you want sorted by default
      desc: false,
    },
  ])