JSFiddle - React, Tailwind, and code Playground

by Jussia

JavaScript

let myBooks = [
  {
    progress: 20,
    status: '1',
    book: {
      authorName: 'Адираджа дас',
      id: 15,
      name: 'Ведическое кулинарное иск',
    }
  },
  {
    progress: 50,
    status: '2',
    book: {
      authorName: 'Его Божественная Милость А.Ч. Бхактиведанта Свами Прабхупада',
      id: 16,
      name: 'Ведическое кулинарное иск',
    }
  },
  {
    progress: 0,
    status: '3',
    book: {
      authorName: 'Его Божественная Милость А.Ч. Бхактиведанта Свами Прабхупада',
      id: 17,
      name: 'Ведическое кулинарное иск',
    }
  },
  {
    progress: 40,
    status: '1',
    book: {
      authorName: 'Его Божественная Милость А.Ч. Бхактиведанта Свами Прабхупада',
      id: 18,
      name: 'Ведическое кулинарное иск',
    }
  },
  {
    progress: 70,
    status: '2',
    book: {
      authorName: 'Его Божественная Милость А.Ч. Бхактиведанта Свами Прабхупада',
      id: 19,
      name: 'Ведическое кулинарное иск',
    }
  },
  {
    progress: 100,
    status: '3',
    book: {
      authorName: 'Его Божественная Милость А.Ч. Бхактиведанта Свами Прабхупада',
      id: 11,
      name: 'Ведическое кулинарное иск',
    }
  }
      ]
      
 let booksStatusesEnum = {
   0: "Все",
   1: "Собираюсь прочесть",
   2: "Сейчас читаю",
   3: "Прочитанные"
  }
  
  function statusItemsList() {
  return Object.values(booksStatusesEnum).map((item, i) => {
      let count = myBooks.filter((book) => {
        if (i !== 0) {
          return book.status === String(i)
        } else {
          return item
        }
      }).length
      return {
        id: i,
        name: item,
        booksCount: count
      }
    })
  }
  
  console.log(statusItemsList())