I have the below code, the problem is in the part where I am calling the RemoveProduct function in the map function:
function AddOrder() {
const d = new Date();
let text = d.toString();
const [addOrder] = useMutation(queries.ADD_ORDER);
const [editUser] = useMutation(queries.EDIT_USER_CART);
const [editProduct] = useMutation(queries.EDIT_PRODUCT);
function RemoveProduct (x) {
let getProd = useQuery(queries.GET_PRODUCTS_BY_ID, {
fetchPolicy: "network-only",
variables: {
_id : x._id
},
});
console.log(getProd.quantity)
console.log(x.quantity)
let a = getProd.quantity - x.quantity
console.log(a)
editProduct({
variables: {
_id : x._id,
quantity: a
},
});
return null;
}
const { currentUser } = useContext(AuthContext);
if (error) {
return <h1> error</h1>;
} else if (loading) {
return <h1> loading</h1>;
} else if (data && getUserOrders.data && currentUser && data.getUser.cart.length > 0) {
let newCart = [];
let total = 0;
for (let i = 0; i < data.getUser.cart.length; i++) {
total += data.getUser.cart[i].price * data.getUser.cart[i].quantity;
newCart.push({
orderedQuantity: data.getUser.cart[i].quantity,
_id: data.getUser.cart[i]._id,
name: data.getUser.cart[i].name,
image: data.getUser.cart[i].image,
price: data.getUser.cart[i].price,
});
}
newCart.map((x) => RemoveProduct(x))
editUser({
variables: {
id: currentUser.uid,
cart: [],
},
});
}
}
export default AddOrder;
I get the following error when I run this code:
Uncaught Error: Rendered more hooks than during the previous render.
How can I fix this? I tried to create a separate component for RemoveProducts and call in this function but that did not work either.
from How do I call react function in js map?
No comments:
Post a Comment