Parichat

  const myFilter = products.filter(el => {
        let name = el.name.toLowerCase().indexOf(filterText.toLowerCase());
        return name !== -1 && ((inStockOnly && el.stocked) || !inStockOnly);
    })

    const finalList = myFilter.reduce((a, c) => {
        c.category !== a.lastCategory
            ? a.output =
                [...a.output, <ProductCategoryRow key={c.category} category={c.category} />]
                : null;
        a.lastCategory = c.category;
        a.output = [...a.output, <ProductRow key={c.name} product={c} />]
        return a;
    }, { lastCategory: null, output: [] })