1function ProductSearch({ products, searchTerm }) {
2  const [filteredProducts, setFilteredProducts] = useState([]);
3  const [highlight, setHighlight] = useState('');
4  
5  useEffect(() => {
6    const results = products.filter(product => 
7      product.name.toLowerCase().includes(searchTerm.toLowerCase())
8    );
9    setFilteredProducts(results);
10    setHighlight(searchTerm);
11  }, [searchTerm, products]);
12
13  return (
14    <div>
15      {filteredProducts.map(product => (
16        <div key={product.id} className="product-card">
17          <HighlightText
18            text={product.name}
19            highlight={highlight}
20          />
21          <p>{product.price}</p>
22        </div>
23      ))}
24    </div>
25  );
26}