React App: Product Lookup jsx Copy Edit

 const products = {

  '001': { name: 'Laptop', price: '$999', stock: 'In Stock', stores: ['Amazon', 'BestBuy'] },

  '002': { name: 'Phone', price: '$499', stock: 'Out of Stock', stores: ['Walmart'] },

};

function ProductLookup() {

  const [input, setInput] = useState('');

  const [product, setProduct] = useState(null);

  const findProduct = () => {

    const entry = Object.values(products).find(

      p => p.name.toLowerCase() === input.toLowerCase() || input === p.code

    );

    setProduct(entry);

  };

  return (

    <div>

      <h1>Product Lookup</h1>

      <input value={input} onChange={(e) => setInput(e.target.value)} placeholder="Enter product code or name" />

      <button onClick={findProduct}>Search</button>

      {product ? (

        <div>

          <p>Name: {product.name}</p>

          <p>Price: {product.price}</p>

          <p>Stock: {product.stock}</p>

          <p>Available at: {product.stores.join(', ')}</p>

        </div>

      ) : input && <p>Product not found.</p>}

    </div>

  );

}