const App = () => { const [showAddress, setShowAddress] = React.useState(false) const products = [ { name: "Running Shoes", description: ["Lightweight and comfortable", "Breathable mesh upper", "Ideal for jogging and casual wear"], offerPrice: 250, price: 200, quantity: 1, size: 42, image: "https://raw.githubusercontent.com/prebuiltui/prebuiltui/main/assets/card/productImage.png", category: "Footwear", }, { name: "Running Shoes", description: ["Lightweight and comfortable", "Breathable mesh upper", "Ideal for jogging and casual wear"], offerPrice: 250, price: 200, quantity: 1, size: 42, image: "https://raw.githubusercontent.com/prebuiltui/prebuiltui/main/assets/card/productImage2.png", category: "Footwear", }, { name: "Running Shoes", description: ["Lightweight and comfortable", "Breathable mesh upper", "Ideal for jogging and casual wear"], offerPrice: 250, price: 200, quantity: 1, size: 42, image: "https://raw.githubusercontent.com/prebuiltui/prebuiltui/main/assets/card/productImage3.png", category: "Footwear", }, ] return (

Shopping Cart 3 Items

Product Details

Subtotal

Action

{products.map((product, index) => (

{product.name}

Size: {product.size || "N/A"}

Qty:

${product.offerPrice * product.quantity}

) )}

Order Summary

Delivery Address

No address found

{showAddress && (

setShowAddress(false)} className="text-gray-500 p-2 hover:bg-gray-100"> New York, USA

setShowAddress(false)} className="text-indigo-500 text-center cursor-pointer p-2 hover:bg-indigo-500/10"> Add address

)}

Payment Method

Price$20

Shipping FeeFree

Tax (2%)$20

Total Amount:$20

) }