Untitled
unknown
plain_text
a year ago
1.1 kB
4
Indexable
import React from "react"; import ProductCategoryRow from "./ProductCateRow"; import ProductRow from "./ProductRow"; export default function ProductTable({ products, filterText, inStockOnly }) { const filteredProducts = products.filter((product) => { const nameMatchesFilter = product.name.toLowerCase().includes(filterText.toLowerCase()); const isInStock = !inStockOnly || (inStockOnly && product.stocked); return nameMatchesFilter && isInStock; }); const rows = []; let lastCategory = null; filteredProducts.forEach((product) => { if (product.category !== lastCategory) { rows.push( <ProductCategoryRow category={product.category} key={product.category} /> ); } rows.push( <ProductRow product={product} key={product.name} /> ); lastCategory = product.category; }); return <> <table> <thead> <tr> <th className="product-name">Name</th> <th className="product-price">Price</th> </tr> </thead> <tbody>{rows}</tbody> </table></>; }
Editor is loading...
Leave a Comment