Untitled

function ProductTable(props) {
  const {products,filterText,inStockOnly} = props
  const rows = [];
  let lastCategory = null;

  const myFilter = products.filter(el => {
    const nameMatches = el.name.toLowerCase().indexOf(filterText.toLowerCase()) !== -1;
    const stockMatches = inStockOnly ? el.stocked : true;

    return nameMatches && stockMatches;
});


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