Сетка не сортируется в функциональном компоненте

Question

Я попытался последовать примеру на github , но с использованием функции без состояния, а не компонента класса.

Прописки отображаются так, как я ожидал, а заголовки столбцов имеют сортировкуиндикаторы, которые переключаются.Однако сетка не сортируется.Я не думаю, что происходит событие, когда я щелкаю заголовок столбца.

Что мне не хватает?

function SimpleTable(props) {
  const { rows } = props;

  const defaultColumnProperties = {
    sortable: true,
    width: 100
  };

  const columns = [
...
  ].map((c) => ({ ...c, ...defaultColumnProperties }));

  const sortRows = (initialRows, sortColumn, sortDirection) => (rows) => {
    const comparer = (a, b) => {
      if (sortDirection === 'ASC') {
        return a[sortColumn] > b[sortColumn] ? 1 : -1;
      } else if (sortDirection === 'DESC') {
        return a[sortColumn] < b[sortColumn] ? 1 : -1;
      }
    };
    return sortDirection === 'NONE' ? initialRows : [...rows].sort(comparer);
  };

  return (
    <div className={divclass.List}>
      <h2>Powell Truck List</h2>
      <ReactDataGrid
        columns={columns}
        rowGetter={(i) => rows[i]}
        rowKey={(i) => rows[i].Id}
        rowsCount={rows.length}
        minHeight={450}
        onGridSort={(sortColumn, sortDirection) => sortRows(rows, sortColumn, sortDirection)}
      />
    </div>
  );
}