Untitled

const myFilter = products
  .filter(el => (el.name.toLowerCase().includes(filterText.toLowerCase()) &&
                (inStockOnly ? el.stocked : true) || (!inStockOnly)));

const finalList = myFilter.reduce((a, c) => {
  const isDifferentCategory = c.category !== a.lastCategory;

  a.output = [...a.output,isDifferentCategory && <ProductCategoryRow key={c.category} category={c.category} />,<ProductRow key={c.name} product={c} />
  ];

  a.lastCategory = isDifferentCategory ? c.category : a.lastCategory;

  return a;
}, { lastCategory: null, output: [] });

console.log(finalList);