Shopping Cart - Copy this React, Tailwind Component to your project
<div>-<div>-<h2>Your-Cart</h2>-{cart.length-===-0-?-(-<p>Your-cart-is-empty</p>-)-:-(-<div>-{cart.map((item)-=>-(-<div-key={item.product._id}>-{loading-?-(-<Loader-/>-)-:-(-<div>-<div>-<img-src={item.product.images[1].src}-alt={item.product.images[1].alt}-width={100}-height={100}-/>-</div>-<div>-<h3>{item.product.name}</h3>-<p>{item.product.description}</p>-<p>-<strong>Price:</strong>-₹{item.product.price}-</p>-<button-onClick={(e)-=>-{-e.preventDefault()-handleRemoveProduct(-item.product._id,-item.product.name-)-}}->-Remove-from-Cart-</button>-</div>-</div>-)}-</div>-))}-</div>-)}-<div>-<p>-<strong>Total-Price:</strong>-₹{totalPrice}-</p>-</div>-<div>-<button-onClick={handleCheckout}-type="button"-disabled={cart.length-===-0}->-{loggedin-?-"Proceed-to-Checkout"-:-"Login-to-Checkout"}-</button>-{cart.length->-0-&&-<button-onClick={clearCart}>Clear-Cart</button>}-</div>-</div>-</div>
