Adding items to cart
Import the "addToCart" function from the fingertipps-handshakes package. pass in the item you want to add as the first argument Additionally, specify the function you want to execute once the operation is done, note the addToCart Function will resolve with the total item the user has in cart. Here is our implementation of this:
<div className="productGrid padding">
{productsItems
? productsItems.map((item) => (
<div key={item._id} className="slideDown">
<div className="stack gap">
<div className="card">
<div className="stack gap">
<img
className="responsive1"
src={item.photos[0] ? item.photos[0].picture : ""}
alt=""
/>
<div
onClick={() =>
addToCart(item, resolve3, errorCather) & ShowAlert()
}
className="flex center"
>
<div className="flex gap pointer">
<Cart2 />
<p className="grayText capitalize addToCart">
add to cart
</p>
</div>
</div>
</div>
</div>
<p className="grayText capitalize"> {item.name.slice(0, 14)}</p>
<p className="smallHeading">₦{item.price.toLocaleString()}</p>
</div>
</div>
))
: ""}
</div>;
In the above code, the addToCart function from the fingertipps-handshakes package is used to add an item to the cart. The item to be added is passed as the first argument. Once the operation is completed, the handleCartUpdate function is called with the total number of items in the cart as an argument. You can customize the handleCartUpdate function to suit your specific needs, such as updating the cart UI or performing additional operations based on the updated cart information