Deleting Single Cart Items
Import the "deleteSingleCartItem" function from the fingertipps-handshakes package. Pass the item you want to delete as the first argument, and also include a function to update user interface(UpdtateCartUI). When the delete operation is complete, the deleteSingleCartItem function will provide the total number of items the user has in their cart to the UpdtateUI function you provided. You can then utilize this information to update your user interface accordingly
import React, { useEffect } from "react";
import { deleteSingleCartItem } from "fingertipps-handshakes";
const CartPage = () => {
const updateCartCount = (count) => {
console.log(count);
// code to update your ui
};
return (
<div>
{itemsInCart
? itemsInCart.map((item) => (
<div key={item._id}>
<div>
<img src={item.photo[0].picture} alt="" />
</div>
<p>{item.name}</p>
<p>₦{item.price.toLocaleString()}</p>
<p>{item.count.reduce((a, c) => a + c, 0).toLocaleString()}</p>
<button
onClick={() =>
deleteSingleCartItem(item, updateCartCount) & UiUpdate()
}
>
delete
</button>
</div>
))
: ""}
</div>
);
};
export default CartPage;
In the provided code sample, we imported the deleteSingleCartItem function from the fingertipps-handshakes package. We then iterated over the items in the cart. When a user clicks on the delete button for a particular item, the deleteSingleCartItem function is triggered with the necessary arguments. This function executes and removes the desired item from the user's cart. In simple terms, the code allows users to delete items from their cart by clicking on the delete button associated with each item.