import React, { useState } from 'react'; import { Heart, Search, Menu, User, Settings, Cart } from 'lucide-react';

interface Product { id: number; name: string; price: number; description: string; }

const products: Product[] = [ { id: 1, name: 'Product 1', price: 10.99, description: 'This is product 1' }, { id: 2, name: 'Product 2', price: 9.99, description: 'This is product 2' }, { id: 3, name: 'Product 3', price: 12.99, description: 'This is product 3' }, ];

const App = () => { const [cart, setCart] = useState([]); const [search, setSearch] = useState('');

const handleAddToCart = (product: Product) => { setCart([...cart, product]); };

const handleRemoveFromCart = (product: Product) => { setCart(cart.filter((item) => item.id !== product.id)); };

return (

E-Commerce Website

setSearch(e.target.value)} placeholder="Search products" className="py-2 pl-10 text-sm text-gray-700 rounded-lg focus:outline-none focus:ring-2 focus:ring-gray-600 w-full" />
{products .filter((product) => product.name.toLowerCase().includes(search.toLowerCase())) .map((product) => (

{product.name}

{product.description}

${product.price}

))}
); };

export default App;