Как отсортировать данные в массиве по годам и алфавитному порядку?

Подскажите, как можно отсортировать данные в массиве, чтобы они выстраивались по годам, и в алфавитном порядке? Пытался через sort, но что-то результат не фонтан, мягко говоря. Может кто-то сможет подсказать.

function SecendPage() {
  const [table, setTable] = useState({
    info: [
      {
        text: 'Пошел в свой первый класс',
        data: {
          year: 2012,
          day: 25,
          month: 0.1
        }
      },
      {
        text: 'Поехал на чемпионат по бейсболу',
        data: {
          year: 2018,
          day: 14,
          month: 3
        }
      },
      {
        text: 'Поступил в институт',
        data: {
          year: 2007,
          day: 12,
          month: 4
        }
      },
    ]
  })

  function SortBy () {
    function compare(a, b) {
      if (a > b) return 1; // если первое значение больше второго
      if (a == b) return 0; // если равны
      if (a < b) return -1; // если первое значение меньше второго
    }
    const sortData = table.info.data.year;
    
    sortData.sort(compare);
  }


  return (
    <table>
      <thead>
        <tr>
          <th onClick={SortBy}>Год</th>
          <th>Событыие</th>
        </tr>
      </thead>

      <TableComponent table={table.info} />
    </table>

  )
}

export default SecendPage; 



import React, { Fragment } from 'react'

function TableComponent({ table }) {
    return (
        <thead>
            {
                table.map((item) => {
                    return (
                        <tr>
                            <th>{`${item.data.year}.${item.data.day}.${item.data.month}`}</th>
                            <th>{item.text}</th>
                        </tr>
                    )
                })
            }
        </thead>
    )
}

export default TableComponent
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>


Ответы (1 шт):

Автор решения: pinchers

Вот сортировка по году при клике на кнопку

  let fn = () => {
    
    setTable({
      ...table,
      info:table.info.sort((a, b) => a.data.year - b.data.year)
    })
   
  };

  return (
    <div>
        <button onClick={fn}>click</button>
    </div>
  )
}

→ Ссылка