Почему не выводится значение переменной в Pie (charts.js) на Реакте?

У меня есть 3 диаграммы, из которых одна (Pie) не работает;

Я получаю данные из https://dummyjson.com/posts. Мне нужно вывести <Pie/> сумма всех лайков и дизлайков.

Я создал переменную likeSum, и с помощью reduce суммировал все значения лайков, в console.log(likesSum) выводится итоговая сумма, но при вставке в data внутри <Pie/> почему-то круговая диаграмма не появляется.

  const filteredData = data.filter((post) => {
    return post.reactions;
  });

  let likesSum = filteredData.reduce((acc, data) => {
    return acc + data.reactions.likes;
  }, 0);

  let dislikesSum = filteredData.reduce((acc, data) => {
    return acc + data.reactions.dislikes;
  }, 0);



 <div className="dataCard pieCard">
          <Pie
            data={{
              labels: filteredData.map((data) => data.id),
              datasets: [
                {
                  label: "likes sum",
                  // data: filteredData.map((data) => data.reactions.likes),
                  data: likesSum,
                },
                {
                  label: "dislikes sum",
                  // data: filteredData.map((data) => data.reactions.dislikes),
                  data: dislikesSum,
                },
                {
                  label: "views",
                  data: filteredData.map((data) => data.reactions.views),
                },
              ],
            }}
          />
        </div>

Картинка, где видно что нет диаграммы круговой:


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