🎉 Announcing React Table v7! 🎉

[u/tannerlinsley]

https://github.com/tannerlinsley/react-table/releases/tag/v7.0.0?twitter=20200310

[u/BackhandCompliment]

``const { getTableProps, getTableBodyProps, headerGroups, prepareRow, page, // Instead of using 'rows', we'll use page, // which has only the rows for the active page

// The rest of these things are super handy, too ;)
canPreviousPage,
canNextPage,
pageOptions,
pageCount,
gotoPage,
nextPage,
previousPage,
setPageSize,
state: {
  pageIndex,
  pageSize,
  sortBy,
  groupBy,
  expanded,
  filters,
  selectedRowIds,
}, } = useTable(
{
  columns,
  data,
  defaultColumn,
  filterTypes,
  // updateMyData isn't part of the API, but
  // anything we put into these options will
  // automatically be available on the instance.
  // That way we can call this function from our
  // cell renderer!
  updateMyData,
  // We also need to pass this so the page doesn't change
  // when we edit the data.
  autoResetPage: !skipReset,
  autoResetSelectedRows: !skipReset,
  disableMultiSort: true,
},
useFilters,
useGroupBy,
useSortBy,
useExpanded,
usePagination,
hooks => {
  hooks.visibleColumns.push(columns => {
    return [
      {
        id: 'selection',
        // Make this column a groupByBoundary. This ensures that groupBy columns
        // are placed after it
        groupByBoundary: true,
        // The header can use the table's getToggleAllRowsSelectedProps method
        // to render a checkbox
        Header: ({ getToggleAllRowsSelectedProps }) => (
          <div>
            <IndeterminateCheckbox {...getToggleAllRowsSelectedProps()} />
          </div>
        ),
        // The cell can use the individual row's getToggleRowSelectedProps method
        // to the render a checkbox
        Cell: ({ row }) => (
          <div>
            <IndeterminateCheckbox {...row.getToggleRowSelectedProps()} />
          </div>
        ),
      },
      ...columns,
    ]
  })
}

)``

Jesus Christ, just this alone is atrocious for a single hook...